/* CSS andreasgregory.com Astra-Child-Theme ab 2026-09-09*/

/* Debug-Funktionen */
/* .ag-section {
    border-block: 1px solid green;
}
*/

/*
#wpadminbar {
	display: none;
}
   */


/* Farben */
:root {
    --ag-color-dark-red: #8c0900;
    --ag-color-site-background: var(--ag-color-grey-10);
    --ag-color-footer-background: var(--ag-color-grey-300);
    --ag-color-black: #141414;
    --ag-color-grey-900: #2b2b2b;
    --ag-color-grey-800: #3b3b3b;
    --ag-color-grey-700: #4a4a4a;
    --ag-color-grey-600: #6e6e6e;
    --ag-color-grey-500: #898987;
    --ag-color-grey-400: #a3a3a0;
    --ag-color-grey-300: #d8d8d5;
    --ag-color-grey-200: #e5e5e3;
    --ag-color-grey-150: #ececea;
    --ag-color-grey-100: #f6f6f4;
    --ag-color-grey-75:  #f8f8f7;
    --ag-color-grey-50:  #fafaf9;
    --ag-color-grey-25:  #fdfdfc;
    --ag-color-grey-20:  #fefefd;
    --ag-color-grey-10:  #fffffe;
}

/* Schriften */
/* Barlow Semi Condensed */
:root {
    --ag-font-heading: "Fjalla One", sans-serif;
    --ag-font-body: "Outfit", sans-serif;
}

/* System-Parameter */
:root {
    --ag-sticky-header-height: 185px; /* Hoehe Header */
    --ag-main-navigation-menu-item-height: 50px; /* Hoehe Menue */
    --ag-sticky-toc-height: 30px; /* Hoehe simpleToc */
}



/* Seitenhoehe - Footer bei kurzen Seiten am unteren Viewport-Rand */
#page {
    min-height: 100vh;
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
}

#page .site-content {
    flex: 1 0 auto;
}

#page .site-footer {
    flex-shrink: 0;
}

.page.ast-article-single {
    padding: 0!Important;
}

/* Scroll-Logik und Viewport-Breite mit/ohne Scrollbar */
html {
   min-height: calc(100dvh + 1px);
   scroll-behavior: smooth;
   scroll-padding-top: calc(
      var(--ag-sticky-header-height)
      + var(--ag-main-navigation-menu-item-height)
      + var(--ag-sticky-toc-height)
      + 75px
   );
}


/* Hintergrundfarbe */
.site-header,
.ast-primary-header-bar, #primary {
   background-color: var(--ag-color-site-background);
}

/* dto. Footer */
.site-footer,
.site-primary-footer-wrap,
.site-primary-footer-wrap[data-section="section-primary-footer-builder"] {
   background-color: var(--ag-color-footer-background);
}

/* Header */
/* Hoehe (150px default) */
.ast-mobile-header-wrap .ast-above-header-bar, .ast-above-header-bar .site-above-header-wrap {
  min-height: 180px;
}


/* Hauptnavigation */
.ast-desktop:not(:has(.ast-header-sticked)) .ast-primary-header-bar .main-header-menu > .menu-item {
   line-height: var(--ag-main-navigation-menu-item-height);
}

.ast-primary-header-bar {
    margin-bottom: 25px;
}

/* statt .site-primary-header-wrap */
.ast-primary-header-bar {
  border-bottom: 1px solid var(--ag-color-grey-300);
}


/* Header Menue mit Unterstreichung exakt in Textbreite */
/* ---------------------------------------------------- */

/* Teil 1/3 - Hauptnavigation strukturell an das Sprachmenue angleichen (Hoehe 50px */
@media (min-width: 922px) {
    #masthead
    .ast-builder-menu-1
    .main-header-menu > .menu-item > .menu-link {
        height: 50px;
        display: flex;
        align-items: center;
        width: max-content;
        padding-inline: 0;
        position: relative;
        text-decoration: none;
    }
}

/* Teil 2/3 - Sprachmenue im Header - Strukturelle Anpassung Unterstreichungsbreite = exakte Textbreite */
@media (min-width: 922px) {
    #masthead
    .ast-builder-menu-2
    .main-header-menu > .menu-item > .menu-link {
        position: relative;
        width: max-content;
        padding-inline: 0;
        height: 50px;
        display: flex;
        align-items: center;
    }
}


