/* Base typography + body baseline - samme sprog som IMSProjekt */
html, body {
    margin: 0;
    padding: 0;
    font-family: var(--font-sans);
    font-size: var(--font-size-base);
    line-height: var(--line-height-base);
    color: var(--color-text);
    background: var(--color-bg);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
    margin: 0;
    font-weight: var(--font-weight-semibold);
    line-height: var(--line-height-tight);
    color: var(--color-text);
}

h1 { font-size: var(--font-size-3xl); }
h2 { font-size: var(--font-size-2xl); }
h3 { font-size: var(--font-size-xl); }
h4 { font-size: var(--font-size-lg); }

p { margin: 0 0 var(--space-2) 0; }

a { color: var(--color-accent); text-decoration: none; }
a:hover { color: var(--color-accent-hover); text-decoration: underline; }

code, pre { font-family: var(--font-mono); font-size: var(--font-size-xs); }

.app-container {
    max-width: var(--container-max);
    margin: 0 auto;
    padding: var(--space-5);
}

.page-header { margin-bottom: var(--space-5); }
.page-title { font-size: var(--font-size-2xl); font-weight: var(--font-weight-bold); margin: 0; }
.page-subtitle { font-size: var(--font-size-sm); color: var(--color-text-faint); margin: var(--space-1) 0 0 0; }