@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;1,400&family=DM+Sans:wght@400;500;600&family=Caveat:wght@400&display=swap');
:root{color-scheme:dark;--night:#17120e;--coffee:#2b2118;--cream:#f1e9d9;--purple:#b881dc}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--night);color:var(--cream);font:16px/1.65 'DM Sans',sans-serif}button,a{-webkit-tap-highlight-color:transparent;touch-action:manipulation}button{font:inherit;cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:3px solid var(--purple);outline-offset:6px}img{max-width:100%}[hidden]{display:none!important}.skip{position:fixed;top:-100px;left:20px;z-index:50;background:var(--cream);color:var(--night);padding:14px}.skip:focus{top:12px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.journey{position:relative;isolation:isolate;max-width:2000px;margin:auto;overflow:clip}.world-art{position:absolute;inset:0;z-index:-1;background:url('assets/continuous-world.webp') center/100% 100% no-repeat;pointer-events:none}.chapter{position:relative;width:100%;aspect-ratio:16/9}header{position:absolute;top:0;left:0;right:0;z-index:10;display:flex;align-items:center;justify-content:space-between;gap:25px;padding:28px 5.5%}.brand{display:inline-flex;align-items:center;gap:7px;font-size:27px;letter-spacing:-1px;font-weight:600;line-height:1}.brand span{color:var(--purple);font-size:28px}.desktop-nav{display:flex;gap:30px;font-size:14px}.desktop-nav a{padding:12px 0}.desktop-nav a:hover{text-decoration:underline;text-underline-offset:8px}.menu-toggle{display:none}#mobile-nav{position:absolute;top:80px;left:5%;right:5%;padding:20px;background:#211911f5;border:1px solid #f1e9d92b;border-radius:18px;box-shadow:0 15px 50px #0006}#mobile-nav a{display:block;padding:10px 12px}
.copy{position:absolute;z-index:2}.center{left:20%;width:60%;text-align:center}.right{left:55%;width:39%}.left{left:8%;width:47%}.hero .copy{top:24%;left:17%;width:66%}.peer .copy{top:24%}.community .copy{top:25%}.resources .copy{top:27%}.app .copy{top:30%}.therapy .copy{top:6%;left:13%;width:74%}.closing .copy{top:22%}.eyebrow{font-size:12px;font-weight:500;letter-spacing:2.6px;text-transform:uppercase;margin:0 0 22px}h1,h2{font:400 clamp(48px,5.2vw,96px)/.98 'Cormorant Garamond',Georgia,serif;letter-spacing:-1.7px;margin:0}h1{font-size:clamp(65px,7.4vw,138px);letter-spacing:-2.4px}em{font-weight:400}.intro{font-size:clamp(15px,1.1vw,20px);line-height:1.75;margin:27px 0 30px;color:#f7ebd9}.fine{font-size:13px;line-height:1.7;margin-top:25px;color:#ead8bc}.light{color:var(--night)}.light .intro,.light .fine{color:#3c2b1e}.light .eyebrow{color:#4b3824}.therapy h2{font-size:clamp(45px,4.7vw,86px)}.therapy .intro{margin:15px 0 20px}.therapy .fine{margin-top:14px}.button{display:inline-flex;align-items:center;justify-content:center;gap:28px;min-height:52px;padding:15px 26px;border:1px solid transparent;border-radius:40px;font-size:14px;font-weight:500;line-height:1.4;transition:transform .25s,background .25s}.button:hover{transform:translateY(-3px)}.primary{color:var(--night);background:var(--cream)}.primary:hover{background:#fff7e9}.dark{color:var(--cream);background:var(--night)}.dark:hover{background:#39291d}.small{min-height:44px;padding:11px 20px;font-size:13px;gap:20px}.actions{display:flex;align-items:center;justify-content:center;gap:30px;flex-wrap:wrap}.text-link{font-size:14px;text-decoration:underline;text-underline-offset:6px;text-decoration-color:#f1e9d966;padding:12px 0}.topics{display:flex;align-items:center;gap:12px;margin-top:24px}.topics button{color:inherit;background:none;border:0;padding:9px 0;font-size:13px;border-bottom:1px solid transparent}.topics button:hover{border-bottom-color:currentColor}.topics>span{opacity:.55}.note{position:absolute;font:400 clamp(23px,2.1vw,37px)/1.05 'Caveat',cursive;transform:rotate(-9deg);color:#e9cb97;margin:0;pointer-events:none;z-index:1}.hero-note{top:28%;left:7%;color:#c6ac82}.peer-note{left:9%;top:12%}.community-note{right:8%;top:53%;color:#5c422c}.resources-note{right:10%;top:78%;color:#755436}.app-note{right:10%;top:76%;color:#e4c99f}.therapy-note{left:9%;top:57%;color:#62462c}.closing-note{right:8%;top:15%;color:#d0ad7b}.scroll-cue{position:absolute;bottom:5%;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:4px;font-size:11px;letter-spacing:1.2px}.scroll-cue span{font-size:28px}
.phone-wrap{position:absolute;left:17%;top:11%;width:22%;perspective:1000px;z-index:3}.phone{display:block;width:100%;padding:8px;border:2px solid #a18d73;border-radius:clamp(22px,2.6vw,48px);background:#100e0b;box-shadow:12px 28px 45px #160f0966,inset 0 0 0 3px #5d5144;position:relative;animation:float 8s ease-in-out infinite;overflow:hidden}.phone img{display:block;width:100%;height:auto;border-radius:clamp(16px,2vw,40px)}.speaker{position:absolute;top:2%;left:35%;width:30%;height:2%;border-radius:0 0 12px 12px;background:#100e0b}.phone:hover{animation-play-state:paused}.bird-flight{position:absolute;left:70%;top:23.5%;width:10%;z-index:1;pointer-events:none}.bird-flight img{display:block;animation:glide 14s ease-in-out infinite;opacity:.9}@keyframes float{0%,100%{transform:translateY(0) rotate(-8deg)}50%{transform:translateY(-12px) rotate(-6deg)}}@keyframes glide{0%,100%{transform:translate(0,0) rotate(-4deg)}50%{transform:translate(-25px,-16px) rotate(3deg)}}
footer{position:absolute;bottom:5%;left:5.5%;right:5.5%;display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:12px}footer .brand{font-size:25px}.footer-line{color:#d0b999}footer nav{display:flex;align-items:center;gap:22px}footer button{padding:12px 0;background:none;border:0;color:inherit;font-size:13px}footer nav>a{display:grid;place-items:center;border:1px solid #f1e9d94d;border-radius:50%;width:42px;height:42px;font-size:20px}.motion{position:fixed;bottom:18px;left:20px;z-index:11;display:flex;align-items:center;gap:10px;background:#21170ed9;color:var(--cream);border:1px solid #f1e9d955;border-radius:30px;padding:11px 16px;min-height:44px;font-size:11px;backdrop-filter:blur(8px)}.motion-icon{font-size:15px}.still *{scroll-behavior:auto!important}.still .phone,.still .bird-flight img{animation:none}
dialog{max-width:590px;width:calc(100% - 40px);max-height:90svh;border:1px solid #f1e9d933;border-radius:24px;padding:48px 38px;background:var(--coffee);color:var(--cream);box-shadow:0 25px 100px #0008;overscroll-behavior:contain}dialog::backdrop{background:#100c09bd;backdrop-filter:blur(9px)}dialog h2{font-size:54px;line-height:1.02;letter-spacing:-1px}dialog p{font-size:15px;line-height:1.75}dialog .eyebrow{font-size:11px;margin-bottom:19px}dialog .button{margin-top:10px}dialog .fine{font-size:12px}.close{position:absolute;right:12px;top:10px;border:0;color:var(--cream);background:transparent;font-size:30px;width:44px;height:44px}.notice{padding-top:19px;border-top:1px solid #f1e9d925;color:#d7c8b2;font-size:13px!important}.steps{padding-left:22px;font-size:14px}.steps li{padding:8px 0}.sample-post{border:1px solid #f1e9d925;border-radius:18px;padding:22px;margin:23px 0;background:#17120e55}.post-label{font-size:10px;letter-spacing:1.1px;color:#c3ac8e}.sample-post p{font-family:'Cormorant Garamond',Georgia,serif;font-size:27px;line-height:1.2}.filters{display:flex;gap:8px;flex-wrap:wrap;margin:22px 0}.filters button{border:1px solid #f1e9d933;background:transparent;color:var(--cream);border-radius:25px;padding:10px 15px;font-size:13px;min-height:44px}.filters button[aria-pressed=true]{color:var(--night);background:var(--cream)}.resource-list a{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:18px 0;border-bottom:1px solid #f1e9d92b;font-size:15px}.resource-list a:hover{color:#d1acfa}.resource-list small{display:block;font-size:10px;letter-spacing:1px;color:#c8ae8d;margin-bottom:6px}.app-preview{display:block;max-height:460px;width:auto;margin:25px auto 0;border:5px solid #0d0c0b;border-radius:25px}.details{padding:15px 0;border-bottom:1px solid #f1e9d924}
@media(min-width:1800px){.eyebrow{font-size:14px}.button{font-size:16px;padding:18px 32px}.desktop-nav{font-size:16px}}
@media(max-width:1100px) and (min-width:761px){header{padding:20px 4%}.desktop-nav{gap:18px;font-size:12px}.brand{font-size:25px}.eyebrow{font-size:10px;margin-bottom:15px}.intro{font-size:14px;margin:20px 0}.fine{font-size:11px;margin-top:14px}h1{font-size:7.2vw}h2{font-size:5.1vw}.button{min-height:46px;font-size:12px;padding:12px 20px;gap:15px}.text-link{font-size:12px}.hero .copy{top:26%}.therapy .copy{top:4%}.therapy h2{font-size:4.5vw}.therapy .intro{font-size:13px;margin:10px 0 12px}.topics{gap:9px;margin-top:15px}.note{font-size:24px}.actions{gap:20px}}
@media(max-width:760px){.journey{overflow:hidden}.chapter{aspect-ratio:auto;height:760px}.world-art{background-size:160% 100%;background-position:50% 0}header{padding:23px 7%}.brand{font-size:26px}.desktop-nav,.header-cta{display:none}.menu-toggle{display:flex;align-items:center;gap:14px;border:1px solid #f1e9d94d;border-radius:30px;color:var(--cream);background:#17120e40;padding:10px 17px;min-height:44px;font-size:13px}.copy{left:8%;width:84%;text-align:center}.hero .copy{top:25%;left:7%;width:86%}.hero h1{font-size:clamp(54px,11.7vw,80px);letter-spacing:-1.5px}.eyebrow{font-size:10px;letter-spacing:2px;margin-bottom:19px}h2{font-size:clamp(48px,10vw,70px);letter-spacing:-1.3px}.intro{font-size:15px;line-height:1.75;max-width:340px;margin:24px auto}.intro br{display:none}.hero .intro{max-width:300px}.actions{gap:15px;flex-direction:column}.button{min-height:50px;font-size:14px}.text-link{font-size:13px;padding:8px 0}.note{font-size:25px}.hero-note{left:8%;top:80%;font-size:24px}.scroll-cue{bottom:5%}.peer .copy{top:38%;text-align:left;left:10%;width:82%;padding:20px 0}.peer .copy:before,.resources .copy:before,.app .copy:before{content:'';position:absolute;z-index:-1;inset:-45px -50px;background:radial-gradient(ellipse,#21170ddd,transparent 72%);pointer-events:none}.peer .intro{margin-left:0}.peer-note{left:12%;top:8%;color:#65452d}.fine{font-size:12px}.community .copy{top:24%;left:7%;width:86%}.community .intro{max-width:250px}.community-note{top:77%;right:10%;font-size:24px}.resources .copy{top:19%;text-align:left;left:8%;width:87%}.resources .intro{margin-left:0;max-width:285px}.resources-note{top:77%;right:9%;color:#4d321e}.topics{gap:13px;justify-content:flex-start;flex-wrap:wrap;margin-top:19px}.topics button{font-size:13px}.phone-wrap{left:17%;top:4%;width:34%;max-width:185px}.phone{border-radius:26px;padding:5px}.phone img{border-radius:20px}.app .copy{top:56%;left:8%;width:86%;text-align:left}.app h2{font-size:45px}.app .intro{margin-left:0;max-width:310px;margin-top:20px;margin-bottom:24px}.app-note{right:10%;top:18%;font-size:24px}.app .eyebrow{margin-bottom:15px}.therapy .copy{top:8%;left:6%;width:88%}.therapy h2{font-size:48px}.therapy .intro{max-width:310px;margin:22px auto}.therapy .fine{max-width:240px;margin:16px auto}.therapy-note{top:68%;left:9%;font-size:24px}.closing .copy{top:23%;left:7%;width:86%}.closing .intro{max-width:280px}.closing-note{top:10%;right:10%;font-size:24px}.bird-flight{top:24.5%;left:64%;width:20%;opacity:.7}footer{bottom:3%;left:7%;right:7%;gap:15px;flex-wrap:wrap}footer .brand{font-size:24px}.footer-line{display:none}footer nav{gap:17px}footer button{font-size:12px}footer nav>a{width:35px;height:35px}.motion{left:auto;right:14px;bottom:14px;padding:10px 13px;min-width:44px;justify-content:center}.motion-label{display:none}.motion-icon{font-size:17px}dialog{padding:44px 25px 30px;border-radius:20px;width:calc(100% - 24px)}dialog h2{font-size:48px}.filters{gap:6px}.filters button{padding:9px 12px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.phone,.bird-flight img{animation:none!important}.button{transition:none}.button:hover{transform:none}}

/* ---------- Motion layer: sticky header, reveals, scroll story ---------- */
header{position:fixed;max-width:2000px;margin:0 auto;transition:padding .45s ease,background-color .45s ease,box-shadow .45s ease,backdrop-filter .45s ease}
header.scrolled{padding-top:14px;padding-bottom:14px;background:#17120eb8;backdrop-filter:blur(14px) saturate(1.2);-webkit-backdrop-filter:blur(14px) saturate(1.2);box-shadow:0 1px 0 #f1e9d914,0 12px 40px #0000004d}
header.scrolled #mobile-nav{top:68px}
.desktop-nav a{position:relative;transition:color .3s}.desktop-nav a:hover{text-decoration:none}
.desktop-nav a::after{content:'';position:absolute;left:0;right:0;bottom:5px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .45s cubic-bezier(.2,.7,.2,1)}
.desktop-nav a:hover::after{transform:scaleX(1)}.desktop-nav a[aria-current]{color:#fff}.desktop-nav a[aria-current]::after{transform:scaleX(1);height:2px;background:var(--purple)}
.thread{position:fixed;top:0;bottom:0;right:0;width:3px;z-index:12;pointer-events:none;background:#f1e9d90d}
.thread span{position:absolute;inset:0;transform-origin:top;transform:scaleY(var(--progress,0));background:linear-gradient(var(--purple),#e9cb97)}
.world-light,.motes{position:fixed;inset:0;z-index:0;pointer-events:none}
.world-light{background:radial-gradient(130% 75% at 50% 118%,#ffc98acc,transparent 62%);mix-blend-mode:soft-light;opacity:calc(.1 + var(--progress,0)*.8)}
.motes span{position:absolute;width:var(--s);height:var(--s);border-radius:50%;background:#ffe7bd;box-shadow:0 0 calc(var(--s)*3) #ffd79a;opacity:0;animation:mote linear infinite}
.line{display:block;overflow:hidden;padding:0 .1em .14em;margin:0 -.1em -.14em}.line>span{display:inline-block}
.phone-wrap{transform:perspective(1100px) translateY(var(--ty,0px)) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg))}
.phone::after{content:'';position:absolute;inset:0;border-radius:inherit;background:linear-gradient(115deg,transparent 38%,#ffffff12 47%,#ffffff2e 50%,transparent 60%);background-size:300% 100%;background-position:calc(50% + var(--glare,0) * 1%) 0;pointer-events:none}
@media(min-width:761px){.hero::before{content:'';position:absolute;left:89.6%;top:22.7%;width:16vw;aspect-ratio:1;translate:-50% -50%;border-radius:50%;background:radial-gradient(circle,#ffe9c24d 0,#ffd9a01f 30%,transparent 66%);mix-blend-mode:screen;pointer-events:none;animation:moon 7s ease-in-out infinite}}
@media(prefers-reduced-motion:no-preference){
.js:not(.still) header{animation:drop 1s .15s cubic-bezier(.2,.7,.2,1) backwards}
.js:not(.still) .bird-flight{position:fixed;left:0;top:0;z-index:4;will-change:transform}
.js:not(.still) .chapter:not(.in) :is(.copy>:not(h1,h2),.scroll-cue,.phone-wrap){opacity:0}
.js:not(.still) .chapter:not(.in) .line>span{translate:0 110%}
.js:not(.still) .chapter:not(.in) .note{clip-path:inset(-30% 100% -30% 0)}
.js:not(.still) .in :is(.copy>:not(h1,h2),.scroll-cue){animation:rise 1s cubic-bezier(.2,.7,.2,1) backwards;animation-delay:calc(var(--d,0)*1s)}
.js:not(.still) .in .line>span{animation:line 1.25s cubic-bezier(.19,1,.22,1) backwards;animation-delay:calc(var(--d,0)*1s)}
.js:not(.still) .in .note{animation:ink 1.8s cubic-bezier(.6,0,.3,1) backwards;animation-delay:calc(var(--d,.8)*1s)}
.js:not(.still) .in .phone-wrap{animation:phone-in 1.4s cubic-bezier(.2,.7,.2,1) backwards}
.scroll-cue span{animation:bob 2.6s ease-in-out infinite}
}
@keyframes drop{from{opacity:0;translate:0 -18px}}@keyframes rise{from{opacity:0;translate:0 28px}}@keyframes line{from{translate:0 110%}}@keyframes ink{from{clip-path:inset(-30% 100% -30% 0)}}@keyframes phone-in{from{opacity:0;translate:-40px 60px}}@keyframes bob{50%{translate:0 7px}}@keyframes moon{0%,100%{opacity:.55;scale:.92}50%{opacity:1;scale:1.06}}@keyframes mote{0%{opacity:0;translate:0 0}15%,80%{opacity:var(--o)}100%{opacity:0;translate:var(--dx) -45vh}}
.still .motes{display:none}.still .hero::before,.still .scroll-cue span{animation:none}
@media(max-width:760px){.thread{width:2px}.motes span:nth-child(n+10){display:none}.bird-flight{width:20%}}
@media(prefers-reduced-motion:reduce){.motes{display:none}.hero::before,.scroll-cue span{animation:none!important}}

/* ---------- Music toggle ---------- */
.music{position:fixed;bottom:18px;left:160px;z-index:11;display:flex;align-items:center;gap:10px;background:#21170ed9;color:var(--cream);border:1px solid #f1e9d955;border-radius:30px;padding:11px 16px;min-height:44px;font-size:11px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:border-color .3s,background .3s}
.music[aria-pressed=true]{border-color:#b881dc99;background:#2a1d2ee0}
.music-icon{display:flex;align-items:flex-end;gap:2px;height:13px}.music-icon i{width:3px;height:40%;border-radius:2px;background:currentColor}
.music-icon i:nth-child(2){height:75%}.music-icon i:nth-child(3){height:55%}
.music[aria-pressed=true] .music-icon i{background:var(--purple);animation:eq 1.1s ease-in-out infinite}
.music[aria-pressed=true] .music-icon i:nth-child(2){animation-delay:-.4s}.music[aria-pressed=true] .music-icon i:nth-child(3){animation-delay:-.75s}
@keyframes eq{0%,100%{height:30%}50%{height:100%}}
.still .music-icon i{animation:none!important}
@media(max-width:760px){.music{left:auto;right:66px;bottom:14px;padding:10px 13px;min-width:44px;justify-content:center}.music-label{display:none}}
@media(prefers-reduced-motion:reduce){.music-icon i{animation:none!important}}
.motion,.music{height:48px}
