/**
 * Preisverleihung Portfolio Template Styles
 * Basierend auf Adobe XD Design für DFJP
 */

/* ========================================
   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;

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

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

/* ========================================
   Basis Styles
======================================== */

/* ========================================
   Responsive Design - Mobile
======================================== */

/* Jurymitglieder Texte mit Raleway */
.jurymitglieder-grid-container p,
.jurymitglieder-grid-container strong {
    font-family: 'Raleway', sans-serif !important;
}

@media only screen and (max-width: 1024px) {
    /* Jurymitglieder: 2-spaltig auf Mobile mit 20px Abstand zwischen den Spalten.
       Flex-basiert statt nth-child(odd/even), da die Jurymitglieder aus mehreren
       fusion_builder_row-Blöcken bestehen und :nth-child sich pro DOM-Elternebene
       (Row bzw. ggf. ein Avada-Wrapper dazwischen) unterschiedlich verhalten kann,
       wodurch Paare aus benachbarten Rows fälschlich einzeln statt nebeneinander
       dargestellt wurden. Flex-wrap ordnet unabhängig von odd/even immer 2 pro Zeile an. */
    .jurymitglieder-grid-container .fusion-builder-row {
        display: flex !important;
        flex-wrap: wrap !important;
    }

    .jurymitglieder-grid-container .fusion_builder_column_1_4 {
        width: 50% !important;
        max-width: 50% !important;
        flex: 0 0 50% !important;
        box-sizing: border-box !important;
        padding-right: 10px !important;
        padding-left: 10px !important;
    }

    /* Header "Preisverleihung" Text */
    .preisverleihung-header p[style*="font-size: 40px"] {
        font-size: 48px !important;
        line-height: 55px !important;
    }

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

    /* Ort/Datum bei Impressionen */
    .preisverleihung-impressionen p[style*="font-size: 20px"] {
        font-size: 28px !important;
        line-height: 32px !important;
    }

    /* Video bei Impressionen volle Breite ohne Padding/Margin */
    .preisverleihung-impressionen div[style*="width: 80%"] {
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* Alle Überschriften (h2) */
    h2 {
        font-size: 48px !important;
        line-height: 57px !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    /* Kategorie Label */
    .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;
        margin: 0 0 10px 0 !important;
    }

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

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

    /* Sender Schriftgröße in Kategorien */
    .preistraeger-kategorie p[style*="font-size: 12px"] {
        font-size: 24px !important;
        line-height: 34px !important;
    }

    /* Reden Namen */
    .preisverleihung-reden-videos p[style*="font-size: 20px"] {
        font-size: 28px !important;
        line-height: 26px !important;
    }

    /* Reden Position */
    .preisverleihung-reden-videos p[style*="font-size: 15px"] {
        font-size: 23px !important;
        line-height: 26px !important;
    }

    /* Jurymitglieder Namen Schriftgröße */
    .jurymitglieder-grid-container strong {
        font-size: 24px !important;
        line-height: 1.1 !important;
    }

    /* Jurymitglieder Sender/Copyright Schriftgröße */
    .jurymitglieder-grid-container p:last-child {
        font-size: 22px !important;
        line-height: 1.1 !important;
    }

    /* Entferne Border und Padding bei Kategorien */
    .preistraeger-kategorie div[style*="border-left"],
    .preistraeger-kategorie div[style*="border-right"],
    .preistraeger-kategorie div[style*="padding-left"],
    .preistraeger-kategorie div[style*="padding-right"] {
        border-left: none !important;
        border-right: none !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    /* Entferne Padding bei Reden Columns - alle Ebenen */
    .preisverleihung-reden-videos .fusion_builder_column_1_2,
    .preisverleihung-reden-videos .fusion_builder_column_1_2[style*="padding"],
    .preisverleihung-reden-videos .fusion-column-wrapper,
    .preisverleihung-reden-videos .fusion_text,
    .preisverleihung-reden-videos .fusion_text div,
    .preisverleihung-reden-videos div[style*="padding-left: 52px"],
    .preisverleihung-reden-videos div[style*="padding-right: 52px"],
    .preisverleihung-reden-videos [style*="padding-left: 0"],
    .preisverleihung-reden-videos [style*="padding-right: 0"] {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    /* Abstand zwischen Videos und Preisträgernamen in Kategorien */
    .preistraeger-kategorie div[style*="aspect-ratio: 16/9"] {
        margin-bottom: 25px !important;
    }

    /* Mitglieder Logos Container: Flexbox für korrekte Anordnung */
    .preisverleihung-mitglieder-logos .fusion-builder-row {
        display: flex !important;
        flex-wrap: wrap !important;
    }

    /* Mitglieder Logos: 3-spaltig auf Mobile mit 30px Abstand */
    .preisverleihung-mitglieder-logos .fusion_builder_column_1_6 {
        width: calc(33.333% - 30px) !important;
        max-width: calc(33.333% - 30px) !important;
        margin: 0 15px 30px 15px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        clear: none !important;
    }

    /* Leere Spalten komplett ausblenden */
    .preisverleihung-mitglieder-logos .hide-mobile-empty {
        display: none !important;
        width: 0 !important;
        height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        position: absolute !important;
        visibility: hidden !important;
    }

    /* Halbe Breite auf Mobile */
    .preisverleihung-mitglieder-logos .half-width-mobile {
        width: 16.666% !important;
        max-width: 16.666% !important;
    }

    .preisverleihung-reden {
        display: none !important;
    }
}