@import url("base/variables.css");
@import url("base/reset.css");
@import url("base/layout.css");

@import url("components/header.css");
@import url("components/navigation.css");
@import url("components/hero.css");
@import url("components/section.css");












/* Mobile Ansicht */

@media (max-width: 900px) {

    .menu-toggle {
        display: block;
    }

    .main-nav {
        display: none;
    }

    .main-nav.active {
        display: block;

        position: absolute;
        top: 70px;
        left: 0;
        right: 0;

        background: var(--bg-color);
        border-top: 1px solid var(--border-color);
        padding: 1rem;
    }

    .main-nav.active ul {
        flex-direction: column;
        gap: 1rem;
    }

    .slide-overlay h1 {
        font-size: 2rem;
        padding: 0 1rem;
        text-align: center;
    }






}