/*
Theme Name: Oder Brueche Child
Template: Divi
Version: 1.0.0
*/


/* =========================================
   1. FONTS
========================================= */

@font-face {
    font-family: "Commissioner";
    src: url("assets/fonts/commissioner-v24-latin_latin-ext-900.woff2") format("woff2");
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Geist Mono";
    src: url("assets/fonts/GeistMono-Medium.woff2") format("woff2");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Geist Mono";
    src: url("assets/fonts/GeistMono-Black.woff2") format("woff2");
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}


/* =========================================
   2. BODY TEXT
========================================= */

body {
    font-family: "Geist Mono", monospace;
    color: #000;
    font-feature-settings: "ss08";
}


/* =========================================
   3. HEADLINES
========================================= */

/* Große Titel: Startseite, Unterseiten, Logo */

h1,
.hero-logo-text,
.hero-logo-text * {
    font-family: "Commissioner", sans-serif !important;
    font-weight: 900 !important;
    line-height: 0.815em !important;
    letter-spacing: -0.03em !important;
}

/* Beitragstitel / Projekttitel auf Einzelansichten */

.single .entry-title,
.single .entry-title a,
.single-post .entry-title,
.single-post .entry-title a,
.single-project .entry-title,
.single-project .entry-title a,
.single-projekte .entry-title,
.single-projekte .entry-title a {
    font-family: "Geist Mono", monospace !important;
    font-weight: 800 !important;
    line-height: 1.3em !important;
    letter-spacing: 0.5px !important;
}

/* Normale Inhaltsüberschriften */

h2,
h3,
h4,
h5,
h6,
.et_pb_module_header,
.et_pb_post h2,
.et_pb_post h3,
.et_pb_post h4,
.et_pb_post h5,
.et_pb_post h6 {
    font-family: "Geist Mono", monospace !important;
    font-weight: 500 !important;
    line-height: 1.3em !important;
    letter-spacing: 0 !important;
    font-feature-settings: "ss08";
}

/* Projekte Headline gezielt wieder Commissioner */

.projects-title,
.projects-title *,
.projects-title h2,
h2.projects-title,
.home .projects-title,
.home .projects-title *,
.home h2.projects-title {
    font-family: "Commissioner", sans-serif !important;
    font-weight: 900 !important;
    line-height: 0.815em !important;
    letter-spacing: -0.03em !important;
}

/* H6 auf Startseite / Überschrift in Fließtext-Typo */

h6 {
    margin-bottom: 1em !important;
}


/* =========================================
   4. HEADER / LOGO
========================================= */

.hero-logo-text,
.hero-logo-text .et_pb_text_inner,
.hero-logo-text .et_pb_text_inner p {
    font-family: "Commissioner", sans-serif !important;
    font-weight: 900 !important;
    line-height: 0.815em !important;
    letter-spacing: -0.03em !important;
    margin: 0 !important;
    padding: 0 !important;
}


/* =========================================
   5. FRONTEND LINKS ONLY
========================================= */

#page-container a:not(.et_pb_button) {
    color: #000;
    font-family: "Geist Mono", monospace;
    font-weight: 600;
    text-decoration-line: underline;
    text-decoration-style: dotted;
    text-decoration-thickness: 2px;
    text-underline-offset: 4px;
}

.ob-project-meta a {
    color: #000;
    font-family: "Geist Mono", monospace;
    font-weight: 500;
    text-decoration-line: underline;
    text-decoration-style: dotted;
    text-decoration-thickness: 2px;
    text-underline-offset: 4px;
}


/* =========================================
   6. BUTTONS
========================================= */

.et_pb_button,
.et_pb_button:visited {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #fff !important;
    color: #000 !important;
    border: 4px dotted #000 !important;
    border-radius: 999px !important;
    padding: 0.45em 1em 0.5em !important;
    font-family: "Geist Mono", monospace !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    line-height: 1 !important;
    text-decoration: none !important;
    transition:
        color 0.18s ease,
        border-color 0.18s ease;
}

