@charset "utf-8";

/* --- 1. GLOBAL & MOBILE STYLES (Baseline) --- */
body {
    color: #000000;
    font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
    margin: 0;
}

/* Headings */
h1 { font-size: 2.25rem; font-weight: 700; color: #000; }
h2 { font-size: 1.8rem; font-weight: 700; color: #000; }
h3 { font-size: 1.5rem; font-weight: 700; color: #000; }
h4 { font-size: 1.25rem; font-weight: 700; font-style: italic; color: #000; }

/* Standard Paragraphs */
p { 
    font-size: 1.15rem; 
    line-height: 1.6; 
    margin-bottom: 1.25rem; 
    color: #000000; 
}

/* THE FIX: Styles the text blocks coming from your database */
.article-text {
    font-size: 1.15rem;
    line-height: 1.6;
    color: #000000;
    display: block;
    margin-bottom: 1.5rem; /* Creates the "paragraph" gap between blocks */
}

/* UI Elements & Components */
.completed { font-size: 1.15rem; line-height: 1.6; font-style: italic; color: #212529; }
.nav-link { font-weight: 700; font-size: 1.1rem; min-width: 110px; }
.sitemap-link { font-weight: 700; font-size: 1.2rem; color: #000; text-decoration: none; }
.bg-light { background-color: #f8f9fa !important; }

.btn-primary { 
    color: #000; 
    background-color: #fff !important; 
    border-color: green !important; 
    border-radius: 4px; 
    padding: 6px 12px; 
    transition: all .2s ease-in-out; 
}

.btn-primary:active, .btn-primary:focus, .btn-primary:hover { 
    background-color: cornsilk !important; 
    border-color: #000 !important; 
    color: #000 !important; 
    box-shadow: none; 
}

/* Article specific sub-headings */
.article-text h3 { 
    font-size: 1.25rem; 
    margin-top: 1.5rem; 
    margin-bottom: .5rem; 
    color: #343a40; 
    font-weight: 700; 
}

.hero-img { object-fit: cover; }

.skip-link { 
    position: absolute; 
    top: -40px; 
    left: 0; 
    background: #2c3e50; 
    color: #fff; 
    padding: 8px; 
    z-index: 1000; 
    transition: top .3s; 
}

.skip-link:focus { top: 0; outline: 2px solid #e67e22; }

.project-era-label { 
    display: block; 
    font-size: .85rem; 
    text-transform: uppercase; 
    letter-spacing: .05em; 
    color: #343a40; 
    margin-bottom: .25rem; 
    font-weight: 700; 
}

/* --- 2. DESKTOP OVERRIDES (Screens wider than 992px) --- */
@media screen and (min-width: 992px) {
    /* Main body and article text scaling */
    p, .article-text {
        font-size: 1.35rem !important; 
        line-height: 1.8 !important;
    }
    
    /* Heading scaling */
    h1 { font-size: 3.5rem !important; }
    h2 { font-size: 2.5rem !important; }
    h3 { font-size: 2rem !important; }
    .article-text h3 { font-size: 1.6rem !important; }
}