:root { color-scheme:light; --paper:#faf9f6; --ink:#111; --green:#303d32; --line:#d8d8cf }
* { box-sizing:border-box }
body { margin:0; background:var(--paper); color:var(--ink); font:450 18px/1.6 'Geist','Geist Fallback',Arial,sans-serif; -webkit-font-smoothing:antialiased }
button,input { font:inherit }
button { cursor:pointer; border:0 }
a { color:inherit; text-decoration:none }
h1,h2,p { margin:0 }
a:focus-visible,button:focus-visible { outline:2px solid var(--green); outline-offset:5px }
[hidden] { display:none!important }
.wrap { width:min(1328px,calc(100% - 96px)); margin-inline:auto }
.header { display:flex; align-items:center; justify-content:space-between; min-height:108px; gap:24px }
.wordmark { font:700 30px/1 'Geist','Geist Fallback',Arial,sans-serif; letter-spacing:-.06em }
.wordmark svg { display:block; height:.71em; width:auto; max-width:100% }
.launch-status { display:flex; align-items:center; gap:10px; color:#526052; font-size:13px }
.launch-status>span { width:7px; height:7px; border-radius:50%; background:#5b754e; box-shadow:0 0 0 4px #e9ece4 }
.intro { display:grid; grid-template-columns:1.35fr 1fr; align-items:center; gap:64px; padding:48px 0 54px }
.eyebrow { display:flex; align-items:center; gap:12px; font-size:11px; letter-spacing:.13em; font-weight:600; color:var(--green) }
.quadrant { width:20px; height:20px; flex-shrink:0; display:block; color:var(--green) }
h1 { font:650 clamp(62px,6.65vw,94px)/1.02 'Geist','Geist Fallback',Arial,sans-serif; letter-spacing:-.068em; margin-top:26px }
h1 em { font-style:normal; color:var(--green); white-space:nowrap }
.intro-copy>p { font-size:clamp(20px,1.8vw,25px); line-height:1.46; letter-spacing:-.032em; max-width:33ch }
.button { display:inline-flex; align-items:center; justify-content:space-between; gap:20px; min-height:48px; padding:12px 18px; background:var(--green); color:var(--paper); border-radius:5px; font-size:15px; font-weight:550; white-space:nowrap; transition:background .2s }
.button span { font-size:23px; line-height:1 }
.button:hover { background:#425443 }
.button:disabled { opacity:.6; cursor:wait }
form { display:grid; gap:14px; margin-top:28px }
label { font-size:14px; font-weight:500; min-width:0 }
input { display:block; width:100%; min-width:0; border:1px solid #bdc6b9; border-radius:6px; background:#fffdfa; color:var(--ink); font-size:16px; padding:12px 13px; margin-top:6px }
input:focus { outline:2px solid var(--green); outline-offset:2px }
input::placeholder { color:#737b70 }
.interest-field { display:flex; padding:5px; border:1px solid #bdc6b9; border-radius:10px; background:#fffdfa; gap:4px; margin-top:-4px }
.interest-field:focus-within { outline:2px solid var(--green); outline-offset:2px }
.interest-field input { margin:0; border:0; background:transparent; padding:10px; outline:0; flex:1 }
.form-note { font-size:12px; line-height:1.5; color:#62665e }
.interest-success { display:flex; gap:16px; align-items:flex-start; background:#eaf0e4; color:var(--green); padding:22px; border-radius:10px; margin-top:28px; outline-offset:4px }
.interest-success .quadrant { margin-top:5px }
.interest-success p { font-size:15px; line-height:1.5; margin-top:4px }
.trap { position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden }
.error { font-size:14px; color:#923924 }
.scene { position:relative; overflow:hidden; border-radius:22px; height:clamp(340px,45vh,490px); background:#77a5e7 }
.scene>img { width:100%; height:100%; display:block; object-fit:cover; object-position:center bottom }
.footer { display:flex; justify-content:flex-end; align-items:center; gap:24px; padding-block:24px; font-size:13px; color:#4d594f }
.preview-link:hover { text-decoration:underline; text-underline-offset:4px }
.preview-link { display:flex; align-items:center; gap:8px; background:transparent; padding:10px 0; font-size:12px; color:#5b645a }
.skip { position:fixed; top:-100px; left:16px; z-index:5; background:var(--paper); padding:12px }
.skip:focus { top:16px }
dialog { width:min(500px,calc(100% - 32px)); max-height:calc(100dvh - 32px); padding:40px; border:1px solid var(--line); border-radius:16px; background:var(--paper); color:var(--ink); box-shadow:0 20px 100px #1113 }
dialog::backdrop { background:#18251c77; backdrop-filter:blur(5px) }
dialog h2 { font:600 42px/1.1 'Geist',Arial,sans-serif; letter-spacing:-.055em; margin-top:16px; margin-bottom:12px }
dialog>p { font-size:16px; color:#494949 }
.close { position:absolute; right:12px; top:10px; width:44px; height:44px; background:transparent; color:var(--green); border-radius:50%; font-size:30px; line-height:1 }
.close:hover { background:#e7ebe2 }
.text-link { font-size:15px }
@media(max-width:1050px) and (min-width:761px) {
  .intro { grid-template-columns:1fr 1fr; gap:32px }
  h1 { font-size:clamp(46px,5.9vw,62px) }
  .interest-field { flex-wrap:wrap }
  .interest-field input { flex-basis:100% }
  .interest-field .button { width:100% }
}
@media(max-width:760px) {
  .wrap { width:calc(100% - 40px) }
  .header { min-height:88px; gap:16px }
  .wordmark { font-size:26px }
  .launch-status { font-size:11px; gap:8px }
  .intro { grid-template-columns:1fr; gap:28px; padding:32px 0 }
  h1 { font-size:clamp(47px,10.7vw,78px); margin-top:22px }
  .intro-copy>p { font-size:21px; max-width:36ch }
  form { margin-top:24px; gap:12px }
  .interest-field { flex-wrap:nowrap }
  .interest-field .button { gap:12px; padding:12px; font-size:14px }
  .form-note { font-size:11px }
  .scene { height:auto; aspect-ratio:1.12; border-radius:16px }
  .scene>img { object-position:52% bottom }
  .footer { gap:8px; padding-block:18px }
  dialog { padding:28px 24px }
  dialog h2 { font-size:36px }
}
@media(max-width:360px) {
  .wrap { width:calc(100% - 32px) }
  h1 { font-size:43px }
  .wordmark { font-size:24px }
  .launch-status { font-size:10px }
  .interest-field { flex-wrap:wrap }
  .interest-field input { flex-basis:100% }
  .interest-field .button { width:100% }
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation:none!important; transition:none!important; scroll-behavior:auto!important }
}