/* The standalone Design page shares the quiet typography of TOP's Seeds chapter. */
.at-design {
  color: #3d342f;
  background: #faf7f1;
  font-family: var(--at-serif);
  letter-spacing: .035em;
}
.at-design *, .at-design *::before, .at-design *::after { box-sizing: border-box; }
.at-design__inner { width: min(100% - 52px, 820px); margin-inline: auto; padding: clamp(72px, 11vw, 135px) 0 clamp(110px, 15vw, 180px); }
.at-design__header { text-align: center; margin-bottom: clamp(64px, 10vw, 105px); }
.at-design__eyebrow { margin: 0 0 18px; color: #8c796b; font: 400 12px/1.6 var(--at-reference-sans, var(--at-sans)); letter-spacing: .2em; }
.at-design__header h1 { margin: 0; font: 400 clamp(42px, 9vw, 68px)/1.3 var(--at-serif); letter-spacing: .075em; }
.at-design__subtitle { margin: 35px 0 0; font: 400 clamp(19px, 3vw, 24px)/1.8 var(--at-serif); letter-spacing: .09em; }
.at-design__statement { max-width: 600px; margin-inline: auto; padding: clamp(35px, 6vw, 65px) clamp(10px, 4vw, 40px); border-top: 1px solid #d9cfc2; border-bottom: 1px solid #d9cfc2; }
.at-design__statement p { margin: 0 0 2.2em; font: 400 clamp(17px, 2.5vw, 20px)/2.15 var(--at-serif); letter-spacing: .05em; }
.at-design__statement p:last-child { margin-bottom: 0; }
.at-design__back { max-width: 600px; margin: 45px auto 0; text-align: right; }
.at-design__back a { color: #5c4b41; font: 400 14px/1.6 var(--at-reference-sans, var(--at-sans)); text-underline-offset: 5px; }
.at-design__back a:focus-visible { outline: 2px solid #956c5d; outline-offset: 4px; }
@media (max-width: 600px) {
  .at-design__inner { width: min(100% - 40px, 820px); }
  .at-design__statement { padding-inline: 5px; }
}