/* ============================================================
   ederrikporter.com — foundational stylesheet
   Palette: Onyx · Ember Amber · Signal Red · Deep Crimson · Cream
   Type:    Playfair Display (display) · Montserrat (utility/body)
   ============================================================ */

/* ---- reset ---- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth}
body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-synthesis:none}
img,svg,video{display:block;max-width:100%;height:auto}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
a{color:inherit;text-decoration:none}
input,textarea,select{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--amber);outline-offset:3px}

/* ---- design tokens ---- */
:root{
  --onyx:#14110F;
  --onyx-2:#1A1613;
  --onyx-3:#221D19;
  --amber:#C9A14A;
  --amber-hi:#DBB565;
  --signal:#E24B4A;
  --crimson:#8F1F1F;
  --crimson-hi:#A82727;
  --cream:#F4EDE1;
  --cream-2:#EDE3D2;
  --ink:#2A241F;
  --ink-2:#4A413A;
  --ink-mute:#7A6F65;
  --on-onyx:#F4EDE1;
  --on-onyx-2:#B8AB94;
  --on-onyx-mute:#7F7566;

  --serif:'Playfair Display',Georgia,serif;
  --sans:'Montserrat','Helvetica Neue',Arial,sans-serif;

  --fs-hero:clamp(2.75rem,4.5vw + 1rem,5.25rem);
  --fs-h1:clamp(2rem,2.5vw + 1rem,3.25rem);
  --fs-h2:clamp(1.5rem,1.5vw + 1rem,2.25rem);
  --fs-h3:clamp(1.15rem,.6vw + 1rem,1.5rem);
  --fs-lead:clamp(1.05rem,.3vw + 1rem,1.2rem);
  --fs-body:1.0625rem;
  --fs-small:.875rem;
  --fs-micro:.75rem;
  --fs-eyebrow:.6875rem;

  --track-eyebrow:.32em;
  --track-nav:.18em;
  --track-cta:.2em;

  --gutter:clamp(1.25rem,3vw,2.5rem);
  --pad-section:clamp(4rem,7vw,7rem);
  --pad-section-tight:clamp(2.5rem,4vw,4rem);
  --max-width:1240px;
  --max-prose:640px;
  --max-narrow:820px;

  --dur:.22s;
  --ease:cubic-bezier(.22,.61,.36,1);
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}

/* ---- base ---- */
body{
  font-family:var(--sans);
  font-size:var(--fs-body);
  line-height:1.65;
  color:var(--ink);
  background:var(--cream);
}
::selection{background:var(--onyx);color:var(--amber)}

.skip{position:absolute;left:-9999px;top:0;background:var(--onyx);color:var(--cream);padding:.75rem 1rem;font-size:var(--fs-small);z-index:100}
.skip:focus{left:0}

.container{max-width:var(--max-width);margin:0 auto;padding-left:var(--gutter);padding-right:var(--gutter)}
.narrow{max-width:var(--max-narrow);margin-left:auto;margin-right:auto}
.prose{max-width:var(--max-prose);margin-left:auto;margin-right:auto}

/* ---- salt light ribbon ---- */
.ribbon{
  background:var(--onyx-2);
  color:var(--on-onyx-2);
  border-bottom:1px solid rgba(201,161,74,.15);
  font-family:var(--sans);
  font-size:var(--fs-small);
  padding:.65rem var(--gutter);
  text-align:center;
  letter-spacing:.02em;
}
.ribbon a{color:var(--amber);font-weight:500;text-decoration:none;border-bottom:1px solid transparent;transition:border-color var(--dur) var(--ease)}
.ribbon a:hover{border-bottom-color:var(--amber)}
.ribbon strong{color:var(--cream);font-weight:500}

