:root {
    --du-color-primary: #eb2d4d;
    --du-color-secondary: #50e3c2;
    --du-color-background: #f5f7fa;
    --du-color-text: #333333;
    --du-color-border: #e0e0e0;

    --du-font-family: 'Helvetica Neue', Arial, sans-serif;
    --du-font-size-base: 16px;
    --du-font-size-small: 14px;
    --du-font-size-large: 18px;

    --du-spacing-sm: 9px;
    --du-spacing-md: 18px;
    --du-spacing-lg: 36px;
    --du-spacing-xl: 72px;

    --du-transition-duration: 0.3s;

    .dark {
        --du-color-text: #ffffff;
    }
}

.dark {
    p,
    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        color: var(--du-color-text);
    }
}

.du-grid {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: var(--du-spacing-md);
    height: 100%;
    align-items: center;

    .du-col-6 {
        grid-column: span 6;
    }
    .du-col-4 {
        grid-column: span 4;
    }
    .du-col-3 {
        grid-column: span 3;
    }
    .du-col-2 {
        grid-column: span 2;
    }
    .du-col-1 {
        grid-column: span 1;
    }
    .du-col-12 {
        grid-column: span 12;
    }
    .du-col-8 {
        grid-column: span 8;
    }
    .du-col-10 {
        grid-column: span 10;
    }
    .du-col-9 {
        grid-column: span 9;
    }
    .du-col-11 {
        grid-column: span 11;
    }
    .du-col-5 {
        grid-column: span 5;
    }
    .du-col-7 {
        grid-column: span 7;
    }
}

.du-page-section {
    color: var(--du-color-text);

    & > .row {
        padding: 0 !important;
    }
    .uncont {
        padding-top: 0 !important;
    }

    .du-container {
        width: 100%;
        max-width: 1288px;
        margin: 0 auto;
        padding: var(--du-spacing-lg);
        display: grid;
        position: relative;
    }
}

.du-header-homepage {
    height: 100vh;
    background-color: #de1f41;
    color: white;
    position: relative;

    .du-bg-1,
    .du-bg-2,
    .du-bg-3 {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }
    .du-bg-1 {
        background: url('https://digitalnauniverzita.sk/wp-content/uploads/2025/06/DU-pattern.png')
            no-repeat center center;
        background-size: cover;
    }
    .du-bg-2 {
        background: linear-gradient(#f9284b, #f9284b00);
    }
    .du-bg-3 {
        background: linear-gradient(150deg, #f9284b, #f9284b00);
    }
}