/* ==========================================
   FFG TYPOGRAFIE
========================================== */

/* ===== INTER VARIABLE ===== */

@font-face {
    font-family: 'Inter';
    src: url('/wp-content/themes/ffgtt4child/assets/fonts/inter/Inter-Variable.woff2') format('woff2');
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}

/* ===== OSWALD ===== */

@font-face {
    font-family: 'Oswald';
    src: url('/wp-content/themes/ffgtt4child/assets/fonts/oswald/Oswald-Regular.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Oswald';
    src: url('/wp-content/themes/ffgtt4child/assets/fonts/oswald/Oswald-Bold.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

/* ==========================================
   BASE TYPOGRAPHY
========================================== */

body {
    font-family: 'Inter', sans-serif;
    line-height: 1.6;
    color: var(--wp--preset--color--dark);
    text-align: left;
}

p {
    font-size: clamp(16px, 1.2vw, 18px);
}

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

:root {
    --section-150-festdamen-bg: #424753;
    --section-150-icon-size: clamp(40px, 15vw, 200px);
    --wp--preset--font-color--primary: #424753;
    --wp--preset--color--primary: #424753;
    --wp--preset--color--dark: #312f38;
    --nav-ease: cubic-bezier(0.22, 1, 0.36, 1);
}



/* ==========================================
   LAYOUT
========================================== */

body .wp-site-blocks>.wp-block-template-part {
    margin-block-start: 0;
    margin-block-end: 0;
    padding: 0;
}

.main {
    padding-top: 0 !important;
}

/* ==========================================
   SINGLE POST
========================================== */

.section-single-post {
    padding-top: clamp(1rem, 5vw, 2rem);
    margin-block-start: 0 !important;
    color: var(--wp--preset--font-color--primary);
}

.section-single-post h1,
.section-single-post h2,
.section-single-post h3 {
    text-transform: uppercase;
    letter-spacing: 1px;
    color: var(--wp--preset--color--contrast);
}

.section-single-post p {
    text-align: justify;
}

.section-single-post a {
    color: var(--wp--preset--color--contrast);
    text-decoration: underline;
}

.section-single-post-content .wp-block-post-featured-image {
    overflow: hidden;
}

/* ==========================================
   FEATURED IMAGE in der Höhe begrenzen
========================================== */

.wp-block-post-featured-image img {
    max-height: 35vh;
    width: 100%;
    object-fit: cover;
}

/* ==========================================
   SECTION HERO - Wir über uns
========================================== */

.main-wir-ueber-uns{
    margin-top: 0 !important;
}

.section-hero {
    position: relative;
    padding-top: clamp(1rem, 5vw, 2rem);
    padding-bottom: clamp(1rem, 5vw, 2rem);
    color: var(--wp--preset--color--white);
    margin-block-start: 0 !important;
}

.section-hero .section-text {
    text-align: justify;
}

 .section-hero::before {
    position: absolute;
    width: 100%;
    height: 100%;
    content: "";
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    opacity: .85;
    background: #7e7c84;
}

.main-wir-ueber-uns .section-hero {
    background-image: var(--bg-section-hero-wir-ueber-uns);
    background-repeat: repeat-y;
    background-position: center top;
    background-size: cover;
    
}

.main-wir-ueber-uns .wp-block-post-featured-image.news-image img {
    object-position: center top;
    max-height: 550px;

}

/* ==========================================
   Rahmen um den Inhalt Single Page & Single Post
========================================== */

.section-single-page .section-single-page-content {
    border-radius: 24px;
    overflow: hidden;
    background-color: rgba(66, 71, 83, 0.08);
    box-shadow: 0 5px 20px rgba(0,0,0,0.05);
    transition: transform .25s ease, box-shadow .25s ease;
    padding:var(--wp--preset--spacing--20);
    margin-bottom: 3rem;
}

.section-single-post .section-single-post-content{
    border-radius: 24px;
    overflow: hidden;
    background-color: rgba(66, 71, 83, 0.08);
    box-shadow: 0 5px 20px rgba(0,0,0,0.05);
    transition: transform .25s ease, box-shadow .25s ease;
    padding:var(--wp--preset--spacing--20);
    margin-bottom: 3rem;
}

.section-single-post-content .wp-block-post-featured-image{
    margin-top: calc(var(--wp--preset--spacing--20) * -1);
    margin-left: calc(var(--wp--preset--spacing--20) * -1);
    margin-right: calc(var(--wp--preset--spacing--20) * -1);
}