/* ==========================================================================
   Base
   Reset, page container, section rhythm and the shared heading styles.
   ========================================================================== */
*,*::before,*::after{ box-sizing:border-box; }

html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }

body{
  margin:0;
  background:var(--white);
  color:var(--ink);
  font-family:var(--font);
  font-size:var(--fs-body);
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
}

img{ display:block; max-width:100%; height:auto; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; background:none; border:0; padding:0; cursor:pointer; }
p{ margin:0; }
h1,h2,h3,h4{ margin:0; font-weight:700; }
ul,ol{ margin:0; padding:0; list-style:none; }

/* --------------------------------------------------------------------------
   Layout helpers
   -------------------------------------------------------------------------- */
.container{
  max-width:var(--wrap);
  margin:0 auto;
  padding-left:var(--page-l);
  padding-right:var(--page-r);
}

.section{ padding-top:var(--space-section); }

/* Heading with the burgundy-page rule underneath it */
.section-title{
  font-size:var(--fs-h2);
  line-height:1.35;
  color:var(--ink);
  padding-bottom:16px;
  border-bottom:2px solid var(--ink);
}

.lede{
  margin-top:clamp(14px, 1.2vw, 22px);
  font-size:var(--fs-body);
  line-height:1.3;
  font-weight:400;
}