:root { --pine:#173d36; --pine-dark:#102d28; --cream:#f6f1e8; --paper:#fffdf9; --rust:#db6748; --gold:#e9bd62; --ink:#17322d; --muted:#63746d; --line:rgba(23,61,54,.16); }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { margin:0; color:var(--ink); background:var(--cream); font-family:"DM Sans",system-ui,sans-serif; font-size:16px; line-height:1.55; } a { color:inherit; text-decoration:none; } button,input,select { font:inherit; } .section-shell,.site-header { width:min(1160px,calc(100% - 48px)); margin-inline:auto; }
.site-header { height:88px; display:flex; align-items:center; justify-content:space-between; } .brand { display:flex; align-items:center; gap:8px; font-size:23px; font-weight:700; letter-spacing:-1.3px; } .brand-mark { display:grid; place-items:center; width:26px; height:26px; border-radius:50% 50% 48% 48%; background:var(--rust); color:white; font-family:Newsreader,serif; font-weight:600; font-size:21px; line-height:1; } nav { display:flex; align-items:center; gap:30px; font-size:14px; font-weight:600; } nav a:not(.nav-cta) { color:#40554e; } .nav-cta { background:var(--pine); color:white; border-radius:100px; padding:10px 15px; }
.hero { min-height:650px; padding:70px 0 78px; display:grid; grid-template-columns:1fr .9fr; gap:64px; align-items:center; overflow:hidden; } .eyebrow { margin:0 0 18px; color:var(--rust); font-size:11px; line-height:1; letter-spacing:1.5px; text-transform:uppercase; font-weight:700; } .eyebrow span { display:inline-block; width:19px; height:1px; margin:0 8px 3px 0; background:currentColor; } h1,h2,h3,p { margin-top:0; } h1,h2 { font-family:Newsreader,Georgia,serif; font-weight:500; letter-spacing:-2.6px; line-height:.98; } h1 { font-size:clamp(56px,6.2vw,82px); margin:0 0 25px; } h1 em,h2 em { color:var(--rust); } .hero-intro { max-width:505px; font-size:20px; line-height:1.55; color:#415750; } .hero-actions { display:flex; align-items:center; gap:25px; margin-top:33px; }.button { border:0; border-radius:4px; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; gap:25px; font-weight:700; padding:15px 19px; transition:transform .2s,background .2s; }.button:hover { transform:translateY(-2px); }.button-primary { color:white; background:var(--pine); }.button-primary:hover { background:var(--pine-dark); }.text-link { font-weight:700; font-size:14px; border-bottom:1px solid var(--ink); padding-bottom:3px; }.fine-print { color:#74817c; font-size:13px; margin:25px 0 0; }
.hero-visual { position:relative; height:510px; display:grid; place-items:center; }.orbit { position:absolute; border:1px solid rgba(23,61,54,.12); border-radius:50%; }.orbit-one { width:490px; height:390px; transform:rotate(-23deg); }.orbit-two { width:350px; height:455px; transform:rotate(32deg); }.phone-shadow { position:absolute; width:220px; height:420px; margin-top:35px; border-radius:38px; background:#c8bfb0; transform:rotate(6deg); }.phone-card { z-index:1; width:240px; min-height:424px; padding:16px 17px 18px; border-radius:35px; background:var(--paper); box-shadow:0 24px 50px rgba(23,51,45,.19); transform:rotate(-3deg); }.phone-status { display:flex; justify-content:space-between; font-size:9px; font-weight:700; }.status-icons { font-size:6px; letter-spacing:1px; }.phone-kicker { color:#8b958f; font-size:10px; margin:29px 0 8px; }.phone-card h2 { font-size:29px; letter-spacing:-1px; margin-bottom:21px; }.action-card { display:flex; align-items:center; gap:10px; padding:12px; background:#eef1e7; border-radius:12px; }.action-icon { display:grid; place-items:center; width:32px;height:32px; border-radius:10px; color:white;background:var(--rust);font-size:18px; }.action-card p { margin:0; color:#66766e; font-size:10px; }.action-card strong { display:block; font-size:12px; }.fallback { color:#6e7c75; font-size:10px; line-height:1.45; margin:13px 1px; }.why-button { display:flex; justify-content:space-between; width:100%; padding:0; border:0; background:transparent; color:var(--pine); border-top:1px solid #dde1d9; padding-top:12px; cursor:pointer; font-size:10px; font-weight:700; }.why-button span { font-size:15px; line-height:.7; }.foundation { display:flex; align-items:center; justify-content:space-between; margin-top:22px; padding:10px 1px 0; border-top:1px solid #dde1d9; }.foundation span { display:block; color:#8a968f; font-size:7px; letter-spacing:.8px; }.foundation strong { display:block;font-size:10px; }.foundation .sprout { color:var(--rust); font-size:26px; }.floating-note { z-index:2; position:absolute; padding:9px 11px; border-radius:6px; background:#fffdf9; box-shadow:0 9px 22px rgba(35,55,48,.12); font-size:10px; font-weight:700; }.note-top { top:75px; right:3px; }.note-bottom { left:6px; bottom:70px; }.note-dot { display:inline-block; width:7px;height:7px; border-radius:50%; background:var(--gold); margin-right:5px; }.check { color:var(--rust); margin-right:4px; }
.belief { display:grid; grid-template-columns:26% 1fr; padding:42px 0 80px; border-top:1px solid var(--line); }.section-label { padding-top:12px; color:var(--muted); font-size:12px; text-transform:uppercase; letter-spacing:1.1px; font-weight:700; }.belief-copy { position:relative; max-width:745px; }.belief-copy p { margin:0; font-family:Newsreader,serif; font-size:clamp(32px,4vw,53px); line-height:1.06; letter-spacing:-1.7px; }.belief-copy em { color:var(--rust); }.arrow-down { position:absolute; right:1px; bottom:-46px; color:var(--rust); font-size:29px; }
.how { padding:98px 0 110px; }.section-heading h2,.today-copy h2,.waitlist h2,.principles h2 { font-size:clamp(46px,5vw,67px); margin-bottom:0; }.steps { display:grid; grid-template-columns:repeat(3,1fr); gap:0; margin-top:62px; border-top:1px solid var(--line); }.step { min-height:284px; position:relative; padding:31px 36px 20px 0; border-right:1px solid var(--line); }.step + .step { padding-left:36px; }.step:last-child { border:0; }.step-number { color:#87938d; font-family:"DM Mono",monospace; font-size:11px; }.step-icon { display:grid; place-items:center; width:44px;height:44px; margin:27px 0 19px; color:var(--rust); font-size:26px; }.sun { background:#f4dca2; border-radius:50%; }.path { background:#d7e3d9; border-radius:15px 50% 15px 50%; }.seed { background:#f1cbbd; border-radius:50% 50% 9px 50%; }.step h3 { margin-bottom:10px; font-family:Newsreader,serif; font-size:26px; font-weight:600; letter-spacing:-.6px; }.step p { color:#61716a; font-size:14px; max-width:285px; }
.today-section { padding:86px clamp(25px,7vw,95px); display:grid; grid-template-columns:1fr 1fr; gap:70px; background:#e8dfd2; }.today-copy > p:not(.eyebrow) { max-width:430px; color:#52645d; }.domains { display:grid; grid-template-columns:1fr 1fr; align-content:center; gap:16px; }.domains > div { padding:20px 15px; border-top:1px solid rgba(23,61,54,.22); }.domain-icon { display:block; color:var(--rust); font-size:25px; margin-bottom:11px; }.domains strong,.domains small { display:block; }.domains strong { font-family:Newsreader,serif; font-size:20px; letter-spacing:-.4px; }.domains small { color:#607069; font-size:11px; margin-top:3px; }
.principles { margin-top:110px; padding:100px 0 104px; background:var(--pine); color:#f6f1e8; }.light { color:var(--gold); }.principles h2 em { color:var(--gold); }.principle-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:30px; margin-top:68px; }.principle-grid article { border-top:1px solid rgba(246,241,232,.26); padding-top:20px; }.principle-grid span { color:var(--gold); font-family:"DM Mono",monospace; font-size:11px; }.principle-grid h3 { margin:27px 0 10px; font-family:Newsreader,serif; font-size:25px; font-weight:500; letter-spacing:-.5px; }.principle-grid p { color:#c6d0c6; font-size:14px; }
.waitlist { display:grid; grid-template-columns:1fr .84fr; gap:100px; padding:115px 0; }.waitlist-copy > p:not(.eyebrow) { max-width:470px; color:#5e6e67; }.waitlist-note { color:var(--rust)!important; font-size:14px; }.signup-form { align-self:center; padding:31px; background:var(--paper); box-shadow:0 10px 30px rgba(23,51,45,.09); }.signup-form label { display:block; margin:0 0 7px; color:#40564e; font-size:12px; font-weight:700; }.signup-form label span { color:#8a968f; font-weight:400; }.signup-form input,.signup-form select { width:100%; height:44px; margin:0 0 20px; padding:0 11px; border:1px solid #c7d0c7; border-radius:3px; background:white; color:var(--ink); }.signup-form input:focus,.signup-form select:focus { outline:2px solid var(--gold); outline-offset:1px; }.signup-form .button { width:100%; }.form-status { min-height:1.5em; margin:14px 0 0; color:#3f6658; font-size:13px; font-weight:600; }
.site-footer { display:flex; align-items:center; justify-content:space-between; padding:29px 0; border-top:1px solid var(--line); color:#718079; font-size:12px; }.site-footer .brand { color:var(--ink); font-size:20px; }.site-footer .brand-mark { width:22px;height:22px;font-size:18px; }.site-footer p { margin:0; }.explainer { width:min(530px,calc(100% - 36px)); border:0; padding:42px; color:var(--ink); background:var(--paper); box-shadow:0 20px 70px rgba(0,0,0,.24); }.explainer::backdrop { background:rgba(13,42,36,.48); }.explainer h2 { font-size:38px; line-height:1.03; }.explainer p:not(.eyebrow) { color:#586a62; }.close-dialog { position:absolute; top:13px; right:16px; border:0;background:transparent;cursor:pointer;color:var(--pine);font-size:30px; }
@media (max-width:760px) { .section-shell,.site-header { width:min(100% - 32px,600px); } .site-header { height:72px; } nav a:not(.nav-cta) { display:none; } nav { gap:0; }.hero { min-height:0; grid-template-columns:1fr; gap:25px; padding:50px 0 47px; }.hero-visual { height:435px; transform:scale(.88); margin:-15px 0 -25px; }.hero-actions { align-items:flex-start; flex-direction:column; gap:18px; }.belief { display:block; padding:35px 0 67px; }.section-label { margin-bottom:20px; }.arrow-down { bottom:-38px; }.how { padding:66px 0; }.steps { grid-template-columns:1fr; margin-top:40px; }.step,.step + .step { min-height:auto; padding:25px 0; border-right:0; border-bottom:1px solid var(--line); }.today-section { display:block; padding:62px 24px; }.domains { margin-top:33px; }.principles { margin-top:67px; padding:69px 0; }.principle-grid { grid-template-columns:1fr 1fr; gap:25px 18px; margin-top:45px; }.waitlist { grid-template-columns:1fr; gap:30px; padding:70px 0; }.site-footer { align-items:flex-start; gap:15px; flex-direction:column; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { transition-duration:.01ms!important; animation-duration:.01ms!important; } }