@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local('Open Sans'), url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;700&display=swap');
}
@font-face {
  font-family: 'Merriweather';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: local('Merriweather'), url('https://fonts.googleapis.com/css2?family=Merriweather:wght@700&display=swap');
}

body {
    font-family: var(--font-family, 'Arial, sans-serif');
	font-size: var(--font-size, 18px);
	font-weight: var(--font-weight, 300);
    line-height: var(--line-height, 1.6);
    background-color: var(--color-primary);
    color: var(--color-secondary);

	h1, h2, h3, h4, h5, h6 {
		color: var(--heading-color, --color-primary);
		font-family: var(--heading-font-family, 'Georgia, serif');
		font-weight: var(--heading-font-weight, 700);
		color: var(--heading-color, --color-primary);
	}
	h1 { font-size: var(--h1-size, 2.5rem); }
	h2 { font-size: var(--h2-size, 2rem); }
	h3 { font-size: var(--h3-size, 1.5rem); }
	h4 { font-size: var(--h4-size, 1.2rem); }
	h5 { font-size: var(--h5-size, 1rem); }
	h6 { font-size: var(--h6-size, 0.9rem); }
}

.section-primary {
	background-color: var(--color-primary);
	color: var(--color-secondary);
}
.section-secondary {
	background-color: var(--color-secondary);
	color: var(--color-primary);
}

/* Utility třídy pro barvy */
.bg-primary {
	background-color: var(--color-primary);
}
.bg-secondary {
	background-color: var(--color-secondary);
}
.bg-white-light {
	background-color: rgba(255,255,255,0.05);
}

.text-primary {
	color: var(--color-primary);
}
.text-secondary {
	color: var(--color-secondary);
}


.border-primary {
	border-color: var(--color-primary);
}
.border-secondary {
	border-color: var(--color-secondary);
}
.border-white-light {
	border-color: var(--color-white-light);
}