
body {
     font-family: Arial, sans-serif;
     overflow-x: hidden;
}

/* Announcement */
 .announcement-slider {
     display: flex;
     overflow: hidden;
}
 .announcement-track {
     animation: marquee 30s linear infinite;
}
 @keyframes marquee {
     0% {
         transform: translateX(0);.timer-card
    }
     100% {
         transform: translateX(-100%);
    }
}
/* Sticky */
 .header-scrolled {
     box-shadow: 0 10px 30px rgba(0, 0, 0, .08);
}
/* Mobile */
 body.menu-open {
     overflow: hidden;
}
 .heroGallery{
     overflow:hidden;
}
 .heroThumbs{
     overflow:hidden;
}
 .heroThumbs .swiper-slide{
     width:110px;
}
 .thumb-card{
     height:100px;
     background:#fff;
     border:2px solid #E5E7EB;
     border-radius:18px;
     display:flex;
     align-items:center;
     justify-content:center;
     cursor:pointer;
     transition:.3s;
}
 .thumb-card img{
     width:80px;
     height:80px;
     object-fit:contain;
}
 .heroThumbs .swiper-slide-thumb-active .thumb-card{
     border-color:#FF6A00;
     box-shadow:0 10px 25px rgba(255,106,0,.18);
}
 .heroPrev, .heroNext{
     position:absolute;
     top:50%;
     transform:translateY(-50%);
     width:48px;
     height:48px;
     border-radius:999px;
     background:#fff;
     box-shadow:0 10px 25px rgba(0,0,0,.15);
     z-index:20;
     display:flex;
     align-items:center;
     justify-content:center;
     transition:.3s;
}
 .heroPrev{
     left:-20px;
}
 .heroNext{
     right:-20px;
}
 .heroPrev:hover, .heroNext:hover{
     background:#FF6A00;
     color:#fff;
}
 @media(max-width:1024px){
     .heroPrev{
         left:10px;
    }
     .heroNext{
         right:10px;
    }
}
/* Floating animation */
 .heroGallery{
     transition:transform 2.5s ease-in-out;
}
/* CTA */
 .scale-105{
     transform:scale(1.05);
}
/* Reveal */
 .reveal{
     transition:all .7s ease;
}
/* Thumbnail */
 .heroThumbs .swiper-slide{
     cursor:pointer;
}
/* Active Thumb */
 .heroThumbs .swiper-slide-thumb-active .thumb-card{
     border-color:#FF6A00;
     box-shadow:0 12px 30px rgba(255,106,0,.18);
}
/* Navigation */
 .heroPrev, .heroNext{
     transition:.3s;
}
 .heroPrev:hover, .heroNext:hover{
     transform:translateY(-50%) scale(1.08);
}
 .counter-card{
     background:white;
     padding:40px 20px;
     border-radius:24px;
     text-align:center;
     box-shadow:0 20px 50px rgba(0,0,0,.06);
     transition:.35s;
}
 .counter-card:hover{
     transform:translateY(-8px);
}
 .counter-number{
     font-size:60px;
     font-weight:900;
     color:#FF6A00;
     line-height:1;
     margin-bottom:10px;
}
 .counter-card p{
     font-size:18px;
     font-weight:600;
     color:#555;
}
 .logoSlider{
     overflow:hidden;
}
 .logoSlider .swiper-slide{
     display:flex;
     align-items:center;
     justify-content:center;
     height:90px;
}
 .logoSlider img{
     height:45px;
     opacity:.55;
     transition:.3s;
     filter:grayscale(100%);
}
 .logoSlider img:hover{
     opacity:1;
     filter:none;
}
 .review-card{
     background:white;
     border-radius:24px;
     padding:35px;
     box-shadow:0 20px 50px rgba(0,0,0,.06);
     transition:.35s;
}
 .review-card:hover{
     transform:translateY(-8px);
}
 .feature-card{
     background:white;
     padding:40px;
     border-radius:28px;
     box-shadow:0 20px 50px rgba(0,0,0,.05);
     transition:.35s;
     position:relative;
     overflow:hidden;
}
 .feature-card:hover{
     transform:translateY(-10px);
     box-shadow:0 25px 60px rgba(0,0,0,.08);
}
 .feature-card::before{
     content:"";
     position:absolute;
     left:-100%;
     top:0;
     width:100%;
     height:100%;
     background:linear-gradient(90deg,transparent,rgba(255,255,255,.5),transparent);
     transition:.8s;
}
 .feature-card:hover::before{
     left:100%;
}
 .feature-icon{
     width:80px;
     height:80px;
     border-radius:20px;
     background:#FFF3E8;
     display:flex;
     align-items:center;
     justify-content:center;
     font-size:40px;
     margin-bottom:25px;
}
 .feature-card h3{
     font-size:28px;
     font-weight:800;
     margin-bottom:18px;
     color:#111827;
}
 .feature-card p{
     font-size:18px;
     line-height:1.8;
     color:#6B7280;
}
 .floating-product{
     animation:floatProduct 4s ease-in-out infinite;
}
 @keyframes floatProduct{
     0%,100%{
         transform:translateY(0);
    }
     50%{
         transform:translateY(-18px);
    }
}

