:root {
	--container-color: #2b2b2b;
	--container-h1-color: #0b3954;
}

[data-theme="dark"] {
	--container-color: #e7e7dc;
	--container-h1-color: #1479b6;
}

/* CONTENT */

.container {
  padding: 3rem clamp(1rem, 3vw, 3rem);
  font-family: 'Segoe UI', sans-serif;
  color: var(--container-color);
  line-height: 1.5;
  border-radius: 1rem;
  transition: box-shadow 0.3s ease;
}

.container:hover {

}

.container h1 {
  font-size: calc(clamp(1.3rem, 3vw, 1.7rem) + var(--font-size-larger));
  color: var(--container-h1-color);
  margin-top: 2rem;
  margin-bottom: 1rem;
  border-left: 5px solid #1e90ff;
  padding-left: 0.75rem;
}

.container p {
	margin-bottom: 1.5rem;
	text-align: justify;
}

.container a {
	color: #3295ff;
	text-decoration: none;
	transition: 0.2s ease;
}

.container a:hover {
	color: #5661ff;
	text-decoration: underline;
}