/* ---- nav ---- */
.nav{
  background:var(--onyx);
  padding:1.15rem var(--gutter);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:2rem;
  position:sticky;
  top:0;
  z-index:50;
  border-bottom:1px solid rgba(244,237,225,.06);
}
.nav-brand{
  font-family:var(--serif);
  font-weight:700;
  font-size:1.0625rem;
  color:var(--cream);
  letter-spacing:.02em;
  white-space:nowrap;
}
.nav-brand em{font-style:normal;color:var(--amber)}
.nav-links{
  display:flex;
  gap:2rem;
  font-family:var(--sans);
  font-size:var(--fs-micro);
  letter-spacing:var(--track-nav);
  text-transform:uppercase;
  color:var(--on-onyx-2);
  font-weight:500;
}
.nav-links a{position:relative;padding:.25rem 0;transition:color var(--dur) var(--ease)}
.nav-links a:hover{color:var(--cream)}
.nav-links a.active{color:var(--amber)}
.nav-links a.active::after{content:"";position:absolute;left:0;right:0;bottom:-.35rem;height:1px;background:var(--amber)}
.nav-toggle{
  display:none;
  width:36px;height:36px;
  align-items:center;justify-content:center;
  color:var(--cream);
}
.nav-toggle span{position:relative;width:22px;height:1.5px;background:currentColor}
.nav-toggle span::before,.nav-toggle span::after{content:"";position:absolute;left:0;width:22px;height:1.5px;background:currentColor;transition:transform var(--dur) var(--ease)}
.nav-toggle span::before{top:-6px}
.nav-toggle span::after{top:6px}
.nav-toggle[aria-expanded="true"] span{background:transparent}
.nav-toggle[aria-expanded="true"] span::before{top:0;transform:rotate(45deg)}
.nav-toggle[aria-expanded="true"] span::after{top:0;transform:rotate(-45deg)}

@media (max-width:820px){
  .nav-toggle{display:flex}
  .nav-links{
    position:absolute;
    top:100%;left:0;right:0;
    background:var(--onyx);
    flex-direction:column;
    gap:0;
    padding:1rem var(--gutter) 1.5rem;
    border-bottom:1px solid rgba(244,237,225,.06);
    transform:translateY(-8px);
    opacity:0;pointer-events:none;
    transition:transform var(--dur) var(--ease),opacity var(--dur) var(--ease);
  }
  .nav-links[data-open="true"]{transform:translateY(0);opacity:1;pointer-events:auto}
  .nav-links a{padding:.85rem 0;border-top:1px solid rgba(244,237,225,.06)}
  .nav-links a.active::after{display:none}
}

/* ---- sections ---- */
.section{padding:var(--pad-section) var(--gutter);position:relative}
.section--tight{padding:var(--pad-section-tight) var(--gutter)}
.section--onyx{background:var(--onyx);color:var(--on-onyx)}
.section--onyx-2{background:var(--onyx-2);color:var(--on-onyx)}
.section--cream{background:var(--cream);color:var(--ink)}
.section--cream-2{background:var(--cream-2);color:var(--ink)}

.golden-thread{
  position:absolute;top:0;left:50%;
  width:1px;height:100%;
  background:linear-gradient(to bottom,transparent,rgba(201,161,74,.28) 15%,rgba(201,161,74,.28) 85%,transparent);
  pointer-events:none;
}

/* ---- typography components ---- */
.eyebrow{
  font-family:var(--sans);
  font-size:var(--fs-eyebrow);
  font-weight:500;
  letter-spacing:var(--track-eyebrow);
  text-transform:uppercase;
  color:var(--amber);
  margin-bottom:1.25rem;
  display:inline-block;
}
.section--cream .eyebrow{color:var(--crimson)}

.display{
  font-family:var(--serif);
  font-weight:900;
  font-size:var(--fs-hero);
  line-height:1.02;
  letter-spacing:-.02em;
}
h1,.h1{font-family:var(--serif);font-weight:900;font-size:var(--fs-h1);line-height:1.08;letter-spacing:-.015em}
h2,.h2{font-family:var(--serif);font-weight:700;font-size:var(--fs-h2);line-height:1.15;letter-spacing:-.008em}
h3,.h3{font-family:var(--serif);font-weight:700;font-size:var(--fs-h3);line-height:1.25;letter-spacing:-.004em}
.lead{font-size:var(--fs-lead);line-height:1.6;font-weight:300}
.prose-body p{margin-bottom:1.15em;line-height:1.85}
.prose-body p:last-child{margin-bottom:0}
.prose-body em{font-family:var(--serif);font-style:italic;font-weight:400}

