:root{
    --container:1280px;
    --radius-xl:32px;
    --radius-lg:24px;
    --radius-md:18px;
    --radius-full:999px;
    --shadow:0 24px 80px rgba(0,0,0,0.22);
    --transition:.35s cubic-bezier(.16,1,.3,1);
}

html[data-theme="dark"]{
    --bg:#06070a;
    --bg-soft:#0c1016;
    --bg-soft-2:#111723;
    --panel:rgba(255,255,255,0.05);
    --panel-strong:rgba(255,255,255,0.08);
    --line:rgba(255,255,255,0.12);
    --line-strong:rgba(255,255,255,0.18);
    --text:#f5f7fb;
    --muted:#9aa4b2;
    --muted-2:#c8d1dc;
    --accent:#9d7bff;
    --accent-2:#39d0ff;
    --accent-3:#ff4d8d;
    --success:#63f2b1;
    --hero-overlay:linear-gradient(180deg, rgba(6,7,10,0.25), rgba(6,7,10,0.90));
    --page-glow-1:rgba(157,123,255,0.16);
    --page-glow-2:rgba(57,208,255,0.10);
    --page-glow-3:rgba(255,77,141,0.08);
}

html[data-theme="light"]{
    --bg:#f4f7fb;
    --bg-soft:#ffffff;
    --bg-soft-2:#eef3f8;
    --panel:rgba(8,18,32,0.04);
    --panel-strong:rgba(8,18,32,0.07);
    --line:rgba(8,18,32,0.10);
    --line-strong:rgba(8,18,32,0.16);
    --text:#0e1420;
    --muted:#5d6b7d;
    --muted-2:#344255;
    --accent:#7a5cff;
    --accent-2:#00a6e6;
    --accent-3:#ff4d8d;
    --success:#109d63;
    --hero-overlay:linear-gradient(180deg, rgba(244,247,251,0.35), rgba(244,247,251,0.82));
    --page-glow-1:rgba(122,92,255,0.10);
    --page-glow-2:rgba(0,166,230,0.08);
    --page-glow-3:rgba(255,77,141,0.05);
    --shadow:0 24px 80px rgba(18,33,54,0.12);
}

html{
    scroll-behavior:auto !important;
}

body{
    background:
      radial-gradient(circle at 20% 20%, var(--page-glow-1), transparent 28%),
      radial-gradient(circle at 80% 10%, var(--page-glow-2), transparent 24%),
      radial-gradient(circle at 50% 80%, var(--page-glow-3), transparent 28%),
      var(--bg);
    color:var(--text);
    font-family:'Inter', sans-serif;
    overflow-x:hidden;
    transition:background var(--transition), color var(--transition);
}

img{
    max-width:100%;
    height:auto;
    display:block;
}

a{
    text-decoration:none;
}

.theme-toggle{
    position:fixed;
    top:18px;
    right:18px;
    z-index:9999;
    width:52px;
    height:52px;
    border-radius:50%;
    border:1px solid var(--line);
    background:rgba(255,255,255,0.08);
    backdrop-filter:blur(14px);
    color:var(--text);
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    box-shadow:var(--shadow);
    transition:transform var(--transition), background var(--transition), border-color var(--transition), color var(--transition);
}

html[data-theme="light"] .theme-toggle{
    background:rgba(255,255,255,0.94);
}

.theme-toggle:hover{
    transform:translateY(-2px);
}

.theme-toggle svg{
    width:20px;
    height:20px;
}

.section-shell{
    position:relative;
    padding:68px 0;
}

.section-shell.section-tight{
    padding:48px 0;
}

.container-premium{
    width:min(var(--container), calc(100% - 32px));
    margin:0 auto;
}

.eyebrow{
    color:var(--accent-2);
    font-size:13px;
    text-transform:uppercase;
    letter-spacing:.22em;
    margin-bottom:12px;
    display:block;
}

.section-head{
    display:grid;
    grid-template-columns:90px 1fr;
    gap:18px;
    align-items:start;
    margin-bottom:26px;
}

.section-no{
    font-size:13px;
    letter-spacing:.28em;
    color:var(--muted);
    padding-top:8px;
}

.section-title{
    font-family:'Syne', sans-serif;
    font-size:clamp(30px,5vw,62px);
    line-height:1.02;
    letter-spacing:-0.03em;
    margin:0;
    color:var(--text);
}

.section-title .accent{
    background:linear-gradient(90deg,var(--accent),var(--accent-2));
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
}

