:root{
  --bone:#f4efe7;
  --sand:#e8ded1;
  --stone:#d9cdbf;
  --clay:#c46a4a;
  --sage:#6b7a5e;
  --charcoal:#1f1f1d;
  --brown-black:#2a241f;
  --line:#c6b7a3;
  --serif:Georgia,'Times New Roman',serif;
  --sans:Arial,Helvetica,sans-serif;
  --space:clamp(24px,5vw,80px);
  --ease:cubic-bezier(.22,1,.36,1);
  --duration:900ms;
  --mask-feather:16px;
  --mask-pad:12px;
}

*{box-sizing:border-box}
html{scroll-behavior:auto;scroll-padding-top:90px}
body{margin:0;background:var(--bone);color:var(--charcoal);font-family:var(--serif);font-size:18px;overflow-x:clip}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}
a:focus-visible,button:focus-visible{outline:2px solid var(--clay);outline-offset:7px}
::selection{background:var(--sand)}

.header{position:absolute;top:0;left:0;width:100%;padding:32px var(--space);display:flex;align-items:center;justify-content:space-between;z-index:20}
.wordmark{font-family:var(--sans);font-size:15px;font-weight:400;letter-spacing:.55em;padding-left:.55em}
.menu-toggle{width:44px;height:44px;border:0;background:transparent;display:grid;align-content:center;gap:6px;cursor:pointer}
.menu-toggle span{display:block;width:29px;height:1px;background:var(--charcoal);transition:transform var(--duration) var(--ease)}
.menu-toggle[aria-expanded=true] span:first-child{transform:translateY(3.5px) rotate(45deg)}
.menu-toggle[aria-expanded=true] span:last-child{transform:translateY(-3.5px) rotate(-45deg)}
nav{position:absolute;right:var(--space);top:86px;padding:28px 36px;background:var(--bone);border:1px solid var(--stone)}
nav a{display:block;padding:14px 0;font-size:22px}
.skip-link{position:fixed;top:-100px;z-index:40;background:var(--bone);padding:16px}
.skip-link:focus{top:10px}

main{position:relative;isolation:isolate}
section{position:relative;text-align:center}
.eyebrow{font-family:var(--sans);font-size:10px;line-height:2.2;letter-spacing:.29em;font-weight:400}
h2{font-weight:400;font-size:clamp(36px,4.8vw,68px);line-height:1.18;letter-spacing:-.025em;margin:0}
p{margin:0}
.small-rule{display:block;width:23px;height:1px;background:var(--charcoal);margin:25px auto}
.paper{width:fit-content;margin-left:auto;margin-right:auto;padding:15px 25px}

/* The journey stays below every foreground mask. */
.journey-svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1;overflow:visible}
.journey-svg path{fill:none;stroke:var(--line);stroke-width:1;vector-effect:non-scaling-stroke}
#ritual-path{stroke:#b58b70}
#gathering-path{stroke:#8d977e}
#awareness,#awareness-sage{position:absolute;top:0;left:0;width:13px;height:13px;margin:-6.5px;border-radius:50%;background:var(--charcoal);z-index:2;pointer-events:none;opacity:0;will-change:transform,opacity,background-color}
#awareness-sage{background:var(--sage)}

/* Soft, bone-colored occlusion. The blurred underlay feathers the line/dot away
   before the solid content layer covers it, without a hard rectangular edge. */
.journey-occluder{position:relative;z-index:4;isolation:isolate}
.journey-occluder::before{content:"";position:absolute;inset:calc(-1 * var(--mask-pad));z-index:-1;background:var(--bone);filter:blur(var(--mask-feather));opacity:.96;pointer-events:none;border-radius:inherit}
.journey-occluder::after{content:"";position:absolute;inset:-2px;z-index:-1;background:var(--bone);pointer-events:none;border-radius:inherit}

