/* ============================================================
   Shared styles — In Memory of Hugh Gordon Murray
   Single source of truth for palette, type, header nav & layout.
   Link this on every page: <link rel="stylesheet" href="styles.css">
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500&family=Playfair+Display:ital,wght@0,400;0,600;1,400;1,600&family=Source+Serif+4:ital,opsz,wght@0,8..60,300;0,8..60,400;1,8..60,300;1,8..60,400&display=swap');

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

:root{
  --ink:#1a1410; --ink-soft:#4a3f35; --ink-muted:#7a6e65;
  --cream:#f7f3ed; --warm-white:#ffffff;
  --rule:#d4c8b8; --border:rgba(212,200,184,0.4);
  --accent:#8b5e3c; --accent-light:#c49a6c;
  /* aliases so each page's original CSS keeps resolving from here */
  --stone:#c49a6c; --stone-light:#d4c8b8; --focus:#8b5e3c; --timeline:#c8baa8;
}

html{scroll-behavior:smooth}
body{background:var(--cream);color:var(--ink);font-family:'Source Serif 4',Georgia,serif;font-size:18px;line-height:1.8}

/* ── Header / navigation ── */
nav{position:sticky;top:0;z-index:100;background:rgba(247,243,237,0.96);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--rule);padding:14px 40px;display:flex;align-items:center;justify-content:space-between}
.nav-name{font-family:'Playfair Display',Georgia,serif;font-size:1rem;font-weight:400;color:var(--ink-soft)}
.nav-links{display:flex;flex-wrap:wrap;gap:28px;list-style:none}
.nav-links a{font-family:'Montserrat',sans-serif;font-size:9.5px;font-weight:400;letter-spacing:0.2em;text-transform:uppercase;color:var(--ink-muted);text-decoration:none;transition:color 0.2s}
.nav-links a:hover,.nav-links a.active{color:var(--accent)}

/* ── Page column ── */
.page{max-width:680px;margin:0 auto;padding:80px 40px 120px}
.page-eyebrow{font-family:'Montserrat',sans-serif;font-size:9.5px;font-weight:400;letter-spacing:0.32em;text-transform:uppercase;color:var(--accent);margin-bottom:24px}
.page h1{font-family:'Playfair Display',Georgia,serif;font-size:clamp(2rem,5vw,3rem);font-weight:400;line-height:1.15;color:var(--ink);margin-bottom:8px}

/* ── Scroll reveal (opt-in via class="reveal") ── */
.reveal{opacity:0;transform:translateY(16px);transition:opacity 0.7s ease,transform 0.7s ease}
.reveal.visible{opacity:1;transform:translateY(0)}

/* ── Responsive ── */
@media(max-width:600px){
  nav{padding:12px 20px;flex-direction:column;align-items:flex-start;gap:10px}
  .nav-links{gap:16px}
  .page{padding:56px 20px 80px}
}