.rule-amber{width:52px;height:1px;background:var(--amber);border:0;margin:0 auto}
.rule-amber--left{margin-left:0}

.tri-beat{
  font-family:var(--sans);
  font-size:var(--fs-eyebrow);
  letter-spacing:var(--track-eyebrow);
  text-transform:uppercase;
  color:var(--amber);
  font-weight:500;
}

/* ---- hero ---- */
.hero{
  padding:clamp(4.5rem,8vw,8rem) var(--gutter) clamp(4.5rem,8vw,8rem);
  text-align:center;
  position:relative;
  overflow:hidden;
}
.hero--onyx{background:var(--onyx);color:var(--on-onyx)}
.hero--cream{background:var(--cream);color:var(--ink)}
.hero-inner{max-width:900px;margin:0 auto;position:relative;z-index:2}
.hero .display{color:var(--cream);margin-bottom:1.35rem}
.hero--cream .display{color:var(--onyx)}
.hero .lead{color:var(--on-onyx-2);max-width:560px;margin:0 auto 2.25rem}
.hero--cream .lead{color:var(--ink-2)}
.hero .rule-amber{margin-bottom:2.25rem}

/* ---- CTA / buttons ---- */
.cta{
  display:inline-block;
  font-family:var(--sans);
  font-size:var(--fs-micro);
  letter-spacing:var(--track-cta);
  text-transform:uppercase;
  font-weight:600;
  padding:1rem 2.1rem;
  border-radius:2px;
  background:var(--crimson);
  color:var(--cream);
  transition:background var(--dur) var(--ease),transform var(--dur) var(--ease);
  border:0;
  cursor:pointer;
}
.cta:hover{background:var(--signal)}
.cta:active{transform:translateY(1px)}
.cta--ghost{background:transparent;color:var(--cream);border:1px solid rgba(244,237,225,.25)}
.cta--ghost:hover{background:rgba(244,237,225,.06);border-color:var(--amber);color:var(--amber)}
.cta--amber{background:var(--amber);color:var(--onyx)}
.cta--amber:hover{background:var(--amber-hi)}
.section--cream .cta--ghost{color:var(--onyx);border-color:rgba(20,17,15,.2)}
.section--cream .cta--ghost:hover{background:rgba(20,17,15,.04);border-color:var(--crimson);color:var(--crimson)}

.text-link{
  color:var(--crimson);
  border-bottom:1px solid currentColor;
  font-weight:500;
  transition:color var(--dur) var(--ease);
}
.text-link:hover{color:var(--signal)}
.section--onyx .text-link{color:var(--amber);border-bottom-color:currentColor}
.section--onyx .text-link:hover{color:var(--amber-hi)}

/* ---- three doorways grid ---- */
.doorways{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:1.5rem;
  margin-top:3rem;
}
.doorway{
  background:var(--onyx);
  color:var(--on-onyx);
  padding:2.5rem 2rem 2.25rem;
  border-radius:4px;
  display:flex;
  flex-direction:column;
  gap:1rem;
  transition:transform var(--dur) var(--ease),background var(--dur) var(--ease);
  position:relative;
  overflow:hidden;
}
.doorway::before{
  content:"";position:absolute;top:0;left:0;
  width:100%;height:2px;background:var(--amber);
  transform:scaleX(.15);transform-origin:left;
  transition:transform var(--dur) var(--ease);
}
.doorway:hover{background:var(--onyx-2);transform:translateY(-3px)}
.doorway:hover::before{transform:scaleX(1)}
.doorway-eyebrow{
  font-family:var(--sans);
  font-size:var(--fs-eyebrow);
  letter-spacing:var(--track-eyebrow);
  text-transform:uppercase;
  color:var(--amber);
  font-weight:500;
}
.doorway h3{color:var(--cream)}
.doorway p{color:var(--on-onyx-2);font-size:var(--fs-body);line-height:1.7;flex-grow:1}
.doorway .arrow{
  font-family:var(--sans);
  font-size:var(--fs-micro);
  letter-spacing:var(--track-cta);
  text-transform:uppercase;
  color:var(--amber);
  font-weight:600;
  margin-top:.5rem;
  transition:transform var(--dur) var(--ease);
  display:inline-block;
}
.doorway:hover .arrow{transform:translateX(4px)}