@media(max-width: 600px){
.feature-card {
    padding: 20px;
}    
}

 .problem-item, .solution-item{
     display:flex;
     align-items:center;
     padding:20px 24px;
     border-radius:18px;
     font-size:20px;
     font-weight:600;
     transition:.35s;
}
 .problem-item{
     background:white;
     color:#991B1B;
}
 .problem-item:hover{
     transform:translateX(10px);
     background:#FEE2E2;
}
 .solution-item{
     background:white;
     color:#166534;
}
 .solution-item:hover{
     transform:translateX(10px);
     background:#DCFCE7;
}
 .comparison-product{
     animation:floatCompare 5s ease-in-out infinite;
}
 @keyframes floatCompare{
     0%,100%{
         transform:translateY(0);
    }
     50%{
         transform:translateY(-15px);
    }
}
 .step-number{
     display:inline-flex;
     width:70px;
     height:70px;
     border-radius:50%;
     background:#FF6A00;
     color:#fff;
     font-size:28px;
     font-weight:800;
     align-items:center;
     justify-content:center;
     margin-bottom:25px;
     box-shadow:0 15px 35px rgba(255,106,0,.25);
}
 .step-title{
     font-size:42px;
     font-weight:900;
     color:#111827;
     margin-bottom:20px;
}
 .step-text{
     font-size:20px;
     line-height:1.8;
     color:#6B7280;
     max-width:520px;
}
 .step-image{
     width:380px;
     height:380px;
     border-radius:50%;
     background:white;
     display:flex;
     align-items:center;
     justify-content:center;
     box-shadow:0 30px 70px rgba(0,0,0,.08);
     transition:.4s;
}
 .step-image:hover{
     transform:translateY(-12px) rotate(2deg);
}
 .step-image img{
     width:260px;
     object-fit:contain;
}
 @media(max-width:1024px){
     .step-title{
         font-size:34px;
    }
     .step-image{
         width:300px;
         height:300px;
    }
}
 .feature-product{
     position:relative;
     width:620px;
     height:620px;
     display:flex;
     align-items:center;
     justify-content:center;
     background:white;
     border-radius:50%;
     box-shadow:0 35px 90px rgba(0,0,0,.08);
}
 .hotspot{
     position:absolute;
     width:52px;
     height:52px;
     border-radius:999px;
     background:#FF6A00;
     color:#fff;
     font-size:28px;
     font-weight:700;
     box-shadow:0 10px 30px rgba(255,106,0,.3);
     animation:pulse 2s infinite;
     cursor:pointer;
     z-index:20;
}
 .hotspot1{
    top:18%;
    left:22%;
}
 .hotspot2{
    top:30%;
    right:20%;
}
 .hotspot3{
    bottom:28%;
    left:18%;
}
 .hotspot4{
    bottom:18%;
    right:22%;
}
 @keyframes pulse{
     0%{
         box-shadow:0 0 0 0 rgba(255,106,0,.45);
    }
     70%{
         box-shadow:0 0 0 18px rgba(255,106,0,0);
    }
     100%{
         box-shadow:0 0 0 0 rgba(255,106,0,0);
    }
}
 .feature-box{
     display:flex;
     gap:22px;
     padding:28px;
     border-radius:22px;
     background:white;
     margin-bottom:22px;
     cursor:pointer;
     transition:.35s;
     border:2px solid transparent;
     box-shadow:0 15px 35px rgba(0,0,0,.05);
}
 .feature-box.active{
     border-color:#FF6A00;
     transform:translateX(12px);
}
 .feature-icon-box{
     width:70px;
     height:70px;
     border-radius:20px;
     background:#FFF1E7;
     display:flex;
     align-items:center;
     justify-content:center;
     font-size:32px;
     flex-shrink:0;
}
 .feature-box h3{
     font-size:28px;
     font-weight:800;
     margin-bottom:10px;
}
 .feature-box p{
     font-size:18px;
     line-height:1.8;
     color:#6B7280;
}
 .mini-card{
     background:white;
     padding:35px;
     text-align:center;
     border-radius:24px;
     box-shadow:0 20px 45px rgba(0,0,0,.05);
     transition:.35s;
}
 .mini-card:hover{
     transform:translateY(-10px);
}
 .mini-icon{
     width:80px;
     height:80px;
     margin:auto;
     margin-bottom:20px;
     border-radius:20px;
     background:#FFF3E8;
     display:flex;
     align-items:center;
     justify-content:center;
     font-size:40px;
}
 .mini-card h4{
     font-size:24px;
     font-weight:800;
     margin-bottom:12px;
}
 .mini-card p{
     color:#6B7280;
}
 @media(max-width:1024px){
     .feature-product{
         width:100%;
         height:auto;
         padding:50px;
         border-radius:30px;
    }
     .hotspot{
         display:none;
    }
}

 @media(max-width:600px){
     .feature-box {
    flex-wrap: wrap; 
 }
 
      .step-image{
         width:auto;
         height: auto;
    }
 }
 .gallery-card{
     position:relative;
     height:600px;
     border-radius:32px;
     overflow:hidden;
     cursor:pointer;
}
 .gallery-card img{
     width:100%;
     height:100%;
     object-fit:cover;
     transition:.6s;
}
 .gallery-card:hover img{
     transform:scale(1.08);
}
 .gallery-overlay{
     position:absolute;
     left:0;
     right:0;
     bottom:0;
     padding:35px;
     background:linear-gradient(transparent,rgba(0,0,0,.9));
     color:#fff;
}
 .gallery-overlay span{
     display:inline-block;
     background:#FF6A00;
     padding:8px 18px;
     border-radius:999px;
     font-size:14px;
     font-weight:700;
     margin-bottom:18px;
}
 .gallery-overlay h3{
     font-size:34px;
     font-weight:800;
     line-height:1.2;
}
 .nav-btn{
     width:60px;
     height:60px;
     border-radius:999px;
     background:white;
     font-size:24px;
     font-weight:700;
     transition:.3s;
}
 .nav-btn:hover{
     background:#FF6A00;
     color:white;
}
 @media(max-width:768px){
     .gallery-card{
         height:420px;
    }
     .gallery-overlay h3{
         font-size:26px;
    }
}
 .video-card{
     position:relative;
     height:600px;
     border-radius:30px;
     overflow:hidden;
     cursor:pointer;
}
 .video-card img{
     width:100%;
     height:100%;
     object-fit:cover;
     transition:.5s;
}
 .video-card:hover img{
     transform:scale(1.08);
}
 .play-btn{
     position:absolute;
     left:50%;
     top:50%;
     transform:translate(-50%,-50%);
     width:90px;
     height:90px;
     border-radius:50%;
     background:white;
     font-size:36px;
     color:#FF6A00;
     box-shadow:0 15px 35px rgba(0,0,0,.2);
     transition:.3s;
}
 .play-btn:hover{
     transform:translate(-50%,-50%) scale(1.08);
}
 .video-overlay{
     position:absolute;
     left:0;
     right:0;
     bottom:0;
     padding:30px;
     background:linear-gradient(transparent,rgba(0,0,0,.9));
     color:white;
}
 .stars{
     color:#FDBA12;
     font-size:22px;
}
 .testimonial-card{
     background:white;
     padding:40px;
     border-radius:28px;
     box-shadow:0 20px 50px rgba(0,0,0,.06);
     transition:.35s;
}
 .testimonial-card:hover{
     transform:translateY(-8px);
}
 .testimonial-card p{
     font-size:18px;
     line-height:1.9;
     color:#555;
}
 @media(max-width:768px){
     .video-card{
         height:420px;
    }
    
    .testimonial-card {
        padding-left: 20px;
        padding-right: 20px;
    }
    
}
 .comparison-table{
     width:100%;
     min-width:1100px;
     border-collapse:separate;
     border-spacing:0;
}
 .comparison-table th, .comparison-table td{
     padding:22px;
     text-align:center;
     border-bottom:1px solid #E5E7EB;
     font-size:18px;
}
 .comparison-table th{
     background:#F8FAFC;
     font-size:22px;
     font-weight:800;
}
 .comparison-table td:first-child, .comparison-table th:first-child{
     text-align:left;
     font-weight:700;
}
 .active-col{
     background:#FFF8F3;
}
 .comparison-table tbody tr:hover{
     background:#FAFAFA;
}
 .price{
     font-size:34px;
     font-weight:900;
     color:#FF6A00;
}
 .comparison-table td{
     transition:.3s;
}
 .comparison-table tbody tr:hover td{
     transform:scale(1.02);
}
 .tech-card{
     display:flex;
     gap:24px;
     padding:30px;
     background:white;
     border-radius:24px;
     box-shadow:0 15px 40px rgba(0,0,0,.06);
     transition:.35s;
     cursor:pointer;
}
 .tech-card:hover{
     transform:translateX(12px);
}
 .tech-card.active{
     border-left:6px solid #FF6A00;
}
 .tech-icon{
     width:75px;
     height:75px;
     border-radius:22px;
     background:#FFF3E8;
     display:flex;
     align-items:center;
     justify-content:center;
     font-size:34px;
     flex-shrink:0;
}
 .tech-card h3{
     font-size:30px;
     font-weight:800;
     margin-bottom:10px;
}
 .tech-card p{
     font-size:18px;
     line-height:1.8;
     color:#6B7280;
}
 .floating-tech{
     animation:techFloat 5s ease-in-out infinite;
     position:relative;
     z-index:5;
}
 @keyframes techFloat{
     50%{
         transform:translateY(-18px);
    }
}
 .ring{
     position:absolute;
     border:2px dashed #D6E6FF;
     border-radius:50%;
     left:50%;
     top:50%;
     transform:translate(-50%,-50%);
     animation:rotateRing 18s linear infinite;
}
 .ring1{
     width:420px;
     height:420px;
}
 .ring2{
     width:520px;
     height:520px;
     animation-direction:reverse;
}
 .ring3{
     width:620px;
     height:620px;
}
 @keyframes rotateRing{
     100%{
         transform:translate(-50%,-50%) rotate(360deg);
    }
}
 .science-stat{
     padding:40px;
     background:white;
     border-radius:24px;
     text-align:center;
     box-shadow:0 20px 50px rgba(0,0,0,.05);
}
 .science-stat h3{
     font-size:60px;
     font-weight:900;
     color:#FF6A00;
}
 .science-stat p{
     margin-top:12px;
     font-size:18px;
     font-weight:600;
     color:#6B7280;
}
 .bundle-card{
     position:relative;
     background:white;
     padding:45px;
     border-radius:32px;
     box-shadow:0 25px 60px rgba(0,0,0,.06);
     transition:.35s;
     overflow:hidden;
}
 .bundle-card:hover{
     transform:translateY(-12px);
}
 .featured{
     border:4px solid #FF6A00;
     transform:scale(1.05);
}
 .popular-tag{
     position:absolute;
     left:50%;
     transform:translateX(-50%);
     top:18px;
     background:#FF6A00;
     color:white;
     padding:8px 24px;
     border-radius:999px;
     font-size:13px;
     font-weight:700;
}
 .bundle-top{
     text-align:center;
}
 .bundle-badge{
     display:inline-block;
     padding:8px 20px;
     border-radius:999px;
     background:#FFF3E8;
     color:#FF6A00;
     font-weight:700;
}
 .bundle-top h3{
     font-size:34px;
     font-weight:900;
     margin-top:20px;
}
 .bundle-top p{
     margin-top:10px;
     color:#6B7280;
}
 .bundle-image{
     width:220px;
     margin:35px auto;
     display:block;
     transition:.35s;
}
 .bundle-card:hover .bundle-image{
     transform:scale(1.08);
}
 .bundle-price{
     text-align:center;
}
 .old-price{
     text-decoration:line-through;
     color:#9CA3AF;
     font-size:24px;
}
 .bundle-price h2{
     font-size:64px;
     font-weight:900;
     color:#FF6A00;
     line-height:1;
     margin-top:10px;
}
 .bundle-price p{
     margin-top:12px;
     font-weight:700;
     color:#16A34A;
}
 .bundle-list{
     margin-top:35px;
     display:flex;
     flex-direction:column;
     gap:18px;
}
 .bundle-list li{
     font-size:18px;
}
 .bundle-btn{
     margin-top:35px;
     height:66px;
     display:flex;
     align-items:center;
     justify-content:center;
     border-radius:999px;
     background:#FF6A00;
     color:white;
     font-weight:800;
     font-size:20px;
     transition:.3s;
}
 .bundle-btn:hover{
     background:#F05E00;
}
 .trust-box{
     background:white;
     padding:30px;
     border-radius:24px;
     display:flex;
     flex-direction:column;
     align-items:center;
     gap:15px;
     font-size:40px;
     box-shadow:0 20px 45px rgba(0,0,0,.05);
}
 .trust-box span{
     font-size:18px;
     font-weight:700;
     color:#374151;
}
 .faq-item{
     background:#fff;
     border:1px solid #E5E7EB;
     border-radius:24px;
     overflow:hidden;
     transition:.35s;
     box-shadow:0 15px 35px rgba(0,0,0,.04);
}
 .faq-item.active{
     border-color:#FF6A00;
}
 .faq-btn{
     width:100%;
     display:flex;
     justify-content:space-between;
     align-items:center;
     padding:28px 35px;
     font-size:22px;
     font-weight:700;
     text-align:left;
     cursor:pointer;
}
 .faq-icon{
     width:44px;
     height:44px;
     border-radius:999px;
     background:#FFF3E8;
     display:flex;
     align-items:center;
     justify-content:center;
     font-size:26px;
     font-weight:800;
     transition:.35s;
     color:#FF6A00;
}
 .faq-content{
     max-height:0;
     overflow:hidden;
     transition:.4s;
}
 .faq-content p{
     padding:0 35px 35px;
     font-size:18px;
     line-height:1.9;
     color:#6B7280;
}
 .faq-item.active .faq-content{
     max-height:250px;
}
 .faq-item.active .faq-icon{
     transform:rotate(45deg);
     background:#FF6A00;
     color:white;
}
 @media(max-width:768px){
     .faq-btn{
         font-size:18px;
         padding:22px;
    }
     .faq-content p{
         padding:0 22px 22px;
         font-size:16px;
    }
    
    .tech-card {
        flex-wrap: wrap;
        padding-left: 20px;
        padding-right: 20px;
    }
    
    .science-stat{ 
        padding: 20px;
    }
}
 .review-box{
     background:white;
     border-radius:32px;
     overflow:hidden;
     box-shadow:0 25px 60px rgba(0,0,0,.06);
     transition:.35s;
}
 .review-box:hover{
     transform:translateY(-10px);
}
 .review-image{
     height:320px;
     overflow:hidden;
}
 .review-image img{
     width:100%;
     height:100%;
     object-fit:cover;
     transition:.5s;
}
 .review-box:hover img{
     transform:scale(1.08);
}
 .review-content{
     padding:35px;
}
 .review-content h4{
     font-size:26px;
     font-weight:800;
}
 .review-content span{
     color:#6B7280;
     font-size:15px;
}
 .review-content p{
     margin-top:22px;
     font-size:18px;
     line-height:1.8;
     color:#4B5563;
}
 .review-stat{
     background:white;
     padding:35px;
     border-radius:24px;
     text-align:center;
     box-shadow:0 20px 50px rgba(0,0,0,.05);
     transition:.35s;
}
 .review-stat:hover{
     transform:translateY(-8px);
}
 .review-stat h3{
     font-size:52px;
     font-weight:900;
     color:#FF6A00;
}
 .review-stat p{
     margin-top:12px;
     font-size:18px;
     font-weight:600;
     color:#6B7280;
}
 .timer-card{
     width:120px;
     height:120px;
     border-radius:24px;
     background:#1F2937;
     display:flex;
     flex-direction:column;
     justify-content:center;
     align-items:center;
}
 .timer-card h3{
     font-size:52px;
     font-weight:900;
     color:white;
     line-height:1;
}
 .timer-card span{
     margin-top:8px;
     font-size:14px;
     text-transform:uppercase;
     color:#9CA3AF;
}

