:root {
  color-scheme: dark;
  background: #080f14;
  color: #f3f2ec;
  font: 100%/1.6 Inter, "Segoe UI", Arial, sans-serif;
}
* { box-sizing: border-box; }
body, h1, h2, p { margin: 0; }
.column { width: min(44rem, calc(100% - 3rem)); margin-inline: auto; }
header { border-bottom: 1px solid #2d383d; }
.brand { display: inline-flex; padding-block: .9rem; vertical-align: middle; }
.brand img {
  display: block; width: 9rem; height: auto; aspect-ratio: 6.35; object-fit: cover;
  mix-blend-mode: screen;
}
.hero {
  padding-block: clamp(2.5rem, 7vw, 5rem);
  background: linear-gradient(90deg, #07100fce, #07100f55), url("/brand/home-forest.jpg") center 48% / cover;
}
h1 {
  color: #fff; font-size: clamp(2.6rem, 6vw, 4.5rem); line-height: 1.05;
  letter-spacing: -.045em; text-wrap: balance;
}
article { padding-block: clamp(2rem, 4vw, 3rem) 4rem; }
section + section { margin-top: 2.5rem; }
h2 { font-size: clamp(1.35rem, 3vw, 1.75rem); line-height: 1.25; letter-spacing: -.025em; }
p { margin-top: .7rem; color: #cdd4d2; font-size: 1.0625rem; }
strong { color: #f3f2ec; }
.article-links { display: flex; flex-wrap: wrap; align-items: center; gap: 1.5rem; margin-top: 2rem; }
.article-links a {
  display: inline-block; padding-block: .6rem; color: #d6ed9b;
  font-weight: 600; text-underline-offset: .25rem;
}
a:focus-visible { outline: 3px solid #d6ed9b; outline-offset: 3px; border-radius: 2px; }