@charset "UTF-8";

/* Typografi */

body {
font-family: "Mulish", Helvetica, Arial, sans-serif;
}

/* Headings */
h1, h2, h3, h4, h5 {
font-family: "Podkova", Times, serif;
}

h6 {
font-family: "Yanone Kaffeesatz", Helvetica, Arial, sans-serif;
}

/* Textstorlekar */

/* Base font size and line height */
body {
font-size: 18px;
line-height: 1.5;
}

/* Responsive font size and line height for headings */
h1, h2, h3, h4, h5 {
font-size: clamp(22px, 36px, 100vw);
line-height: clamp(1.2, 1.5, 100vw);
font-weight: 200;
}

h6 {
font-size: clamp(10px, 14px, 100vw);
line-height: clamp(1.2, 1.3, 100vw);
margin-top: 0px;
margin-bottom: 0px;
}

/* Responsive font size and line height for body text */
p {
font-size: clamp(16px, 20px, 100vw);
line-height: clamp(1.5, 2, 100vw);
}

/* Media Queries */
@media (max-width: 400px) {
footer {
font-size: 80%;
}
}

@media (min-width: 768px) {
footer {
font-size: 90%;
line-height: clamp(1.5, 3, 100vw);
}
}

/* Organisera koden i sektioner som typografi, textstorlekar, media-queries etc. och ge sektionerna lämpliga rubriker. Organisera koden inom varje sektion i en logisk ordning, till exempel alfabetisk ordning eller efter logisk relation till varandra */