:root { --ink:#142a2b; --cream:#f2f0e7; --mint:#b7e7d5; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--cream); color:var(--ink); font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue",sans-serif; }
button,a { touch-action:manipulation; }
a { color:inherit; text-underline-offset:5px; }
a:focus-visible,button:focus-visible { outline:3px solid #b7e7d5; outline-offset:5px; }
.skip-link { position:fixed; z-index:99; top:-80px; left:20px; background:#b7e7d5; color:#142a2b; padding:12px 16px; }
.skip-link:focus { top:12px; }
.masthead { position:absolute; z-index:20; top:0; left:0; right:0; height:100px; display:flex; align-items:center; justify-content:space-between; padding:0 clamp(24px,4.8vw,86px); color:#f0f4ea; border-bottom:1px solid #e4fff51b; }
.wordmark { display:inline-flex; align-items:center; gap:13px; text-decoration:none; font:700 32px/1 "Iowan Old Style",Baskerville,Georgia,serif; letter-spacing:-.06em; }
.wordmark-dot { color:#b7e7d5; }
.mark { display:inline-flex; align-items:center; justify-content:center; gap:4px; width:34px; height:34px; border-radius:11px; background:#b7e7d5; box-shadow:0 0 24px #b7e7d555; }
.mark:before,.mark:after { content:""; width:4px; height:14px; border-radius:4px; background:#173c3a; }
.masthead nav { display:flex; gap:clamp(20px,3vw,52px); }
.masthead nav a { font-size:12px; text-decoration:none; text-transform:uppercase; letter-spacing:.16em; font-weight:700; transition:color .2s; }
.masthead nav a:hover { color:#b7e7d5; }
.world { height:max(790px,100svh); position:relative; overflow:hidden; isolation:isolate; color:#f5f2e7; background:radial-gradient(ellipse at 51% 66%,#315c5e 0%,#14333e 34%,#091925 68%,#06111d 100%); transition:background 1s; }
.world[data-scene=day] { background:radial-gradient(ellipse at 70% 44%,#e9e5c9 0%,#c7dde0 35%,#88afbd 70%,#7099a9 100%); color:#17353a; }
.sky-grain { position:absolute; inset:0; pointer-events:none; opacity:.32; background-image:repeating-linear-gradient(0deg,#ffffff0b 0 1px,transparent 1px 4px); mask-image:linear-gradient(#000,transparent 75%); }
.starfield { position:absolute; inset:0; pointer-events:none; transition:opacity .7s; }
.starfield-far { opacity:.65; background-image:radial-gradient(circle at 9% 17%,#fff 0 1px,transparent 1.5px),radial-gradient(circle at 24% 38%,#d9f9ee 0 1px,transparent 2px),radial-gradient(circle at 52% 13%,#fff 0 1px,transparent 2px),radial-gradient(circle at 73% 30%,#fff 0 1px,transparent 1.5px),radial-gradient(circle at 93% 11%,#fff 0 1px,transparent 1.5px); background-size:231px 239px,331px 271px,287px 197px,391px 317px,459px 389px; }
.starfield-near { opacity:.7; background-image:radial-gradient(circle at 18% 42%,#fff 0 1.6px,transparent 2.5px),radial-gradient(circle at 81% 18%,#dcfff0 0 1.6px,transparent 2.5px),radial-gradient(circle at 65% 61%,#fff 0 1.3px,transparent 2.3px); background-size:523px 337px,619px 491px,701px 367px; animation:star-drift 18s ease-in-out infinite alternate; }
.world[data-scene=day] .starfield { opacity:0; }
.celestial { position:absolute; top:20%; right:19%; width:clamp(65px,6vw,98px); aspect-ratio:1; border-radius:50%; background:#f4f2df; box-shadow:0 0 30px #d6f3e96e,0 0 90px #d6f3e947,0 0 190px #e5fff023; opacity:.88; transition:all 1s; }
.world[data-scene=day] .celestial { top:21%; right:17%; width:clamp(120px,10vw,190px); background:#fffae2; box-shadow:0 0 55px #fff5cb,0 0 170px #fff8d5,0 0 300px #fff9d2; opacity:.9; }
.world-content { position:absolute; z-index:3; left:clamp(24px,8vw,150px); top:23%; right:22%; max-width:1300px; }
.overline { font-size:12px; line-height:1.2; font-weight:700; text-transform:uppercase; letter-spacing:.24em; color:#b9e4d3; margin:0; }
.world[data-scene=day] .overline { color:#23555c; }
.world h1,.ritual h2 { font:400 clamp(92px,12vw,215px)/.86 "Iowan Old Style",Baskerville,Georgia,serif; letter-spacing:-.075em; margin:32px 0 0; }
.world h1 em,.ritual h2 em { font-weight:400; font-style:italic; }
.world h1 em { color:#bde7d8; white-space:nowrap; }
.world[data-scene=day] h1 em { color:#194b4e; text-shadow:none; }
.hero-undertext { display:flex; align-items:end; gap:60px; margin-top:32px; }
.hero-undertext p { font-size:clamp(17px,1.7vw,22px); line-height:1.5; max-width:420px; margin:0; color:#d9e5db; }
.world[data-scene=day] .hero-undertext p { color:#1c4549; }
.text-link { display:inline-flex; gap:40px; align-items:center; text-decoration:none; border-bottom:1px solid currentColor; padding-bottom:9px; font-size:13px; font-weight:700; text-transform:uppercase; letter-spacing:.14em; white-space:nowrap; transition:gap .2s; }
.text-link:hover { gap:50px; }
.world-aside { position:absolute; z-index:5; top:145px; right:clamp(24px,4.8vw,86px); display:flex; flex-direction:column; align-items:end; gap:40px; }
.scene-picker { display:flex; gap:11px; align-items:center; font-size:12px; letter-spacing:.1em; }
.scene-switch { border:0; background:transparent; color:inherit; opacity:.55; cursor:pointer; font:700 12px/1 -apple-system,BlinkMacSystemFont,sans-serif; text-transform:uppercase; letter-spacing:.14em; padding:6px 1px; }
.scene-switch.active { opacity:1; border-bottom:1px solid currentColor; }
.world-aside p { font:400 31px/1 "Iowan Old Style",Baskerville,Georgia,serif; margin:0; text-align:right; }
.world-aside p span { display:block; font:600 10px/1.5 -apple-system,BlinkMacSystemFont,sans-serif; text-transform:uppercase; letter-spacing:.15em; margin-top:9px; }
.world-footer { position:absolute; z-index:6; left:clamp(24px,4.8vw,86px); right:clamp(24px,4.8vw,86px); bottom:35px; display:flex; align-items:end; justify-content:space-between; gap:20px; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.13em; color:#e5eee5; }
.world[data-scene=day] .world-footer { color:#f4f8ef; }
.scroll-note { border-left:1px solid currentColor; padding-left:18px; }
.scroll-note span { margin-left:12px; }
.wave { position:absolute; left:-3%; width:106%; height:28%; bottom:-7%; pointer-events:none; will-change:transform; }
.wave path { transition:fill 1s; }
.wave-rear { z-index:1; bottom:0; animation:rise 11s ease-in-out infinite alternate; }
.wave-rear path { fill:#23726a9c; }
.wave-front { z-index:2; animation:rise-front 9s ease-in-out infinite alternate; }
.wave-front path { fill:#0a3437; }
.world[data-scene=day] .wave-rear path { fill:#79b5adbd; }
.world[data-scene=day] .wave-front path { fill:#336f70; }
.ritual { background:#f2f0e7; padding:125px clamp(24px,5vw,90px) 145px; transition:background .55s; }
.ritual[data-break=move] { background:#f3e7df; }
.ritual[data-break=breathe] { background:#e5e8e7; }
.ritual-heading { max-width:1500px; margin:0 auto 90px; display:grid; grid-template-columns:1fr 1.4fr .8fr; gap:5vw; align-items:end; }
.dark-overline { color:#447568; align-self:start; }
.ritual h2 { font-size:clamp(58px,6.3vw,108px); line-height:.94; margin:0; }
.ritual h2 em { color:#36806c; white-space:nowrap; }
.ritual-heading>p:last-child { font-size:17px; line-height:1.55; max-width:280px; margin:0; color:#536961; }
.ritual-stage { max-width:1500px; margin:auto; display:grid; grid-template-columns:minmax(240px,.48fr) minmax(0,1fr); gap:6vw; align-items:center; }
.ritual-menu { border-top:1px solid #8fa99c; }
.break-choice { display:grid; grid-template-columns:44px 1fr; column-gap:10px; width:100%; padding:26px 0 27px; text-align:left; background:transparent; color:#1d4441; border:0; border-bottom:1px solid #8fa99c; cursor:pointer; opacity:.5; transition:opacity .2s,padding-left .2s; }
.break-choice:hover,.break-choice.active { opacity:1; padding-left:12px; }
.break-choice .choice-number { font-size:13px; font-weight:700; letter-spacing:.1em; padding-top:7px; }
.break-choice span:nth-child(2) { font:400 clamp(36px,3.5vw,56px)/1 "Iowan Old Style",Baskerville,Georgia,serif; letter-spacing:-.06em; }
.break-choice small { grid-column:2; font-size:11px; text-transform:uppercase; letter-spacing:.16em; margin-top:9px; }
.ritual-picture { min-width:0; }
.ritual-picture img { display:block; width:100%; height:auto; box-shadow:0 42px 70px #1c3d3c27; transition:opacity .3s; }
.ritual-picture p { font:italic 25px/1.3 "Iowan Old Style",Baskerville,Georgia,serif; margin:22px 0 0; text-align:right; color:#467166; }
.details { background:#0c2027; color:#f1f1e9; padding:130px clamp(24px,5vw,90px) 155px; position:relative; overflow:hidden; }
.details:before { content:"still"; position:absolute; left:-.04em; bottom:-.31em; color:#f2f7eb06; font:400 clamp(240px,39vw,680px)/1 "Iowan Old Style",Baskerville,Georgia,serif; letter-spacing:-.1em; pointer-events:none; }
.details-top,.details-list { position:relative; z-index:1; max-width:1500px; margin:auto; }
.details-top { display:grid; grid-template-columns:1fr 2fr; gap:5vw; align-items:start; margin-bottom:100px; }
.details h2 { font:400 clamp(58px,6.6vw,112px)/.98 "Iowan Old Style",Baskerville,Georgia,serif; letter-spacing:-.068em; margin:0; }
.details h2 em { color:#b7e7d5; font-weight:400; }
.details-list { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid #b7e7d547; }
.details-list>div { min-width:0; padding:30px 32px 80px 0; border-right:1px solid #b7e7d547; }
.details-list>div:not(:first-child) { padding-left:32px; }
.details-list>div:last-child { border-right:0; }
.details-list span { color:#b7e7d5; font:700 12px/1 -apple-system,BlinkMacSystemFont,sans-serif; letter-spacing:.16em; }
.details-list h3 { font:400 clamp(30px,3vw,48px)/1.04 "Iowan Old Style",Baskerville,Georgia,serif; letter-spacing:-.045em; margin:55px 0 18px; max-width:340px; }
.details-list p { color:#bfd0c9; font-size:16px; line-height:1.65; max-width:350px; margin:0; }
.privacy-statement { max-width:1600px; margin:auto; padding:140px clamp(24px,5vw,90px) 160px; display:grid; grid-template-columns:1fr 2.4fr; gap:4vw; }
.privacy-statement h2 { grid-column:2; font:400 clamp(65px,7.3vw,125px)/.95 "Iowan Old Style",Baskerville,Georgia,serif; letter-spacing:-.069em; margin:0; }
.privacy-statement h2 em { color:#4b927e; font-weight:400; }
.privacy-statement>div { grid-column:2; display:flex; align-items:end; gap:70px; margin-top:38px; }
.privacy-statement>div p { font-size:20px; line-height:1.55; max-width:500px; margin:0; color:#4c655e; }
.privacy-statement .text-link { font-size:11px; }
.outro { background:#d1dfd3; padding:130px 24px 135px; text-align:center; }
.outro-mark { width:54px; height:54px; border-radius:16px; margin:0 auto 30px; box-shadow:none; }
.outro-mark:before,.outro-mark:after { height:21px; width:5px; }
.outro .overline { color:#3a7666; }
.outro h2 { font:400 clamp(66px,8.7vw,145px)/.94 "Iowan Old Style",Baskerville,Georgia,serif; letter-spacing:-.068em; margin:24px 0 33px; }
.outro h2 em { color:#397d69; font-weight:400; }
.outro>p:not(.overline) { color:#345d50; font-size:18px; line-height:1.5; margin:0 0 8px; }
.outro .outro-meta { font-size:13px!important; margin-bottom:28px!important; }
.outro .text-link { margin:0 auto; font-size:11px; }
.home-footer { display:flex; justify-content:space-between; align-items:center; gap:25px; background:#0c2027; color:#d4e0d8; padding:32px clamp(24px,5vw,90px); font-size:12px; }
.home-footer a { text-decoration:none; }
.home-footer a:hover { color:#b7e7d5; }
.footer-brand { font:400 19px/1 "Iowan Old Style",Baskerville,Georgia,serif; }
.home-footer nav { display:flex; flex-wrap:wrap; gap:22px; }
@keyframes star-drift { to { transform:translate(20px,11px); } }
@keyframes rise { to { transform:translateY(-25px) translateX(1%); } }
@keyframes rise-front { to { transform:translateY(17px) translateX(-1%); } }
@media(max-width:900px) { .world-content { right:8%; top:29%; } .world h1 { font-size:clamp(75px,12vw,120px); } .ritual-heading { grid-template-columns:1fr 1.5fr; } .ritual-heading>p:last-child { grid-column:2; } .ritual-stage { grid-template-columns:1fr; } .ritual-menu { display:grid; grid-template-columns:repeat(3,1fr); } .break-choice { border-right:1px solid #8fa99c; padding:18px 12px; } .break-choice:last-child { border-right:0; } .break-choice:hover,.break-choice.active { padding-left:12px; } .details-top { grid-template-columns:1fr 2fr; } .details-list h3 { margin-top:40px; } .privacy-statement>div { display:block; } .privacy-statement .text-link { margin-top:25px; } }
@media(max-width:650px) { .masthead { height:76px; padding-inline:22px; } .wordmark { font-size:27px; } .mark { width:30px; height:30px; } .masthead nav { gap:17px; } .masthead nav a { font-size:10px; letter-spacing:.07em; } .masthead nav a:nth-child(2) { display:none; } .world { height:max(760px,100svh); } .world-content { top:26%; left:22px; right:22px; } .world h1 { font-size:clamp(65px,15vw,99px); line-height:.92; margin-top:24px; } .world h1 em { white-space:normal; } .hero-undertext { display:block; margin-top:33px; } .hero-undertext p { max-width:330px; font-size:18px; } .text-link { margin-top:25px; } .world-aside { top:101px; right:22px; gap:0; } .world-aside p { display:none; } .world-footer { left:22px; right:22px; bottom:22px; font-size:10px; } .world-footer span:first-child,.scroll-note { display:none; } .wave { height:29%; bottom:0; } .wave-rear { bottom:8%; } .ritual { padding:80px 22px 92px; } .ritual-heading { display:block; margin-bottom:42px; } .ritual h2 { font-size:clamp(55px,12vw,78px); margin:23px 0; } .ritual-heading>p:last-child { font-size:16px; } .ritual-menu { grid-template-columns:1fr 1fr 1fr; } .break-choice { display:block; padding:15px 5px; text-align:center; } .break-choice:hover,.break-choice.active { padding-left:5px; } .break-choice .choice-number { display:block; padding:0; font-size:10px; } .break-choice span:nth-child(2) { display:block; font-size:27px; margin-top:7px; } .break-choice small { display:block; font-size:9px; letter-spacing:.05em; margin-top:5px; } .ritual-picture p { text-align:left; font-size:21px; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } .starfield,.wave { animation:none; } .world,.celestial,.starfield,.wave path,.ritual,.ritual-picture img { transition:none; } }
@media(max-width:650px) {
  .celestial { top:16%; right:10%; width:74px; }
  .world[data-scene=day] .celestial { top:17%; right:3%; width:82px; }
  .details { padding:86px 22px 85px; }
  .details:before { font-size:300px; bottom:-.12em; }
  .details-top { display:block; margin-bottom:54px; }
  .details h2 { font-size:clamp(50px,11.6vw,75px); margin-top:25px; }
  .details-list { display:block; }
  .details-list>div,.details-list>div:not(:first-child) { border-right:0; border-bottom:1px solid #b7e7d547; padding:25px 0 35px; }
  .details-list h3 { font-size:38px; margin:25px 0 12px; }
  .details-list p { font-size:16px; }
  .privacy-statement { display:block; padding:90px 22px 100px; }
  .privacy-statement h2 { font-size:clamp(54px,11vw,78px); margin:24px 0 0; }
  .privacy-statement>div { margin-top:28px; }
  .privacy-statement>div p { font-size:18px; }
  .outro { padding:95px 22px 100px; }
  .outro h2 { font-size:clamp(61px,12vw,90px); }
  .home-footer { display:block; padding:33px 22px; }
  .home-footer span { display:block; margin:8px 0 20px; }
  .home-footer nav { gap:14px 23px; }
}

/* App Store availability */
.app-store-button { display:inline-flex; justify-content:center; align-items:center; flex-shrink:0; max-width:100%; min-height:48px; padding:15px 21px; border-radius:100px; background:#b7e7d5; color:#153833; font-size:14px; font-weight:700; line-height:1.35; text-align:center; text-decoration:none; }
.app-store-button:hover { background:#d7ffed; }
.outro-download { margin:0 0 26px; }
.outro .app-store-button { background:#153833; color:#eff8ed; }
.outro .app-store-button:hover { background:#23554c; }
.hero-undertext { flex-wrap:wrap; gap:24px 36px; }
@media(max-width:650px) { .hero-undertext .app-store-button { margin-top:25px; } }

/* Store details and screenshot demo */
.hero-download { min-width:0; max-width:100%; }
.hero-undertext .hero-price { font-size:13px; line-height:1.5; margin:10px 0 0; max-width:360px; }
.demo { padding:70px clamp(24px,5vw,90px) 0; }
.demo video { display:block; width:100%; max-width:1500px; height:auto; aspect-ratio:16 / 9; margin:0 auto; background:#0c2027; }
@media(max-width:650px) { .demo { padding:50px 22px 0; } }
