*{box-sizing:border-box}body{margin:0;background:#faf8f3;color:#26352e;font:17px/1.7 Georgia,"Times New Roman",serif}a{color:inherit;text-decoration:none}header,main,footer{width:min(1120px,calc(100% - 56px));margin:auto}header{display:flex;align-items:center;justify-content:space-between;padding:32px 0;border-bottom:1px solid #dddcd2}.brand{font-size:26px;line-height:1.2}.brand span{display:block;margin-top:7px;font:11px/1.5 system-ui,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#6c766c}nav,footer{font:13px/1.7 system-ui,sans-serif}nav a:hover,footer a:hover{text-decoration:underline}main{padding:74px 0}.eyebrow,.category{font:11px/1.6 system-ui,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#72836b}h1{font-weight:400;font-size:clamp(34px,4.6vw,60px);line-height:1.16;letter-spacing:-.035em;margin:20px 0 27px}.intro{max-width:660px;color:#637064;font-size:20px;line-height:1.65}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:34px;margin-top:64px}h2{font-size:26px;line-height:1.3;font-weight:400;margin:10px 0 16px}article p:last-child{font-size:16px;color:#687266}.category{margin-top:22px}.landscape{height:200px;border-radius:2px;background-color:#ccd6c8;position:relative;overflow:hidden}.landscape:after{content:"";position:absolute;inset:45% -10% -30%;border-radius:48% 55% 0 0;transform:rotate(-12deg)}.water{background:linear-gradient(#dce4dc 0 47%,#99b6b3 48% 74%,#cbd4bd 75%)}.water:after{background:#718979;inset:72% -10% -30%;transform:rotate(8deg)}.hills{background:#dbe0c8}.hills:after{background:#8d9e76;box-shadow:60px -16px 0 #b1bb91}.city{background:linear-gradient(90deg,#cec4af 0 27%,#e6dfcc 27% 38%,#b5b4a1 38% 72%,#dcd3bf 72%)}.city:after{border-radius:0;background:#8b9380;inset:74% 0 0;transform:none}aside{border-top:1px solid #dddcd2;margin-top:60px;padding-top:30px;max-width:750px}aside p{color:#687266}footer{display:flex;justify-content:space-between;border-top:1px solid #dddcd2;padding:26px 0 34px;color:#778173}.reading{max-width:840px;min-height:70vh}.reading>p:not(.eyebrow){max-width:680px}@media(max-width:720px){header,main,footer{width:calc(100% - 36px)}header{padding:24px 0}.brand{font-size:23px}main{padding:46px 0}.grid{grid-template-columns:1fr;gap:22px;margin-top:40px}.landscape{height:210px}.intro{font-size:18px}h1 br{display:none}}