:root{
      --bg:#fbfaf7;
      --ink:#1f1f1f;
      --muted:#5a5a5a;
      --rule:rgba(0,0,0,.10);
      --card:#ffffff;
      --max:980px;
      --radius:14px;
    }
    *{box-sizing:border-box}
    body{
      margin:0;
      font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
      color:var(--ink);
      background:var(--bg);
      line-height:1.55;
    }
    a{color:inherit}
    a:hover{opacity:.8}
    .wrap{
      max-width:var(--max);
      margin:0 auto;
      padding:32px 20px 64px;
    }
    header{
      padding:18px 0 22px;
    }
    .kicker{
      font-size:.95rem;
      color:var(--muted);
      letter-spacing:.01em;
      margin:0 0 10px;
    }
    h1{
      font-size: clamp(2.2rem, 4vw, 3.2rem);
      letter-spacing:.02em;
      margin:0 0 10px;
      font-weight:650;
    }
    .lede{
      font-size:1.05rem;
      max-width:68ch;
      margin:0;
      color:var(--ink);
    }
    .rule{border:0;border-top:1px solid var(--rule); margin:28px 0}
    .hero{
      margin-top:18px;
      border-radius:var(--radius);
      overflow:hidden;
      background:var(--card);
      border:1px solid var(--rule);
    }
    figure{margin:0}
    img{
      display:block;
      width:100%;
      height:auto;
    }
    figcaption{
      font-size:.92rem;
      color:var(--muted);
      padding:12px 14px 14px;
    }
    .section-title{
      font-size:1.05rem;
      letter-spacing:.08em;
      text-transform:uppercase;
      color:var(--muted);
      margin:0 0 12px;
      font-weight:650;
    }
    .prose{
      max-width:70ch;
      font-size:1.02rem;
      margin:0;
      margin-bottom: .8rem;
    }
    .grid{
      display:grid;
      grid-template-columns: 1.1fr .9fr;
      gap:18px;
      align-items:start;
    }
    @media (max-width: 860px){
      .grid{grid-template-columns:1fr}
    }
    .card{
      background:var(--card);
      border:1px solid var(--rule);
      border-radius:var(--radius);
      overflow:hidden;
    }
    .card .pad{padding:16px 16px 18px}
    .stack{display:flex; flex-direction:column; gap:18px}
    ul{
      margin:10px 0 0 1.1rem;
      padding:0;
    }
	ul li {
		margin-left:2rem;
	}
    .meta{
      display:grid;
      grid-template-columns: 1fr 1fr;
      gap:14px;
      margin-top:10px;
    }
    @media (max-width: 560px){
      .meta{grid-template-columns:1fr}
    }
    .meta div{
      padding:14px 14px 14px;
      border:1px solid var(--rule);
      border-radius:12px;
      background:rgba(255,255,255,.65);
    }
    .meta .label{
      display:block;
      font-size:.82rem;
      letter-spacing:.08em;
      text-transform:uppercase;
      color:var(--muted);
      margin-bottom:6px;
      font-weight:650;
    }
    footer{
      margin-top:42px;
      color:var(--muted);
      font-size:.95rem;
      display:flex;
      justify-content:space-between;
      gap:12px;
      flex-wrap:wrap;
      padding-top:18px;
      border-top:1px solid var(--rule);
    }
    .small{font-size:.92rem;color:var(--muted)}
    .sr-only{
      position:absolute!important;
      width:1px;height:1px;
      padding:0;margin:-1px;
      overflow:hidden;clip:rect(0,0,0,0);
      white-space:nowrap;border:0;
    }
	
	.sticky-bar{
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(251,250,247,.86);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--rule);
}

.sticky-bar .inner{
  max-width: var(--max);
  margin: 0 auto;
  padding: 10px 20px;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}

.brand{
  display: flex;
  align-items: center;
  gap: 10px;
  font-weight: 700;
  letter-spacing: .02em;
}

.brand-mark{
  height: 1.5rem;
  width: 1.5rem;
  display: inline-block;
  flex-shrink: 0;
}

.brand-name{
  white-space: nowrap;
}

.brand small{
  margin-left: 6px;
  font-weight: 600;
  color: var(--muted);
  letter-spacing: .06em;
  text-transform: uppercase;
  font-size: .72rem;
}

@media (max-width: 560px){
  .brand small{
    display: none;
  }
}