.hero-premium{
    min-height:100vh;
    display:flex;
    align-items:center;
    position:relative;
    isolation:isolate;
    overflow:hidden;
    background:
      var(--hero-overlay),
      radial-gradient(circle at 15% 20%, rgba(157,123,255,0.22), transparent 28%),
      radial-gradient(circle at 82% 18%, rgba(57,208,255,0.18), transparent 22%),
      radial-gradient(circle at 55% 80%, rgba(255,77,141,0.10), transparent 25%),
      url('../img/banner-img1.jpg') center center / cover no-repeat;
}

.hero-noise{
    position:absolute;
    inset:0;
    background-image:
        linear-gradient(rgba(255,255,255,0.02) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,0.02) 1px, transparent 1px);
    background-size:36px 36px;
    mask-image:linear-gradient(to bottom, rgba(0,0,0,.75), transparent 85%);
    pointer-events:none;
    z-index:-1;
}

.hero-grid{
    width:min(var(--container), calc(100% - 32px));
    margin:0 auto;
    display:grid;
    grid-template-columns:1.08fr .92fr;
    gap:42px;
    align-items:center;
    padding:130px 0 90px;
}

.hero-title-new{
    max-width:9ch;
    font-size:clamp(48px,8vw,112px);
    line-height:.92;
    letter-spacing:-0.055em;
    margin:0 0 22px;
    color:var(--text);
}

.hero-title-new .gradient{
    background:linear-gradient(90deg, var(--text) 0%, var(--accent-2) 55%, var(--accent) 100%);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
}

.hero-desc{
    max-width:640px;
    color:var(--muted-2);
    font-size:18px;
    line-height:1.9;
    margin-bottom:28px;
}

.hero-actions{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    margin-bottom:18px;
}

.hero-trust-row{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    margin-top:8px;
}

.hero-chip{
    display:inline-flex;
    align-items:center;
    min-height:42px;
    padding:0 16px;
    border-radius:999px;
    border:1px solid var(--line);
    background:var(--panel);
    backdrop-filter:blur(10px);
    color:var(--text);
    font-size:13px;
    letter-spacing:.04em;
}

.hero-showcase{
    position:relative;
    border-radius:34px;
    border:1px solid var(--line);
    background:linear-gradient(180deg, var(--panel-strong), var(--panel));
    backdrop-filter:blur(18px);
    box-shadow:0 30px 90px rgba(0,0,0,0.22);
    padding:20px;
    overflow:hidden;
    transition:transform .2s linear;
}

.hero-showcase::before{
    content:"";
    position:absolute;
    inset:auto -10% -25% auto;
    width:220px;
    height:220px;
    background:radial-gradient(circle, rgba(57,208,255,0.18), transparent 70%);
    pointer-events:none;
}

.hero-showcase-top{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    margin-bottom:18px;
}

.hero-showcase-label{
    color:var(--muted-2);
    font-size:12px;
    text-transform:uppercase;
    letter-spacing:.18em;
}

.hero-showcase-badge{
    display:inline-flex;
    align-items:center;
    gap:8px;
    min-height:32px;
    padding:0 12px;
    border-radius:999px;
    background:rgba(99,242,177,0.12);
    color:var(--success);
    border:1px solid rgba(99,242,177,0.18);
    font-size:12px;
    font-weight:700;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.hero-showcase-screen{
    border-radius:26px;
    border:1px solid var(--line);
    background:linear-gradient(180deg, rgba(9,14,22,0.88), rgba(10,15,23,0.96));
    padding:18px;
}

html[data-theme="light"] .hero-showcase-screen{
    background:linear-gradient(180deg, rgba(255,255,255,0.94), rgba(240,245,250,0.96));
}

.hero-stat-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:14px;
    margin-bottom:18px;
}

.hero-stat-card{
    border-radius:22px;
    border:1px solid var(--line);
    background:var(--panel);
    padding:18px;
}

.hero-stat-card small{
    display:block;
    color:var(--muted);
    font-size:12px;
    letter-spacing:.14em;
    text-transform:uppercase;
    margin-bottom:10px;
}

.hero-stat-card strong{
    display:block;
    color:var(--text);
    font-family:'Syne', sans-serif;
    font-size:34px;
    line-height:1;
    margin-bottom:8px;
}

.hero-stat-card span{
    display:block;
    color:var(--muted-2);
    font-size:14px;
    line-height:1.7;
}

