/* Style the main content area */
#main {
    flex: 1;
    width: 100%;
    max-width: min(1400px, 96vw);
    margin: 0 auto;
    padding: clamp(2rem, 3vw, 3.5rem) clamp(0.75rem, 1.5vw, 1.5rem);
}
@media (min-width: 1800px) {
    #main {
        max-width: 1800px;
    }
}
@media (min-width: 1400px) {
    .accessibility-content {
        max-width: 1400px;
    }
}
h1 {
    font-size: 2.5rem;
    margin-bottom: 1.5rem;
    text-align: center;
}   
/* Accessibility Statement Content Styles */
.accessibility-content {
    display: flex;
    gap: 0;
    font-size: 1rem;
    padding: 0.5rem;
    line-height: 1.6;
    color: var(--body-text);
    max-width: 1300px;
    margin-inline: auto;
}
.accessibility-content p {
    margin-bottom: 1.25rem;
}
.accessibility-content p:last-child {
    margin-bottom: 0;
}
.accessibility-image {
    max-width: 12.5rem;
    height: auto;
    flex-shrink: 0;
    margin-right: 1.25rem;
    margin-top: 0.75rem;
    border-radius: 2px;
}


.accessibility-text {
    flex: 1;
    max-width: 100%;
}

html.readable-text .accessibility-text {
    max-width: min(88ch, 100%);
}

html.readable-text .accessibility-content p,
html.readable-text .accessibility-content li {
    max-width: none;
}

@media (max-width: 768px) {
    .accessibility-content {
        flex-direction: column;
        padding-inline: 0;
    }

    .accessibility-image {
        width: min(10rem, 45vw);
        margin: 0 auto 1.25rem;
    }
}
@media (min-width: 1200px) {
    #main {
        padding-left: 1rem;
        padding-right: 1rem;
    }
}

body.dark-mode .accessibility-content,
body.dark-mode .accessibility-content p {
    color: var(--body-text);
}

body.dark-mode .accessibility-image {
    border: 1px solid rgba(99, 210, 207, 0.22);
    box-shadow:
        0 10px 24px rgba(0, 0, 0, 0.32),
        0 0 0 1px rgba(99, 210, 207, 0.08);
    filter: brightness(0.78) contrast(1.08) saturate(0.92);
}