/* ---- three tiers cards (threshold) ---- */
.tiers{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:1.25rem;
  margin-top:3rem;
}
.tier{
  background:var(--onyx);
  color:var(--on-onyx);
  padding:2.5rem 2rem;
  border-radius:4px;
  display:flex;
  flex-direction:column;
  gap:1rem;
  border-top:3px solid var(--amber);
}
.tier-name{font-family:var(--serif);font-weight:700;font-size:1.5rem;color:var(--cream);letter-spacing:-.005em}
.tier-role{font-family:var(--sans);font-size:var(--fs-eyebrow);letter-spacing:var(--track-eyebrow);text-transform:uppercase;color:var(--amber);font-weight:500}
.tier p{color:var(--on-onyx-2);line-height:1.7}
.tier-note{font-family:var(--sans);font-size:var(--fs-small);color:var(--on-onyx-mute);font-style:italic;padding-top:.75rem;border-top:1px solid rgba(244,237,225,.08)}

/* ---- credentials strip (about) ---- */
.credentials{
  background:var(--onyx);
  color:var(--on-onyx);
  border-radius:4px;
  padding:2rem 2.25rem;
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:1.5rem 2rem;
  margin-top:2.5rem;
}
.credential{display:flex;flex-direction:column;gap:.35rem}
.credential-degree{font-family:var(--sans);font-size:var(--fs-eyebrow);letter-spacing:var(--track-eyebrow);text-transform:uppercase;color:var(--amber);font-weight:600}
.credential-inst{font-family:var(--serif);font-size:1.0625rem;color:var(--cream);font-weight:400;line-height:1.35}
.credential-year{font-family:var(--sans);font-size:var(--fs-small);color:var(--on-onyx-mute)}

/* ---- signature topics list ---- */
.topics{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:.5rem 2rem;
  list-style:none;
  margin-top:2rem;
}
.topics li{
  font-family:var(--serif);
  font-size:1.15rem;
  line-height:1.4;
  padding:1rem 0;
  border-bottom:1px solid rgba(20,17,15,.08);
  color:var(--onyx);
}
.topics li::before{content:"— ";color:var(--crimson);margin-right:.35rem}
.section--onyx .topics li{color:var(--cream);border-bottom-color:rgba(244,237,225,.08)}
.section--onyx .topics li::before{color:var(--amber)}

/* ---- essay grid ---- */
.essays{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:1.5rem;
  margin-top:3rem;
}
.essay{
  padding:2rem 1.75rem;
  background:var(--cream-2);
  border-radius:4px;
  display:flex;
  flex-direction:column;
  gap:.85rem;
  transition:transform var(--dur) var(--ease);
  border-left:2px solid var(--amber);
}
.essay:hover{transform:translateY(-3px)}
.essay-date{font-family:var(--sans);font-size:var(--fs-eyebrow);letter-spacing:var(--track-eyebrow);text-transform:uppercase;color:var(--crimson);font-weight:600}
.essay-title{font-family:var(--serif);font-weight:700;font-size:1.35rem;line-height:1.2;color:var(--onyx);letter-spacing:-.005em}
.essay-excerpt{font-size:var(--fs-small);line-height:1.65;color:var(--ink-2)}
.essay-more{font-family:var(--sans);font-size:var(--fs-micro);letter-spacing:var(--track-cta);text-transform:uppercase;color:var(--crimson);font-weight:600;margin-top:.5rem}