.hero-stat-card-wide{
    grid-column:1 / -1;
}

.hero-graph{
    position:relative;
    height:140px;
    border-radius:22px;
    border:1px solid var(--line);
    background:
        linear-gradient(to top, rgba(57,208,255,0.08), transparent 60%),
        var(--panel);
    overflow:hidden;
}

.hero-graph-line{
    position:absolute;
    inset:auto 0 22px 0;
    height:68px;
    background:linear-gradient(90deg,
        transparent 0%,
        transparent 6%,
        rgba(57,208,255,0.95) 7%,
        rgba(157,123,255,0.95) 28%,
        rgba(57,208,255,0.95) 52%,
        rgba(255,255,255,0.98) 74%,
        rgba(99,242,177,0.95) 100%);
    clip-path:path("M0,60 C70,62 95,18 150,25 C210,33 230,78 290,58 C350,38 390,6 470,12 L470,68 L0,68 Z");
    opacity:.92;
}

.hero-graph-dots{
    position:absolute;
    inset:auto 28px 34px 28px;
    display:flex;
    justify-content:space-between;
    align-items:flex-end;
}

.hero-graph-dots span{
    width:12px;
    height:12px;
    border-radius:50%;
    background:var(--text);
    box-shadow:0 0 0 6px rgba(255,255,255,0.08);
}

.hero-scroll-link{
    position:absolute;
    left:40px;
    bottom:30px;
    display:inline-flex;
    align-items:center;
    gap:14px;
    color:var(--muted-2);
    text-transform:uppercase;
    letter-spacing:.2em;
    font-size:11px;
    z-index:2;
}

.hero-scroll-link span{
    width:26px;
    height:42px;
    border-radius:999px;
    border:1px solid var(--line-strong);
    display:inline-block;
    position:relative;
}

.hero-scroll-link span::before{
    content:"";
    position:absolute;
    left:50%;
    top:8px;
    width:4px;
    height:8px;
    border-radius:999px;
    background:var(--text);
    transform:translateX(-50%);
    animation:scrollWheel 1.8s ease-in-out infinite;
}

.hero-scroll-link em{
    font-style:normal;
}

@keyframes scrollWheel{
    0%{opacity:0; transform:translateX(-50%) translateY(0);}
    30%{opacity:1;}
    100%{opacity:0; transform:translateX(-50%) translateY(14px);}
}

.btn-premium{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:52px;
    padding:0 24px;
    border-radius:999px;
    font-weight:600;
    font-size:14px;
    letter-spacing:.04em;
    transition:var(--transition);
    border:1px solid transparent;
    position:relative;
    overflow:hidden;
    cursor:pointer;
}

.btn-premium::before{
    content:"";
    position:absolute;
    top:0;
    left:-120%;
    width:60%;
    height:100%;
    background:linear-gradient(90deg, transparent, rgba(255,255,255,0.24), transparent);
    transform:skewX(-22deg);
    transition:left .7s ease;
}

.btn-premium:hover::before{
    left:140%;
}

.btn-primary{
    background:linear-gradient(135deg,var(--accent),var(--accent-2));
    color:#071018;
    box-shadow:0 10px 30px rgba(157,123,255,0.28);
}

.btn-primary:hover{
    transform:translateY(-2px);
    color:#071018;
}

.btn-secondary{
    background:var(--panel);
    color:var(--text);
    border-color:var(--line);
    backdrop-filter:blur(10px);
}

.btn-secondary:hover{
    background:var(--panel-strong);
    transform:translateY(-2px);
    color:var(--text);
}

.about-grid{
    display:grid;
    grid-template-columns:1.05fr .95fr;
    gap:22px;
    align-items:stretch;
}

.about-media,
.glass-panel,
.feature-card,
.video-shell,
.price-card,
.testimonial-slide-card{
    border:1px solid var(--line);
    background:linear-gradient(180deg, var(--panel-strong), var(--panel));
    backdrop-filter:blur(14px);
    border-radius:30px;
    box-shadow:var(--shadow);
}

.about-media{
    overflow:hidden;
    min-height:580px;
}

.about-media img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.about-content{
    padding:28px;
}

.bullet-list{
    display:grid;
    gap:14px;
}

.bullet-item{
    padding:16px 18px;
    border-radius:20px;
    border:1px solid var(--line);
    background:var(--panel);
}

.bullet-item h4{
    margin:0 0 6px;
    color:var(--text);
    font-size:18px;
}

