@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Playfair+Display:ital,wght@0,500;0,700;1,500;1,700&display=swap');

:root{--ink:#20201e;--paper:#f4f0e9;--pink:#f35f70;--orange:#ff9b4b;--blue:#4a81de;--green:#9fcb66;--line:#252522}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Mono',monospace}
.noise{position:fixed;inset:0;pointer-events:none;z-index:10;opacity:.06;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E")}
a{color:inherit;text-decoration:none}
header{height:76px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 clamp(20px,4vw,65px)}
.wordmark{font-size:18px;font-weight:500;letter-spacing:-1px}
.wordmark span{font-style:italic;font-family:'Playfair Display',serif;color:var(--pink);letter-spacing:-2px}
nav{display:flex;align-items:center;gap:28px;font-size:11px}
nav a:hover{text-decoration:underline}
.nav-contact{border:1px solid var(--ink);padding:10px 13px;border-radius:30px}
.nav-contact span{color:var(--pink);font-size:14px}
.hero{min-height:calc(100vh - 76px);padding:clamp(52px,9vw,128px) clamp(20px,9vw,135px) 40px;position:relative;overflow:hidden;border-bottom:1px solid var(--line)}
.eyebrow{font-size:10px;letter-spacing:.03em;margin:0;text-transform:uppercase}
.eyebrow i{display:inline-block;width:8px;height:8px;background:var(--pink);border-radius:50%;margin-right:8px}
.hero h1,.about h2,.contact h2{font:500 clamp(50px,8.7vw,136px)/.89 'Playfair Display',serif;letter-spacing:-.07em;position:relative;z-index:1;margin:clamp(65px,13vw,165px) 0 0}
.hero h1 em,.about h2 em,.contact h2 em{font-weight:500;color:var(--pink)}
.hero-bottom{display:flex;align-items:end;justify-content:space-between;gap:20px;position:relative;z-index:2;margin-top:65px}
.hero-bottom p{width:420px;font-size:12px;line-height:1.75}
.round-link{width:72px;height:72px;display:grid;place-items:center;border:1px solid var(--ink);border-radius:50%;font-size:25px;transition:.25s}
.round-link:hover{background:var(--ink);color:var(--paper);transform:translateY(4px)}
.hero-art{position:absolute;right:7%;bottom:0;width:min(44vw,600px);height:73%;background:var(--orange);border:1px solid var(--line);overflow:hidden}
.sun{position:absolute;width:45%;aspect-ratio:1;border-radius:50%;top:12%;right:16%;background:#f8db4d}
.arch{position:absolute;border:1px solid var(--line);border-radius:250px 250px 0 0}
.arch-one{width:71%;height:65%;bottom:-1px;left:8%;background:var(--blue)}
.arch-two{width:50%;height:50%;bottom:-1px;right:3%;background:var(--pink)}
.star{position:absolute;top:13%;left:11%;font-size:46px}
.ball{position:absolute;width:38px;height:38px;border-radius:50%;background:var(--paper);left:20%;top:45%;border:1px solid var(--line)}
.work,.about,.services,.experience,.contact{padding:130px clamp(20px,8vw,120px);border-bottom:1px solid var(--line)}
.section-head{display:flex;justify-content:space-between;margin-bottom:46px}
.section-head>p:last-child{font-size:11px}
.project{display:block}
.project-art{position:relative;overflow:hidden;border:1px solid var(--line)}
.featured .project-art{height:min(54vw,625px);background:var(--green)}
.farm-sun{position:absolute;right:17%;top:13%;width:25%;aspect-ratio:1;border-radius:50%;background:#f7e25d}
.hill{position:absolute;border-radius:50% 50% 0 0;bottom:-15%}
.hill-a{width:80%;height:65%;left:-10%;background:#659f56}
.hill-b{width:70%;height:53%;right:-11%;background:#356c5b}
.mini-barn{position:absolute;right:26%;bottom:18%;z-index:1;font-size:100px;color:#dd5145;text-shadow:3px 3px 0 #492f2b}
.farm-art strong{position:absolute;left:8%;top:13%;font:700 clamp(48px,8vw,118px)/.75 'Playfair Display',serif;letter-spacing:-.08em}
.farm-art small{position:absolute;bottom:8%;left:8%;font-size:10px}
.project-info{display:grid;grid-template-columns:1.1fr 1.7fr 1fr;gap:28px;padding:18px 0 54px;align-items:baseline}
.project-info h2{font:500 34px 'Playfair Display',serif;margin:0 0 7px;letter-spacing:-.05em}
.project-info p,.project-info span{font-size:10px;line-height:1.7}
.project-info>p{max-width:460px;margin:0}
.project-info span{text-align:right}
.project:hover .project-art{filter:saturate(1.2)}
.project-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px}
.project-grid .project-art{height:340px}
.type-art{background:var(--pink);padding:25px}
.type-art span{font:500 160px/.8 'Playfair Display',serif;color:var(--paper);letter-spacing:-.1em}
.type-art b{position:absolute;bottom:23px;right:22px;text-align:right;font-size:23px;line-height:.9}
.grid-art{display:grid;grid-template-columns:1fr 1fr;background:var(--blue)}
.grid-art i{border:1px solid var(--line)}
.grid-art b{position:absolute;left:25px;bottom:22px;color:var(--paper);font:500 42px/.8 'Playfair Display',serif;letter-spacing:-.07em}
.about{display:grid;grid-template-columns:1fr 2fr;gap:30px}
.about h2{font-size:clamp(48px,6vw,86px);margin:0 0 50px}
.about>div>p{max-width:620px;font-size:14px;line-height:1.8}
.service-list{margin-top:55px;border-top:1px solid var(--line)}
.service-list>div{display:grid;grid-template-columns:.4fr 1.4fr 1fr;padding:32px 0;border-bottom:1px solid var(--line);align-items:start}
.service-list span,.service-list p{font-size:10px;line-height:1.7}
.service-list h3{font:500 clamp(27px,3vw,45px)/.9 'Playfair Display',serif;letter-spacing:-.06em;margin:0}
.service-list p{margin:0;max-width:320px}
.experience-list{margin-top:55px;border-top:1px solid var(--line)}
.experience-list>div{display:grid;grid-template-columns:.8fr 2fr;gap:30px;padding:35px 0;border-bottom:1px solid var(--line)}
.experience-list span,.experience-list p{font-size:10px;line-height:1.7}
.experience-list h3{font:500 clamp(27px,3vw,42px)/.95 'Playfair Display',serif;letter-spacing:-.05em;margin:0 0 18px}
.experience-list p{max-width:650px;margin:0}
.contact{min-height:580px;background:var(--ink);color:var(--paper)}
.contact .eyebrow i{background:var(--orange)}
.contact h2{margin:75px 0 25px;font-size:clamp(54px,7vw,104px)}
.contact h2 em{color:var(--orange)}
.contact-copy{max-width:470px;font-size:12px;line-height:1.8;color:#d5d0c8}
.contact-links{display:flex;gap:35px;margin-top:35px}
.contact-links a{font:500 clamp(20px,2.7vw,38px) 'Playfair Display',serif;border-bottom:1px solid var(--paper);padding-bottom:6px}
.contact-links span{color:var(--orange)}
.edit-note{margin-top:30px!important;font-size:10px!important;color:#777;font-style:italic}
.contact .edit-note{color:#a9a49c}
footer{display:flex;align-items:center;justify-content:space-between;padding:24px clamp(20px,4vw,65px);font-size:10px}
footer .wordmark{font-size:15px}
footer a:last-child:hover{text-decoration:underline}

@media(max-width:720px){
header{height:65px}
nav{gap:13px;font-size:9px}
.hero{min-height:760px;padding-top:50px}
.hero h1{margin-top:76px;font-size:55px}
.hero-art{width:83%;height:300px;right:-6%;bottom:0;opacity:.85}
.hero-bottom{margin-top:110px}
.hero-bottom p{width:250px}
.work,.about,.services,.experience,.contact{padding:75px 20px}
.section-head{margin-bottom:28px}
.section-head>p:last-child{display:none}
.featured .project-art{height:360px}
.project-info{grid-template-columns:1fr;padding-bottom:39px;gap:8px}
.project-info span{text-align:left}
.project-grid{grid-template-columns:1fr;gap:0}
.project-grid .project-art{height:270px}
.about{grid-template-columns:1fr;gap:35px}
.about h2{margin-bottom:30px}
.service-list>div{grid-template-columns:25px 1fr;gap:15px}
.service-list p{grid-column:2}
.experience-list>div{grid-template-columns:1fr;gap:12px}
.contact{min-height:500px}
.contact h2{margin-top:60px}
.contact-links{flex-direction:column;gap:18px;align-items:flex-start}
footer{gap:18px;flex-wrap:wrap}
}