/* ---- book feature ---- */
.book{
  display:grid;
  grid-template-columns:1fr 2fr;
  gap:3rem;
  align-items:center;
  margin-top:2.5rem;
}
@media (max-width:640px){.book{grid-template-columns:1fr}}
.book-cover{
  aspect-ratio:2/3;
  background:linear-gradient(140deg,var(--onyx) 0%,var(--onyx-3) 100%);
  border-radius:4px;
  padding:2.5rem 2rem;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  color:var(--cream);
  position:relative;
  overflow:hidden;
  box-shadow:0 30px 60px -25px rgba(20,17,15,.4),0 8px 20px -8px rgba(20,17,15,.2);
}
.book-cover::before{
  content:"";position:absolute;top:12%;left:0;right:0;height:1px;background:var(--amber)
}
.book-cover::after{
  content:"";position:absolute;bottom:12%;left:0;right:0;height:1px;background:var(--amber)
}
.book-cover-eyebrow{font-family:var(--sans);font-size:var(--fs-eyebrow);letter-spacing:var(--track-eyebrow);text-transform:uppercase;color:var(--amber);font-weight:500}
.book-cover-title{font-family:var(--serif);font-weight:900;font-size:clamp(1.5rem,2.5vw,2.25rem);line-height:1;letter-spacing:-.01em}
.book-cover-sub{font-family:var(--serif);font-style:italic;font-weight:400;font-size:.95rem;color:var(--on-onyx-2);line-height:1.3}
.book-cover-author{font-family:var(--sans);font-size:var(--fs-small);letter-spacing:.1em;text-transform:uppercase;color:var(--amber);font-weight:500}
.book-body h2{margin-bottom:1rem}
.book-body p{margin-bottom:1.15em;line-height:1.75;color:var(--ink-2)}
.book-body .cta-row{margin-top:1.5rem;display:flex;gap:1rem;flex-wrap:wrap}

