:root{
    --ld-bg:#0A0B10;
    --ld-bg-2:#111319;
    --ld-bg-3:#161920;

    --ld-glass:rgba(255,255,255,.045);
    --ld-glass-hover:rgba(255,255,255,.075);

    --ld-border:rgba(255,255,255,.09);
    --ld-border-strong:rgba(255,255,255,.18);

    --ld-text:#F5F6FA;
    --ld-text-soft:#98A2B8;
    --ld-text-muted:#5C6478;

    --ld-blue:#4F7CFF;
    --ld-cyan:#22D3EE;
    --ld-violet:#9B87F5;

    --ld-gold:#D9AE66;
    --ld-gold-soft:rgba(217,174,102,.16);

    --ld-success:#34D399;
    --ld-warning:#FBBF24;
    --ld-danger:#F87171;

    --ld-grad:
        linear-gradient(
            95deg,
            #4F7CFF,
            #22D3EE
        );

    --ld-grad-gold:
        linear-gradient(
            95deg,
            #4F7CFF,
            #22D3EE,
            #D9AE66
        );

    --ld-display:
        'Bricolage Grotesque',
        'Inter',
        sans-serif;

    --ld-sans:
        'Inter',
        -apple-system,
        BlinkMacSystemFont,
        'Segoe UI',
        sans-serif;

    --ld-ease:
        cubic-bezier(.19,1,.22,1);

    --ld-container:1180px;
}

*{
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body.ld-v6{
    margin:0;
    color:var(--ld-text);
    background:var(--ld-bg);
    font-family:var(--ld-sans);
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
}

body.ld-v6::before{
    content:"";
    position:fixed;
    inset:0;
    z-index:-3;
    pointer-events:none;

    background-image:
        linear-gradient(
            rgba(255,255,255,.028) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255,255,255,.028) 1px,
            transparent 1px
        );

    background-size:52px 52px;

    mask-image:
        radial-gradient(
            ellipse 85% 65% at 50% 0%,
            #000 25%,
            transparent 80%
        );
}

.ld-v6-container{
    width:min(
        calc(100% - 56px),
        var(--ld-container)
    );

    margin-inline:auto;
}

.ld-v6-display,
.ld-v6 h1,
.ld-v6 h2,
.ld-v6 h3{
    font-family:var(--ld-display);
}

.ld-v6 h1,
.ld-v6 h2,
.ld-v6 h3,
.ld-v6 p{
    margin-top:0;
}

.ld-v6-gradient-text{
    background:var(--ld-grad);
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
}

.ld-v6-glass{
    background:var(--ld-glass);
    border:1px solid var(--ld-border);
    backdrop-filter:blur(14px);
}

.ld-v6-card{
    border-radius:18px;
    background:var(--ld-glass);
    border:1px solid var(--ld-border);

    transition:
        transform .25s var(--ld-ease),
        background .25s ease,
        border-color .25s ease;
}

.ld-v6-card:hover{
    transform:translateY(-4px);
    background:var(--ld-glass-hover);
    border-color:var(--ld-border-strong);
}

.ld-v6-grad-border{
    position:relative;
    padding:1px;
    border-radius:20px;

    background:
        linear-gradient(
            135deg,
            rgba(79,124,255,.55),
            rgba(34,211,238,.20),
            rgba(217,174,102,.45)
        );
}

.ld-v6-grad-border > .ld-v6-inner{
    background:var(--ld-bg-2);
    border-radius:19px;
}

.ld-v6-label{
    display:inline-flex;
    align-items:center;
    gap:8px;

    color:var(--ld-cyan);
    font-size:13px;
    font-weight:600;
}

.ld-v6-label::before{
    content:"";
    width:6px;
    height:6px;
    border-radius:50%;
    background:var(--ld-grad);
}

.ld-v6-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;

    padding:12px 22px;
    border-radius:11px;

    border:1px solid transparent;

    font-weight:700;
    text-decoration:none;

    transition:
        transform .2s var(--ld-ease),
        filter .2s ease,
        background .2s ease,
        border-color .2s ease;
}

.ld-v6-btn:hover{
    transform:translateY(-2px);
}

.ld-v6-btn:active{
    transform:scale(.97);
}

.ld-v6-btn-primary{
    color:#04101F;
    background:var(--ld-grad);
}

.ld-v6-btn-primary:hover{
    filter:brightness(1.08);
}

.ld-v6-btn-ghost{
    color:var(--ld-text);
    border-color:var(--ld-border-strong);
    background:transparent;
}

.ld-v6-btn-ghost:hover{
    background:var(--ld-glass);
}

.ld-v6-section{
    position:relative;
    padding:100px 0;
}

.ld-v6-section-title{
    font-size:
        clamp(
            30px,
            4vw,
            48px
        );

    line-height:1.1;
    letter-spacing:-.025em;
}

.ld-v6-muted{
    color:var(--ld-text-soft);
}

.ld-v6-reveal{
    opacity:0;
    transform:translateY(24px);

    transition:
        opacity .8s var(--ld-ease),
        transform .8s var(--ld-ease);
}

.ld-v6-reveal.is-visible{
    opacity:1;
    transform:none;
}

/* ----------------------------------------------------------
   HEADER
---------------------------------------------------------- */

.ld-v6-header{
    position:sticky;
    top:0;
    z-index:60;

    background:
        rgba(
            10,
            11,
            16,
            .62
        );

    backdrop-filter:blur(16px);

    border-bottom:
        1px solid transparent;

    transition:
        background .25s ease,
        border-color .25s ease;
}