.arrival{min-height:850px;height:100svh;display:grid;place-items:center;background:radial-gradient(ellipse at 17% 22%,#ded4c33d,transparent 48%),radial-gradient(ellipse at 90% 73%,#dfd2bc48,transparent 40%)}
.arrival-brand{margin-top:-60px;--mask-pad:18px;--mask-feather:18px}
.hero-mark{position:relative;width:160px;margin:auto;z-index:5}
.hero-mark img{width:160px;height:240px;display:block;position:relative;z-index:2}
/* Actual SVG top-circle center: cx 298.42 / 592, cy 76.48 / 956. */
#start-anchor{position:absolute;left:50.4088%;top:7.999%;width:1px;height:1px;pointer-events:none}
#hero-exit-anchor{position:absolute;left:50%;bottom:-12px;width:1px;height:1px;pointer-events:none}
.arrival h1{font-size:27px;letter-spacing:.64em;margin:9px 0 0}
.arrival .eyebrow{font-size:10px}

.peripheral{position:absolute;font-family:var(--sans);font-size:10px;letter-spacing:.25em;color:#938675;text-transform:uppercase;--scroll-drift:0px;transform:translate3d(var(--scroll-drift),0,0);will-change:transform,opacity}
.peripheral>span{display:block;will-change:transform;animation-timing-function:ease-in-out;animation-iteration-count:infinite;animation-direction:alternate;animation-fill-mode:both}
.p1{left:16%;top:36%}.p1>span{animation-name:float-p1;animation-duration:7.4s;animation-delay:-1.2s}
.p2{right:12%;top:28%}.p2>span{animation-name:float-p2;animation-duration:8.6s;animation-delay:-4.1s}
.p3{right:20%;top:67%}.p3>span{animation-name:float-p3;animation-duration:6.9s;animation-delay:-2.7s}
.p4{left:28%;top:73%}.p4>span{animation-name:float-p4;animation-duration:9.1s;animation-delay:-5.4s}
.p5{left:8%;top:60%}.p5>span{animation-name:float-p5;animation-duration:7.9s;animation-delay:-3.3s}
@keyframes float-p1{0%{transform:translate3d(-4px,3px,0)}50%{transform:translate3d(3px,-4px,0)}100%{transform:translate3d(5px,2px,0)}}
@keyframes float-p2{0%{transform:translate3d(4px,-3px,0)}50%{transform:translate3d(-5px,3px,0)}100%{transform:translate3d(-2px,-4px,0)}}
@keyframes float-p3{0%{transform:translate3d(-3px,-5px,0)}50%{transform:translate3d(5px,2px,0)}100%{transform:translate3d(1px,5px,0)}}
@keyframes float-p4{0%{transform:translate3d(3px,2px,0)}50%{transform:translate3d(-4px,-5px,0)}100%{transform:translate3d(-5px,1px,0)}}
@keyframes float-p5{0%{transform:translate3d(-5px,2px,0)}50%{transform:translate3d(2px,5px,0)}100%{transform:translate3d(4px,-3px,0)}}

.scroll-cue{position:absolute;bottom:43px;left:50%;transform:translateX(-50%);padding:15px 22px 16px;white-space:nowrap;color:var(--bone);--mask-pad:10px;--mask-feather:12px;display:flex;align-items:center;gap:10px;font-family:var(--sans);letter-spacing:.22em;font-size:9px;font-weight:700;line-height:1;border:1px solid #b8876d;background:var(--clay);border-radius:999px;box-shadow:0 12px 35px #c46a4a24}
.scroll-cue::before{opacity:.42}
.scroll-cue::after{background:transparent}
.scroll-cue .cue-text{display:block;margin:0}
.scroll-cue .cue-arrow{display:block;font-size:14px;line-height:1;margin-top:-1px}

.chapter{color:#7b6e5f;margin-bottom:32px}
.outward{padding:100px 0 0;min-height:1050px}
.outward .chapter{display:inline-block;padding:10px;--mask-pad:10px;--mask-feather:12px}
.pull-diagram{height:650px;max-width:1150px;margin:-18px auto 0;position:relative}
.pull-diagram svg{width:100%;height:100%;overflow:visible}
.pull-diagram path{fill:none;stroke:var(--line);stroke-width:1;vector-effect:non-scaling-stroke}
.labels{position:absolute;top:70px;bottom:120px;width:31%;display:flex;flex-direction:column;justify-content:space-between;font:10px var(--sans);letter-spacing:.21em;text-transform:uppercase}
.labels.left{left:0}.labels.right{right:0}
.labels span{padding:9px;background:var(--bone);position:relative;z-index:4}

.return{padding:80px 0 0;min-height:1350px}
.return .chapter{display:inline-block;padding:15px;--mask-pad:10px}
.return-words{position:relative;z-index:4;font-size:clamp(40px,5.4vw,76px)}
.return-words>*{display:table;padding:4px 20px;margin:0 auto;--mask-pad:12px;--mask-feather:15px}
.return-words em{font-weight:400;color:var(--clay)}
.return-copy{margin-top:40px;padding-bottom:25px;--mask-pad:15px;--mask-feather:18px}
.return-copy p,.serif-italic{font-size:clamp(19px,2vw,25px);line-height:1.6;font-style:italic;color:#655c50}
.return-field{position:relative;width:440px;height:440px;max-width:96vw;margin:80px auto 10px;display:grid;place-items:center}
.rings{position:absolute;inset:0;display:grid;place-items:center;z-index:1}
.rings i{position:absolute;border:1px solid var(--stone);border-radius:50%;width:100%;height:100%}
.rings i:nth-child(2){width:80%;height:80%}
.rings i:nth-child(3){width:60%;height:60%}
.rings i:nth-child(4){width:40%;height:40%}
.returned-mark{background:var(--sand);border-radius:50%;width:136px;height:136px;display:grid;place-items:center;z-index:5;--mask-pad:16px;--mask-feather:20px}
.returned-mark::before,.returned-mark::after{border-radius:50%}
.returned-mark::after{background:var(--sand)}
.returned-mark img{height:105px;width:70px;position:relative;z-index:2}
.returned-mark #return-anchor{position:absolute;left:50%;top:50%;width:1px;height:1px}
.settled{margin-top:44px;--mask-pad:12px;--mask-feather:14px;border:1px solid color-mix(in srgb,var(--sage) 48%,var(--stone));color:var(--sage);border-radius:999px;padding:13px 24px 12px;font-weight:700;background:var(--bone);line-height:1.8}

.ways{padding-top:100px}
.ways-heading{padding-bottom:20px;--mask-pad:20px;--mask-feather:22px}
.ways-heading h2{font-size:clamp(23px,2.6vw,36px);letter-spacing:.18em;line-height:1.55}
.ways-heading .chapter{margin-bottom:35px}
.ways-heading .small-rule{margin:28px auto}
.ways-heading .serif-italic{font-size:21px}
#split-anchor{position:absolute;top:440px;left:50%;width:1px;height:1px}
.destinations{max-width:1000px;margin:190px auto 0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(80px,14vw,220px);padding:0 35px}
.destination{padding-top:25px;--mask-pad:18px;--mask-feather:24px}
.destination::before{inset:-8px -18px -22px}
.destination::after{inset:-1px -8px -10px}
.destination-point{position:absolute;top:0;left:50%;width:10px;height:10px;border-radius:50%;transform:translate(-50%,-50%);background:var(--clay);z-index:7}
.gatherings .destination-point{background:var(--sage)}
.path-number{color:#817361;margin-top:20px}
.destination h3{font-size:26px;letter-spacing:.12em;font-weight:400;margin:20px 0}
.destination>p:not(.path-number){font-size:19px;line-height:1.55;min-height:90px}
.destination h3,.destination>p,.destination-image,.destination-link{position:relative;z-index:6}
.destination-image{aspect-ratio:3/4;margin-top:36px;background:linear-gradient(140deg,#cfbaa0,#80745f);overflow:hidden;border-radius:200px 200px 0 0}
.gathering-image{background:linear-gradient(140deg,#c4b99b,#737b60)}
.destination-image img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.65)}
.destination-image img.failed{display:none}
.destination-link{display:flex;align-items:center;flex-direction:column;width:fit-content;margin:30px auto 0;padding:10px 24px 26px}
.arrow{border:1px solid #a08061;border-radius:50%;width:54px;height:54px;display:grid;place-items:center;font:25px var(--sans);margin-bottom:16px;transition:background var(--duration),transform var(--duration)}
.gatherings .arrow{border-color:var(--sage)}
.destination-link:hover .arrow{background:var(--sand);transform:translateY(-4px)}
.destination-exit{position:absolute;left:50%;bottom:-38px;width:1px;height:1px;pointer-events:none}

.ending{padding:300px 0 clamp(260px,30vh,440px);min-height:980px}
#convergence-anchor{position:absolute;left:50%;top:-68px;width:1px;height:1px;pointer-events:none}
.ending>.eyebrow{line-height:2.1;--mask-pad:14px;--mask-feather:18px;border:1px solid color-mix(in srgb,var(--clay) 48%,var(--stone));color:var(--clay);border-radius:999px;padding:13px 26px 12px;font-weight:700;background:var(--bone)}
.ending>.small-rule{position:relative;z-index:4;--mask-pad:8px;--mask-feather:10px}
.ending-mark{width:92px;height:148px;margin:88px auto 0;display:grid;place-items:center;--mask-pad:18px;--mask-feather:22px;opacity:var(--ending-logo,0);transform:translateY(calc(12px * (1 - var(--ending-logo,0)))) scale(calc(.96 + .04 * var(--ending-logo,0)));transition:opacity .18s linear;will-change:opacity,transform}
.ending-mark img{width:92px;height:148px;display:block;position:relative;z-index:2}
#end-anchor{position:absolute;left:50.4088%;top:7.999%;width:1px;height:1px;pointer-events:none}
.ending .wordmark{display:inline-block;margin-top:54px;font-size:20px;--mask-pad:12px;--mask-feather:15px}


.ending-welcome{max-width:540px;margin:58px auto 0;padding:18px 24px 0;--mask-pad:18px;--mask-feather:22px}
.ending-welcome>p{font-size:clamp(18px,2vw,24px);line-height:1.55;font-style:italic;color:#655c50}
.subscribe-form{margin-top:44px;font-family:var(--sans)}
.subscribe-row{display:flex;justify-content:center;gap:10px;align-items:stretch}
.subscribe-row input{min-width:0;width:min(290px,58vw);border:1px solid var(--stone);background:transparent;color:var(--charcoal);padding:15px 16px;font:10px var(--sans);letter-spacing:.22em;text-transform:uppercase;border-radius:0}
.subscribe-row input::placeholder{color:#938675}
.subscribe-row button{border:1px solid var(--charcoal);background:var(--charcoal);color:var(--bone);padding:15px 18px;font:10px var(--sans);letter-spacing:.22em;cursor:pointer;transition:background var(--duration) var(--ease),color var(--duration) var(--ease),transform var(--duration) var(--ease)}
.subscribe-row button:hover{background:transparent;color:var(--charcoal);transform:translateY(-2px)}
.subscribe-status{min-height:24px;margin-top:14px;font:10px/1.8 var(--sans);letter-spacing:.12em;color:#756b5e;text-transform:uppercase}
.has-error input{border-color:var(--clay)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

footer{border-top:1px solid var(--stone);margin:0 var(--space);padding:30px 0;display:flex;justify-content:space-between;gap:20px;align-items:center;font:9px var(--sans);letter-spacing:.16em;position:relative;z-index:5;background:var(--bone)}
footer a{display:inline-block;min-height:44px;align-content:center}
footer div{display:flex;gap:25px}

.js .pull-diagram path{stroke-dasharray:1100;stroke-dashoffset:calc(1100 * (1 - var(--pull,0)))}
.js .labels{opacity:var(--pull,0)}
.js .return-words>*{opacity:var(--reveal,0);transform:translateY(calc(18px * (1 - var(--reveal,0))))}
.js .rings{opacity:var(--rings,0);transform:scale(calc(.94 + .06 * var(--rings,0)))}

@media(min-width:800px){
  .header.compact{position:fixed;padding-top:12px;padding-bottom:12px;background:#f4efe7ed;border-bottom:1px solid #d9cdbf55}
  .hero-mark{width:190px}.hero-mark img{width:190px;height:285px}
  .arrival h1{font-size:32px}
  .arrival{min-height:800px}
  .arrival-brand{margin-top:0}
}

@media(max-width:650px){
  :root{--mask-feather:13px;--mask-pad:9px}
  .header{padding-top:20px}
  .arrival{min-height:720px}
  .peripheral{font-size:8px}
  .p1{left:7%;top:31%}.p2{right:4%;top:25%}.p3{right:6%;top:68%}.p4{left:16%;top:75%}.p5{left:4%;top:57%}
  .outward{padding-top:75px;min-height:880px}
  .pull-diagram{height:560px;margin-top:15px}
  .labels{font-size:8px;letter-spacing:.12em;width:37%;top:60px;bottom:100px;line-height:1.8}
  .labels.left{left:-2%}.labels.right{right:-2%}
  .return{padding-top:55px;min-height:1200px}
  .return-field{width:340px;height:340px;margin-top:90px}
  .return-copy{margin-top:25px}
  .ways{padding-top:70px}
  #split-anchor{top:405px}
  .destinations{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px;margin-top:150px;padding:0 14px}
  .destination{width:auto;align-self:stretch;--mask-feather:16px;--mask-pad:10px;padding-top:18px}
  .destination h3{font-size:17px;letter-spacing:.1em;margin:14px 0}
  .destination>p:not(.path-number){font-size:13px;line-height:1.45;min-height:64px}
  .destination-image{margin-top:20px;border-radius:120px 120px 0 0}
  .destination-link{padding:8px 8px 18px;margin-top:22px;letter-spacing:.16em;font-size:7px}
  .arrow{width:42px;height:42px;font-size:20px;margin-bottom:12px}
  .path-number{font-size:7px;letter-spacing:.18em;margin-top:14px}
  .ending{padding-top:300px;padding-bottom:310px;min-height:980px}
  .ending-mark{margin-top:78px}
  footer{flex-direction:column;text-align:center;gap:8px}
  footer p{order:3;margin:14px 0}
  .chapter{font-size:9px}
  .ending .wordmark{font-size:18px}
  .arrival .scroll-cue{font-size:7px;bottom:34px;padding:12px 16px;gap:8px}
  .scroll-cue .cue-arrow{font-size:12px}
  .ending-welcome{max-width:88vw;margin-top:48px;padding-left:18px;padding-right:18px}
  .subscribe-row{flex-direction:column;align-items:center}
  .subscribe-row input{width:min(310px,78vw)}
  .subscribe-row button{width:min(310px,78vw)}
}


html:not(.js) main::before{content:"";position:absolute;top:600px;bottom:600px;left:50%;width:1px;background:var(--line);z-index:1}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition:none!important}
  .peripheral>span{animation:none!important}
  .js .pull-diagram path{stroke-dashoffset:0}
  .js .labels,.js .rings,.js .return-words>*{opacity:1;transform:none}
  #awareness,#awareness-sage{display:none}
  .ending-mark{opacity:1;transform:none}
}

@media(min-width:651px){
  .destination{min-width:0}
  .destination>p:not(.path-number){font-size:clamp(16px,1.6vw,19px)}
}
