2026-08-22 01:20:06 +02:00
<!doctype html>
2026-08-22 01:29:45 +02:00
< html > < head >
< meta name = "description" content = "Saving seed is the oldest covenant there is. Every fall I walk the rows and pick the best of the best. I dry them on the porch screen, label them in my…" > < meta charset = "UTF-8" / >
2026-08-22 01:20:06 +02:00
< script src = "https://cdn.jsdelivr.net/npm/gsap@3.14.2/dist/gsap.min.js" > < / script >
< style >
body{margin:0;background:#1a1408;color:#f4ead2;font-family:Georgia,'Times New Roman',serif}
#root{position:relative;width:1920px;height:1080px;overflow:hidden;background:#1a1408}
.clip{position:absolute;inset:0;display:grid;place-items:center}
.bg{position:absolute;inset:0;background-size:cover;background-position:center}
.veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(26,20,8,.05),rgba(26,20,8,.75))}
.words{position:relative;z-index:2;max-width:1500px;text-align:center;padding:0 80px}
h1{font-size:64px;line-height:1.15;font-weight:400;margin:0;text-shadow:0 2px 18px rgba(0,0,0,.85)}
.sub{display:block;margin-top:26px;font-size:30px;font-style:italic;opacity:.85;font-family:Georgia,serif}
2026-08-22 01:29:45 +02:00
< / style > < script defer src = "https://analytics.4ort.xyz/script.js" data-website-id = "d3ed927c-888a-4a6c-ae5f-0b1c613ddf5b" > < / script >
< / head >
2026-08-22 01:20:06 +02:00
< body >
< div id = "root" data-composition-id = "main" data-start = "0" data-width = "1920" data-height = "1080" data-duration = "30" >
< audio id = "voice-s1" src = "audio/s1.wav" data-start = "0" > < / audio >
< audio id = "voice-s2" src = "audio/s2.wav" data-start = "9" > < / audio >
< audio id = "voice-s3" src = "audio/s3.wav" data-start = "20" > < / audio >
< audio id = "bgm" src = "audio/music.mp3" data-start = "0" data-volume = "0.15" > < / audio >
< section id = "s1" class = "clip" data-start = "0" data-duration = "9" data-track-index = "1" >
< div class = "bg" style = "background-image:url('https://images.pexels.com/photos/7782153/pexels-photo-7782153.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940')" > < / div >
< div class = "veil" > < / div >
< div class = "words" > < h1 id = "s1-title" > Saving seed is the oldest covenant there is.< / h1 >
< span id = "s1-sub" class = "sub" > Every fall I walk the rows and pick the best of the best.< / span > < / div >
< / section >
< section id = "s2" class = "clip" data-start = "9" data-duration = "11" data-track-index = "1" >
< div class = "bg" style = "background-image:url('https://images.pexels.com/photos/7782163/pexels-photo-7782163.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940')" > < / div >
< div class = "veil" > < / div >
< div class = "words" > < h1 id = "s2-title" > I dry them on the porch screen, label them in my own hand.< / h1 >
< span id = "s2-sub" class = "sub" > Each packet is a promise I'm keeping for next spring.< / span > < / div >
< / section >
< section id = "s3" class = "clip" data-start = "20" data-duration = "10" data-track-index = "1" >
< div class = "bg" style = "background-image:url('https://images.pexels.com/photos/38339436/pexels-photo-38339436.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940')" > < / div >
< div class = "veil" > < / div >
< div class = "words" > < h1 id = "s3-title" > I'm not just growing a vegetable.< / h1 >
< span id = "s3-sub" class = "sub" > I'm passing my grandmother's hands along to hands that haven't been born yet.< / span > < / div >
< / section >
< / div >
< script >
window.__timelines = window.__timelines || {};
const tl = gsap.timeline({ paused: true });
tl.from("#s1-title", { opacity: 0, y: 40, duration: 1.4, ease: "power3.out" }, 0.3);
tl.from("#s1-sub", { opacity: 0, y: 24, duration: 1.2, ease: "power2.out" }, 1.4);
tl.to("#s1-title", { opacity: .95, scale: 1.03, duration: 3, ease: "power1.inOut" }, 4);
tl.from("#s2-title", { opacity: 0, y: 40, duration: 1.4, ease: "power3.out" }, 10);
tl.from("#s2-sub", { opacity: 0, y: 24, duration: 1.2, ease: "power2.out" }, 11.2);
tl.to("#s2-title", { opacity: .95, scale: 1.03, duration: 3, ease: "power1.inOut" }, 13);
tl.from("#s3-title", { opacity: 0, y: 40, duration: 1.4, ease: "power3.out" }, 21);
tl.from("#s3-sub", { opacity: 0, y: 24, duration: 1.3, ease: "power2.out" }, 22.3);
tl.to("#s3-title", { opacity: .95, scale: 1.04, duration: 3, ease: "power1.inOut" }, 24);
window.__timelines["main"] = tl;
< / script >
< / body > < / html >
