/* Neuer, freundlicher Schriftstil für die Volksschule */
body, 
h1, h2, h3, h4, h5, h6, 
.site-title, .navbar-brand {
    font-family: "Segoe UI", "Century Gothic", AppleGothic, sans-serif !important;
    letter-spacing: 0.02em; /* Gibt den Buchstaben minimal mehr Luft zum Lesen */
}

/* Überschriften global verkleinern und feiner gestalten */
h1, .page-header h1, .com-content-article.item-page .page-header h1 {
    font-size: 1.8rem !important;  /* Standard ist oft über 2.5rem */
    font-weight: 500 !important;   /* Macht die Schrift dünner/eleganter */
    letter-spacing: 0.01em;
}

h2, h2.item-title {
    font-size: 1.5rem !important;  /* Für Beitrags- und Unterüberschriften */
    font-weight: 500 !important;
}

h3 {
    font-size: 1.3rem !important;  /* Für Modulüberschriften in den Sidebars */
    font-weight: 500 !important;
}

h4, h5, h6 {
    font-size: 1.1rem !important;  /* Für kleinere Zwischenüberschriften */
    font-weight: 600 !important;   /* Bei sehr kleinen Schriften belässt man es gern etwas deutlicher */
}

/* Change the main header color */
.header.container-header.full-width {
    background: #4abdc4;
}
/* Change the footer color */
.footer.container-footer.footer.full-width {
    background: #4abdc4;
}
/* Change the article title text color */
/* 1. Target plain text titles */
h2.item-title {
    color: #4abdc4; 
}

/* 2. Target clickable titles (Links) */
h2.item-title a {
    color: #4abdc4; /* Keeps the link the same color */
    text-decoration: none; /* Optional: removes the underline */
}

/* 3. Target the title when someone hovers over it */
h2.item-title a:hover,
h2.item-title a:focus {
    color: #4abdc4; /* Changes color on hover */
    text-decoration: underline; /* Optional: adds underline on hover */
}

.com-content-article.item-page .page-header h1,
.com-content-article.item-page .page-header h1 span {
    color: #4abdc4 !important;
}

/* Farbliche Abstimmung der Zwischenüberschriften */
h3, h4 {
    color: #1e4d58 !important;
}

.footer1 {
    text-align: center;
}
.footer2 {
    text-align: center;
}

/* Center all content inside the Cassiopeia footer */
.container-footer.footer.full-width {
    display: flex;
    justify-content: center; /* Centers elements horizontally */
    align-items: center;     /* Centers elements vertically */
    flex-direction: column;  /* Stacks modules neatly if there are multiple */
    text-align: center;      /* Centers individual lines of plain text */
}

/* Tighten the footer container and force text alignment */
.container-footer.footer.full-width {
    display: block !important;       /* Resets the flex grid blowout */
    text-align: center !important;   /* Centers all inline text elements */
    padding-top: 0.5rem !important;  /* Drops top padding to a bare minimum */
    padding-bottom: 0.5rem !important; /* Drops bottom padding to a bare minimum */
}

/* Eliminate hidden margins on modules and paragraphs inside the footer */
.container-footer.footer.full-width .moduletable,
.container-footer.footer.full-width p,
.container-footer.footer.full-width div,
.container-footer.footer.full-width footer {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

/* Ensure horizontal menus inside the footer align centrally */
.container-footer.footer.full-width ul.nav {
    justify-content: center !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* 1. Reset the primary outer footer wrapper */
.container-footer.footer.full-width {
    display: block !important;
    text-align: center !important;
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
    width: 100% !important;
}

/* 2. FORCE the inner grid child to break out of the columns and center its text */
.container-footer.footer.full-width .grid-child,
.container-footer.footer.full-width > div {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    text-align: center !important;
    float: none !important;
}

/* 3. Strip out any remaining margin/padding padding traps */
.container-footer.footer.full-width .moduletable,
.container-footer.footer.full-width p,
.container-footer.footer.full-width div {
    margin: 0 auto !important;
    padding: 0 !important;
    text-align: center !important;
}