/* Lehm-Holz-Kunst – Anpassungen an die Vorlage „Prologue“ (main.css bleibt unverändert) */

/* Schrift lokal eingebunden (kein Google-Fonts-Aufruf, DSGVO) */
@font-face { font-family: "Source Sans Pro"; font-style: normal; font-weight: 300; font-display: swap; src: url("../webfonts/source-sans-3/latin-300-normal.woff2") format("woff2"); }
@font-face { font-family: "Source Sans Pro"; font-style: normal; font-weight: 400; font-display: swap; src: url("../webfonts/source-sans-3/latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Source Sans Pro"; font-style: italic; font-weight: 400; font-display: swap; src: url("../webfonts/source-sans-3/latin-400-italic.woff2") format("woff2"); }
@font-face { font-family: "Source Sans Pro"; font-style: normal; font-weight: 600; font-display: swap; src: url("../webfonts/source-sans-3/latin-600-normal.woff2") format("woff2"); }

/* Farben: erdige Töne statt Türkis/Pink */
:root {
    --lehm: #a8683f;
    --lehm-hell: #bb7c52;
    --lehm-dunkel: #8f5733;
    --sand-1: #faf7f2;
    --sand-2: #f3ede4;
    --sand-3: #e9e1d5;
}

/* Lesbarkeit: Die Vorlage setzt Text in #888 (zu wenig Kontrast, WCAG AA) und <strong> in Light – beides korrigiert */
body, input, textarea, select { color: #5c534b; }
strong, b { font-weight: 600; color: #4a3b30; }

a:hover { color: var(--lehm); }
.button, input[type="submit"], button { background-color: var(--lehm); }
.button:hover, input[type="submit"]:hover, button:hover { background-color: var(--lehm-hell); }
.button:active, input[type="submit"]:active, button:active { background-color: var(--lehm-dunkel); }
#nav ul li a.active span:before { color: var(--lehm-hell); }

#main > section.two { background-color: var(--sand-1); }
#main > section.three { background-color: var(--sand-2); }
#main > section.four { background-color: var(--sand-3); }
#footer { background-color: var(--sand-3); }

/* Buttons, die wie Textlinks aussehen (Impressum/Datenschutz) */
button.link-button {
    display: inline;
    padding: 0;
    margin: 0;
    border: 0;
    border-radius: 0;
    background: none;
    box-shadow: none;
    font: inherit;
    line-height: inherit;
    color: inherit !important;
    cursor: pointer;
    border-bottom: dotted 1px rgba(128, 128, 128, 0.5);
}
button.link-button:hover { background: none; color: var(--lehm) !important; border-bottom-color: transparent; }

/* Titelbereich */
#main > section.one {
    background-color: #3a2e25;
    /* Foto abdunkeln – in der Mitte, wo der Text steht, etwas stärker */
    background-image:
        radial-gradient(ellipse 70% 65% at 50% 50%, rgba(24, 19, 15, 0.45), rgba(24, 19, 15, 0) 100%),
        linear-gradient(rgba(24, 19, 15, 0.5), rgba(24, 19, 15, 0.6)),
        url("../../images/allgemein/banner.jpg");
}
@media screen and (max-width: 736px) { /* kleinere Fassung fürs Handy */
    #main > section.one {
        background-image:
            radial-gradient(ellipse 70% 65% at 50% 50%, rgba(24, 19, 15, 0.45), rgba(24, 19, 15, 0) 100%),
            linear-gradient(rgba(24, 19, 15, 0.5), rgba(24, 19, 15, 0.6)),
            url("../../images/allgemein/thumb/banner.jpg");
    }
}
#top header { text-shadow: 0 1px 2px rgba(0, 0, 0, 0.55), 0 2px 14px rgba(0, 0, 0, 0.45); }
#top header p { color: #fff; margin: 0; }
#top .dachzeile {
    font-size: 0.8em;
    font-weight: 600;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: #f1d9c2;
}
#top .untertitel { font-size: 1.15em; font-weight: 400; line-height: 1.45em; max-width: 34em; margin: 0 auto; }
#top .zusatz { font-size: 0.85em; font-weight: 400; line-height: 1.45em; color: rgba(255, 255, 255, 0.9); margin-top: 1.25em; }
.button { font-weight: 400; }
#top footer { margin-top: 2.25em; }