.et_pb_button:hover,
.et_pb_button:focus {
    background: #fff !important;
    color: #77E290 !important;
    border-color: #77E290 !important;
}


/* =========================================
   7. LINK HOVER
========================================= */

#page-container a:not(.et_pb_button):hover {
    color: #000;
    opacity: 1;
}


/* =========================================
   8. TEXT SELECTION
========================================= */

::selection {
    background: #77E290;
    color: #000;
}


/* =========================================
   9. OPTIONAL STRONG TEXT
========================================= */

strong,
b {
    font-family: "Geist Mono", monospace;
    font-weight: inherit;
    background: linear-gradient(
        to bottom,
        transparent 58%,
        #77E290 58%
    );
    padding: 0 0.08em;
}

.ob-bold,
h6.ob-bold {
    font-family: "Geist Mono", monospace !important;
    font-weight: 800 !important;
    background: none !important;
}


/* =========================================
   10. DIVI FILTER GRID - FILTER BUTTONS
========================================= */

.dp-dfg-filters,
.dp-dfg-filters-buttons-layout {
    text-align: center !important;
    margin-bottom: 1.5rem !important;
}

.dp-dfg-filters ul,
.dp-dfg-filters-buttons-layout ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.dp-dfg-filters li,
.dp-dfg-filters-buttons-layout li,
.dp-dfg-filter {
    display: inline-flex !important;
    align-items: center !important;
    margin: 0.25rem !important;
    height: auto !important;
}

.dp-dfg-filters a.dp-dfg-filter-link,
.dp-dfg-filters-buttons-layout a.dp-dfg-filter-link,
.dp-dfg-filter a.dp-dfg-filter-link {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #fff !important;
    color: #000 !important;
    border: 4px dotted #000 !important;
    border-radius: 999px !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
    padding: 0.45em 1em 0.5em !important;
    font-family: "Geist Mono", monospace !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    line-height: 1 !important;
    text-decoration: none !important;
    transition:
        color 0.18s ease,
        border-color 0.18s ease;
}

/* Aktiv / Hover: grüne Outline + grüne Schrift, kein grüner Hintergrund */

.dp-dfg-filter.active a.dp-dfg-filter-link,
.dp-dfg-filter a.dp-dfg-filter-link.active,
.dp-dfg-filters a.dp-dfg-filter-link.active,
.dp-dfg-filters-buttons-layout a.dp-dfg-filter-link.active,
.dp-dfg-filter a.dp-dfg-filter-link:hover {
    background: #fff !important;
    border: 4px dotted #77E290 !important;
    color: #77E290 !important;
    opacity: 1 !important;
}


/* =========================================
   11. FILTER GRID TITLES
========================================= */

#page-container .dp-dfg-header.entry-header h2.entry-title,
#page-container .dp-dfg-header.entry-header h2.entry-title a,
#page-container .dp-dfg-header .entry-title,
#page-container .dp-dfg-header .entry-title a {
    font-family: "Geist Mono", monospace !important;
    font-size: 18px !important;
    line-height: 1.3em !important;
    letter-spacing: 0.5px !important;
    font-weight: 800 !important;
}


/* =========================================
   12. FILTER GRID META
========================================= */

.dp-dfg-meta,
.dp-dfg-meta a,
.dp-dfg-item-meta {
    font-family: "Geist Mono", monospace !important;
    font-size: 14px !important;
    line-height: 1.4em !important;
    font-weight: 500 !important;
    color: #000 !important;
}


/* =========================================
   13. CONTENT SEPARATOR / LANGUAGE BREAK
========================================= */

.entry-content hr,
.et_pb_post_content hr,
.et_pb_text_inner hr {
    border: 0;
    border-top: 3px dotted #000;
    margin: 4rem 0 3rem;
    width: 100%;
}