:root{--ease-out:cubic-bezier(0.23,1,0.32,1);--pine:#22634f;--ink:#222;--muted:#6a6a6a;--soft:#f7f7f5;--pale:#edf5f0;--leaf:#cce3b0;--line:#e8e8e6;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:white;font-synthesis:none}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0}a{color:inherit;text-decoration:none}button{font:inherit}a,button{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--pine);outline-offset:6px}.skip{position:absolute;top:-60px;left:20px;padding:12px;background:white;z-index:10}.skip:focus{top:10px}.header,footer{max-width:1240px;margin:auto;padding:28px 48px;display:flex;align-items:center;justify-content:space-between}.brand{display:inline-flex;align-items:center;gap:10px;font-size:18px;font-weight:700;letter-spacing:-.5px}.brand img{border-radius:12px}.header-link{font-size:14px;font-weight:600;padding:12px 0}.header-link span{margin-left:10px}.hero{max-width:1240px;margin:0 auto;min-height:780px;padding:45px 48px 90px;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:60px}.intro{padding-bottom:12px;position:relative;z-index:1}h1{font-size:clamp(80px,8.8vw,124px);line-height:.95;letter-spacing:-8px;font-weight:750;margin:0 0 42px}.rep{color:var(--pine);position:relative;display:inline-block}.period{color:var(--ink)}.rep svg{position:absolute;bottom:-20px;left:-3px;width:100%;height:23px;fill:none;stroke:var(--leaf);stroke-width:5;stroke-linecap:round}.lede{font-size:28px;line-height:1.25;letter-spacing:-.8px;margin:0 0 19px;font-weight:550}.description{font-size:17px;color:var(--muted);line-height:1.6;margin:0 0 28px}.primary{display:inline-flex;align-items:center;justify-content:space-between;gap:34px;background:var(--pine);color:white;padding:17px 24px;border-radius:16px;font-weight:650;font-size:16px;box-shadow:0 2px 4px #2222221a;transition:transform 100ms var(--ease-out)}.availability{display:flex;gap:8px;align-items:center;color:var(--muted);font-size:12px;margin-top:18px}.dot{width:6px;height:6px;border-radius:50%;background:var(--pine)}.hero-visual{position:relative;display:flex;align-items:center;justify-content:center;min-height:640px}.halo{position:absolute;width:110%;height:78%;border-radius:48%;background:var(--pale);transform:rotate(-12deg)}.phone{position:relative;overflow:hidden;background:#fff;border:7px solid #292b29;border-radius:49px;box-shadow:0 0 0 1px #9a9d98,0 6px 16px #22222212,0 30px 55px -18px #172d2240;width:300px;flex-shrink:0}.phone img{display:block;width:100%;height:auto;aspect-ratio:1206/2622;object-fit:cover}.island{position:absolute;top:10px;left:50%;transform:translateX(-50%);width:30%;height:22px;border-radius:20px;background:#161716}.hero-phone{transform:rotate(5deg);animation:arrive .8s cubic-bezier(.2,.8,.2,1) both}.little-note{position:absolute;bottom:53px;left:-6px;background:white;display:flex;align-items:center;gap:10px;padding:16px 20px;border-radius:20px;font-size:14px;font-weight:600;box-shadow:0 2px 4px #2222220a,0 6px 16px #22222212;transform:rotate(-5deg);animation:note .65s .3s both}.check{background:var(--leaf);color:var(--pine);border-radius:50%;display:grid;place-items:center;width:28px;height:28px;font-size:17px}.showcase{border-top:1px solid var(--line);max-width:1144px;margin:0 auto;padding:85px 0;display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}.showcase-copy h2{font-size:52px;line-height:1.05;letter-spacing:-2px;margin:0 0 35px}.tabs{display:grid;gap:12px;max-width:435px}.tabs button{border:1px solid transparent;border-radius:22px;background:transparent;text-align:left;padding:22px 18px;display:flex;gap:16px;align-items:center;cursor:pointer;transition:transform 100ms var(--ease-out)}.tabs button[aria-selected=true]{background:white;box-shadow:0 2px 4px #2222220a,0 6px 16px #22222212;border-color:#f5f5f3}.step{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}.tabs button[aria-selected=true] .step{color:var(--pine)}.tabs strong{display:block;font-size:18px;letter-spacing:-.4px;font-weight:650}.tab-description{display:block;font-size:13px;color:var(--muted);margin-top:7px;line-height:1.5}.tab-arrow{margin-left:auto;color:var(--pine);opacity:0;font-size:20px}.tabs button[aria-selected=true] .tab-arrow{opacity:1}.preview-stage{padding:36px 20px 20px;background:var(--soft);border-radius:40px;display:flex;align-items:center;flex-direction:column;gap:24px;min-width:0}.preview-phone{width:270px;border-radius:43px;border-width:6px;box-shadow:0 0 0 1px #9a9d98,0 10px 32px #22222218}.preview-phone .island{height:19px;top:9px}#preview-image{transition:opacity .16s,transform .25s}.changing #preview-image{opacity:0;transform:translateY(6px)}.screen-caption{font-size:11px;color:var(--muted)}.closing{background:var(--pine);color:white;border-radius:40px;margin:0 auto 56px;max-width:1144px;padding:58px;text-align:center}.closing-mark{display:grid;place-items:center;font-size:32px;background:var(--leaf);color:var(--pine);height:64px;width:64px;border-radius:21px;transform:rotate(-9deg);margin:0 auto 24px}.closing h2{font-size:48px;line-height:1.06;letter-spacing:-2px;margin:0 0 16px}.closing p{font-size:16px;color:#e0ede6;margin:0 0 24px}.coming-soon{display:inline-block;border:1px solid #ffffff45;border-radius:100px;padding:10px 17px;font-size:12px}footer{padding-top:0;padding-bottom:35px;color:var(--muted);font-size:12px;gap:16px}footer .brand{font-size:14px;color:var(--ink)}footer a:hover{text-decoration:underline}@keyframes arrive{from{opacity:0;transform:translateY(25px) rotate(1deg)}to{opacity:1;transform:translateY(0) rotate(5deg)}}@keyframes note{from{opacity:0;transform:translateY(14px) rotate(-2deg)}to{opacity:1;transform:translateY(0) rotate(-5deg)}}
@media(min-width:1440px){.hero{min-height:820px}.hero-phone{width:320px}}@media(max-width:950px){.header,footer{padding-left:28px;padding-right:28px}.hero{padding:40px 28px 60px;gap:20px;min-height:690px}h1{font-size:94px;letter-spacing:-6px}.hero-visual{min-height:570px}.hero-phone{width:255px}.phone{border-radius:43px}.island{height:18px;top:8px}.little-note{left:-18px;bottom:45px;font-size:12px;padding:12px}.showcase{margin:0 28px;gap:32px;padding:60px 0}.showcase-copy h2{font-size:42px}.preview-phone{width:235px;border-radius:38px}.tabs button{padding:18px 12px;gap:12px}.tabs strong{font-size:16px}.closing{margin:0 28px 40px}}
@media(max-width:640px){.header{padding:22px}.brand{font-size:16px}.brand img{width:32px;height:32px}.header-link{font-size:12px}.hero{padding:28px 24px 38px;grid-template-columns:1fr;gap:26px;text-align:center}.intro{padding:0}h1{font-size:92px;line-height:.93;letter-spacing:-6px;margin:0 0 35px}.lede{font-size:24px;margin-bottom:14px}.description{font-size:15px;margin-bottom:22px}.availability{justify-content:center;margin-top:14px}.primary{padding:15px 22px;font-size:14px}.hero-visual{min-height:585px;margin:0 14px}.hero-phone{width:255px}.halo{width:112%;height:78%}.little-note{left:-20px;bottom:32px}.showcase{grid-template-columns:1fr;padding:40px 0;margin:0 22px;gap:28px}.showcase-copy h2{font-size:39px;text-align:center;margin:0 0 24px}.tabs{max-width:none;gap:8px}.tabs button{padding:15px 18px}.tabs strong{font-size:16px}.tab-description{font-size:12px;margin-top:4px}.preview-stage{border-radius:30px;padding-top:28px}.preview-phone{width:260px;border-radius:42px}.closing{margin:0 22px 34px;padding:38px 20px;border-radius:30px}.closing h2{font-size:39px}.closing p{font-size:14px}.closing-mark{height:54px;width:54px;font-size:27px}footer{padding:0 22px 28px;flex-wrap:wrap;gap:14px}footer .brand{flex-basis:100%}footer span:last-child{margin-left:auto}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.hero-phone{transform:rotate(5deg)}}
/* Keep the decorative halo inside the page on narrow phones. */
.hero{overflow:clip}
@media(max-width:640px){h1{font-size:76px;letter-spacing:-5px}.hero-visual{min-height:570px}}

/* Feedback is pointer-only. Keyboard navigation and Reduced Motion stay still. */
@media (hover:hover) and (pointer:fine){
  html:not([data-input="keyboard"]) .primary:hover:not([data-pressed]){background:#194c3d;transform:translateY(-2px)}
  html:not([data-input="keyboard"]) .tabs button:hover{background:var(--soft)}
}
.primary[data-pressed]{transform:scale(.98);transition-duration:160ms}
.tabs button[data-pressed]{transform:scale(.99)}
html[data-input="keyboard"]{scroll-behavior:auto}
html[data-input="keyboard"] :is(.primary,.tabs button,#preview-image){transition:none}
@media(prefers-reduced-motion:reduce){
  .primary,.tabs button{transform:none!important}
}

/* The product story stays readable and flat; screenshots carry the visual detail. */
.intro .description{max-width:390px}
.routine-intro{max-width:1144px;margin:0 auto;padding:48px 0 64px;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:start}
.routine-intro h2{font-size:42px;line-height:1.08;letter-spacing:-1.6px;margin:0}
.routine-options p{font-size:16px;line-height:1.65;color:var(--muted);margin:0 0 20px;max-width:470px}
.routine-options p:last-child{margin-bottom:0}
.routine-options strong{display:block;color:var(--ink);font-weight:650;margin-bottom:4px}
.tabs button>span:nth-child(2){min-width:0;flex:1}
.tab-arrow,.step{flex-shrink:0}
.closing p{line-height:1.6}
@media(max-width:950px){.routine-intro{margin:0 28px;gap:32px}.routine-intro h2{font-size:36px}}
@media(max-width:640px){
  .intro .description{margin-left:auto;margin-right:auto}
  .routine-intro{margin:0 22px;padding:32px 0;grid-template-columns:1fr;gap:22px}
  .routine-intro h2{font-size:34px;text-align:center}
  .routine-options p{font-size:15px}
}