@media (max-width: 600px){
    
     .timer-card {
         width:auto;
         height:auto;
         padding: 10px;
     }
     
      .timer-card h3{
          font-size: 20px;
      }
}
 .offer-trust{
     background:rgba(255,255,255,.08);
     border:1px solid rgba(255,255,255,.12);
     padding:18px 22px;
     border-radius:18px;
     font-weight:700;
     color:white;
     backdrop-filter:blur(12px);
}
 .offer-card{
     position:relative;
     background:white;
     border-radius:36px;
     padding:50px;
     text-align:center;
     box-shadow:0 40px 100px rgba(0,0,0,.3);
}

@media (max-width: 600px){
  .offer-card {
      padding: 20px;
  }
}

 .offer-tag{
     position:absolute;
     top:20px;
     right:20px;
     background:#FF6A00;
     color:white;
     padding:10px 20px;
     border-radius:999px;
     font-size:13px;
     font-weight:700;
}
 .offer-image{
     width:280px;
     margin:auto;
     animation:offerFloat 4s ease-in-out infinite;
}
 @keyframes offerFloat{
     50%{
         transform:translateY(-12px);
    }
}
 .offer-card h3{
     font-size:38px;
     font-weight:900;
     margin-top:20px;
}
 .offer-card p{
     margin-top:10px;
     color:#6B7280;
}
 .offer-price{
     margin-top:35px;
}
 .offer-price span{
     font-size:26px;
     color:#9CA3AF;
}
 .offer-price h2{
     font-size:74px;
     line-height:1;
     font-weight:900;
     color:#FF6A00;
     margin-top:12px;
}
 .offer-price small{
     display:block;
     margin-top:10px;
     font-size:18px;
     font-weight:700;
     color:#16A34A;
}
     .offer-btn{
     display:flex;
     justify-content:center;
     align-items:center;
     margin-top:35px;
     height:72px;
     border-radius:999px;
     background:#FF6A00;
     color:white;
     font-size:22px;
     font-weight:800;
     transition:.35s;
}
 .offer-btn:hover{
     transform:scale(1.03);
     background:#F45E00;
}
 .payment-icons{
     display:flex;
     justify-content:center;
     gap:16px;
     margin-top:30px;
}
 .payment-icons img{
     height:34px;
}
 .offer-note{
     margin-top:20px;
     font-weight:600;
     color:#16A34A;
}