/* Teil 3/3 - Hauptnavigation Linie unten fuer Astra / Desktop bei Hauptnavigation + Sprachmenue */
@media (min-width: 922px) {

    /* Abstand Hauptnavigation */
    #masthead
    .ast-builder-menu-1
    .main-header-menu {
        gap: 0 2.00rem;
    }

    /* Link-Grundzustand Hauptnavigation + Sprachmenue */
    #masthead
    :is(.ast-builder-menu-1, .ast-builder-menu-2)
    .main-header-menu > .menu-item > .menu-link {
        position: relative;
        color: var(--ag-color-grey-800);
        text-decoration: none;
        transition: color 160ms ease;
    }

    /* Unterstreichung */
    #masthead
    :is(.ast-builder-menu-1, .ast-builder-menu-2)
    .main-header-menu > .menu-item > .menu-link::after {
        content: "";
        position: absolute;
        left: 0;
        right: 100%;
        bottom: 0;
        height: 3px;
        background: currentColor;
        transition: right 160ms ease;
    }

    /* Hover / Tastaturfokus */
    #masthead
    :is(.ast-builder-menu-1, .ast-builder-menu-2)
    .main-header-menu > .menu-item > .menu-link:hover,

    #masthead
    :is(.ast-builder-menu-1, .ast-builder-menu-2)
    .main-header-menu > .menu-item > .menu-link:focus-visible {

        color: var(--ag-color-grey-900);
    }


    /* Aktuelle Seite */
    #masthead
    :is(.ast-builder-menu-1, .ast-builder-menu-2)
    .main-header-menu > .menu-item.current-menu-item > .menu-link,

    #masthead
    :is(.ast-builder-menu-1, .ast-builder-menu-2)
    .main-header-menu > .menu-item.current-menu-ancestor > .menu-link,

    #masthead
    :is(.ast-builder-menu-1, .ast-builder-menu-2)
    .main-header-menu > .menu-item > .menu-link[aria-current="page"] {

        color: var(--ag-color-grey-900);
    }


    /* Unterstreichung aktiv */
    #masthead
    :is(.ast-builder-menu-1, .ast-builder-menu-2)
    .main-header-menu > .menu-item > .menu-link:hover::after,

    #masthead
    :is(.ast-builder-menu-1, .ast-builder-menu-2)
    .main-header-menu > .menu-item > .menu-link:focus-visible::after,

    #masthead
    :is(.ast-builder-menu-1, .ast-builder-menu-2)
    .main-header-menu > .menu-item.current-menu-item > .menu-link::after,

    #masthead
    :is(.ast-builder-menu-1, .ast-builder-menu-2)
    .main-header-menu > .menu-item.current-menu-ancestor > .menu-link::after,

    #masthead
    :is(.ast-builder-menu-1, .ast-builder-menu-2)
    .main-header-menu > .menu-item > .menu-link[aria-current="page"]::after {

        right: 0;
    }
}


/* Link zur Sprache - Sprachwechsel */
.main-header-menu .lang-item a.menu-link {
   text-transform: uppercase;
}


/* Sticky Parameter fuer Hauptnavigation und SimpleToc Menue */
.site-header {
   position: sticky;
   top: 0;
   z-index: 1000;
}

/* SimpleToc Sticky Position (Header + Menue Height) */
.wp-block-ag-section.ag-section:has(.simpletoc.wp-block-simpletoc-toc) {
    position: sticky;
    top:
            calc(
            var(--ag-sticky-header-height)
            + var(--ag-main-navigation-menu-item-height)
        );
    z-index: 900;
    background-color: var(--ag-color-site-background);
    padding-block: 25px!Important; /* Ueberschreibt Editor Einstellung */
}

.simpletoc {
   display: flex;
   align-items: baseline;
   gap: 32px;
   width: fit-content;
   padding: 5px 0;
   margin-inline: auto;
   border-block: 1px solid var(--ag-color-grey-400);
}

.simpletoc-title {
   margin: 0;
}

.simpletoc ul.simpletoc-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 32px;
    margin: 0;
    padding: 0;
    list-style: none;
}

p.simpletoc-title,
.entry-content .simpletoc-list a {
   font-size: 16px;
   font-weight: 500;
	text-decoration: none;
   color: black;
   margin-bottom: 0;
}

/* SimpleToc Navigation mit Unterstreichung exakt in Textbreite */
/* ------------------------------------------------------------ */

/* Link-Grundzustand */
.simpletoc .simpletoc-list > li > a {
    position: relative;
    display: inline-block;
    width: max-content;
    padding-inline: 0;
    color: var(--ag-color-grey-900);
    text-decoration: none;
    transition: color 160ms ease;
}