/* ---- capture form ---- */
.capture{
  max-width:520px;
  margin:2rem auto 0;
  display:flex;
  gap:.65rem;
  flex-wrap:wrap;
}
.capture input[type="email"]{
  flex:1 1 260px;
  font-family:var(--sans);
  font-size:var(--fs-body);
  padding:1rem 1.15rem;
  border:1px solid rgba(244,237,225,.25);
  border-radius:2px;
  background:rgba(244,237,225,.04);
  color:var(--cream);
  transition:border-color var(--dur) var(--ease),background var(--dur) var(--ease);
}
.capture input[type="email"]::placeholder{color:rgba(244,237,225,.4)}
.capture input[type="email"]:focus{outline:0;border-color:var(--amber);background:rgba(244,237,225,.07)}
.section--cream .capture input[type="email"]{
  background:rgba(20,17,15,.03);border-color:rgba(20,17,15,.15);color:var(--onyx);
}
.section--cream .capture input[type="email"]::placeholder{color:rgba(20,17,15,.4)}
.section--cream .capture input[type="email"]:focus{border-color:var(--crimson);background:rgba(20,17,15,.05)}
.capture-msg{
  font-family:var(--sans);
  font-size:var(--fs-small);
  min-height:1.25rem;
  margin-top:1rem;
  text-align:center;
  width:100%;
}
.capture-msg.err{color:#E6A3A3}
.capture-msg.ok{color:var(--amber)}
.section--cream .capture-msg.ok{color:var(--crimson)}
.capture-note{
  font-family:var(--sans);
  font-size:var(--fs-micro);
  color:var(--on-onyx-mute);
  text-align:center;
  margin-top:1.25rem;
  letter-spacing:.02em;
}
.section--cream .capture-note{color:var(--ink-mute)}
.hp{position:absolute;left:-9999px}

/* ---- salt light feature (home) ---- */
.saltlight{
  display:grid;
  grid-template-columns:1fr 1.4fr;
  gap:3rem;
  align-items:center;
}
@media (max-width:820px){.saltlight{grid-template-columns:1fr;gap:1.5rem}}
.saltlight-dates{
  font-family:var(--serif);
  font-weight:900;
  font-size:clamp(2.5rem,5vw,4.5rem);
  line-height:1;
  color:var(--amber);
  letter-spacing:-.02em;
}
.saltlight-dates span{display:block;font-family:var(--sans);font-size:var(--fs-eyebrow);letter-spacing:var(--track-eyebrow);text-transform:uppercase;color:var(--on-onyx-2);font-weight:500;margin-top:.75rem}
.saltlight h2{color:var(--cream);margin-bottom:1rem}
.saltlight p{color:var(--on-onyx-2);line-height:1.7;margin-bottom:1.25rem}

/* ---- north star band ---- */
.north-star{
  padding:clamp(5rem,8vw,8rem) var(--gutter);
  text-align:center;
  background:var(--cream);
  position:relative;
}
.north-star-quote{
  font-family:var(--serif);
  font-weight:700;
  font-size:clamp(1.75rem,3vw,2.75rem);
  line-height:1.2;
  color:var(--onyx);
  letter-spacing:-.01em;
  max-width:820px;
  margin:0 auto;
}
.north-star-quote span{color:var(--crimson)}
.north-star-attr{
  font-family:var(--sans);
  font-size:var(--fs-eyebrow);
  letter-spacing:var(--track-eyebrow);
  text-transform:uppercase;
  color:var(--ink-mute);
  font-weight:500;
  margin-top:2rem;
}

/* ---- benediction ---- */
.benediction{
  text-align:center;
  padding:clamp(4rem,7vw,7rem) var(--gutter);
}
.benediction-body{
  font-family:var(--serif);
  font-weight:400;
  font-style:italic;
  font-size:clamp(1.5rem,2.6vw,2.25rem);
  line-height:1.35;
  color:var(--cream);
  max-width:720px;
  margin:0 auto 2rem;
}
.benediction-sign{
  font-family:var(--sans);
  font-size:var(--fs-eyebrow);
  letter-spacing:var(--track-eyebrow);
  text-transform:uppercase;
  color:var(--amber);
  font-weight:500;
}

/* ---- footer ---- */
.footer{
  background:var(--onyx-2);
  color:var(--on-onyx-2);
  padding:3.5rem var(--gutter) 2rem;
  border-top:1px solid rgba(244,237,225,.06);
}
.footer-grid{
  display:grid;
  grid-template-columns:1.5fr 1fr 1fr;
  gap:3rem;
  max-width:var(--max-width);
  margin:0 auto;
}
@media (max-width:640px){.footer-grid{grid-template-columns:1fr;gap:2rem}}
.footer-brand .nav-brand{font-size:1.25rem;display:block;margin-bottom:1rem}
.footer-tag{font-family:var(--sans);font-size:var(--fs-eyebrow);letter-spacing:var(--track-eyebrow);text-transform:uppercase;color:var(--amber);font-weight:500;margin-bottom:1rem}
.footer p{font-size:var(--fs-small);line-height:1.6;color:var(--on-onyx-2)}
.footer-col h4{font-family:var(--sans);font-size:var(--fs-eyebrow);letter-spacing:var(--track-eyebrow);text-transform:uppercase;color:var(--amber);font-weight:600;margin-bottom:1rem}
.footer-col ul{list-style:none;display:flex;flex-direction:column;gap:.55rem}
.footer-col a{color:var(--on-onyx-2);font-size:var(--fs-small);transition:color var(--dur) var(--ease)}
.footer-col a:hover{color:var(--cream)}
.footer-bottom{
  max-width:var(--max-width);margin:2.5rem auto 0;
  padding-top:1.5rem;
  border-top:1px solid rgba(244,237,225,.06);
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem;
  font-family:var(--sans);font-size:var(--fs-micro);color:var(--on-onyx-mute);
}
.footer-bottom .benediction-mini{color:var(--amber);font-style:italic;font-family:var(--serif);font-size:var(--fs-small)}

/* ---- utilities ---- */
.center{text-align:center}
.mt-2{margin-top:2rem}
.mt-3{margin-top:3rem}
.mt-4{margin-top:4rem}
.mb-1{margin-bottom:1rem}
.mb-2{margin-bottom:2rem}
.pt-0{padding-top:0}

/* ---- page header (non-home hero variant) ---- */
.page-header{
  background:var(--cream);
  padding:clamp(4rem,6vw,6rem) var(--gutter) clamp(3rem,4vw,4rem);
  text-align:center;
  border-bottom:1px solid rgba(20,17,15,.06);
}
.page-header .eyebrow{color:var(--crimson)}
.page-header h1{color:var(--onyx);margin-bottom:1rem}
.page-header .lead{color:var(--ink-2);max-width:600px;margin:0 auto}