@import url('https://fonts.googleapis.com/css2?family=Sora:wght@200;400;500&display=swap');

:root {
  --color-background: #FFFFFF;
  --color-white: #FAFAF9;
  --color-primary: #20293A;
  --color-secondary: #6C727F;
  --color-chip-background: #E6D6FC;
  --color-chip-text: #883AE1;
  --color-border: #E5EAF0;
}

/* Reset some default styles */
body, h1, h2, h3, p, ul, li, hr {
  margin: 0;
	margin-inline: 0;
  padding: 0;
	padding-inline: 0;
}

.title {
    font-size: 18px;
    font-size: 1.125rem;
    font-weight: 600;
}

.body-text {
    font-size: 14px;
    font-size: 0.875rem;
    font-weight: 400;
}

.small-text {
    font-size: 12px;
    font-size: 0.75rem;
    font-weight: 400;
}

.tag {
    font-size: 10px;
    font-size: 0.625rem;
    font-weight: 500;
}

body {
	display: flex;
	justify-content: center;
	align-items: flex-start;
	min-height: 100vh;
	font-family: 'Sora', sans-serif;
	padding-top: 164px;
	background-color: var(--color-white);
}

.card {
	width: 335px;
	background-color: var(--color-background);
	border-radius: 15px;
	overflow: hidden;
	padding: 16px 16px 20px;
	box-shadow: 0px 30px 100px 0px rgba(17, 23, 41, 0.05);
}

.header-image {
	height: 152px;
	width: 100%;
	object-fit: cover;
	border-radius: 15px;
}

.chip {
	display: inline-block;
	background-color: var(--color-chip-background);
	color: var(--color-chip-text);
	padding: 6px 16px;
	border-radius: 20px;
	margin: 16px 0
}

h1 {
	margin-bottom: 6px;
}

p {
	color: var(--color-secondary);
}

.description {
	margin-bottom: 20px;
}

hr {
	width: 120%;
	margin-left: -20px;
	border: 1px solid var(--color-border);
}

.author {
	color: var(--color-secondary);
	height: 35px;
	display: flex;
	align-items: flex-end;
	justify-content: flex-start;
}