@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:ital,wght@0,500;0,600;1,500&display=swap');
:root{--paper:#f5f2e9;--ink:#243d34;--muted:#68746a;--line:#d4d7cb;--accent:#b95838;--soft:#e9ebdf;--serif:'Playfair Display',Georgia,serif;--sans:'DM Sans',Arial,sans-serif;color-scheme:light}
:root[data-theme=dark]{--paper:#17271f;--ink:#eeeadd;--muted:#afb8a9;--line:#405043;--accent:#e99b76;--soft:#253a2c;color-scheme:dark}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:28px}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);line-height:1.6}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}a:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:6px}.wrap{max-width:1160px;margin:auto;padding-inline:40px}.header{height:112px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.wordmark{font-weight:700;letter-spacing:-.7px;font-size:22px}.dot{font-size:10px;color:var(--accent);margin-left:9px;vertical-align:middle}nav{display:flex;gap:30px;align-items:center;font-size:13px}nav a:hover,.text-link:hover,footer a:hover{color:var(--accent)}#theme{background:none;border:1px solid var(--line);border-radius:50%;width:32px;height:32px;font-size:21px;line-height:1}.hero{padding-block:94px 102px;display:grid;grid-template-columns:1fr 280px;gap:70px;align-items:center}.eyebrow{font-size:10px;font-weight:700;letter-spacing:2px;margin:0 0 25px}h1,h2,h3,h4,p{margin-top:0}h1{font-family:var(--serif);font-weight:500;font-size:clamp(42px,5.3vw,66px);line-height:1.13;letter-spacing:-2.5px;margin-bottom:28px}.intro{font-size:16px;max-width:480px;color:var(--muted);line-height:1.9;margin-bottom:30px}.text-link{font-size:13px;font-weight:600;border-bottom:1px solid var(--ink);padding-bottom:7px}.text-link span{margin-left:28px}.note{background:var(--soft);padding:26px;transform:rotate(3deg);position:relative;min-height:330px;border:1px solid var(--line)}.note-number,.note-bottom{font-size:9px;letter-spacing:1.6px}.monogram{font-family:var(--serif);font-size:112px;letter-spacing:-12px;line-height:1.4}.monogram span{font-family:var(--sans);font-size:36px;letter-spacing:0;position:absolute;right:25px;top:65px;color:var(--accent)}.note p{font-family:var(--serif);font-style:italic;font-size:18px;line-height:1.5;margin-bottom:25px}.note-bottom{display:block;border-top:1px solid var(--line);padding-top:16px}.section{border-top:1px solid var(--ink);padding-top:22px;padding-bottom:70px}.section-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:42px}.section-top h2{font-size:15px;font-weight:600;margin:0}.section-top h2 span{color:var(--accent);font-size:10px;margin-right:18px}.section-top>p{color:var(--muted);font-size:12px;margin:0}.work-body{display:grid;grid-template-columns:1fr 1fr;gap:80px}.work-body h3,.project-copy h3{font:500 35px/1.3 var(--serif);letter-spacing:-.8px}.work-body p,.project-copy>p:not(.eyebrow){font-size:14px;color:var(--muted);max-width:380px}.pending{font-size:12px!important;color:var(--muted);border-left:2px solid var(--line);padding-left:14px}.project{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}.project-art{height:300px;position:relative;overflow:hidden;background:#d9dfce;color:#284536;display:grid;place-items:center}.project-letter{font:100px var(--serif);letter-spacing:-7px;z-index:1}.orbit{position:absolute;width:290px;height:290px;border:1px solid #92a085;border-radius:50%;transform:rotate(-32deg) scaleX(1.5)}.orbit.two{transform:rotate(32deg) scaleX(.65)}.art-caption{position:absolute;bottom:22px;left:24px;font-size:9px;letter-spacing:2px}.project-copy .eyebrow{margin-bottom:15px}.tag{display:inline-block;font-size:10px;border:1px solid var(--line);padding:5px 10px;border-radius:20px;margin-top:5px}.small-note{font-size:12px;color:var(--muted);margin:22px 0 0}.shelf-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:26px}.shelf-heading h3{font:500 28px var(--serif);margin:0}.filters{display:flex;gap:4px}.filters button{background:none;border:0;border-radius:25px;padding:7px 14px;font-size:11px}.filters button.active{background:var(--ink);color:var(--paper)}.shelves{display:grid;grid-template-columns:1fr 1fr;gap:25px}.shelf{padding:30px;border:1px solid var(--line)}.shelf-icon{font:42px var(--serif);color:var(--accent);margin-bottom:34px;height:50px}.shelf-icon.screen{font:23px var(--sans);border:2px solid var(--accent);width:66px;height:43px;border-radius:8px;text-align:center;line-height:38px;margin-top:7px}.shelf .eyebrow{font-size:9px;margin-bottom:9px}.shelf h4{font:500 28px var(--serif);margin-bottom:15px}.shelf>p:not(.eyebrow){font-size:13px;color:var(--muted);max-width:330px}.shelf[hidden]{display:none}.closing{border-top:1px solid var(--line);padding:65px 0 75px;text-align:center}.closing h2{font:500 46px/1.2 var(--serif);letter-spacing:-1px}.closing .eyebrow{color:var(--muted)}footer{border-top:1px solid var(--line);padding-block:25px;display:flex;justify-content:space-between;gap:20px;font-size:10px;color:var(--muted)}.skip{position:absolute;top:-100px;left:15px;background:var(--ink);color:var(--paper);padding:12px;z-index:2}.skip:focus{top:12px}
@media(max-width:760px){.wrap{padding-inline:24px}.header{height:90px}.wordmark{font-size:18px}nav{gap:15px;font-size:11px}.hero{padding-block:60px;grid-template-columns:1fr;gap:45px}h1{letter-spacing:-1.5px}.note{max-width:300px;justify-self:center;width:100%;min-height:310px}.section-top{align-items:flex-start;gap:20px;margin-bottom:30px}.section-top>p{text-align:right;max-width:150px}.work-body,.project{grid-template-columns:1fr;gap:20px}.work-body h3{margin-bottom:6px}.section{padding-bottom:48px}.shelf-heading{align-items:flex-start;flex-direction:column;gap:20px}.shelves{gap:15px}.shelf{padding:20px}.closing h2{font-size:38px}footer{flex-wrap:wrap}footer>span:nth-child(2){display:none}}
@media(max-width:420px){nav{gap:10px}nav a:nth-child(2){display:none}.shelves{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
