/* * Kinzua Gazette - Global Stylesheet
 * Brand Colors: Forest (#1b2e1e), Amber (#a8763e), Clay (#7c512d)
 */

@import url('https://fonts.googleapis.com/css2?family=Crimson+Pro:ital,wght@0,400;0,700;1,400&family=Inter:wght@400;600;800&display=swap');

:root {
    --forest: #1b2e1e;
    --amber: #a8763e;
    --clay: #7c512d;
    --stone-50: #fcfaf7;
    --stone-100: #f5f2ed;
    --stone-800: #292524;
    --news-red: #b91c1c;
}

body {
    font-family: 'Inter', sans-serif;
    background-color: var(--stone-50);
    color: var(--stone-800);
    line-height: 1.6;
}

h1, h2, h3, h4, .serif {
    font-family: 'Crimson Pro', serif;
}

/* --- Layout Components --- */

.container-custom {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 1rem;
}

/* --- Navigation & Header --- */

.bg-forest { background-color: var(--forest); }
.border-amber { border-color: var(--amber); }

.nav-link {
    transition: color 0.3s ease;
    text-transform: uppercase;
    font-size: 0.75rem;
    letter-spacing: 0.1em;
    font-weight: 800;
}

.nav-link:hover { color: var(--amber); }

/* --- Article Styling --- */

.prose p {
    margin-bottom: 1.5rem;
    font-size: 1.125rem;
    color: #333;
}

.prose h2 {
    font-size: 1.875rem;
    font-weight: 700;
    margin-top: 2.5rem;
    margin-bottom: 1rem;
    border-left: 4px solid var(--amber);
    padding-left: 1rem;
}

.prose h3 {
    font-size: 1.5rem;
    font-weight: 700;
    margin-top: 2rem;
    margin-bottom: 0.75rem;
}

/* --- News & Widgets --- */

.news-heading {
    color: var(--news-red);
    border-bottom: 2px solid var(--news-red);
    text-transform: uppercase;
    letter-spacing: -0.02em;
}

.history-widget {
    background-color: var(--forest);
    border-radius: 1rem;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.2);
}

.card-shadow {
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

/* --- Utility --- */

.btn-amber {
    background-color: var(--amber);
    color: white;
    padding: 0.75rem 1.5rem;
    border-radius: 0.5rem;
    font-weight: 700;
    transition: background 0.3s;
}

.btn-amber:hover {
    background-color: var(--clay);
}