:root{
    --margin-width:min(1rem, 5vw);

    --color-background: #D9D9D9;
    --color-bubble-blue: #84A1B6;
    --color-bubble-winered: #9A4F30;
    --color-bubble-pink: #C59392;
    --color-bubble-beige-light: #D2C9C0;
    --color-bubble-beige-dark: #C7AE90;
    --color-bubble-brown: #59402E;

    --font-sentient: 'Sentient', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    --font-sentient-italic: 'SentientItalic', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}

*{
    padding: 0;
    margin: 0;
}

@font-face {
    font-family: 'Sentient';
    src: url(./fonts/Sentient-Variable.ttf);
}

@font-face {
    font-family: 'SentientItalic';
    src: url(./fonts/Sentient-VariableItalic.ttf);
}

body{
    background-color: var(--color-background);
}

header{
    display: flex;
    align-items: end;
    justify-content: space-between;

    margin-inline: var(--margin-width);
}

h1, p{
    font-family: var(--font-sentient);
    font-weight: 300;
}