/* Resonance Co. — shared site styles (tokens, nav, footer). Page-specific CSS stays inline per page. */
:root{ --cream:#F4F3EF; --paper-2:#EEEBE3; --linen:#DDD4C2; --charcoal:#2A2520; --muted:#6B5F52; --rose:#B01050;
  --ink-2:#4A4945; --muted-2:#5E5C55; --faint:#9E9484;
  --serif:'Cormorant Garamond',Georgia,serif; --sans:'Jost',system-ui,sans-serif; }
*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; }
body{ background:var(--cream); color:var(--charcoal); font-family:var(--serif);
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
img{ max-width:100%; display:block; }

/* ===== shared site nav ===== */
.site-nav{ max-width:none; margin:0; padding:clamp(22px,3vw,40px) clamp(24px,5vw,64px) 18px;
  display:flex; align-items:flex-end; justify-content:space-between; gap:2rem; flex-wrap:wrap; }
.site-nav .brand{ text-decoration:none; color:var(--charcoal); line-height:1; display:flex; flex-direction:column; align-items:center; }
.site-nav .brand .wm{ font-size:clamp(24px,2.6vw,32px); font-weight:400; letter-spacing:.01em;
  border-bottom:1px solid var(--charcoal); padding-bottom:6px; display:inline-block; }
.site-nav .brand .wm span{ font-weight:300; }
.site-nav .brand em{ display:block; font-style:italic; font-size:clamp(14px,1.3vw,17px); font-weight:500;
  margin-top:8px; color:var(--muted); }
.site-nav .links{ display:flex; gap:clamp(22px,4vw,52px); padding-bottom:6px; }
.site-nav .links a{ font-family:var(--sans); font-weight:300; font-size:12.5px; letter-spacing:.16em;
  text-transform:uppercase; text-decoration:none; color:var(--charcoal); padding-bottom:8px;
  border-bottom:1px solid transparent; transition:border-color .2s; }
.site-nav .links a:hover{ border-color:var(--linen); }
.site-nav .links a.active{ border-color:var(--charcoal); }

/* ===== shared footer ===== */
.site-footer{ margin-top:1rem; padding:clamp(40px,6vw,72px) 1.5rem clamp(30px,4vw,48px);
  text-align:center; border-top:1px solid var(--linen); }
.site-footer .fwm{ font-size:clamp(22px,2.4vw,30px); font-weight:400; letter-spacing:.01em; display:inline-block; border-bottom:1px solid var(--charcoal); padding-bottom:6px; }
.site-footer .fwm span{ font-weight:300; }
.site-footer .ftag{ font-style:italic; color:var(--muted); margin-top:8px; font-size:16px; font-weight:500; }
.site-footer .socials{ display:flex; gap:20px; justify-content:center; margin-top:20px; }
.site-footer .socials a{ color:var(--muted); display:inline-flex; transition:color .2s; }
.site-footer .socials a:hover{ color:var(--charcoal); }
.site-footer .socials svg{ width:21px; height:21px; }
.site-footer .flegal{ font-family:var(--sans); font-weight:300; font-size:11px; letter-spacing:.12em;
  text-transform:uppercase; color:var(--muted); margin-top:22px; }