/* =============================================================
   RESPONSIVE
   ============================================================= */
@media (max-width: 600px) {

    :root {
        --first-divider-space: 45px;
        --divider-space: 40px;
    }

    .main-header-inner {
        min-height: 50px;
    }
	
	.main-header {
    transition: transform .25s ease;
    will-change: transform;
	}

	.main-header.header-hidden {
		transform: translateY(-100%);
	}

    .logo-full { display: none; }
    .logo-short { display: inline; }

    .main-nav ul {
        gap: 15px;
    }

    .main-nav a {
        font-size: 15px;
    }

    .grid-3,
    .grid-2 {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .blog-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .blog-content {
        gap: 15px;
    }

    .blog-sidebar {
        position: static;
        margin-top: 10px;
    }
	
	/* --- Abstand der Boxen auf der Infoseite --- */
	.blog-post-info {
		margin-bottom: 15px;
	}

    .divider--text h2 {
        font-size: 1.8em;
        flex-direction: column;
        gap: 0;
        line-height: 1.35;
        margin: 0 18px;
    }

    .box {
        padding: 20px;
    }

    .banner {
        height: 250px;
    }

    .gallery-list {
        gap: 20px;
    }

    .gallery-toggle {
        padding: 18px;
    }

    .gallery-content {
        padding: 0 18px 18px;
    }

    .gallery-grid {
        grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
        gap: 10px;
    }

    .file-row,
    .form-actions {
        grid-template-columns: 1fr;
    }

    .admin-title-row {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }

    .admin-title-row .button-link {
        width: 100%;
        margin-top: 0;
    }

    .site-footer {
        margin-top: 50px;
    }
}