@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap');

body{
    margin: 0;
    background-color: FFFEFB;
    color: white;
    font-family: 'Lato', sans-serif;
    scroll-behavior: smooth;
}
*{
    margin: 0;
}

:root {
    --greyOne: #0f0f0f;
    --greyTwo: #181818;
    --greyThree: #363636;
    --greyFour: #ececec;
    --orange: #FFA200;
    --greyGradient: linear-gradient(180deg, #212121 0%, rgba(33, 33, 33, 0.4) 100%);

    --backdrop-filter: blur(20px);
    --border-radius-button: 4px;
    --border-radius-card: 10px;

    --font-size-heading: 2.25rem;
    --font-size-semibold: 2rem;
    --font-size-medium: 1.25rem;
    --font-size-text: 1rem;

    --font-weight-heading: 900;
    --font-weight-semibold: 700;
    --font-weight-medium: 400;
    --font-weight-text: 400;
}

h1{
    color: var(--greyOne);
    font-size: var(--font-size-heading);
    font-weight: var(--font-weight-heading);
    letter-spacing: 1.5px;
}
h2{
    color: var(--greyTwo);
    font-size: var(--font-size-semibold);
    font-weight: var(--font-weight-semibold);
    letter-spacing: 1.5px;
}
h3{
    color: var(--greyTwo);
    font-size: var(--font-size-medium);
    font-weight: var(--font-weight-semibold);
    letter-spacing: 1px;
}
p{
    color: var(--greyThree);
    font-size: var(--font-size-text);
    font-weight: var(--font-weight-text);
    letter-spacing: 0.5px;
}
a{
    color: var(--greyThree);
    text-decoration: none;
}
ul{
    color: var(--greyThree);
}
li{
    color: var(--greyTwo);
}
a:visited{
    color: var(--greyThree);
}
.flent-intro{
    background-color: rgb(5, 5, 5);
    color: #f8f8f8;
    padding-top: 8vh;
    padding-left: 8vw;
    padding-right: 8vw;
    padding-bottom: 24vh;
}
.flent-intro h1{
    color: #f8f8f8;
    margin-top: 12vh;
    font-size: 6rem;
    color: var(--orange);
}
.flent-intro p{
    color: #e0e0e0;
}
.flent-intro a{
    color: #f8f8f8;
    font-size: 1.5rem;
}
.flent-intro a:visited{
    color: #e0e0e0;
}
.flent-intro p.big-intro{
    margin-top: 18vh;
    width: 50vw;
    line-height: 5vh;
}
.problem-statement{
    margin-left: 8vw;
    margin-bottom: 10vh;
    margin-top: 18vh;
    margin-right: 8vw;
}
.problem-statement h3{
    margin-bottom: 1vh;
    letter-spacing: 0.5px;
    font-size: 1.5rem;
}
.solution{
    margin-left: 8vw;
    margin-bottom: 10vh;
    margin-top: 6vh;
    margin-right: 8vw;
}
.solution h3{
    margin-bottom: 1vh;
    letter-spacing: 0.5px;
    font-size: 1.5rem;
}
.process{
    margin-left: 8vw;
    margin-right: 8vw;
}
.process h3{
    margin-bottom: 1vh;
    letter-spacing: 0.5px;
    font-size: 1.5rem;
}
.process h4{
    color: var(--greyThree);
    margin-bottom: 8vh;
}
.process p{
    font-weight: 700;
    font-size: 1.05rem;
    margin-bottom: 1vh;
}
.pro{
    display: flex;
    flex-direction: column;
    margin-bottom: 8vh;
}
.process a{
    font-weight: 400;
    font-size: 1.5rem;
    color: var(--greyOne);
    text-decoration: underline;
}
.process a span{
    font-weight: 700;
    font-size: 1.5rem;
    color: var(--orange);
    text-decoration: none;
}
.process-in{
    display: flex;
}
.process-right{
    margin-left: 24vw;
}
.quantative-research, .qualitative-research{
    margin-left: 8vw;
    margin-right: 8vw;
    margin-top: 12vh;
}
.quantative-research h3, .qualitative-research h3{
    margin-bottom: 1vh;
    letter-spacing: 0.5px;
    font-size: 1.5rem;
    margin-bottom: 2vh;
}
.quantative-research p, .qualitative-research p{
    font-weight: 400;
    font-size: 1rem;
    width: 60vw;
    margin-top: 2vh;
}
.quantative-research ul, .qualitative-research ul{
    list-style: circle;
    color: var(--greyThree);
    font-weight: 400;
    font-size: 1rem;
    margin-top: 2vh;
}
.stats h3{
    font-size: 1rem;
    margin-top: 8vh;
}
.stats{
    display: flex;
}
.barchart img{
    width: 50vw;
    margin-left: 25vw;
}
.third-stats h3{
    font-size: 1rem;
    margin-top: 8vh;
}
.second-stats{
    margin-left: 10vw;
}
.user-persona{
    margin-left: 8vw;
    margin-top: 12vh;
    margin-right: 8vw;
}
.user-persona p{
    margin-right: 8vw;
}
.user-persona h3{
    margin-bottom: 1vh;
    letter-spacing: 0.5px;
    font-size: 1.5rem;
    margin-bottom: 2vh;
}
.pratik-bio{
    display: flex;
    margin-top: 6vh;
}
.pratik-bio img{
    width: 25vw;
    margin-right: 12vw;
}
.pratik-bio h4{
    margin-top: 12vh;
    color: #111111 !important;
    font-size: 1 rem;
    margin-bottom: 2vh;
}
.prateek-goals h3{
    margin-bottom: 2vh;
    margin-top: 4vh;
    font-size: 0.1 rem;
}
.stats img{
    width: 36vw;
}
.prateek-goals ul span{
    font-weight: 600;
    margin-right: 1vw;
    font-size: 1.05rem;
}
.prateek-goals ul li{
    margin-left: 2vw;
    margin-bottom: 2vh;
}
.prateek-goals ul{
    padding: 0px;
    list-style:lower-roman;
    width: 40vw;
    margin-right: 5vw;
}
.prateek-goals h4{
    color: #111111;
    font-size: 2 rem;
    margin-bottom: 2vh;
    margin-top: 4vh;
}
.pain-prateek h4{
    color: #111111;
    font-size: 2 rem;
    margin-bottom: 2vh;
    margin-top: 4vh;
}
.pain-prateek ul li{
    margin-bottom: 0.5vh;
}
.pain-prateek ul{
    padding-left: 8px;
    list-style: square;
}
.prateek-flex{
    display: flex;
}
.aditi-bio{
    display: flex;
    margin-top: 6vh;
}
.aditi-bio img{
    width: 25vw;
    margin-right: 12vw;
}
.aditi-bio h4{
    margin-top: 12vh;
    color: #111111 !important;
    font-size: 1 rem;
    margin-bottom: 2vh;
}
.aditi-goals h3{
    margin-bottom: 2vh;
    margin-top: 4vh;
    font-size: 0.1 rem;
}
.stats img{
    width: 36vw;
}
.aditi-goals ul span{
    font-weight: 600;
    margin-right: 1vw;
    font-size: 1.05rem;
}
.aditi-goals ul li{
    margin-left: 2vw;
    margin-bottom: 2vh;
}
.aditi-goals ul{
    padding: 0px;
    list-style:lower-roman;
    width: 40vw;
    margin-right: 5vw;
}
.aditi-goals h4{
    color: #111111;
    font-size: 2 rem;
    margin-bottom: 2vh;
    margin-top: 4vh;
}
.pain-aditi h4{
    color: #111111;
    font-size: 2 rem;
    margin-bottom: 2vh;
    margin-top: 4vh;
}
.pain-aditi ul li{
    margin-bottom: 0.5vh;
}
.pain-aditi ul{
    padding-left: 8px;
    list-style: square;
}
.aditi-flex{
    display: flex;
}
.emathy-mapping {
    margin-left: 8vw;
    margin-top: 12vh;
    margin-right: 8vw;
}
.emathy-mapping h3{
    margin-bottom: 2vh;
}
.emathy-mapping p{
    width: 60vw;
}
.prateek-emathy h4{
    color: #0f0f0f;
    margin-top: 6vh;
}
.aditi-emathy h4{
    color: #0f0f0f;
    margin-top: 6vh;
}
.emathy-mapping h2{
    letter-spacing: 0px;
    font-size: 1.5rem;
    font-weight: 700;
    margin-bottom: 1vh;
}
.affinity-mapping h2{
    letter-spacing: 0px;
    font-size: 1.5rem;
    font-weight: 700;
    margin-bottom: 1vh;
}
.affinity-mapping {
    margin-left: 8vw;   
    margin-top: 12vh;
    margin-right: 8vw;
}
.affinity-mapping p{
    width: 60vw;
}
.affinity-top{
    margin-top: 4vh;
}
.img-affinity img{
    margin-top: 2vh;
    margin-left: auto;
}
.ideatec {
    margin-left: 8vw;   
    margin-top: 12vh;
    margin-right: 8vw;
}
.card-sorting h3{
    margin-bottom: 4vh;
}
.card-sorting img{
    width: 84vw;
}
.img-affinity img{
    width: 84vw;
}
.prateek-emathy img{
    width: 84vw;
}
.aditi-emathy img{
    width: 84vw;
}
.user-flow h3{
    margin-bottom: 4vh;
}
.user-flow img{
    width: 76vw;
}
.design{
    margin-left: 8vw;   
    margin-top: 12vh;
    margin-right: 8vw;
}
.first-wireframe img, .second-wireframe img, .third-wireframe img, .fourth-wireframe img{
    width: 18%;
    align-items:start;
}