html{

	font-size: 16px;
}

body{

	font-family: sans-serif;
	padding: 1.2rem 0;
	line-height: 1.2rem;
	background: yellow;
}

img{

	max-width: 100%;
}


header{

	margin-bottom: 4.8rem;
	padding: 0 1.2rem;
	font-size: 2.4rem;
	line-height: 2.4rem;
}

header h1{

	margin-bottom: 2.4rem;
}

header .intro{

	width: calc(100% / 2);
}


#cats{

	columns: 3;
	column-gap: 0;

}

#cats .cat{

	padding: 0 1.2rem;
	margin-bottom: 2.4rem;
	break-inside: avoid;

}

#cats .cat .content{

	columns: 2;
	column-gap: 0;
}


#cats .cat .content > *{

	break-inside: avoid;
}

.cat h2{

	font-size: 2.4rem;
	line-height: 2.4rem;
	font-family: cursive;
}

.cat  h2,
.cat .content p{

	margin-bottom: 1.2rem;
}

.cat .content figure{

	font-size: 0.75rem;
	line-height: 1rem;
}

.cat .content p{

	padding-right: 1.2rem;
}