/* Impressum page styles (self-contained, with responsive breakpoints) */

/* Base layout and background */
.legal-page {
    min-height: 100vh;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 0 20px;
    /* Background image with subtle dark overlay for readability */
    background-image: linear-gradient(rgba(0, 0, 0, 0.45), rgba(0, 0, 0, 0.45)), url('assets/section_images/impressum_image.webp');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: fixed;
}

/* Back link icon/text swap defaults */
.back-link .icon {
    display: none;
    margin-right: 0;
}

.back-link .label {
    display: inline;
}

/* Prefer scroll attachment on small/coarse-pointer devices to avoid white bands
   and swap text for an arrow icon */
@media (max-width: 767px),
(pointer: coarse) {
    .legal-page {
        background-attachment: scroll !important;
    }

    /* On small screens: show only arrow icon, hide visible text but keep it accessible */
    .legal-header {
        margin-top: 4px;
    }

    .legal-header .back-link {
        padding: 12px;
        font-size: 20px;
        line-height: 1;
    }

    .back-link .icon {
        display: inline;
    }

    .back-link .label {
        position: absolute !important;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
        border: 0;
    }
}

/* Content container */
.legal-content {
    max-width: 900px;
    width: 100%;
}

/* Header row */
.legal-header {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    margin-bottom: 16px;
}

.legal-header h1 {
    margin-top: 8px;
}

.legal-header .back-link {
    color: #B6B2B1;
    text-decoration: none;
    padding-top: 24px;
    padding-left: 0;
    margin-left: 0;
    align-self: flex-start;
}

.legal-header .back-link:hover {
    color: #fff;
}

/* Prevent horizontal scrolling and constrain elements within the viewport */
.legal-page,
.legal-content,
.legal-header {
    max-width: 100%;
    overflow-x: hidden;
}

.back-link {
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
}

.back-link .label {
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Typography overrides scoped to legal page to avoid global h1 margin-top */
.legal-content h1 {
    margin-top: 40px;
    margin-bottom: 24px;
}

.legal-content h2 {
    font-size: 1.25rem;
    margin: 28px 0 8px;
}

.legal-content h3 {
    font-size: 1.05rem;
    margin: 20px 0 6px;
}

.legal-content p {
    line-height: 1.6;
    margin: 8px 0;
}

.legal-content .muted {
    color: #B6B2B1;
}

/* Breakpoints */
/* Small phones */
@media (max-width: 399px) {
    .legal-content h1 {
        margin-top: 24px;
    }

    .legal-page {
        width: 100svw;
    }
}

/* Phones */
@media (min-width: 400px) and (max-width: 767px) {
    .legal-content h1 {
        margin-top: 32px;
    }
}

/* Tablets */
@media (min-width: 768px) and (max-width: 1023px) {
    .legal-content {
        max-width: 840px;
    }

    .legal-content h1 {
        margin-top: 60px;
    }
}

/* Laptops */
@media (min-width: 1024px) and (max-width: 1439px) {
    .legal-content {
        max-width: 900px;
    }

    .legal-content h1 {
        margin-top: 72px;
    }
}

/* Desktops/large */
@media (min-width: 1440px) {
    .legal-content {
        max-width: 1000px;
    }

    .legal-content h1 {
        margin-top: 84px;
    }
}

body {
    overflow-x: hidden;
}