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

:root {
    --Purple-50: hsl(260, 100%, 95%);
    --Purple-300: hsl(264, 82%, 80%);
    --Purple-500: hsl(263, 55%, 52%);


    --White: hsl(0, 0%, 100%);
    --Grey-100: hsl(214, 17%, 92%);
    --Grey-200: hsl(0, 0%, 81%);
    --Grey-400: hsl(224, 10%, 45%);
    --Grey-500: hsl(217, 19%, 35%);
    --Dark-blue: hsl(219, 29%, 14%);
    --Black: hsl(0, 0%, 7%);
}

body {
    background-color: var(--Purple-50);
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
}

.container {
    display: grid;
    width: 100rem;
    grid-template-columns: auto auto auto auto;
    grid-template-rows: auto auto;
    gap: 3rem;
    font-family: "Barlow Semi Condensed", sans-serif;
}

.long-box {
    border-radius: 0.7rem;
}

.long-1 {
    background-color: var(--Purple-500);
    color: var(--White);
    grid-column: span 2;    
}

.long-2 {
    background-color: var(--Dark-blue);
    color: var(--White);
    grid-column: span 2;
}

.short-box {
    border-radius: 0.7rem;
}

.short-1 {
    background-color: var(--Grey-500);
    color: var(--White);
}

.short-2 {
    background-color: var(--White);
}

.high-box {
    background-color: var(--White);
    grid-row: span 2;
    border-radius: 0.7rem;
    width: 100%;
    color: var(--Grey-400);
}

.box-inside {
    margin: 2.5rem;
    display: grid;
    row-gap: 1.4rem; 
}

.profile {
    display: flex;
    align-items: center;

}

.name-edu {
    display: block;
    margin-left: 1rem;
}

img {
    border-radius: 1rem;
    width: 2rem;
    height: 2rem;
}


.education {
    color: var(--Grey-200);
    font-size: clamp(0.4rem, 2.5vh, 0.8rem);
}

.header {
    font-size: clamp(1rem, 2.5vh, 3rem);
    font-weight: 500;
}

.paragraph {
    color: var(--Grey-200);
    font-size: clamp(0.4rem, 2.5vh, 1.1rem);
}

@media screen and (max-width:75rem) {
    .container {
        display: block;
        width: 80%;
    }

    .box-inside {
        padding-top: 2.5rem;
        padding-bottom: 2.5em;
    }
}