.bullet-item p{
    margin:0;
    color:var(--muted);
    line-height:1.7;
    font-size:15px;
}

.features-grid{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:16px;
}

.feature-card{
    height:100%;
    padding:22px;
    position:relative;
    overflow:hidden;
    transition:transform var(--transition), box-shadow var(--transition), border-color var(--transition);
}

.feature-card::before{
    content:"";
    position:absolute;
    inset:auto -20% -35% auto;
    width:160px;
    height:160px;
    background:radial-gradient(circle, rgba(157,123,255,0.18), transparent 70%);
    pointer-events:none;
}

.feature-index{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:42px;
    height:42px;
    border-radius:999px;
    margin-bottom:18px;
    background:var(--panel);
    border:1px solid var(--line);
    color:var(--accent-2);
    font-size:13px;
    font-weight:700;
}

.feature-card h4{
    margin:0 0 12px;
    color:var(--text);
    font-size:20px;
    line-height:1.35;
}

.feature-card p{
    margin:0;
    color:var(--muted);
    font-size:15px;
    line-height:1.8;
}

.video-shell{
    padding:14px;
    overflow:hidden;
}

.video-shell iframe{
    width:100%;
    height:640px;
    border:0;
    border-radius:24px;
}

.commitment-grid{
    display:grid;
    grid-template-columns:1fr;
    gap:20px;
}

.commitment-text{
    max-width:980px;
}

.commitment-text p{
    color:var(--muted);
    font-size:16px;
    line-height:1.8;
    margin:0 0 14px;
}

.commitment-cta{
    margin-bottom:12px;
}

#demo{
    border-radius:32px;
    overflow:hidden;
    border:1px solid var(--line);
    background:linear-gradient(180deg, var(--panel-strong), var(--panel));
    box-shadow:var(--shadow);
    padding:14px 14px 42px;
}

#demo .carousel-item .row{
    align-items:center;
}

#demo img{
    border-radius:24px;
    min-height:280px;
    object-fit:cover;
    background:var(--bg-soft);
}

.carousel-control-prev,
.carousel-control-next{
    width:56px;
    height:56px;
    top:auto;
    bottom:18px;
    opacity:1;
    background:var(--panel-strong);
    border:1px solid var(--line);
    border-radius:999px;
}

.carousel-control-prev{left:auto;right:86px;}
.carousel-control-next{right:18px;}

.pricing-grid{
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:16px;
}

.price-card{
    position:relative;
    height:100%;
    overflow:hidden;
    transition:transform var(--transition), box-shadow var(--transition), border-color var(--transition);
}

.price-card.featured{
    transform:translateY(-8px);
    border-color:rgba(157,123,255,0.42);
}

.price-top{
    padding:22px 20px 16px;
    border-bottom:1px solid var(--line);
}

.price-kicker{
    display:inline-flex;
    padding:8px 12px;
    border-radius:999px;
    font-size:11px;
    letter-spacing:.18em;
    text-transform:uppercase;
    margin-bottom:18px;
    background:var(--panel);
    color:var(--text);
}

.price-card.featured .price-kicker{
    background:linear-gradient(135deg,var(--accent),var(--accent-2));
    color:#071018;
}

.price-top h3{
    margin:0 0 10px;
    color:var(--text);
    font-size:26px;
    font-family:'Syne', sans-serif;
}

.price-sub{
    color:var(--muted);
    font-size:15px;
    line-height:1.7;
}

.price-amount{
    margin-top:20px;
    font-family:'Syne', sans-serif;
    color:var(--text);
    font-size:42px;
    line-height:1;
}

.price-body{
    padding:18px 20px 20px;
}

.price-list{
    list-style:none;
    padding:0;
    margin:0 0 18px;
}

.price-list li{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
    padding:10px 0;
    border-bottom:1px solid var(--line);
    color:var(--text);
    font-size:15px;
}

.price-list li span:last-child{
    color:var(--success);
    font-weight:700;
}

.price-action .btn-premium{
    width:100%;
}

.price-free{
    color:var(--text);
    font-size:22px;
    font-family:'Syne', sans-serif;
    margin:14px 0 0;
}

.clients-section{
    padding-top:26px;
    padding-bottom:76px;
}

.testimonial-slider-wrap{
    position:relative;
    padding:10px 0 6px;
    overflow:hidden;
}

.client-slider{
    margin:0 -10px;
}

.client-slider .slick-list{
    overflow:hidden !important;
    padding:30px 0 !important;
}

