/*
 * Projektin tyylit. Pääteema lataa tämän tiedoston pääbundlen jälkeen.
 *
 * Suurin osa brändäyksestä hoituu pelkästään määrittelemällä pääteeman
 * design-tokenit uudelleen — ei Sass-buildia, ei node_modulesia.
 *
 * Koko token-listan näkee pääteeman tiedostosta
 * assets/scss/abstracts/_tokens.scss.
 */

:root {
	/* Brändivärit. Anna aina myös -rgb-pari: CSS ei osaa ottaa rgba():ta
	   var()-väristä, ja läpinäkyvät variantit lasketaan triplasta. */
	--louhos-primary: #2c6ca3;
	--louhos-primary-rgb: 44, 108, 163;
	--louhos-primary-dark: #1f4d75; /* hover-tila, n. 18 % tummempi */
	--louhos-accent: #1f9d55;

	/* Linkkiväri on erikseen: brändiväri ei useinkaan läpäise WCAG AA
	   -kontrastia tekstinä valkoisella, vaikka toimii painikkeen täyttönä. */
	--louhos-link-color: #1f5480;

	/* Neutraalit */
	--louhos-headings: #14181d;
	--louhos-body-color: #333940;
	--louhos-grey: #f4f5f7;
	--louhos-border: #c9ced6;
	--louhos-border-rgb: 201, 206, 214;

	/* Tummat pinnat (hero-paneeli, header, footer) */
	--louhos-dark-1: #1b2026;
	--louhos-dark-1-rgb: 27, 32, 38;
	--louhos-dark-2: #101418;
	--louhos-dark-2-rgb: 16, 20, 24;

	/* Mitat */
	--louhos-header-height: 91px;
	--louhos-radius: 0.625rem;
	--louhos-radius-lg: 1.25rem;

	/* Typografia. Omat webfontit: lisää @font-face-määrittelyt tiedostoon
	   assets/css/fonts.css ja fonttitiedostot kansioon assets/fonts/. */
	--louhos-font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}

/* Projektikohtaiset säännöt tämän alle. */