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

/* Announcement */

.announcement-slider {

    display: flex;

    overflow: hidden;

}

.announcement-track {

    animation: marquee 30s linear infinite;

}

@keyframes marquee {

    0% {

        transform: translateX(0);

    }

    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);

}

}

.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;

}

}

.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;

}

}

.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;

}

}

.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;

}

.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);

}

.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;

}

.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;

}