/* Unterstreichung */
.simpletoc .simpletoc-list > li > a::after {
    content: "";
    position: absolute;
    left: 0;
    right: 100%;
    bottom: 0;
    height: 2.5px;
    background: currentColor;
    transition: right 160ms ease;
}


/* Hover / Tastaturfokus */
.simpletoc .simpletoc-list > li > a:hover,
.simpletoc .simpletoc-list > li > a:focus-visible {
    color: var(--ag-color-grey-900);
}


/* Unterstreichung sichtbar */
.simpletoc .simpletoc-list > li > a:hover::after,
.simpletoc .simpletoc-list > li > a:focus-visible::after {
    right: 0;
}


/* ag-link-container */
.ast-single-post .entry-content a.wp-block-ag-link-container {
    text-decoration: none;
    color: inherit;
}

a.wp-block-ag-link-container {
    transition: transform 180ms ease;
}

a.wp-block-ag-link-container:hover {
    transform: scale(1.0225);
}

.ag-multi-columns .wp-block-ag-link-container .wp-block-image.size-large {
    border-block: 1px solid var(--ag-color-grey-400);
    margin: 1.25rem 0px;
}


/* Typografie */

body {
    font-family: var(--ag-font-body);
    font-weight: 400;
}

/* Nutzung bei ag-Mehrspalten */
.font-body-compact p {
    letter-spacing: -0.975%;
    line-height: 1.50;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--ag-font-heading);
}

h2 {
    max-width: 35ch;
}


/* Seitentitel ausblenden */
h1.entry-title {
	display: none;
}

/* Bildbeschriftung */
.wp-block-image :where(figcaption) {
  font-size: 14px;
  color: var(--ag-color-grey-500);
  margin-bottom: 0em;
  margin-top: .125em;
  text-align: right;
}


/* Sections */
/* Erster Textblock in einer ag-section */
.wp-block-ag-section.ag-section p.wp-block-paragraph:first-of-type {
    max-width: 960px;
}


.wp-block-ag-section.ag-section .wp-block-post-template {
    padding: 0px 0px;
}

.wp-block-ag-section.ag-section .wp-block-query .wp-block-ag-two-columns.ag-two-columns {
  padding-bottom: 2.50em;
}

.wp-block-ag-section.ag-section .wp-block-post-excerpt {
    margin-top: 0;
}




.ag-section-hero {

}

.ag-section-ausgangssituation {

}

.ag-section-systemgestaltung {

}

.ag-section-loesungsarchitektur {

}

.ag-section-ergebnisse {

}

.ag-section-zusammenarbeit {

}

.ag-section-zusammenarbeit-erweitert {

}

.ag-section-zusammenarbeit-detail {

}

.ag-section-andreasgregory {

}

.ag-section-kontakt {

}


/* Ueberschrift */
.ag-headline-uppercase {
   display: block;
   margin-block-end: 1.0rem;
   font-size: 1.25rem;
   font-family: var(--ag-font-heading);
   font-weight: 600;
   text-transform: uppercase;
   letter-spacing: 0.075em;
   line-height: 1;
   color: var(--ag-color-dark-red);
}

/* Typografie Hero-Bereich */
/* Startseite Hero h1 */
_body.home .ag-section:first-of-type h1{
   _margin-block-start: 1.0rem;
   max-width: 16ch;
   text-wrap: balance;
   font-size: clamp(3.2rem, 2rem + 3.6vw, 4.8rem);
   font-size: clamp(2.2rem, 1.638rem + 1.771vw, 3.2rem);
   font-size: 48px;
   line-height: 0.98;
   /*letter-spacing: -0.0125em;*/
   font-weight: 400;
}

/* Hero Subheadline */
.site-main .ag-section:first-of-type .ag-subheadline{
   margin-top: 0rem;
   margin-bottom: 1.15rem;
   font-size: clamp(1.3rem, 1.08rem + 0.7vw, 1.7rem);
   font-size: clamp(1.5rem, 2.4vw, 2.0rem);
   font-size: 30px;
   font-weight: 500;
   line-height: 1.37;
   line-height: 1.35;
   letter-spacing: -0.0115em;
   color: var(--ag-color-grey-700);
}

