:root { color-scheme:dark; --bg:#0d1511; --panel:#16231a; --text:#e6ecdf; --muted:#a0b19e; --green:#b4d298; --border:#2a3a2d; font:16px/1.7 "Segoe UI",system-ui,sans-serif; scroll-behavior:smooth; }
* { box-sizing:border-box; }
body { margin:0; background:var(--bg); color:var(--text); overflow-x:hidden; }
a { color:inherit; text-underline-offset:5px; }
a:focus-visible { outline:2px solid var(--green); outline-offset:5px; }
img { display:block; max-width:100%; height:auto; }
figure { margin:0; min-width:0; }
.site-header,main,footer { max-width:1320px; margin:auto; padding:0 48px; }
.site-header { display:flex; justify-content:space-between; align-items:center; gap:24px; padding-top:24px; padding-bottom:24px; border-bottom:1px solid var(--border); }
.wordmark { display:flex; align-items:center; gap:12px; text-decoration:none; font-size:23px; font-weight:600; }
.wordmark img { border-radius:11px; }
.site-header nav { display:flex; gap:28px; font-size:14px; }
.site-header nav a { text-decoration:none; color:var(--muted); }
.site-header nav a:hover { color:var(--green); }
.skip { position:absolute; top:-100px; }
.skip:focus { top:8px; background:var(--panel); z-index:30; padding:10px; }
.scroll-progress { position:fixed; inset:0 0 auto; height:3px; background:var(--green); transform:scaleX(var(--progress,0)); transform-origin:left; z-index:50; pointer-events:none; }
.hero { display:grid; grid-template-columns:.9fr 1.2fr; gap:56px; padding:100px 0 130px; align-items:center; min-height:88vh; }
.hero-copy,.hero-art { min-width:0; }
.eyebrow,.chapter-number { font-size:11px; letter-spacing:.16em; color:var(--green); font-weight:600; }
h1,h2,h3,p { margin:0 0 20px; }
h1 { font-size:clamp(54px,6vw,88px); line-height:1.06; letter-spacing:-.055em; font-weight:550; margin:25px 0; }
h1 em,h2 em { color:var(--green); font-style:normal; }
h2 { font-size:clamp(32px,4vw,54px); font-weight:500; line-height:1.15; letter-spacing:-.04em; }
h3 { font-size:23px; font-weight:500; line-height:1.3; }
.lead { max-width:440px; font-size:18px; color:var(--muted); }
.actions { display:flex; gap:12px; flex-wrap:wrap; margin:30px 0 20px; }
.button { display:inline-flex; align-items:center; justify-content:center; min-height:48px; border:1px solid var(--border); border-radius:9px; padding:12px 22px; background:var(--panel); text-decoration:none; font-size:14px; font-weight:600; transition:transform .2s,background .2s; }
.button:hover { transform:translateY(-3px); background:#273c2c; }
.primary { background:var(--green); color:#142213; border-color:var(--green); }
.primary:hover { background:#c8e2b0; }
.quiet { color:var(--muted); font-size:13px; }
.hero-art { transform:translate3d(0,var(--drift,0px),0) rotate(var(--turn,0deg)); }
.art-window { border:1px solid #49653d; background:#182a1d; padding:10px; border-radius:16px; box-shadow:0 40px 100px #0006; }
.window-caption { display:block; padding:8px 8px 16px; font-size:10px; letter-spacing:.2em; color:var(--green); }
.art-window img { border-radius:8px; width:100%; }
figcaption { color:var(--muted); font-size:11px; line-height:1.8; padding:14px 0; }
figcaption strong { color:var(--text); font-weight:500; }
figcaption small { display:block; font-size:10px; }
.source-ribbon { padding:22px 0; border-block:1px solid var(--border); overflow:hidden; color:var(--green); font-size:16px; letter-spacing:.06em; }
.source-ribbon span { display:block; width:max-content; min-width:100%; text-align:center; }
.experience,.feature-section,.privacy-section,.download-section { padding:100px 0; scroll-margin-top:20px; }
.section-title { margin-bottom:70px; }
.chapter { display:grid; grid-template-columns:.85fr 1.15fr; gap:90px; align-items:center; min-height:85vh; padding:60px 0; }
.chapter-copy { position:sticky; top:100px; align-self:center; }
.chapter-copy p,.collection-moment>p { max-width:440px; color:var(--muted); }
.chapter-number { display:block; margin-bottom:25px; }
.chapter-art img { width:100%; max-height:76vh; object-fit:contain; border-radius:14px; background:#17231b; }
.chapter.reverse { grid-template-columns:1.15fr .85fr; }
.chapter.reverse .chapter-copy { order:2; }
.chapter.reverse .chapter-art { order:1; }
.tag-strip { display:flex; gap:10px; flex-wrap:wrap; }
.tag-strip span { padding:6px 12px; background:#233421; border:1px solid #3c5334; border-radius:30px; color:var(--green); font-size:12px; }
.archive-note { font-size:12px; color:var(--green); }
.dot { display:inline-block; width:6px; height:6px; background:var(--green); border-radius:50%; margin-right:6px; }
.collection-moment { text-align:center; padding:160px 20px 100px; background:radial-gradient(ellipse,#243f2150,transparent 70%); }
.collection-moment>p { margin:20px auto 40px; }
.collection-tiles { display:flex; justify-content:center; gap:16px; flex-wrap:wrap; }
.collection-tiles span { display:grid; place-items:center; padding:26px; border:1px solid #4a643e; border-radius:14px; background:linear-gradient(140deg,#29432b,#142419); min-width:180px; box-shadow:0 20px 40px #0004; transform:rotate(-4deg); }
.collection-tiles span:nth-child(2) { transform:translateY(-20px) rotate(3deg); }
.collection-tiles span:nth-child(3) { transform:rotate(6deg); }
.feature-section,.privacy-section,.download-section { border-top:1px solid var(--border); }
.feature-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:40px; margin-top:32px; }
.feature-grid p,.privacy-section p,.download-grid p { color:var(--muted); font-size:14px; }
.privacy-section { display:grid; grid-template-columns:1fr 1fr; gap:80px; }
.download-section { text-align:center; }
.download-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; text-align:left; margin:38px 0; }
.download-grid article { border:1px solid var(--border); border-radius:14px; background:var(--panel); padding:30px; }
.download-grid .button { width:100%; margin:8px 0 14px; }
.download-grid p:last-child { font-size:12px; margin-bottom:0; }
.installation { max-width:880px; margin:auto; color:var(--muted); font-size:12px; }
footer { display:flex; justify-content:space-between; align-items:center; gap:25px; flex-wrap:wrap; border-top:1px solid var(--border); padding-top:30px; padding-bottom:30px; }
footer p { margin:0; color:var(--muted); font-size:12px; }
footer>div { display:flex; gap:22px; font-size:12px; }
.motion-ready .reveal { opacity:0; translate:0 44px; transition:opacity .8s,translate .8s; }
.motion-ready .reveal.is-visible { opacity:1; translate:0 0; }
.motion-ready .feature-grid article:nth-child(2) { transition-delay:.12s; }
.motion-ready .feature-grid article:nth-child(3) { transition-delay:.24s; }
.motion-ready .source-ribbon span { animation:glide 24s ease-in-out infinite alternate; }
@keyframes glide { to { transform:translateX(-12%); } }
@media(max-width:760px) {
  .site-header,main,footer { padding-left:22px; padding-right:22px; }
  .site-header nav { gap:14px; font-size:12px; }
  .site-header nav a:nth-child(2) { display:none; }
  .wordmark { font-size:19px; }
  .wordmark img { width:32px; height:32px; }
  .hero { grid-template-columns:1fr; gap:32px; padding:55px 0 70px; min-height:auto; }
  h1 { font-size:62px; }
  .chapter,.chapter.reverse { grid-template-columns:1fr; gap:24px; padding:35px 0; min-height:auto; }
  .chapter-copy { position:static; }
  .chapter.reverse .chapter-copy,.chapter.reverse .chapter-art { order:initial; }
  .experience,.feature-section,.privacy-section,.download-section { padding:55px 0; }
  .section-title { margin-bottom:30px; }
  .chapter-art img { max-height:68vh; }
  .collection-moment { padding:80px 0 30px; }
  .collection-tiles { gap:12px; }
  .collection-tiles span { min-width:0; padding:18px; font-size:12px; }
  .feature-grid,.privacy-section,.download-grid { grid-template-columns:1fr; gap:25px; }
  .download-grid article { padding:24px; }
  footer>p { width:100%; }
}
@media(prefers-reduced-motion:reduce) {
  :root { scroll-behavior:auto; }
  *,*::before,*::after { animation:none!important; transition:none!important; }
  .hero-art { transform:none; }
  .collection-tiles span { transform:none!important; }
  .reveal { opacity:1!important; translate:none!important; }
}

.art-window { position:relative; }
.art-window img { aspect-ratio: 16/10; object-fit:contain; background:#101814; }
#artwork-rotation { position:absolute; top:12px; right:12px; border:1px solid var(--border); border-radius:6px; padding:6px 10px; background:var(--bg); color:var(--text); font:inherit; font-size:11px; cursor:pointer; }
#artwork-rotation:focus-visible { outline:2px solid var(--green); }
.app-preview { padding:80px 0; }
.app-preview img { border:1px solid var(--border); border-radius:14px; margin:30px 0 18px; }
.app-preview p:last-child { color:var(--muted); font-size:12px; }

.preview-shots { display:grid; grid-template-columns:minmax(0,1fr) minmax(180px,.3fr); gap:24px; align-items:center; }
.preview-shots img { width:100%; max-height:650px; object-fit:contain; }
@media(max-width:700px) { .preview-shots { grid-template-columns:1fr; } .preview-shots .phone-capture { max-width:300px; margin:auto; } }