:root { --ink:#182521; --paper:#f3f0e8; --lime:#c5e95e; --line:rgba(24,37,33,.25); --serif:'Playfair Display', Georgia, serif; --sans:'DM Sans', sans-serif; --mono:'DM Mono', monospace; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:var(--sans); }
a { color:inherit; text-decoration:none; }
.site-header { height:82px; display:flex; align-items:center; justify-content:space-between; padding:0 5.5vw; border-bottom:1px solid var(--line); position:relative; z-index:3; }
.wordmark { font:600 29px/1 var(--serif); letter-spacing:-1.5px; } .wordmark span { color:#81a92d; }
.navigation { display:flex; gap:20px; font:11px var(--mono); text-transform:uppercase; }.navigation a:hover,.text-link:hover { text-decoration:underline; text-underline-offset:4px; }
.menu-button { display:none; border:0; background:none; color:var(--ink); font:12px var(--mono); text-transform:uppercase; }
.hero { min-height:650px; padding:80px 12vw 65px; position:relative; overflow:hidden; border-bottom:1px solid var(--line); }
.eyebrow,.post-meta,.section-number,.post-count { margin:0; font:11px/1.4 var(--mono); text-transform:uppercase; letter-spacing:.04em; }
.hero h1 { position:relative; z-index:1; margin:38px 0 48px; max-width:840px; font:500 clamp(66px,10vw,145px)/.89 var(--serif); letter-spacing:-.075em; }
em { font-weight:500; }.hero h1 em { color:#5b7625; }
.hero-footer { display:flex; align-items:flex-end; justify-content:space-between; max-width:780px; position:relative; z-index:1; }.hero-footer p { margin:0; font-size:15px; line-height:1.5; }.scroll-link { font:11px var(--mono); text-transform:uppercase; }.scroll-link span { font-size:20px; margin-left:8px; vertical-align:-2px; }
.sun { background:var(--lime); border-radius:50%; width:min(37vw,520px); aspect-ratio:1; position:absolute; right:-8vw; top:47px; }.side-note { position:absolute; right:7vw; bottom:52px; font:11px/1.5 var(--mono); text-transform:uppercase; }
.intro { padding:118px 12vw 132px; display:grid; grid-template-columns:1fr 2.1fr; }.intro-copy { max-width:790px; margin:0; font:500 clamp(30px,4.2vw,57px)/1.06 var(--serif); letter-spacing:-.05em; }.intro-copy em { color:#5b7625; }
.featured,.journal { padding:0 5.5vw 130px; }.section-heading { display:flex; justify-content:space-between; padding-bottom:18px; border-bottom:1px solid var(--ink); margin-bottom:24px; }.section-heading a { font:11px var(--mono); text-transform:uppercase; }.section-heading a span { margin-left:5px; }
.feature-card { display:grid; grid-template-columns:1.08fr 1fr; min-height:475px; background:#d8d5cb; }.feature-image { min-height:400px; background-size:cover; background-position:center; }.image-museum { background-image:linear-gradient(0deg,rgba(16,23,19,.1),rgba(16,23,19,.1)),url('https://images.unsplash.com/photo-1564399579883-451a5d44ec08?auto=format&fit=crop&w=1200&q=85'); }
.recent-feed { padding:0 5.5vw 130px; }.recent-layout { display:grid; grid-template-columns:1.12fr .88fr; border-top:1px solid var(--line); }.latest-post { background:#d8d5cb; display:block; min-height:610px; }.latest-post .feature-image { min-height:330px; }.latest-copy { padding:35px 40px 37px; }.latest-copy h2 { margin:20px 0 15px; font:500 clamp(35px,4vw,57px)/.98 var(--serif); letter-spacing:-.06em; }.latest-copy h2 em { color:#5b7625; }.latest-copy > p:not(.post-meta) { margin:0 0 24px; font-size:15px; }.type-pill { padding:3px 6px; margin-right:7px; border:1px solid var(--ink); font-size:9px; }.text-link b { font-size:19px; margin-left:6px; vertical-align:-2px; }.recent-list { border-left:1px solid var(--line); }.recent-item { min-height:122px; padding:21px 26px; display:grid; grid-template-columns:1fr 18px; column-gap:12px; border-bottom:1px solid var(--line); transition:background .18s; }.recent-item:first-child { border-top:0; }.recent-item:hover { background:var(--lime); }.recent-item .post-meta { grid-column:1/-1; margin-bottom:13px; }.recent-item h3 { margin:0; font:500 clamp(19px,2vw,28px)/1.02 var(--serif); letter-spacing:-.045em; }.recent-item > span { align-self:end; font-size:19px; }
.feature-content { padding:56px clamp(25px,5vw,75px); display:flex; flex-direction:column; align-items:flex-start; }.feature-content h2,.shelf h2,.newsletter h2 { margin:29px 0 23px; font:500 clamp(35px,4vw,59px)/.98 var(--serif); letter-spacing:-.055em; }.feature-content h2 em,.shelf h2 em,.newsletter h2 em { color:#5b7625; }.excerpt { margin:0 0 31px; max-width:350px; font-size:15px; line-height:1.5; }.text-link { margin-top:auto; font:11px var(--mono); text-transform:uppercase; }.text-link span { font-size:19px; margin-left:5px; vertical-align:-2px; }
.journal { padding-bottom:145px; }.post-list { border-top:1px solid var(--line); }.post-row { display:grid; grid-template-columns:230px 1fr 25px; align-items:center; gap:20px; padding:27px 0; border-bottom:1px solid var(--line); cursor:pointer; }.post-row:hover h3 { color:#5b7625; }.post-row h3 { transition:color .15s; margin:0; font:500 clamp(23px,2.7vw,38px)/1 var(--serif); letter-spacing:-.045em; }.arrow { font-size:20px; }
.shelf { padding:125px 5.5vw 140px; background:var(--ink); color:var(--paper); display:grid; grid-template-columns:.75fr 1.45fr; gap:8vw; }.shelf-title { max-width:315px; }.shelf h2 { margin-top:32px; }.shelf h2 em { color:var(--lime); }.shelf-title > p:last-child { font-size:14px; line-height:1.55; color:#cdd3c6; }.shelf-grid { display:grid; grid-template-columns:repeat(3,1fr); align-items:end; gap:15px; }.shelf-item { min-height:315px; padding:18px; display:flex; flex-direction:column; justify-content:space-between; transition:transform .2s; }.shelf-item:hover { transform:translateY(-7px); }.shelf-item span { font:10px var(--mono); }.shelf-item strong { font:500 24px/1.04 var(--serif); letter-spacing:-.04em; }.book { background:#bb462d; color:#ffe8bd; }.film { background:#b8cbda; color:#15212e; }.read { background:#d5e76a; color:#1e3022; }
.newsletter { padding:130px 12vw 140px; text-align:center; }.newsletter h2 { margin:25px 0 18px; font-size:clamp(56px,8vw,105px); }.newsletter > p:not(.eyebrow):not(.form-message) { margin:0 auto 33px; max-width:400px; font-size:15px; line-height:1.55; }.signup-form { display:flex; max-width:455px; margin:auto; border-bottom:1px solid var(--ink); }.signup-form input { flex:1; background:transparent; border:0; padding:14px 0; outline:none; font:14px var(--sans); color:var(--ink); }.signup-form button { border:0; background:transparent; color:var(--ink); cursor:pointer; font:11px var(--mono); text-transform:uppercase; }.signup-form button span { font-size:18px; margin-left:6px; }.form-message { min-height:18px; margin-top:14px; font:11px var(--mono); text-transform:uppercase; color:#5b7625; }
footer { padding:37px 5.5vw; border-top:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; }footer p { margin:0; font:10px/1.5 var(--mono); text-transform:uppercase; }
.page-hero { min-height:445px; padding:78px 12vw 72px; border-bottom:1px solid var(--line); background:#e4e0d6; }.page-hero h1 { margin:28px 0 24px; max-width:820px; font:500 clamp(58px,9vw,124px)/.9 var(--serif); letter-spacing:-.07em; }.page-hero h1 em { color:#5b7625; }.page-hero > p:last-child { max-width:400px; margin:0; font-size:15px; line-height:1.5; }.category-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--ink); border:1px solid var(--ink); }.category-card { min-height:350px; padding:30px 5.5vw; display:flex; flex-direction:column; background:var(--paper); transition:background .2s; }.category-card:hover { background:var(--lime); }.category-card span,.category-card b { font:11px var(--mono); }.category-card h2 { margin:auto 0 12px; font:500 clamp(46px,6vw,85px)/.9 var(--serif); letter-spacing:-.07em; }.category-card p { max-width:250px; margin:0 0 27px; font-size:14px; line-height:1.45; }.category-card b { text-transform:uppercase; font-weight:400; }.video-list,.review-list { padding:85px 12vw 130px; }.video-feature { display:grid; grid-template-columns:1.15fr .85fr; min-height:390px; background:#d7ddd2; }.video-still { background:linear-gradient(120deg,rgba(24,37,33,.05),rgba(24,37,33,.35)),url('https://images.unsplash.com/photo-1518005020951-eccb494ad742?auto=format&fit=crop&w=1200&q=85') center/cover; display:grid; place-items:center; }.video-still span { width:67px; height:67px; border:1px solid var(--paper); border-radius:50%; display:grid; place-items:center; color:var(--paper); padding-left:4px; }.video-feature > div:last-child { padding:48px; display:flex; flex-direction:column; align-items:flex-start; }.video-feature h2 { margin:26px 0 18px; font:500 clamp(30px,3.5vw,48px)/1 var(--serif); letter-spacing:-.05em; }.video-feature p:not(.post-meta) { font-size:15px; line-height:1.5; }.video-row { display:grid; grid-template-columns:170px 1fr 20px; gap:20px; padding:25px 0; border-bottom:1px solid var(--line); }.video-row h3 { margin:0; font:500 30px/1 var(--serif); letter-spacing:-.05em; }.review-list { max-width:1020px; }.review-list article { padding:33px 0 44px; border-bottom:1px solid var(--line); }.review-list h2 { margin:22px 0 18px; font:500 clamp(35px,4vw,56px)/.98 var(--serif); letter-spacing:-.06em; }.review-list h2 em { color:#5b7625; }.review-list article > p:not(.post-meta) { max-width:570px; margin:0 0 26px; font-size:15px; line-height:1.55; }
.dynamic-feed { padding:85px 12vw 130px; max-width:1100px; }.dynamic-post { display:grid; grid-template-columns:minmax(220px,.65fr) 1fr; gap:35px; padding:32px 0; border-bottom:1px solid var(--line); }.dynamic-post img,.youtube { width:100%; aspect-ratio:16/10; object-fit:cover; background:#d8d5cb; }.youtube iframe { width:100%; height:100%; border:0; }.dynamic-post h2,.empty-media h2 { margin:17px 0 14px; font:500 clamp(33px,4vw,54px)/.98 var(--serif); letter-spacing:-.06em; }.dynamic-post > div:last-child > p:not(.post-meta) { margin:0 0 21px; font-size:15px; line-height:1.5; }.empty-media { padding:80px 0; text-align:center; }.empty-media h2 em { color:#5b7625; }.empty-media > p:last-child { font-size:15px; }.owner-page { min-height:100vh; background:var(--ink); color:var(--paper); }.owner-page main { max-width:700px; padding:14vh 12vw; }.owner-page h1 { margin:30px 0 18px; font:500 clamp(64px,9vw,120px)/.9 var(--serif); letter-spacing:-.07em; }.owner-page h1 em { color:var(--lime); }.owner-page main > p:not(.eyebrow):not(.owner-note) { max-width:390px; font-size:16px; line-height:1.5; }.owner-login { margin:25px 0 18px; padding:14px 22px; background:var(--lime); border:0; color:var(--ink); cursor:pointer; font:12px var(--mono); text-transform:uppercase; }.owner-note { font:11px var(--mono); text-transform:uppercase; color:#cdd3c6; }
.back-link { font:11px var(--mono); text-transform:uppercase; }.full-post { max-width:780px; margin:0 auto; padding:100px 7vw 130px; }.full-post h1 { margin:24px 0 20px; font:500 clamp(54px,8vw,100px)/.92 var(--serif); letter-spacing:-.07em; }.full-post .lead { max-width:570px; margin:0 0 38px; font:20px/1.45 var(--serif); }.full-post > img,.post-video { display:block; width:100%; max-height:620px; margin:42px 0; object-fit:cover; }.post-video { aspect-ratio:16/9; }.post-video iframe { width:100%; height:100%; border:0; }.post-body { max-width:650px; font:18px/1.65 var(--serif); }.post-body p { margin:0 0 24px; }
.sr-only { clip:rect(0,0,0,0); clip-path:inset(50%); height:1px; overflow:hidden; position:absolute; white-space:nowrap; width:1px; }
@media (max-width:700px) { .site-header{height:67px;padding:0 6vw}.navigation{display:none}.navigation.is-open{display:flex;position:absolute;top:66px;left:0;right:0;padding:22px 6vw;background:var(--paper);border-bottom:1px solid var(--line);flex-direction:column;gap:17px}.menu-button{display:block}.hero{min-height:560px;padding:65px 7vw 43px}.hero h1{font-size:clamp(57px,17vw,86px);margin:29px 0 65px}.sun{width:300px;right:-120px;top:140px;opacity:.9}.hero-footer{align-items:flex-start;flex-direction:column;gap:31px}.side-note{display:none}.intro{padding:78px 7vw 90px;grid-template-columns:1fr;gap:25px}.intro-copy{font-size:37px}.featured,.journal,.recent-feed{padding:0 6vw 82px}.feature-card{grid-template-columns:1fr}.feature-image{min-height:290px}.feature-content{padding:35px 26px;min-height:370px}.feature-content h2{font-size:40px}.recent-layout{grid-template-columns:1fr}.latest-post{min-height:0}.latest-post .feature-image{min-height:270px}.latest-copy{padding:29px 25px}.latest-copy h2{font-size:40px}.recent-list{border-left:0}.recent-item{padding:20px 18px}.post-row{grid-template-columns:1fr 20px;gap:10px;padding:23px 0}.post-row .post-meta{grid-column:1/-1}.post-row h3{font-size:28px}.shelf{padding:77px 6vw 85px;grid-template-columns:1fr;gap:40px}.shelf-grid{grid-template-columns:1fr;gap:12px}.shelf-item{min-height:175px}.newsletter{padding:85px 7vw}.newsletter h2{font-size:64px}footer{padding:28px 6vw;align-items:flex-end}footer p:nth-of-type(1){display:none} }
@media (max-width:700px) { .page-hero{min-height:400px;padding:63px 7vw}.page-hero h1{font-size:clamp(54px,15vw,76px)}.category-grid{grid-template-columns:1fr}.category-card{min-height:265px;padding:28px 7vw}.category-card h2{font-size:59px}.video-list,.review-list{padding:55px 7vw 85px}.video-feature{grid-template-columns:1fr}.video-still{min-height:250px}.video-feature > div:last-child{padding:30px}.video-feature h2{font-size:37px}.video-row{grid-template-columns:1fr 20px}.video-row .post-meta{grid-column:1/-1}.video-row h3{font-size:27px}.review-list h2{font-size:40px} }