/* Subtext */
.ag-subtext {
   _max-width: 60ch;
   font-size: clamp(1.5rem, 2.4vw, 2.0rem);
   font-size: clamp(1.3rem, 1.08rem + 0.7vw, 1.7rem);
   font-size: 20px;
   line-height: 1.50;
   font-weight: 500;
   margin-block: clamp(3.25rem, 2rem + 2vw, 4.25rem) 1.50rem; /* Minimum, Soll, Maximum */
   margin-top: 0rem;
   margin-bottom: 3.5rem!Important;
   color: var(--ag-color-grey-700);
}

/* Horizontale Auflistung mit Trennpunkten */
.wp-block-group.is-layout-flex:not(.is-vertical) {
   display: flex;
   flex-wrap: wrap;
   gap: 0.50em;
   font-family: var(--ag-font-heading);
   font-size: 1.35rem;
   font-weight: 500;
   color: var(--ag-color-grey-700);
   margin-block: 1.50rem;
}

.wp-block-group.is-layout-flex:not(.is-vertical) > p:not(:first-child)::before {
  content: "·";
  font-weight: 600;
  margin-inline-end: 0.5em;
}


.ag-multi-columns .wp-block-image.size-large {
    height: 220px;
    margin: 0;
    overflow: hidden;
}

.ag-multi-columns .wp-block-image.size-large img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

.ag-headline-number-grey::first-line {
    font-size: 1.125rem;
    line-height: 1.125em;
    color: var(--ag-color-grey-400);
}

h3.ag-headline-number-grey {
    margin-bottom: 0px;
 }


.ag-headline-number-grey::first-line {
    line-height: 3.0;
}

h4.ag-headline-number-grey {
    border-bottom: 1px solid var(--ag-color-grey-400);
    padding-bottom: 1.0rem;
 }


_p.wp-block-paragraph {
    border-block: 1px solid var(--ag-color-grey-400);
    margin: 1.25rem 0px;
}



/* Back-To-Top Button */
#ast-scroll-top {
  color: #ffffff;
  background-color: var(--ag-color-dark-red);
  font-weight: bolder;
}


/* Footer */
.site-primary-footer-wrap[data-section="section-primary-footer-builder"] .ast-builder-grid-row {
  grid-column-gap: 0;
  max-width: 1280px;
  margin-left: auto;
  margin-right: auto;
}

.site-footer-section-2 {
   border-left: 1px solid grey;
   border-right: 1px solid grey;
   padding-left: 1em;
}

.site-footer-section-3 {
   padding-left: 1em;
}

.site-footer-primary-section-1 p:first-of-type {
    margin-bottom: 2px;
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 1.37;
    letter-spacing: -0.0125em;
    max-width: 26ch;
    color: var(--ag-color-dark-red);
}

.site-footer-primary-section-2 p:first-of-type {
  margin-bottom: 2px;
  font-weight: 600;
  font-size: 1.25rem;
}


/* Footer Navigation**/
.site-navigation li.menu-item a {
   color: black;
}

/* Footer Navigation mit Unterstreichung exakt in Textbreite */
/* --------------------------------------------------------- */

/* Abstand zwischen den Menuepunkten */
#footer-site-navigation #astra-footer-menu {
    gap: 0 0.85rem;
}

/* Link */
#footer-site-navigation .menu-link {
    position: relative;
    display: inline-block;
    width: max-content;
    /* Astra-Padding neutralisieren */
    padding-inline: 0;
    color: var(--ag-color-black);
    text-decoration: none;
    transition: color 160ms ease;
}


/* Unterstreichung - exakt ueber die Link-/Textbreite */
#footer-site-navigation .menu-link::after {
    content: "";
    position: absolute;
    left: 0;
    right: 100%;
    bottom: 0;
    height: 2px;
    background: currentColor;
    transition: right 160ms ease;
}


/* Hover / Focus */
#footer-site-navigation .menu-link:hover,
#footer-site-navigation .menu-link:focus-visible {
    color: var(--ag-color-black);
}

/* Aktuelle Seite */
#footer-site-navigation .menu-item.current-menu-item > .menu-link,
#footer-site-navigation .menu-item.current-menu-ancestor > .menu-link,
#footer-site-navigation .menu-link[aria-current="page"] {
    color: var(--ag-color-black);
}

/* Unterstreichung aktiv */
#footer-site-navigation .menu-link:hover::after,
#footer-site-navigation .menu-link:focus-visible::after,
#footer-site-navigation .menu-item.current-menu-item > .menu-link::after,
#footer-site-navigation .menu-item.current-menu-ancestor > .menu-link::after,
#footer-site-navigation .menu-link[aria-current="page"]::after {
    right: 0;
}