/* Fließtext in den Leistungsbereichen links ausrichten */
.inhalt { text-align: left; max-width: 48em; margin: 0 auto; }
.inhalt h3 { margin-top: 1.75em; color: #4a3b30; }
.inhalt h3:first-child { margin-top: 0; }
.lead { font-size: 1.1em; }

/* Bildraster mit Zoom (PhotoSwipe) */
.galerie {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
    gap: 1.25em;
    margin: 2.5em 0 0;
    text-align: left;
}
.galerie figure { margin: 0; }
.galerie figure > a {
    display: block;
    border: 0;
    border-radius: 0.35em;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
    cursor: zoom-in;
}
.galerie img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    transition: transform 0.35s ease;
}
.galerie figure > a:hover img { transform: scale(1.04); }
.galerie a.kachel { cursor: pointer; }
.uebersicht figcaption { font-size: 1em; font-weight: 600; text-align: center; }
.uebersicht figcaption a { border: 0; color: #4a3b30; }
.galerie figcaption { font-size: 0.8em; line-height: 1.4em; margin-top: 0.5em; color: #6b5f55; }

/* Hochformat-Raster (Skulpturen) */
.galerie.hoch img { aspect-ratio: 3 / 4; }

/* Projekte / Referenzen */
.projekte {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 2em 1.5em;
    text-align: left;
    margin-top: 2em;
}
.projekt { position: relative; margin: 0; background: #fff; border-radius: 0.35em; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1); overflow: hidden; }
.projekt .cover { position: relative; display: block; border: 0; cursor: zoom-in; overflow: hidden; }
.projekt .cover img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; transition: transform 0.35s ease; }
.projekt .cover:hover img { transform: scale(1.04); }
.projekt .anzahl {
    position: absolute;
    right: 0.6em;
    bottom: 0.6em;
    background: rgba(0, 0, 0, 0.6);
    color: #fff;
    font-size: 0.75em;
    line-height: 1em;
    padding: 0.45em 0.7em;
    border-radius: 1em;
}
.projekt .anzahl:before { /* Bild-Symbol */
    content: "";
    display: inline-block;
    width: 1.1em;
    height: 1.1em;
    margin-right: 0.4em;
    vertical-align: -0.2em;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Ccircle cx='9' cy='10' r='1.5'/%3E%3Cpath d='M21 16l-5-5-8 8'/%3E%3C/svg%3E") center / contain no-repeat;
}
.projekt .text { padding: 1em 1.25em 1.25em; }
.projekt h3 { font-size: 1.05em; line-height: 1.35em; margin: 0 0 0.5em; }
.projekt .denkmal {
    /* liegt als Plakette auf dem Titelbild, damit die Titel aller Karten auf gleicher Höhe beginnen */
    position: absolute;
    top: 0.75em;
    left: 0.75em;
    z-index: 1;
    pointer-events: none; /* Klick geht weiter an das Bild (Galerie) */
    font-size: 0.7em;
    font-weight: 600;
    line-height: 1em;
    padding: 0.45em 0.7em;
    border-radius: 0.25em;
    background: rgba(255, 255, 255, 0.92);
    color: var(--lehm-dunkel);
    letter-spacing: 0.05em;
    text-transform: uppercase;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}
.projekt ul { margin: 0; padding-left: 1.1em; font-size: 0.85em; line-height: 1.5em; }
.projekt ul li { padding-left: 0; }
.projekt .weitere { display: none; }

/* Galerien direkt beim passenden Text */
.inhalt .galerie { margin: 1.25em 0 0.5em; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); }

/* Biografie */
.lebenslauf { list-style: none; padding: 0; margin: 0; }
.lebenslauf li { padding: 0.45em 0 0.45em 9.5em; text-indent: -9.5em; }
.lebenslauf .jahr { display: inline-block; width: 9.5em; text-indent: 0; color: var(--lehm-dunkel); font-weight: 600; }
@media screen and (max-width: 736px) {
    .lebenslauf li { padding-left: 0; text-indent: 0; }
    .lebenslauf .jahr { display: block; width: auto; }
}
.bildnachweis { font-size: 0.8em; color: #6b5f55; text-align: center; margin-top: 1em; }
.galerie.portrait { grid-template-columns: 1fr; max-width: 40em; margin: 0 auto 2.5em; }
.galerie.portrait img { aspect-ratio: var(--ar); } /* Platz vor dem Laden reservieren, kein Layout-Sprung */
.galerie.portrait figcaption { text-align: center; }
.biografie { text-align: left; max-width: 48em; margin: 0 auto; }
.mitgliedschaften { display: flex; flex-wrap: wrap; gap: 2em; align-items: center; justify-content: center; margin-top: 2.5em; }
.mitgliedschaften img { width: 120px; height: auto; }

/* Zweitrangiger Button: Umriss statt Fläche */
.button.zweitrangig {
    background: transparent;
    background-image: none;
    box-shadow: inset 0 0 0 2px currentColor;
    color: var(--lehm-dunkel) !important;
}
.button.zweitrangig:hover { background: rgba(168, 104, 63, 0.1); }
#top .button.zweitrangig { color: #fff !important; }
#top .button.zweitrangig:hover { background: rgba(255, 255, 255, 0.12); }
#top footer { display: flex; flex-wrap: wrap; gap: 0.75em 1em; justify-content: center; }

/* Kontakt */
.kontakt-knoepfe { list-style: none; padding: 0; margin: 1.5em 0 2em; display: flex; flex-wrap: wrap; gap: 0.75em 1em; justify-content: center; }
.kontakt-knoepfe li { padding: 0; }
.kontakt { text-align: center; }
.kontakt address { font-style: normal; font-size: 1.1em; line-height: 1.8em; }

/* PhotoSwipe: Bildunterschrift */
.pswp__custom-caption {
    position: absolute;
    left: 50%;
    bottom: 16px;
    transform: translateX(-50%);
    width: calc(100% - 32px);
    max-width: 44em;
    padding: 0.5em 1em;
    border-radius: 0.35em;
    background: rgba(0, 0, 0, 0.55);
    color: #fff;
    font-size: 0.9em;
    text-align: center;
}
.pswp__custom-caption:empty { display: none; }

/* Unterseiten (Impressum / Datenschutz) */
.rechtstext { text-align: left; max-width: 48em; margin: 0 auto; }
.rechtstext h2, .rechtstext h3 { margin-top: 1.75em; font-size: 1.5em; letter-spacing: 0; }
#impressum h1 { font-size: 2em; letter-spacing: -1px; }
.offen { background: #fff3cd; padding: 0 0.25em; }