/* ── Brand Colors ── */
:root {
    --brand-red:      #cf3728;
    --brand-red-dark: #a82d20;
    --brand-gold:     #ffd201;
    --brand-dark:     #231f20;
    --bg:             #fdf6ee;
}

/* ── Reset & Base ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
    background: var(--bg);
    color: #374151;
    font-family: 'Inter', system-ui, -apple-system, sans-serif;
    -webkit-font-smoothing: antialiased;
    line-height: 1.6;
}
a { color: var(--brand-red); }
img { max-width: 100%; }

/* ── Red Accent Bar ── */
.accent-bar { height: 3px; background: var(--brand-red); }

/* ── Header / Nav ── */
header {
    position: sticky;
    top: 0;
    z-index: 50;
    background: var(--brand-gold);
    box-shadow: 0 2px 6px rgba(0,0,0,0.15);
}
.nav-inner {
    max-width: 72rem;
    margin: 0 auto;
    padding: 0 1.5rem;
    display: flex;
    align-items: center;
    height: 4rem;
    gap: 1.5rem;
}

/* Logo */
.nav-logo {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    text-decoration: none;
    flex-shrink: 0;
    border: 1px solid rgba(35,31,32,0.4);
    background: var(--brand-dark);
    border-radius: 0.375rem;
    padding: 0.375rem 0.75rem;
    transition: border-color 0.15s;
}
.nav-logo:hover { border-color: var(--brand-dark); }
.nav-logo img { height: 2rem; width: 2rem; border-radius: 0.25rem; }
.nav-logo-title { color: #fff; font-weight: 700; font-size: 0.875rem; display: block; line-height: 1.2; }
.nav-logo-sub   { color: var(--brand-gold); font-size: 0.625rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; display: block; }

/* Desktop nav */
nav.main-nav {
    display: none;
    align-items: center;
    gap: 0.25rem;
    flex: 1;
}
.nav-link {
    padding: 0.375rem 0.75rem;
    border-radius: 0.375rem;
    font-size: 0.875rem;
    font-weight: 500;
    color: rgba(35,31,32,0.8);
    text-decoration: none;
    transition: color 0.15s, background 0.15s;
}
.nav-link:hover, .nav-link.active { color: var(--brand-red); background: rgba(207,55,40,0.08); }
.nav-link.highlight { color: var(--brand-red); font-weight: 600; }

/* Nav right */
.nav-right { display: none; align-items: center; gap: 0.5rem; margin-left: auto; }

.nav-back-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.375rem 1rem;
    border-radius: 0.375rem;
    background: var(--brand-red);
    color: #fff !important;
    font-size: 0.875rem;
    font-weight: 600;
    text-decoration: none;
    transition: background 0.15s;
    flex-shrink: 0;
    white-space: nowrap;
}
.nav-back-btn:hover { background: var(--brand-red-dark); }

/* Hamburger */
.nav-hamburger {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: auto;
    padding: 0.5rem;
    border: none;
    background: none;
    color: rgba(35,31,32,0.7);
    border-radius: 0.375rem;
    cursor: pointer;
    transition: color 0.15s, background 0.15s;
}
.nav-hamburger:hover { color: var(--brand-dark); background: rgba(35,31,32,0.08); }
.nav-hamburger svg { width: 1.25rem; height: 1.25rem; }
#iconClose { display: none; }

/* Mobile menu */
.mobile-menu { display: none; border-top: 1px solid rgba(35,31,32,0.2); }
.mobile-menu.open { display: block; }
.mobile-menu-inner { padding: 0.75rem 1rem; }
.mobile-link {
    display: block;
    padding: 0.625rem 0.75rem;
    border-radius: 0.375rem;
    font-size: 0.875rem;
    font-weight: 500;
    color: rgba(35,31,32,0.8);
    text-decoration: none;
    transition: color 0.15s, background 0.15s;
}
.mobile-link:hover, .mobile-link.active { color: var(--brand-red); background: rgba(207,55,40,0.08); }
.mobile-link.highlight { color: var(--brand-red); font-weight: 600; }
.mobile-link-separator { margin-top: 0.5rem; border-top: 1px solid rgba(35,31,32,0.15); padding-top: 0.75rem; }

@media (min-width: 768px) {
    nav.main-nav  { display: flex; }
    .nav-right    { display: flex; }
    .nav-hamburger { display: none; }
}

/* ── Main Content ── */
main {
    max-width: 56rem;
    margin: 0 auto;
    padding: 2.5rem 1.5rem;
}
@media (min-width: 1024px) { main { padding: 3.5rem 1.5rem; } }

