/* --- Basis-Einstellunge und Variablen: Schriften, Farben, Abstände, Eck-Radien ------------------------------------------------------------------------------------ */
@font-face {
    font-family: "Aptos";
    src: url("../fonts/Aptos-Light.ttf");
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: "Aptos";
    src: url("../fonts/Aptos-ExtraBold.ttf");
    font-weight: 800;
    font-style: normal;
}

/* --- Variablen ------------------------------------------------------------------------- */

:root {
    /* Schriftfamilien ---*/
    --font-family--primary: "Aptos", sans-serif;
    
    /* Schriftgrössen ---*/
    --font-size--xx-small: 0.9rem;
    --font-size--x-small: clamp(1rem, 0.8rem + 0.1227vw, 1.15rem);
    --font-size--small: clamp(1.0625rem, 1.0341rem + 0.1227vw, 1.1875rem); /* Standard-Schriftgrösse ca. 19 px*/
    --font-size--medium: clamp(1.25rem, 1.2216rem + 0.1227vw, 1.375rem);
    --font-size--large: clamp(1.4rem, 2vw + 1rem, 1.7rem);
    --font-size--x-large: clamp(2rem, 3.5vw + 1rem, 1.75rem);
    --font-size--xx-large: clamp(2.125rem, 1.9831rem + 0.6135vw, 2.75rem);
    --font-size--xxx-large: clamp(2.8125rem, 2.4578rem + 1.5337vw, 4.375rem);

    /* --- Farben --- */    
    --color--primary-1: #E3000F;  /* pikkerton-Rot */
    --color--primary-2: #004E9E;  /* pikkerton-Blau */
    --color--secondary-1: #1E1E1E; /* Anthrazit */
    --color--secondary-2: #ffffff;   /* Weiss */
    --color--accent-1: #6F6F6E; /* pikkerton-Grau */

    /* --- Eck-Radien für Bilder, Kacheln, etc. ---*/
    --border-radius--small: 0.5rem;
    --border-radius--medium: clamp(0.1rem, 5vw, 1rem);

    /* --- Schatten für Cards und Boxen  */
    --box-shadow--primary: 0px 4px 32px 0px rgba(60, 112, 221, 0.20);

}
/*----------------------------------------------------------------------------------------------------------------------------------------*/


/* --- Basis-Einstellungen, -Abstände  ------------------------------------------------------------------------------------ */
body {
    /* padding-left: 15px; 
    padding-right: 15px;
    overflow-x: hidden !important; */
}

.entry-content {
    margin-top: clamp(5rem, 5vw + 1.5rem, 8rem);
}

.wp-site-blocks {
    padding-left: 15px; 
    padding-right: 15px;
    overflow-x: hidden !important;
}

section { 
    padding-top: clamp(2rem, 4vw + 1rem, 5rem); /* Abstände zwischen den Haupt-Sections */
    padding-bottom: clamp(2rem, 4vw + 1rem, 5rem);
}
  
  
/* --- Bild-Basiseinstellungen ------------------------------------------------------------------------------------ */
.wp-block-media-text__media img,
.wp-block-cover img,
.wp-block-image img {
    border-radius: var(--border-radius--medium);
}

/* --- Standard-Paragraph ------------------------------------------------------------------------------------ */
.wp-block-group p {
    font-family: var(--font-family--primary);
    font-size: var(--font-size--small);
    line-height: 135%;
    margin: 0;
    margin-bottom: clamp(0.5rem, 2vw + 1rem, 1rem);
    hyphens: auto; 
}

/* --- Standard-Links ------------------------------------------------------------------------------------ */
a:link  {
    color: var(--color--secondary-1);
}
a:hover, a:active {
    color: var(--color--primary-1);
}


/* --- Bulletpoint-Liste ------------------------------------------------------------------------------------ */
ul.wp-block-list {
    font-family: var(--font-family--primary);
    font-size: var(--font-size--small);
    hyphens: auto;
    list-style: none; /* Entfernt die Standard-Bullets */
    padding: 0;
    margin: 0;
}

.wp-block-list li {
    position: relative;
    padding-left: 20px; /* Platz für den Bulletpoint (10px Abstand + Bulletgröße) */
    line-height: 120%;
    margin-bottom: 0.8rem; /* Abstand nach */
}

/* Bulletpoint */
.wp-block-list li::before {
    content: ""; /* Erzeugt ein eigenes Bullet-Element */
    position: absolute;
    left: 0; /* Positioniert das Bullet vor dem Text */
    top: 0.55em; /* Zentriert das Bullet optisch zur ersten Zeile */
    width: 0.6rem;
    height: 2px;
    background-color: var(--color--primary-1);
}

/* --- Headings H1-H5 ------------------------------------------------------------------------------------ */

h1.wp-block-heading,
h2.wp-block-heading,
h3.wp-block-heading,
h4.wp-block-heading,
h5.wp-block-heading 
{
    margin: 0;
    font-family: var(--font-family--primary);
    font-size: var(--font-size--xxx-large);
    line-height: 100%;
}

h2.wp-block-heading {
    font-size: var(--font-size--xx-large);
    margin-bottom: clamp(0.75rem, 1vw + 1rem, 3rem);
}
h3.wp-block-heading {
    font-size: var(--font-size--x-large);
    margin-bottom: clamp(0.75rem, 1vw + 1rem, 3rem);
    line-height: 115%;
}
h4.wp-block-heading {
    font-size: var(--font-size--large);
    line-height: 115%;
}
h5.wp-block-heading {
    font-size: var(--font-size--medium);
    line-height: 115%;
}



/* --- Standard centered Items ---------------------------------------------------------------------------------------------- */

.card:has(.has-text-align-center) .wp-block-buttons.is-layout-flex {
    justify-content: center;
}

.card:has(.has-text-align-center) .wp-block-buttons .wp-block-button__link {
    margin-top: 2rem;
}

.wp-block-group.text-wide-centered {
    width: 75%;
    margin-bottom: 5rem;
}

.error404 .wp-block-buttons {
    max-width: clamp(45rem, 2vw, 2rem);
}

.error404 .wp-block-buttons>.wp-block-button {
    margin-left: 0;
}

section.error .wp-block-buttons > .wp-block-button {
    margin: 0;
}

.wp-site-blocks:has(.error) {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.wp-site-blocks > .error {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: start;
}

/* ---- Media Queries --------------------------------------------------------------------------------------- */

@media (max-width: 900px) {
    .wp-block-group.text-wide-centered {
        width: 80%;
        padding: 4%;
        box-sizing: unset;
    }

    .error404 .wp-block-buttons>.wp-block-button {
        margin-left: clamp(1.25rem, 0vw, 0rem) !important;
    }
}

@media (max-width: 400px) {
    .wp-block-group.text-wide-centered {
        width: 100%;
        box-sizing: border-box;
        margin-bottom: 2rem;
    }
}