/* theme-home.css — reskins site-pages.css pages to match index.html's visual system
   (saffron/charcoal newspaper palette, Playfair Display + Source Serif 4 + IBM Plex Mono,
   textured background, sticky nav). Does not touch index.html or its own inline styles.
   Load AFTER site-pages.css so these rules win on the shared class names. */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@700;900&family=Source+Serif+4:wght@400;600&family=IBM+Plex+Mono:wght@400;600&display=swap');

:root{
  --ink:#18232D;--muted:#68747C;--paper:#FFFCF5;--cream:#F5F0E5;--line:#E2D8C5;
  --saffron:#B85F00;--saffron2:#D97800;--green:#187B45;--crimson:#A73227;--blue:#176B9C;
  --serif:'Playfair Display',Georgia,serif;
  --mono:'IBM Plex Mono',monospace;
}

body{
  background:var(--cream);
  color:var(--ink);
  font-family:'Source Serif 4',Georgia,serif;
  background-image:linear-gradient(#ffffff3d 1px,transparent 1px);
  background-size:100% 28px;
}
a{color:var(--saffron)}

nav{background:#fffdf9f2;border-bottom:2px solid var(--saffron);box-shadow:0 4px 18px #5d46320d}
.brand{font-family:var(--serif);color:var(--saffron);border-right:1px solid var(--line);padding-right:.75rem}
.nav-links a{font-family:var(--mono);color:var(--muted)}
.nav-links a:hover,.nav-links a[aria-current=page]{background:var(--saffron);color:var(--paper)}

.hero{
  background:linear-gradient(135deg,#fffdf8 0%,#f3e8d5 100%);
  border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 35px #4c341d0d;
}
.eyebrow{font-family:var(--mono);color:var(--saffron2);letter-spacing:.14em}
h1,h2,h3{font-family:var(--serif)}
h1{color:var(--saffron)}
.lede{color:var(--muted)}
.notice{border-left-color:var(--saffron2);background:#fff7e8}

.card{background:var(--paper);border:1px solid var(--line);box-shadow:0 8px 24px #5b42240a}
.card h2,.card h3{color:var(--saffron)}
.card-link:hover{border-color:var(--saffron)}

th{background:var(--line);color:var(--saffron)}
td{border-bottom-color:var(--line);color:#3a332c}

.tricolor-bar{height:6px;border-radius:3px;max-width:280px;background:linear-gradient(to right,#FF9933 33%,#fff 33%,#fff 66%,#138808 66%);margin:1rem 0}

/* Illustrated hero banner (used with approved-pages artwork) */
.page-banner{margin:-0.5rem 0 2rem;border-radius:16px;overflow:hidden;border:1px solid var(--line);box-shadow:0 18px 50px #4c341d14;background:var(--paper)}
.page-banner img{display:block;width:100%;height:auto}

footer{background:var(--paper);border-top:1px solid var(--line);color:var(--muted)}