/* ========================================
   Font Definitions
======================================== */

@font-face {
    font-family: 'Raleway';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url('https://fonts.gstatic.com/s/raleway/v34/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVvaorCGPrcVIT9d0c-dYA.woff2') format('woff2');
}

/* Fallback: Raleway von Google Fonts Import */
@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@700&display=swap');

/* ========================================
   CSS Variablen / Design Tokens
======================================== */

:root {
    /* Farben - Desktop Palette */
    --color-white: #FFFFFF;
    --color-black: #000000;
    --color-lightblue: #B3E5FC;
    --color-beige: #E8C4B0;
    --color-lilac: #C5B3E6;
    --color-yellow: #F4E4A1;
    --color-mint: #B8F4D3;
    --color-lightgray: #E5E5E5;
    --color-gray: #C4C4C4;

    /* Farben - Preisträger spezifisch */
    --color-gold: #FFD700;
    --color-bronze: #CD7F32;

    /* Spacing */
    --spacing-xs: 8px;
    --spacing-sm: 16px;
    --spacing-md: 24px;
    --spacing-lg: 40px;
    --spacing-xl: 60px;
    --spacing-xxl: 80px;

    /* Container */
    --container-max-width: 1200px;
}

/* ========================================
   Single Preisträger Layout
======================================== */

/* Sender Spalte - Vertikale Zentrierung */
/* Innere Row als Flexbox damit beide Spalten gleich hoch werden */
.preistraeger-kategorie .fusion-builder-row-inner {
    display: flex !important;
}

.preistraeger-kategorie .fusion-builder-row-inner .fusion_builder_column {
    display: flex !important;
}

.preistraeger-kategorie .fusion-builder-row-inner .fusion_builder_column .fusion-column-wrapper {
    width: 100% !important;
}

/* Sender Spalte zentrieren */
.preistraeger-kategorie .fusion-builder-row-inner .fusion_builder_column_1_3.fusion-column-last .fusion-column-wrapper {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* ========================================
   Weitere Preisträger - Button am unteren Rand
======================================== */

/* Weitere Preisträger Container - Flexbox für gleiche Höhe */
.weitere-preistraeger .fusion-builder-row {
    display: flex !important;
    align-items: stretch !important;
}

.weitere-preistraeger .fusion_builder_column {
    display: flex !important;
}

.weitere-preistraeger .fusion_builder_column .fusion-column-wrapper {
    width: 100% !important;
}

/* Button Spalte - Button am unteren Rand */
.weitere-preistraeger .button-column-bottom .fusion-column-wrapper {
    display: flex !important;
    align-items: flex-end !important;
    justify-content: center !important;
}

/* ========================================
   Mobile Responsive Anpassungen
======================================== */

@media only screen and (max-width: 800px) {
    /* Kategorie Container - Name und Sender untereinander */
    .preistraeger-kategorie .fusion-builder-row-inner {
        display: block !important;
    }

    .preistraeger-kategorie .fusion-builder-row-inner .fusion_builder_column {
        display: block !important;
        width: 100% !important;
        margin-bottom: 20px !important;
    }

    /* Border zwischen Name und Sender ausblenden */
    .preistraeger-kategorie .fusion-builder-row-inner .fusion_builder_column_2_3 {
        border-right: none !important;
    }

    .preistraeger-kategorie .fusion-builder-row-inner .fusion_builder_column_2_3 .fusion-column-wrapper {
        border-right: none !important;
    }

    /* Abstand zwischen Bild und Name: 30px */
    .preistraeger-kategorie .fusion-builder-row-inner {
        margin-top: 30px !important;
    }

    /* Border bottom zwischen Titel und Sender */
    .preistraeger-kategorie .fusion-builder-row-inner .fusion_builder_column_2_3 {
        border-bottom: 1px solid #C88E4B !important;
        padding-bottom: 20px !important;
        margin-bottom: 20px !important;
    }

    /* Border zwischen Sender und Beschreibungstext */
    .preistraeger-kategorie .fusion-builder-row-inner .fusion_builder_column_1_3.fusion-column-last {
        margin-bottom: 20px !important;
    }

    /* Schriftgrößen erhöhen - Hauptbereich Kategorie */
    /* Kategorie Label "Kategorie" */
    .preistraeger-kategorie p[style*="font-size: 20px"][style*="Raleway"] {
        font-size: 32px !important;
        line-height: 36px !important;
    }

    /* Kategorienamen */
    .preistraeger-kategorie p[style*="font-size: 40px"] {
        font-size: 48px !important;
        line-height: 57px !important;
    }

    /* Preisträgernamen und Projekttitel */
    .preistraeger-kategorie p[style*="font-size: 25px"] {
        font-size: 37px !important;
        line-height: 47px !important;
    }

    /* Preisträger Beschreibungstext */
    .preistraeger-kategorie .fusion_builder_column_2_3 p[style*="font-size: 14px"] {
        font-size: 26px !important;
        line-height: 32px !important;
    }

    /* Schriftgrößen erhöhen - Weitere Preisträger */
    /* Kategorie Label */
    .weitere-preistraeger p[style*="font-size: 15px"] {
        font-size: 27px !important;
        line-height: 30px !important;
    }

    /* Kategorienamen */
    .weitere-preistraeger p[style*="font-size: 30px"] {
        font-size: 42px !important;
        line-height: 49px !important;
    }

    /* Preisträgernamen */
    .weitere-preistraeger p[style*="font-size: 16px"] {
        font-size: 28px !important;
        line-height: 34px !important;
    }

    /* Projekttitel */
    .weitere-preistraeger p[style*="font-size: 18px"] {
        font-size: 30px !important;
        line-height: 34px !important;
    }

    /* Medienquelle */
    .weitere-preistraeger p[style*="font-size: 12px"] {
        font-size: 24px !important;
        line-height: 34px !important;
    }

    /* Header Schriften */
    /* Header "PreisträgerInnen" Text */
    .preistraeger-header p[style*="font-size: 40px"] {
        font-size: 48px !important;
        line-height: 55px !important;
    }

    /* Header Jahr */
    .preistraeger-header p[style*="font-size: 90px"] {
        font-size: 98px !important;
        line-height: 118px !important;
    }

    /* Überschrift Weitere Preisträger */
    h2[style*="font-size: 40px"] {
        font-size: 48px !important;
        line-height: 55px !important;
    }

    /* Weitere Preisträger - Alles untereinander */
    .weitere-preistraeger .fusion-builder-row {
        display: block !important;
    }

    .weitere-preistraeger .fusion_builder_column {
        display: block !important;
        width: 100% !important;
        margin-bottom: 20px !important;
    }

    .weitere-preistraeger .button-column-bottom .fusion-column-wrapper {
        display: flex !important;
        align-items: flex-end !important;
        justify-content: flex-end !important;
    }

    /* Padding entfernen bei Name, Titel, Sender Spalten */
    .weitere-preistraeger .fusion_builder_column .fusion-column-wrapper {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    /* Button Margin auf 0 */
    .weitere-preistraeger .fusion-button {
        margin: 0 !important;
    }

    /* Separatoren zwischen Kategorien - margin bottom 15px */
    .fusion-separator {
        margin: 30px 0 !important;
    }
}