.client-slider .slick-track{
    display:flex !important;
    align-items:center;
}

.client-slide{
    padding:0 10px;
}

.testimonial-slide-card{
    min-height:290px;
    padding:24px;
    position:relative;
    overflow:hidden;
    transition:transform var(--transition), opacity var(--transition), box-shadow var(--transition), border-color var(--transition);
    transform:scale(.92);
    opacity:.65;
}

.client-slider .slick-active .testimonial-slide-card{
    opacity:.85;
}

.client-slider .slick-center .testimonial-slide-card{
    transform:scale(1.06);
    opacity:1;
    border-color:rgba(157,123,255,0.38);
    box-shadow:0 30px 90px rgba(0,0,0,0.26);
}

html[data-theme="light"] .client-slider .slick-center .testimonial-slide-card{
    box-shadow:0 26px 70px rgba(18,33,54,0.16);
}

.client-stars{
    display:flex;
    gap:6px;
    margin-bottom:14px;
    color:#ffcc66;
    font-size:16px;
}

.client-quote{
    color:var(--text);
    font-size:18px;
    line-height:1.75;
    font-weight:500;
    margin:0 0 18px;
}

.client-user{
    color:var(--accent-2);
    font-size:13px;
    letter-spacing:.10em;
    text-transform:uppercase;
    margin:0;
}

.client-role{
    color:var(--muted);
    font-size:14px;
    margin-top:8px;
    line-height:1.6;
}

.client-slider-nav{
    display:flex;
    justify-content:flex-end;
    gap:12px;
    margin-top:18px;
}

.client-slider-btn{
    width:54px;
    height:54px;
    border:none;
    border-radius:999px;
    background:var(--panel-strong);
    border:1px solid var(--line);
    color:var(--text);
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    transition:var(--transition);
}

.client-slider-btn:hover{
    transform:translateY(-2px);
    background:var(--panel);
}

.client-slider-btn svg{
    width:18px;
    height:18px;
}

.client-slider .slick-dots{
    display:none !important;
}

.feature-card:hover,
.price-card:hover{
    transform:translateY(-8px);
    box-shadow:0 28px 70px rgba(0,0,0,0.18);
}

.reveal{
    opacity:0;
    transform:translate3d(0, 24px, 0);
    transition:
        opacity .8s cubic-bezier(.16,1,.3,1),
        transform .8s cubic-bezier(.16,1,.3,1);
}

.reveal.active{
    opacity:1;
    transform:translate3d(0,0,0);
}

.reveal-delay-1{transition-delay:.05s;}
.reveal-delay-2{transition-delay:.10s;}
.reveal-delay-3{transition-delay:.15s;}
.reveal-delay-4{transition-delay:.20s;}

.modal-content{
    background:var(--bg-soft);
    border:1px solid var(--line);
    border-radius:24px;
    color:var(--text);
}

.modal-body{
    padding:28px;
}

.modal-body p{
    color:var(--muted);
    line-height:1.9;
    margin-bottom:16px;
}

@media (max-width:1199px){
    .hero-grid,
    .about-grid{
        grid-template-columns:1fr;
    }

    .pricing-grid{
        grid-template-columns:repeat(2,1fr);
    }
}

@media (max-width:991px){
    .testimonial-slide-card{
        transform:scale(1);
        opacity:1;
        min-height:260px;
    }

    .client-slider .slick-center .testimonial-slide-card{
        transform:scale(1);
    }
}

@media (max-width:767px){
    .section-shell{
        padding:52px 0;
    }

    .section-head{
        grid-template-columns:1fr;
        gap:10px;
        margin-bottom:20px;
    }

    .hero-grid{
        grid-template-columns:1fr;
        padding:110px 0 70px;
    }

    .hero-title-new{
        max-width:none;
        font-size:44px;
    }

    .hero-stat-grid,
    .features-grid,
    .pricing-grid{
        grid-template-columns:1fr;
    }

    .hero-scroll-link{
        display:none;
    }

    .about-content{
        padding:22px;
    }

    .video-shell iframe{
        height:320px;
    }

    .theme-toggle{
        top:14px;
        right:14px;
        width:48px;
        height:48px;
    }

    .client-slide{
        padding:0 6px;
    }

    .client-slider-nav{
        justify-content:center;
    }
}

@media (prefers-reduced-motion: reduce){
    .reveal,
    .btn-premium::before,
    .hero-scroll-link span::before{
        animation:none !important;
        transition:none !important;
    }
}