*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

:root{
    /*colors*/
    --black: #1d1d1d;
    --white: #f5f5f5;

    /*font-sizing*/
    --font-type-29: 1.812rem;
    --font-type-23: 1.438rem;
    --font-type-18: 1.125rem;
    --font-type-16: 1rem;

    /*margins*/
    --margin-half: 0.5rem;
    --margin-one: 1rem;
    --margin-two: 2rem;
}

@font-face {
    font-family: "Satoshi-Bold";
    font-weight: 700;
    src: url("/assets/fonts/Satoshi-Bold.woff2");
    font-display: swap;
}

@font-face {
    font-family: "Satoshi-Medium";
    font-weight: 500;
    src: url("/assets/fonts/Satoshi-Medium.woff2");
    font-display: swap;
}

@font-face {
    font-family: "Satoshi-Regular";
    font-weight: 400;
    src: url("/assets/fonts/Satoshi-Regular.woff2");
    font-display: swap;
}

/*GLOBAL STYLES*/

body{
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    background: var(--white);
    color: var(--black);
    font-family: "Satoshi-Regular", sans-serif;
    font-weight: 400;
}

.container{
    width: 85%;
    max-width: 62rem;
    margin: 0 auto;
}

/*------INTRO STYLES START-------*/
.intro__section{
    margin-top: 1.5rem;
}

.intro__heading__container{
    display: flex;
    flex-direction: row;
    align-items: center;
}

.intro__heading__text{
    margin-right: auto;
}

.intro__heading__socials a{
    text-decoration: none;
    color: var(--black);
    margin-right: 15px;
}

.intro__heading__socials__item{
    height: var(--font-type-29);
    width: var(--font-type-29);
}


.intro__title{
    font-size: var(--font-type-29);
    font-family: "Satoshi-Bold", sans-serif;
    font-weight: 700;
}

.intro__text a:visited{
    text-decoration: none;
}

.intro__text, .intro__help{
    display: block;
    line-height: 160%;
    margin-block-start: var(--margin-one);
    margin-block-end: var(--margin-one);
    font-size: var(--font-type-18);
}

.intro__help{
    list-style-position: inside;
}


/*------INTRO STYLES END-------*/


/*-----TOOLS SECTION START-----*/
.tools__section{
    margin-bottom: var(--margin-two);
}

.tools__title{
    font-size: var(--font-type-23);
    font-family: "Satoshi-Medium", sans-serif;
    font-weight: 500;
    margin-bottom: var(--margin-one);
}

.tools__grid{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 1rem;
    max-width: 65%;   
}

.tools__grid__item{
    font-size: var(--font-type-18);
    list-style: none;
    display: flex;
    align-items: center;
    text-align: center;
}

.tools__grid__item__logo{
    width: var(--font-type-18);
    height: var(--font-type-18);
    margin-left: 0.5rem;
}
/*------TOOLS SECTION END------*/


/*------VALUE SECTION START------*/
.value__title{
    font-size: var(--font-type-23);
    font-family: "Satoshi-Medium", sans-serif;
    font-weight: 500;
    margin-bottom: var(--margin-one);
}

.value__text{
    display: block;
    line-height: 160%;
    margin-block-start: var(--margin-one);
    margin-block-end: var(--margin-one);
    font-size: var(--font-type-18);
}

/*------VALUE SECTION END------*/

/*----SEEKING SECTION START-----*/
.seeking__section{
    margin-bottom: 1.5rem;
}

.seeking__title{
    font-size: var(--font-type-23);
    font-family: "Satoshi-Medium", sans-serif;
    font-weight: 500;
    margin-bottom: var(--margin-one);
}

.seeking__text{
    display: block;
    line-height: 160%;
    margin-block-start: var(--margin-one);
    margin-block-end: var(--margin-one);
    font-size: var(--font-type-18);
}

/*----SEEKING SECTION END-----*/


/*-----RESPONSIVE STYLES START----*/
@media only screen and (max-width:768px){
    .intro__title{
        font-size: var(--font-type-23);
    }

    .intro__heading__socials__item{
        height: var(--font-type-23);
        width: var(--font-type-23);
    }

    .value__title, .seeking__title, .tools__title{
        font-size: var(--font-type-18);
    }

   .intro__text, .intro__help, .value__text, .seeking__text, .tools__grid__item{
        font-size: var(--font-type-16);
    }
}

/*-----RESPONSIVE STYLES END-----*/