/*
Theme Name: chronerion-media-2026
Theme URI: 
Author: Dein Name
Author URI: 
Description: Ein minimalistisches Landingpage-Theme mit vollbreitem Header-Bild und einem zentrierten Inhaltsbereich darunter. Keine Blog-/Artikel-Funktionen.
Version: 1.0
Requires at least: 5.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: chronerion-media-2026
*/

/* ---------- Grundlegendes Reset ---------- */
* {
    box-sizing: border-box;
}

html, body {
    margin: 0;
    padding: 0;
}

body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    line-height: 1.6;
    /* Textfarbe & Hintergrundfarbe werden über Design > Anpassen > Farben gesteuert (siehe functions.php) */
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

a {
    /* Linkfarbe wird über Design > Anpassen > Farben gesteuert (siehe functions.php) */
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

/* ---------- Header (volle Breite) ---------- */
.site-header {
    position: relative;
    width: 100%;
    margin: 0;
    padding: 0;
    background: transparent; /* transparent, damit die Body-Hintergrundfarbe/-bild durchscheint */
    --slm-overlay-alpha: 0.2; /* Fallback, wird per Customizer über Inline-CSS überschrieben */
}

/* Verdunkelungs-Ebene HINTER dem Header-Bild (niedrigerer z-index als das Bild).
   Dadurch wirkt sie nur dort, wo das PNG transparent ist – das Bildmotiv
   selbst bleibt unverändert. */
.site-header::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    background-color: rgba(0, 0, 0, var(--slm-overlay-alpha, 0.2));
    pointer-events: none;
}

.site-header img.custom-header-image {
    position: relative;
    z-index: 1;
    width: 100%;
    display: block;
}

.site-header a.site-header-link {
    display: block;
    position: relative;
    z-index: 1;
    text-decoration: none;
}

.site-header a.site-header-link img.custom-header-image {
    z-index: auto; /* Stapelung übernimmt jetzt der Link-Wrapper */
}

/* ---------- Hauptinhalt ---------- */
.site-main {
    max-width: 860px;
    margin: 0 auto;
    padding: 60px 24px;
}

.site-main .page-title {
    font-size: 2rem;
    margin-bottom: 1.2rem;
}

.site-main .page-content {
    font-size: 1.1rem;
    background-color: rgba(0, 0, 0, var(--slm-content-darken-alpha, 0));
    padding: var(--slm-content-padding, 0px);
    border-radius: 4px;
}

.site-main .page-content h1,
.site-main .page-content h2,
.site-main .page-content h3 {
    margin-top: 1.6em;
}

/* ---------- Footer ---------- */
.site-footer {
    text-align: center;
    padding: 24px;
    font-size: 0.85rem;
    color: #777;
}

/* ---------- Responsiv ---------- */
@media (max-width: 600px) {
    .site-main {
        padding: 32px 16px;
    }
}