.ld-v6-header.is-scrolled{
    background:
        rgba(
            10,
            11,
            16,
            .90
        );

    border-bottom-color:
        var(--ld-border);
}

.ld-v6-nav{
    min-height:76px;

    display:flex;
    align-items:center;
    justify-content:space-between;

    gap:28px;
}

.ld-v6-nav-links{
    display:flex;
    align-items:center;
    gap:30px;
}

.ld-v6-nav-links a{
    color:var(--ld-text-soft);
    text-decoration:none;
    font-size:14px;
    font-weight:600;
}

.ld-v6-nav-links a:hover{
    color:var(--ld-text);
}

/* ----------------------------------------------------------
   HERO
---------------------------------------------------------- */

.ld-v6-hero{
    position:relative;
    overflow:hidden;

    padding:
        130px 0
        96px;
}

.ld-v6-hero-blob{
    position:absolute;
    z-index:-1;

    border-radius:50%;
    filter:blur(90px);

    pointer-events:none;
}

.ld-v6-hero-blob-a{
    width:560px;
    height:560px;

    left:-170px;
    top:-230px;

    background:
        radial-gradient(
            circle,
            rgba(79,124,255,.40),
            transparent 70%
        );

    animation:
        ld-v6-drift-a
        20s ease-in-out
        infinite;
}

.ld-v6-hero-blob-b{
    width:500px;
    height:500px;

    right:-180px;
    top:-110px;

    background:
        radial-gradient(
            circle,
            rgba(34,211,238,.30),
            transparent 70%
        );

    animation:
        ld-v6-drift-b
        24s ease-in-out
        infinite;
}

.ld-v6-hero-blob-c{
    width:440px;
    height:440px;

    left:35%;
    bottom:-260px;

    background:
        radial-gradient(
            circle,
            rgba(155,135,245,.24),
            transparent 70%
        );

    animation:
        ld-v6-drift-a
        26s ease-in-out
        infinite reverse;
}

@keyframes ld-v6-drift-a{
    0%,
    100%{
        transform:translate(0,0);
    }

    50%{
        transform:translate(42px,28px);
    }
}

@keyframes ld-v6-drift-b{
    0%,
    100%{
        transform:translate(0,0);
    }

    50%{
        transform:translate(-36px,26px);
    }
}

.ld-v6-hero-copy{
    max-width:900px;
    margin-inline:auto;
    text-align:center;
}

.ld-v6-hero h1{
    margin:
        20px auto
        26px;

    max-width:13ch;

    font-size:
        clamp(
            44px,
            6.5vw,
            82px
        );

    line-height:1.02;
    letter-spacing:-.04em;
}

.ld-v6-hero-sub{
    max-width:58ch;
    margin-inline:auto;

    color:var(--ld-text-soft);
    font-size:18px;
}

.ld-v6-hero-actions{
    display:flex;
    justify-content:center;
    flex-wrap:wrap;
    gap:14px;

    margin-top:34px;
}

.ld-v6-hero-showcase{
    position:relative;

    width:min(
        100%,
        1040px
    );

    margin:
        70px auto
        0;
}

.ld-v6-product-frame{
    padding:8px;

    box-shadow:
        0 45px 100px
        -32px rgba(0,0,0,.68);
}

.ld-v6-product-frame img{
    width:100%;
    display:block;

    border-radius:15px;
}

/* ----------------------------------------------------------
   MARQUEE
---------------------------------------------------------- */

.ld-v6-marquee{
    overflow:hidden;

    border-top:1px solid var(--ld-border);
    border-bottom:1px solid var(--ld-border);

    background:var(--ld-bg-2);
}

.ld-v6-marquee-track{
    display:flex;
    width:max-content;
    gap:56px;

    padding:21px 0;

    animation:
        ld-v6-marquee
        28s linear
        infinite;
}

.ld-v6-marquee-item{
    display:flex;
    align-items:center;
    gap:12px;

    white-space:nowrap;

    color:var(--ld-text-muted);

    font-family:var(--ld-display);
    font-weight:650;
}

.ld-v6-marquee-item::after{
    content:"";
    width:5px;
    height:5px;

    border-radius:50%;

    background:var(--ld-gold);
}

@keyframes ld-v6-marquee{
    from{
        transform:translateX(0);
    }

    to{
        transform:translateX(-50%);
    }
}

/* ----------------------------------------------------------
   RESPONSIVE
---------------------------------------------------------- */

@media (max-width:900px){

    .ld-v6-container{
        width:min(
            calc(100% - 36px),
            var(--ld-container)
        );
    }

    .ld-v6-nav-links{
        display:none;
    }

    .ld-v6-section{
        padding:76px 0;
    }

    .ld-v6-hero{
        padding:
            105px 0
            72px;
    }

    .ld-v6-hero h1{
        font-size:
            clamp(
                40px,
                10vw,
                66px
            );
    }
}

@media (max-width:560px){

    .ld-v6-container{
        width:
            calc(
                100% - 28px
            );
    }

    .ld-v6-hero{
        padding-top:82px;
    }

    .ld-v6-hero-sub{
        font-size:16px;
    }

    .ld-v6-btn{
        width:100%;
    }
}

@media (
    prefers-reduced-motion:
    reduce
){

    *,
    *::before,
    *::after{
        animation-duration:
            .001ms !important;

        animation-iteration-count:
            1 !important;

        transition-duration:
            .001ms !important;
    }
}