@charset "UTF-8";
/* iaf.css - shared design system for iceagefloodstrail.org
   Warm "museum / field-guide" identity: paper / basalt / iron-oxide.
   Loaded by every hand-authored page AND every generated detail page.
   NOTE: keep this file ASCII-only in comments. A multi-byte char in a CSS
   comment with no @charset once broke the whole :root (see project memory). */

:root{
  --paper:#f3eee4; --paper-2:#ece3d3; --paper-3:#e4dac6;
  --ink:#211e19; --ink-soft:#5b5447; --faint:#8b8475;
  --line:rgba(33,30,25,.14); --line-2:rgba(33,30,25,.26);
  --rust:#b0552f; --rust-deep:#8f421f; --water:#2f6b86; --sage:#6b7355;
  --basalt:#23201b; --basalt-2:#2c2820; --on-dark:#ece3d3; --on-dark-soft:#a9a08c;
  --peach:#e9c9a8; --peach-2:#f0d4b6;
  --serif:'Newsreader',Georgia,serif; --mono:'Spline Sans Mono',ui-monospace,monospace;
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--serif);line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}
img{max-width:100%;display:block;}
::selection{background:var(--rust);color:#fff;}
/* Peoples section uses a sage selection highlight */
body.sel-sage ::selection{background:var(--sage);color:#fff;}

/* Responsive system. Inline styles can't carry media queries, so layout grids
   opt in via data-r attributes; these rules collapse them at the two
   breakpoints (880px, 600px). Mirrors the design-handoff responsive block. */
@media (max-width:880px){
  [data-r="split"],[data-r="sidebar"],[data-r="3"],[data-r="feature"]{grid-template-columns:1fr !important;}
  [data-r="split"]{gap:32px !important;}
  [data-r="sidebar"]{gap:16px !important;}
  [data-sticky]{position:static !important;}
  [data-r="4"]{grid-template-columns:repeat(2,1fr) !important;}
  [data-r="cards3"]{grid-template-columns:repeat(2,1fr) !important;}
  [data-r="cycle"] [data-row]{grid-template-columns:1fr !important;}
  [data-hide-m]{display:none !important;}
}
@media (max-width:600px){
  [style*="margin:0 auto"]{padding-left:22px !important;padding-right:22px !important;}
  [data-r="4"],[data-r="cards3"]{grid-template-columns:1fr !important;}
  [data-r="split"]{gap:26px !important;}
  header[data-iaf-nav]{padding-left:22px !important;padding-right:22px !important;}
}