* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Inter', sans-serif;
    scroll-behavior: smooth;
    transition: all .25s ease;
}


:root {
    --text: rgb(0, 0, 0);
    --text-desc: rgba(0, 0, 0, 0.568);
    --text-more: rgba(0, 0, 0, 0.546);

    --opposite-text: rgb(255, 255, 255);
    --opposite-text-desc: rgba(255, 255, 255, 0.855);
    --opposite-text-mosre: rgba(255, 255, 255, 0.546);


    --background: rgb(254, 255, 255);
    --background-light: rgb(255, 255, 255);
    --background-trans: rgba(255, 255, 255, 0.931);
    --background-trans2: rgba(1, 1, 18, 0.509);

    --background-desc: rgba(255, 255, 255, 0.671);

    --shadow: rgba(0, 0, 0, 0.163);
    --shadow-medium: rgba(0, 0, 0, 0.285);

    --main: #ff0389;
    --main-dark: #7106d6;

    --fw-400: 400;
    --fw-500: 500;
    --fw-600: 600;
    --fw-700: 700;
    --fw-800: 800;
    --fw-900: 900;






    --card-transition: cubic-bezier(0.83, 0.02, 0.17, 0.98);
    --card-transition-2: cubic-bezier(0.34, 0.78, 0, 0.97);

    --gradient1: linear-gradient(250deg, #ff9249 21%, #ff00ff 50%, #00eeff 100%);
    --gradient2: linear-gradient(250deg, rgba(255, 0, 255, 1) 30%, rgba(0, 234, 255, 1) 100%);


    --gradient-smooth-r: linear-gradient(90deg, rgb(255, 150, 80) 25%, rgb(255, 73, 194) 50%, rgb(88, 240, 251) 75%, rgb(255, 150, 80) 100%);
    --gradient-smooth: linear-gradient(70deg, #72def6 21%, #ff44b1 50%, #f8aa3d 100%);


    --gradient-smooth2: linear-gradient(250deg, rgb(249, 183, 140) 21%, rgb(255, 120, 255) 50%, rgb(174, 250, 255) 100%);

    --gradient1-c: linear-gradient(250deg, rgb(253, 126, 41) 21%, rgb(255, 0, 204) 50%, rgb(0, 229, 245) 100%);

    --gradient1-r: linear-gradient(260deg, rgb(255, 146, 73) 10%, rgba(255, 0, 255, 1) 40%, rgba(0, 234, 255, 1) 75%, rgb(255, 146, 73) 100%);

    --gc1: #ff9249;
    --gc2: #ff00ff;
    --gc3: #00eaff;

    --gr1: #fa985c;
    --gr2: #ff49c2;
    --gr3: #61f1fb;






    /* Text sizes */
    --h1-big: 6.75rem;
    --h1: 4.25rem;
    --h2: 3.75rem;
    --h3: 2rem;
    --p: .95rem;
    --p-big: 1.5rem;
}







/* Display too large */
@media screen and (min-width: 1500px) {
    html {
        font-size: calc(100vw / 100);
    }
}

/* Mobile sizedown */
@media screen and (max-width: 1200px) {
    :root {
        --h1-big: 5rem;
        --h1: 4rem;
        --h2: 3rem;
        --h3: 2rem;
        --p: 1rem;
        --p-big: 1.4rem;
    }
}

@media screen and (max-width: 1100px) {
    :root {
        --h1-big: 4rem;
        --h1: 3.5rem;
        --h2: 2.5rem;
        --h3: 2.5rem;
        --p: .75rem;
        --p-big: 1.3rem;
    }
}

@media screen and (max-width: 700px) {
    :root {
        --h1-big: 2.5rem;
        --h1: 3rem;
        --h2: 2rem;
        --h3: 2rem;
        --p: .75rem;
        --p-big: 1.2rem;
    }

    html {
        font-size: 13px;
    }


}



/* Text settings */

h1 {
    font-size: var(--h1);
    line-height: calc(var(--h1) * 1);
    font-weight: 800;
    color: var(--text);
    font-family: Inter;
    letter-spacing: -.1rem;
}

h2 {
    font-size: var(--h2);
    line-height: var(--h2);
    font-weight: 900;
    color: var(--text);
    font-family: Inter;
    letter-spacing: -.075rem;
}

h3 {
    font-size: var(--h3);
    line-height: var(--h3);
    font-weight: 800;
    color: var(--text);
    font-family: Inter;
}

p {
    font-size: var(--p);
    line-height: var(--p);
    font-weight: 400;
    color: var(--text-desc);
    font-family: Inter;
}

/* Very beautiful code below (Text configuration) */
h1.center,
h2.center,
h3.center,
p.center {
    text-align: center;
}

h1.right,
h2.right,
h3.right,
p.right {
    text-align: right;
}

span {
    font-family: inherit;
}




#nwrapper {
    padding: 0 5rem;
}

/* Flex styles */


.flex {
    display: flex;
    flex-direction: row;
}

.flex.v {
    flex-direction: column;
}

.flex.v.center,
.flex.center {
    align-items: center;
    justify-content: center;
}

.fkex.v.nocenter,
.flex.nocenter {
    align-items: flex-start;
    justify-content: flex-start;
}

.jcenter {
    justify-content: center;
}

.acenter {
    align-items: center;
}

.flex.spacebetween {
    justify-content: space-between;
}

.flex.spacearound {
    justify-content: space-around;
}

.flex.v.spacebetween {
    align-items: space-between;
}

.flex.v.spacearound {
    align-items: space-around;
}

/* Parameters */

.absolute {
    position: absolute;
}

.relative {
    position: relative;
}

.fixed {
    position: fixed;
}

.width100 {
    width: 100%;
}

#nwrapper>.width100 {
    width: calc(100% - 10rem)
}

.height100 {
    height: 100%;
}




/* Gap parametres */

.gap05 {
    gap: 0.5rem;
}

.gap1 {
    gap: 1rem;
}

.gap15 {
    gap: 1.5rem;
}

.gap2 {
    gap: 2rem;
}

.gap3 {
    gap: 3rem;
}

.gap4 {
    gap: 4rem;
}

.gap5 {
    gap: 5rem;
}





/* A  */

p a {
    color: var(--text);
    text-decoration: underline;
    transition: all .2s ease-in-out;
}