::-webkit-scrollbar{
    width:0;
    background:transparent;
}

html{
    scrollbar-width:none;
}

body{
    -ms-overflow-style:none;
}

.section-nav{

    position:fixed;

    top:50%;

    right:28px;

    transform:translateY(-50%);

    z-index:99999;

    display:flex;

    flex-direction:column;

    gap:18px;

}

.section-nav-item{

    position:relative;

    width:12px;

    height:12px;

    border-radius:50%;

    background:#555;

    cursor:pointer;

    transition:.35s;

}

.section-nav-item.active{

    background:#00ff91;

    box-shadow:0 0 20px rgba(0,255,145,.6);

    transform:scale(1.25);

}

.section-nav-item::before{

    content:"";

    position:absolute;

    right:8px;

    top:50%;

    width:0;

    height:2px;

    background:#00ff91;

    transform:translateY(-50%);

    transition:.3s;

}

.section-nav-item::after{

    content:attr(data-title);

    position:absolute;

    right:22px;

    top:50%;

    transform:translateY(-50%);

    opacity:0;

    color:white;

    font-size:14px;

    white-space:nowrap;

    transition:.3s;

    pointer-events:none;

}

.section-nav:hover .section-nav-item::before{

    width:45px;

}

.section-nav:hover .section-nav-item::after{

    opacity:1;

    right:60px;

}

.section-nav{

    position:fixed;

    top:50%;

    right:16px;

    transform:translateY(-50%);

    display:flex;

    flex-direction:column;

    align-items:flex-end;

    gap:18px;

    z-index:9999;

}

.section-nav-item{

    position:relative;

    width:10px;
    height:10px;

    border-radius:50%;

    background:#666;

    cursor:pointer;

    transition:.3s;

}

/* kreska */

.section-nav-item:not(:last-child){

    margin-bottom:26px;

}

.section-nav-item:not(:last-child)::before{

    content:"";

    position:absolute;

    left:50%;

    top:100%;

    width:2px;

    height:26px;

    transform:translateX(-50%);

    background:rgba(255,255,255,.15);

}

.section-nav-item.active{

    background:#00ff91;

    transform:scale(1.35);

    box-shadow:0 0 16px rgba(0,255,145,.6);

}

.section-nav-item.active::before{

    background:rgba(0,255,145,.45);

}

.nav-dot{

    position:relative;

}

.nav-dot:not(:last-child)::after{

    content:"";

    position:absolute;

    left:50%;

    top:100%;

    width:2px;

    height:18px;

    transform:translateX(-50%);

    background:rgba(255,255,255,.15);

}

.about,
.why,
.faq,
.end-section{

    scroll-margin-top:90px;

}