/* Osnova: reset, tipografija, kontejner, fokus. Komponente idu u zasebne datoteke. */

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
	margin: 0;
	background: var(--c-bg);
	color: var(--c-ink);
	font: 400 var(--fs-body)/var(--lh-body) var(--f-ui);
	-webkit-font-smoothing: antialiased;
}

img, svg { display: block; max-width: 100%; height: auto; }

a { color: inherit; }

h1, h2, h3 {
	margin: 0;
	font-family: var(--f-display);
	font-weight: 500;
}

button, input, select, textarea { font: inherit; color: inherit; }

:focus-visible {
	outline: 2px solid var(--c-ink);
	outline-offset: 2px;
}

.hr-container {
	width: 100%;
	max-width: calc(var(--content-max) + 2 * var(--gutter));
	margin-inline: auto;
	padding-inline: var(--gutter);
}

.screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	white-space: nowrap;
}

/* Podnožje (handout: #FBF8F5, gornja linija #EDE6E0, 24 px 64 px, 13 px) */
.hr-footer {
	margin-top: 72px;
	border-top: 1px solid var(--c-hairline);
	background: var(--c-bg-warm);
	color: var(--c-ink-2);
	font-size: 13px;
	line-height: normal;
}
.hr-footer__red {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 8px 24px;
	padding-block: 24px;
}