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

.inconsolata-text {
  font-family: "Inconsolata", monospace;
  font-optical-sizing: auto;
  font-weight: normal;
  font-style: normal;
  font-variation-settings:
    "wdth" 100;
}

@font-face {
	font-family: "Lora";
	src: url(lora regular);
	font-weight: normal;
	font-style: normal;
	font-display: fallback;
}

@font-face {
	font-family: "LoraBold";
	src: url(lora bold);
	font-weight: bold;
	font-style: normal;
	font-display: fallback;
}

body {
	font-family: "Inconsolata";
	font-size: 100%;
	line-height: 133%;
}

main {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
	gap: 1em;
}

.second {
	font-family: system-ui;
}

h2 {
	text-transform: capitalize;
	font-size: 200%;
	line-height: 120%;
}