_body.scss

@use 'vendors/vertical-rhythm-reset' as vr;
@use 'abstracts/mixins';

body {
	// @include vr.grid(); Debugging
	max-width: 65ch;

	margin: 0 auto;
	@include vr.set($padding: 0 1);
}

body:has(input[id="toggle-grid"]:checked) {
	@include mixins.dot-grid;
}

// Make headers one level smaller when they’re in the `main`.
main {
	h1 {
		@include vr.set($font-size: 3);
	}

	h2 {
		@include vr.set($font-size: 2);
	}

	h3 {
		@include vr.set($font-size: 1);
	}

	h4,
	h5,
	h6 {
		@include vr.set($font-size: 0);
	}
}