/* Index */
.index-header {
    font-size: 4rem;
    font-weight: 700;
    background: linear-gradient(80deg , var(--primary-700), var(--primary) 30%, var(--indigo));
    background-clip: border-box;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
@media (min-width: 992px) {
    .index-header {
        font-size: 4.4rem;
    }
}

.index-subheader {
    font-size: 1.35rem;
    color: var(--gray-500);
}

.index-button {
    padding: 0.8rem 4rem;
    font-size: 1.1rem;
    border-radius: calc(2*var(--border-radius));
}

@media (min-width: 1200px) {
    .index-hero {
        transform: scale(1.15);
    }
}

.index-background-one {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' xmlns:svgjs='http://svgjs.com/svgjs' width='1440' height='560' preserveAspectRatio='none' viewBox='0 0 1440 560'%3e%3cg mask='url(%26quot%3b%23SvgjsMask1671%26quot%3b)' fill='none'%3e%3crect width='1440' height='560' x='0' y='0' fill='url(%23SvgjsLinearGradient1672)'%3e%3c/rect%3e%3cpath d='M1440 0L1387.75 0L1440 124.31z' fill='rgba(255%2c 255%2c 255%2c .1)'%3e%3c/path%3e%3cpath d='M1387.75 0L1440 124.31L1440 296.51L771.68 0z' fill='rgba(255%2c 255%2c 255%2c .075)'%3e%3c/path%3e%3cpath d='M771.68 0L1440 296.51L1440 380.24L555.18 0z' fill='rgba(255%2c 255%2c 255%2c .05)'%3e%3c/path%3e%3cpath d='M555.18 0L1440 380.24L1440 473.47L374.51 0z' fill='rgba(255%2c 255%2c 255%2c .025)'%3e%3c/path%3e%3cpath d='M0 560L231.01 560L0 308.07z' fill='rgba(0%2c 0%2c 0%2c .1)'%3e%3c/path%3e%3cpath d='M0 308.07L231.01 560L894.36 560L0 180.36z' fill='rgba(0%2c 0%2c 0%2c .075)'%3e%3c/path%3e%3cpath d='M0 180.36L894.36 560L906.78 560L0 162.73000000000002z' fill='rgba(0%2c 0%2c 0%2c .05)'%3e%3c/path%3e%3cpath d='M0 162.73000000000002L906.78 560L1182.71 560L0 73.44000000000001z' fill='rgba(0%2c 0%2c 0%2c .025)'%3e%3c/path%3e%3c/g%3e%3cdefs%3e%3cmask id='SvgjsMask1671'%3e%3crect width='1440' height='560' fill='white'%3e%3c/rect%3e%3c/mask%3e%3clinearGradient x1='50%25' y1='100%25' x2='50%25' y2='0%25' gradientUnits='userSpaceOnUse' id='SvgjsLinearGradient1672'%3e%3cstop stop-color='%230e2a47' offset='0'%3e%3c/stop%3e%3cstop stop-color='rgba(114%2c 19%2c 170%2c 1)' offset='1'%3e%3c/stop%3e%3c/linearGradient%3e%3c/defs%3e%3c/svg%3e");
    background-size: cover;
}

/* Index testimonial */
.index-testimonial-avatar {
    width: 85px;
    height: 85px;
    border-radius: 50%;
    transform: translateY(-70%);
    border: 4px solid var(--white);
    position: absolute;
    left: 50%;
    margin-left: -52px;
}

/* Index FAQ */
.index-faq svg {
    transition: all .15s;
    color: var(--primary-800);
}

/* Timeline */
.index-timeline {
    position: relative;
}

.index-timeline::before {
    content: '';
    position: absolute;
    border-left: 2px solid var(--gray-200);
    height: 100%;
    left: calc(57px / 2);
}

/* Index call to action */
.index-cta {
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:svgjs="http://svgjs.dev/svgjs" viewBox="0 0 700 700" width="700" height="700"><defs><linearGradient gradientTransform="rotate(58, 0.5, 0.5)" x1="50%" y1="0%" x2="50%" y2="100%" id="ffflux-gradient"><stop stop-color="hsl(315, 96%, 20%)" stop-opacity="1" offset="0%"></stop><stop stop-color="hsl(313, 100%, 39%)" stop-opacity="1" offset="100%"></stop></linearGradient><filter id="ffflux-filter" x="-20%" y="-20%" width="140%" height="140%" filterUnits="objectBoundingBox" primitiveUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feTurbulence type="fractalNoise" baseFrequency="0.005 0.003" numOctaves="1" seed="282" stitchTiles="stitch" x="0%" y="0%" width="100%" height="100%" result="turbulence"></feTurbulence><feGaussianBlur stdDeviation="20 0" x="0%" y="0%" width="100%" height="100%" in="turbulence" edgeMode="duplicate" result="blur"></feGaussianBlur><feBlend mode="color-dodge" x="0%" y="0%" width="100%" height="100%" in="SourceGraphic" in2="blur" result="blend"></feBlend></filter></defs><rect width="700" height="700" fill="url(%23ffflux-gradient)" filter="url(%23ffflux-filter)"></rect></svg>');
    background-repeat: no-repeat;
    background-size: cover;
    color: white !important;
}

.index-cta a.btn {
    color: var(--primary);
    padding: 1.1rem 4rem;
    font-size: 1.15rem;
}

.index-cta a.btn:hover {
    background: var(--primary-900);
    border-color: var(--primary-900);
    color: var(--primary-300);
}

[data-theme-style="dark"] .index-cta a.btn {
    background: var(--light);
    border-color: var(--light);
}