@media (max-width: 600px){
     .offer-btn{ 
         font-size: 18px;
         padding: 8px 12px;
     }
}
 .footer-title{
     font-size:22px;
     font-weight:800;
     margin-bottom:24px;
}
 .footer-links{
     display:flex;
     flex-direction:column;
     gap:16px;
}
 .footer-links a{
     color:#9CA3AF;
     transition:.3s;
}
 .footer-links a:hover{
     color:white;
     padding-left:8px;
}
 .social-icon{
     width:50px;
     height:50px;
     border-radius:50%;
     background:rgba(255,255,255,.08);
     display:flex;
     align-items:center;
     justify-content:center;
     font-size:20px;
     transition:.35s;
}
 .social-icon:hover{
     background:#FF6A00;
     transform:translateY(-6px);
}
 footer img{
     transition:.3s;
}
 footer img:hover{
     transform:scale(1.08);
     opacity:1;
}
 @media(max-width:1024px){
     .footer-title{
         margin-top:20px;
    }
}
 .reveal, .feature-card, .step-image, .step-title, .step-text, .step-number, .problem-item, .solution-item, .review-card, .review-box, .bundle-card, .offer-card, .faq-item, .tech-card, .review-stat, .science-stat, .trust-box{
     will-change:transform,opacity;
}

.swiper {
  width: 100%;
  max-width: 100%;
}

.swiper-wrapper {
  width: 100%;
}

.heroGallery {
  overflow: hidden;
}

.swiper {
  width: 100%;
  overflow: hidden;
}

.swiper-wrapper {
  align-items: stretch;
}

.swiper-slide {
  height: auto;
}