/* ── Footer ── */
footer { background: var(--brand-dark); color: #fff; margin-top: 4rem; }
.footer-top-border { height: 4px; background: var(--brand-gold); }
.footer-inner {
    max-width: 72rem;
    margin: 0 auto;
    padding: 3rem 1.5rem;
    display: grid;
    grid-template-columns: 1fr;
    gap: 2.5rem;
}
@media (min-width: 768px) { .footer-inner { grid-template-columns: repeat(3, 1fr); } }
.footer-brand-row { display: flex; align-items: center; gap: 0.75rem; margin-bottom: 1rem; }
.footer-brand-row img { height: 2.5rem; width: 2.5rem; border-radius: 0.25rem; }
.footer-brand-name { font-weight: 700; color: #fff; line-height: 1.3; font-size: 0.9375rem; }
.footer-brand-sub  { color: var(--brand-gold); font-size: 0.75rem; letter-spacing: 0.12em; text-transform: uppercase; font-weight: 600; }
.footer-desc { color: rgba(255,255,255,0.6); font-size: 0.875rem; line-height: 1.6; }
.footer-heading { color: var(--brand-gold); font-weight: 600; font-size: 0.875rem; text-transform: uppercase; letter-spacing: 0.08em; margin-bottom: 1rem; }
.footer-links { list-style: none; }
.footer-links li { margin-bottom: 0.5rem; }
.footer-links a { color: rgba(255,255,255,0.7); text-decoration: none; font-size: 0.875rem; transition: color 0.15s; }
.footer-links a:hover { color: var(--brand-gold); }
.footer-contact { list-style: none; }
.footer-contact li { display: flex; align-items: flex-start; gap: 0.5rem; margin-bottom: 0.75rem; color: rgba(255,255,255,0.7); font-size: 0.875rem; }
.footer-contact li svg { width: 1rem; height: 1rem; flex-shrink: 0; color: var(--brand-gold); margin-top: 0.125rem; }
.footer-contact a { color: rgba(255,255,255,0.7); text-decoration: none; transition: color 0.15s; }
.footer-contact a:hover { color: var(--brand-gold); }
.footer-bottom {
    border-top: 1px solid rgba(255,255,255,0.1);
    padding: 1rem 1.5rem;
    text-align: center;
    color: rgba(255,255,255,0.4);
    font-size: 0.75rem;
}

/* ── Breadcrumb ── */
.pub-breadcrumb { font-size: 0.875rem; color: #6b7280; margin-bottom: 1.5rem; }
.pub-breadcrumb a { color: var(--brand-red); text-decoration: none; }
.pub-breadcrumb a:hover { text-decoration: underline; }

/* ── Prose content ── */
.pub-prose h1 { font-size: 1.875rem; font-weight: 800; color: var(--brand-dark); margin-bottom: 0.75rem; line-height: 1.2; }
.pub-prose h2 { font-size: 1.375rem; font-weight: 700; color: var(--brand-dark); margin-top: 2rem; margin-bottom: 0.5rem; }
.pub-prose h2:first-child { margin-top: 0; }
.pub-prose h3 { font-size: 1.0625rem; font-weight: 700; color: var(--brand-dark); margin-top: 1.25rem; margin-bottom: 0.375rem; }
.pub-prose p  { line-height: 1.75; margin-bottom: 1em; color: #374151; }
.pub-prose a  { color: var(--brand-red); }
.pub-prose ul { list-style-type: disc; padding-left: 1.5rem; margin-bottom: 1em; color: #374151; line-height: 1.75; }
.pub-prose ol { list-style-type: decimal; padding-left: 1.5rem; margin-bottom: 1em; color: #374151; line-height: 1.75; }
.pub-prose li { display: list-item; margin-bottom: 0.25rem; }
.pub-prose hr { border: none; border-top: 1px solid #e5e7eb; margin: 2.5rem 0; }
.pub-prose strong { font-weight: 700; }
.pub-prose em { font-style: italic; }
.pub-prose blockquote { border-left: 4px solid var(--brand-red); padding-left: 1rem; color: #6b7280; font-style: italic; }

/* ── Card grid ── */
.pub-card-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 1.25rem; margin: 1.75rem 0; }
.pub-card { background: #f9fafb; border: 1px solid #e5e7eb; border-radius: 0.75rem; padding: 1.25rem 1.5rem; transition: box-shadow 0.15s; }
.pub-card:hover { box-shadow: 0 4px 12px rgba(0,0,0,0.08); }
.pub-card h3 { color: var(--brand-dark); margin: 0 0 0.5rem; font-size: 1rem; font-weight: 700; }
.pub-card p  { color: #6b7280; font-size: 0.875rem; line-height: 1.6; margin: 0 0 0.875rem; }
.pub-card a  { color: var(--brand-red); font-weight: 600; font-size: 0.875rem; text-decoration: none; }
.pub-card a:hover { text-decoration: underline; }

/* ── Donate page ── */
.donate-address-box {
    background: #f9f5f0;
    border-left: 4px solid var(--brand-red);
    padding: 1rem 1.25rem;
    border-radius: 4px;
    margin: 1rem 0;
    font-size: 0.9375rem;
    line-height: 1.8;
    color: #374151;
}
.donate-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.875rem 1.75rem;
    background: #0070ba;
    color: #fff !important;
    font-weight: 700;
    border-radius: 0.5rem;
    text-decoration: none;
    font-size: 1rem;
    transition: background 0.15s;
}
.donate-btn:hover { background: #005a96; }
.donate-center { text-align: center; margin: 2rem 0; }
.donate-hint { text-align: center; color: #6b7280; font-size: 0.875rem; margin-top: -0.75rem; margin-bottom: 2rem; }