:root {
  --ink: #211126;
  --eggplant: #40144f;
  --plum: #57206e;
  --violet: #6d3585;
  --lilac: #cdb6e8;
  --mist: #f5f0f8;
  --ivory: #fffdf9;
  --sand: #f3ece5;
  --peach: #ffbd9f;
  --rose: #eaa2b5;
  --mint: #b9d9cb;
  --line: rgba(64, 20, 79, 0.15);
  --serif: "Playfair Display", Georgia, serif;
  --sans: "Manrope", Arial, sans-serif;
  --mono: "DM Mono", monospace;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--ivory); color: var(--ink); font-family: var(--sans); -webkit-font-smoothing: antialiased; }
body:has(.site-nav.open) { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button, input, select { font: inherit; }
button { cursor: pointer; }
img { display: block; max-width: 100%; }

.skip-link { position: fixed; z-index: 1000; left: 1rem; top: -5rem; padding: .75rem 1rem; color: white; background: var(--plum); border-radius: .5rem; transition: top .2s; }
.skip-link:focus { top: 1rem; }
.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; }
.section-frame { width: min(100% - 3rem, 1230px); margin-inline: auto; }

.site-header { width: min(100% - 3rem, 1230px); min-height: 88px; margin: auto; display: flex; align-items: center; justify-content: space-between; position: relative; z-index: 20; }
.brand { width: 176px; position: relative; z-index: 21; }
.brand img { width: 100%; height: auto; }
.site-nav { display: flex; align-items: center; gap: 2rem; color: #542260; font-size: .82rem; font-weight: 700; letter-spacing: -.02em; }
.site-nav > a:not(.nav-cta) { position: relative; padding: .7rem 0; }
.site-nav > a:not(.nav-cta)::after { content: ""; position: absolute; left: 0; right: 100%; bottom: .45rem; height: 1px; background: currentColor; transition: right .25s ease; }
.site-nav > a:not(.nav-cta):hover::after, .site-nav > a:not(.nav-cta):focus-visible::after { right: 0; }
.nav-cta { display: inline-flex; gap: .6rem; align-items: center; padding: .72rem 1rem; border: 1px solid var(--line); border-radius: 999px; transition: transform .2s, background .2s; }
.nav-cta:hover { transform: translateY(-2px); background: var(--mist); }
.menu-toggle { display: none; border: 0; padding: .55rem; background: none; }
.menu-toggle span:not(.sr-only) { width: 24px; height: 2px; display: block; margin: 4px; background: var(--plum); transition: transform .2s, opacity .2s; }

.hero { min-height: 650px; padding: 3.5rem 0 5rem; display: grid; grid-template-columns: .92fr 1.08fr; gap: 3rem; align-items: center; overflow: hidden; }
.hero-copy { position: relative; z-index: 3; padding-block: 2rem; }
.eyebrow { margin: 0 0 1.35rem; color: var(--violet); font: 500 .72rem/1.1 var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.eyebrow-dark { color: var(--plum); }
.eyebrow-light { color: #f7eefd; }
.pulse-dot { display: inline-block; width: .55rem; height: .55rem; margin-right: .5rem; border-radius: 50%; background: #b37ddb; box-shadow: 0 0 0 5px rgba(179,125,219,.18); }
h1, h2, h3, p { margin-top: 0; }
h1 { max-width: 650px; margin-bottom: 1.5rem; color: var(--eggplant); font: 700 clamp(3.25rem, 6.2vw, 5.8rem)/.94 var(--serif); letter-spacing: -.065em; }
h1 em, h2 em { color: var(--violet); font-weight: 600; }
.hero-lede { max-width: 485px; margin-bottom: 2rem; color: #5e5261; font-size: 1.04rem; line-height: 1.75; }
.hero-actions { display: flex; align-items: center; gap: 1.4rem; flex-wrap: wrap; }
.button { display: inline-flex; justify-content: center; align-items: center; gap: 1.1rem; padding: 1rem 1.25rem; border: 0; border-radius: .55rem; font-size: .83rem; font-weight: 800; transition: transform .2s ease, box-shadow .2s ease, background .2s ease; }
.button:hover { transform: translateY(-3px); }
.button-primary { color: white; background: var(--plum); box-shadow: 0 12px 24px rgba(83, 30, 105, .17); }
.button-primary:hover { background: #6b2d7f; box-shadow: 0 16px 30px rgba(83, 30, 105, .24); }
.button-ink { width: 100%; color: white; background: var(--ink); margin-top: 1.1rem; }
.button-ink:hover { background: #3c1b47; box-shadow: 0 13px 26px rgba(24, 13, 29,.23); }
.text-link { color: var(--plum); font-size: .83rem; font-weight: 800; }
.text-link span { display: inline-block; margin-left: .45rem; transition: transform .2s; }
.text-link:hover span { transform: translateY(3px); }
.hero-note { display: flex; align-items: center; gap: .85rem; margin-top: 3.3rem; color: #6a606c; font-size: .72rem; line-height: 1.4; }
.hero-note p { margin: 0; max-width: 260px; }
.hero-note strong { color: var(--ink); }
.avatar-stack { display: flex; padding-left: .4rem; }
.avatar-stack span { width: 28px; height: 28px; margin-left: -.4rem; border: 2px solid var(--ivory); border-radius: 50%; display: grid; place-items: center; background: #e0c5d9; color: var(--plum); font-size: .58rem; font-weight: 800; }
.avatar-stack span:nth-child(2) { background: var(--mint); }.avatar-stack span:nth-child(3) { background: var(--peach); }

.hero-visual { min-height: 540px; position: relative; isolation: isolate; }
.hero-visual-ground { position: absolute; z-index: -3; inset: 5% 2% 4% 5%; background: linear-gradient(135deg, #f4eaf8, #f6dede); border-radius: 47% 53% 45% 55% / 39% 42% 58% 61%; transform: rotate(-4deg); }
.hero-arc { position: absolute; z-index: -2; border-radius: 50%; border: 1px solid rgba(110, 53, 133, .18); }
.arc-one { width: 470px; height: 470px; left: 6%; top: 4%; }.arc-two { width: 355px; height: 355px; right: 1%; bottom: 7%; }
.hero-art { position: absolute; z-index: -1; width: min(100%, 620px); max-height: 540px; object-fit: cover; object-position: center; left: 2%; top: 3%; mix-blend-mode: multiply; border-radius: 41% 59% 49% 51% / 50% 38% 62% 50%; filter: saturate(.95) contrast(1.02); }
.signal-card { position: absolute; display: flex; align-items: center; gap: .65rem; padding: .74rem .85rem; border: 1px solid rgba(255,255,255,.72); border-radius: .8rem; background: rgba(255,255,255,.85); backdrop-filter: blur(11px); box-shadow: 0 12px 30px rgba(64,20,79,.11); color: var(--ink); }
.signal-card b, .signal-card small { display: block; }.signal-card b { font-size: .68rem; }.signal-card small { margin-top: .16rem; color: #7c6c81; font-size: .55rem; }.signal-card > strong { margin-left: .5rem; color: var(--violet); font: 500 .64rem var(--mono); }
.signal-icon { width: 25px; height: 25px; display: grid; place-items: center; border-radius: .5rem; font-size: 1rem; }.icon-clock { color: white; background: var(--violet); }.icon-check { color: var(--plum); background: #e8d9f0; }
.card-screen-time { right: -2%; top: 18%; }.card-checkin { left: -4%; bottom: 19%; }.hero-spark { position: absolute; color: var(--violet); font-size: 1.55rem; }.spark-a { left: 7%; top: 18%; }.spark-b { right: 6%; bottom: 14%; color: #d47597; }

.signal-band { display: flex; justify-content: center; align-items: center; gap: clamp(1rem, 4vw, 4.5rem); padding: 1.15rem 1rem; background: var(--plum); color: #fff7ff; font-size: .72rem; font-weight: 700; text-align: center; }.band-icon { margin-right: .45rem; color: var(--peach); }

.intro { padding-block: 8.5rem; }.section-intro { max-width: 675px; margin-bottom: 4.5rem; }.section-intro h2, .how-header h2 { margin-bottom: 1.1rem; color: var(--eggplant); font: 700 clamp(2.35rem, 4.1vw, 4rem)/1.03 var(--serif); letter-spacing: -.055em; }.section-intro > p:last-child { max-width: 545px; margin: 0; color: #6b5f6d; font-size: .98rem; line-height: 1.8; }
.feature-collection { display: grid; grid-template-columns: 1.13fr .87fr; grid-template-rows: auto auto; gap: 1.25rem; }
.feature-card { overflow: hidden; position: relative; min-height: 290px; border-radius: 1.1rem; }.feature-card-large { min-height: 435px; grid-row: span 2; background: #eadcf4; }.feature-card-tall { background: var(--plum); color: white; }.feature-card-wide { background: #f5e2d8; }.feature-card-small { background: #d9ebe3; }
.feature-label { position: absolute; top: 1.35rem; left: 1.45rem; z-index: 2; display: flex; gap: .65rem; align-items: center; color: #67536c; font: 500 .61rem var(--mono); letter-spacing: .05em; text-transform: uppercase; }.feature-label span { display: grid; place-items: center; width: 20px; height: 20px; border: 1px solid currentColor; border-radius: 50%; font-size: .49rem; }.feature-time .feature-label { color: #ecdff3; }
.feature-content { position: relative; z-index: 2; padding: 4.5rem 1.6rem 1.5rem; max-width: 360px; }.feature-icon { display: grid; place-items: center; width: 38px; height: 38px; margin-bottom: 1.3rem; border-radius: .7rem; font-size: 1.35rem; }.feature-icon-violet { color: white; background: var(--violet); }.feature-icon-cream { color: var(--plum); background: #f8eafb; }.feature-icon-pink { color: #9e4368; background: #f4c3d3; }.feature-icon-mint { color: #326b58; background: #eff9f3; }.feature-card h3 { margin-bottom: .7rem; font: 700 clamp(1.5rem, 2.25vw, 2.15rem)/1.08 var(--serif); letter-spacing: -.04em; }.feature-card p { margin: 0; color: #685b6b; font-size: .78rem; line-height: 1.65; }.feature-time p { color: #eaddec; }
.browser-window { position: absolute; width: 68%; height: 45%; right: -6%; bottom: 5%; padding: 1rem; border-radius: .95rem 0 0 .95rem; background: rgba(255,255,255,.74); box-shadow: 0 15px 26px rgba(70,30,91,.12); transform: rotate(-6deg); }.browser-dots { display: flex; gap: .3rem; }.browser-dots i { width: 6px; height: 6px; border-radius: 50%; background: #b995c8; }.browser-url { width: 70%; height: .7rem; margin: 1rem 0; border-radius: .4rem; background: #e5d6ed; color: #a17eb4; font-size: .45rem; line-height: .7rem; text-indent: .5rem; }.browser-shield { display: grid; place-items: center; width: 64%; aspect-ratio: 1.8; margin: auto; border-radius: .75rem; color: white; background: linear-gradient(135deg, #9c5eb3, #63307e); font-size: 2rem; }
.dial-wrap { position: absolute; right: 6%; bottom: 4%; width: 45%; text-align: center; }.dial { width: 130px; aspect-ratio: 1; margin: auto; padding-top: 42px; border: 11px solid #d499dc; border-right-color: #835293; border-bottom-color: #835293; border-radius: 50%; color: #fff; transform: rotate(25deg); }.dial span, .dial small { display: block; transform: rotate(-25deg); }.dial span { font: 500 .9rem var(--mono); }.dial small { margin-top: .2rem; color: #eac6eb; font-size: .48rem; }.dial-caption { margin-top: .85rem; color: #e9dcea; font-size: .58rem; }.dial-caption i { display: inline-block; width: .4rem; height: .4rem; margin-right: .25rem; border-radius: 50%; background: var(--mint); }
.feature-aware .feature-content { max-width: 62%; }.insight-lines { position: absolute; right: 1.3rem; bottom: 1.15rem; width: 37%; height: 55%; }.insight-line { position: absolute; bottom: 0; width: 19%; border-radius: .4rem .4rem 0 0; background: #d59eb7; }.line-a { height: 37%; left: 7%; }.line-b { height: 70%; left: 39%; background: #a66a97; }.line-c { height: 52%; left: 71%; background: #6d3683; }.insight-bubble { position: absolute; top: 0; right: -8%; width: 116px; padding: .55rem; border-radius: .6rem; background: #fffaf6; color: #7a596d; box-shadow: 0 5px 15px rgba(100,49,78,.1); font-size: .51rem; line-height: 1.3; }
.feature-habits .feature-content { max-width: 290px; }.feature-habits::after { content: ""; position: absolute; width: 155px; height: 155px; border: 1px solid rgba(53,106,88,.16); border-radius: 50%; right: -38px; bottom: -45px; }

.comparison { position: relative; padding: 6.5rem clamp(1.5rem, 7vw, 6.5rem); display: grid; grid-template-columns: .9fr 1.1fr; gap: 4rem; overflow: hidden; border-radius: 1.2rem; background: var(--eggplant); color: white; }.comparison .eyebrow { color: #d5b3e6; }.comparison h2 { margin: 0; max-width: 425px; font: 700 clamp(2.7rem, 4.5vw, 4.35rem)/1 var(--serif); letter-spacing: -.06em; }.comparison h2 em { color: #e1bee8; }.comparison-points { position: relative; z-index: 2; display: grid; gap: 2rem; }.comparison-points article { display: grid; grid-template-columns: 2.5rem 1fr; column-gap: 1rem; }.point-number { grid-row: span 2; color: #d8b5e7; font: .67rem var(--mono); }.comparison-points h3 { margin: 0 0 .35rem; font-size: .9rem; }.comparison-points p { max-width: 355px; margin: 0; color: #d7c8da; font-size: .74rem; line-height: 1.7; }.comparison-ornament { position: absolute; inset: 0; z-index: 1; pointer-events: none; opacity: .5; }.comparison-ornament span { position: absolute; border: 1px solid rgba(232,201,240,.17); border-radius: 50%; }.comparison-ornament span:nth-child(1) { width: 470px; height: 470px; left: -160px; bottom: -300px; }.comparison-ornament span:nth-child(2) { width: 300px; height: 300px; left: -75px; bottom: -214px; }.comparison-ornament span:nth-child(3) { width: 610px; height: 610px; right: -270px; top: -355px; }

.how-it-works { padding-block: 8.5rem; }.how-header { max-width: 640px; margin-bottom: 3.6rem; }.steps-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; padding: 0; margin: 0; list-style: none; }.steps-list li { position: relative; min-height: 370px; padding: 1.35rem; overflow: hidden; border: 1px solid var(--line); border-radius: 1rem; background: #fffdfa; }.step-count { color: #85688e; font: .65rem var(--mono); }.steps-list h3 { margin: 1.8rem 0 .7rem; color: var(--eggplant); font: 700 1.35rem/1.15 var(--serif); letter-spacing: -.035em; }.steps-list p { max-width: 250px; margin: 0; color: #6b616d; font-size: .76rem; line-height: 1.7; }.step-visual { position: absolute; width: 90%; height: 45%; left: 5%; bottom: 2%; }.visual-connect { background: #eee3f5; border-radius: 1rem 1rem 0 0; }.device-mini { position: absolute; width: 110px; height: 145px; left: calc(50% - 55px); bottom: 0; padding: 12px 10px; border: 7px solid #73398b; border-bottom: 0; border-radius: 18px 18px 0 0; background: #fffdf9; }.device-mini i { display: block; height: 10px; margin-bottom: 8px; border-radius: 4px; background: #ddc1e8; }.device-mini i:nth-child(2) { width: 70%; background: #ffbca0; }.device-mini i:nth-child(3) { width: 45%; background: #b9d9cb; }.connect-waves i { position: absolute; left: 50%; bottom: 35px; border: 1px solid #9d66b3; border-radius: 50%; transform: translateX(-50%); }.connect-waves i:nth-child(1) { width: 160px; height: 70px; }.connect-waves i:nth-child(2) { width: 220px; height: 100px; }.connect-waves i:nth-child(3) { width: 280px; height: 130px; }
.visual-choose { background: #f5e4d8; border-radius: 1rem 1rem 0 0; }.toggle-stack { width: 160px; padding: 1rem; position: absolute; left: calc(50% - 80px); bottom: 1.4rem; border-radius: .9rem; background: rgba(255,255,255,.8); box-shadow: 0 15px 25px rgba(116,68,67,.09); }.toggle-stack span { display: block; width: 100%; height: 19px; margin: .55rem 0; border-radius: 999px; background: #e5d0c9; }.toggle-stack span::after { content: ""; display: block; width: 19px; height: 19px; margin-left: auto; border-radius: 50%; background: #b86685; }.toggle-stack span:nth-child(2)::after { margin-left: 0; background: #c6a0ab; }.toggle-stack span:nth-child(3) { background: #e3ceba; }.toggle-stack span:nth-child(3)::after { background: #e59250; }
.visual-grow { background: #dcece5; border-radius: 1rem 1rem 0 0; }.grow-star { position: absolute; top: 25px; left: calc(50% - 27px); display: grid; place-items: center; width: 54px; height: 54px; border-radius: 50%; color: #fff; background: #4f8b75; font-size: 1.3rem; }.visual-grow > i { position: absolute; width: 1px; height: 80px; left: 50%; top: 79px; background: #6ba18d; transform-origin: top; }.visual-grow > i:nth-of-type(1) { transform: rotate(-42deg); }.visual-grow > i:nth-of-type(2) { transform: rotate(0deg); }.visual-grow > i:nth-of-type(3) { transform: rotate(42deg); }.visual-grow::after { content:""; position:absolute; width: 82%; height: 47px; bottom: 21px; left: 9%; border-radius: 50%; background:#b7d8c9; }

.beta-section { position: relative; overflow: hidden; background: linear-gradient(123deg, #4b165e 0%, #602279 58%, #3d184b 100%); color: white; }.beta-content { position: relative; z-index: 3; min-height: 580px; display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(2.5rem, 9vw, 9rem); align-items: center; padding-block: 6.5rem; }.beta-copy h2 { max-width: 490px; margin-bottom: 1.3rem; font: 700 clamp(3rem, 5vw, 5rem)/.97 var(--serif); letter-spacing: -.06em; }.beta-copy > p:not(.eyebrow) { max-width: 440px; color: #ebdff0; font-size: .91rem; line-height: 1.8; }.beta-perks { display: grid; gap: .55rem; margin-top: 2rem; color: #f2e8f5; font-size: .7rem; }.beta-perks span::first-letter { color: var(--peach); }.beta-shape { position: absolute; border: 1px solid rgba(240,210,248,.14); border-radius: 50%; }.shape-left { width: 650px; height: 650px; left: -480px; top: -200px; }.shape-right { width: 820px; height: 820px; right: -590px; bottom: -500px; }
.beta-form { width: 100%; max-width: 450px; padding: 1.55rem; border: 1px solid rgba(255,255,255,.46); border-radius: 1rem; background: #fffdf9; color: var(--ink); box-shadow: 0 20px 55px rgba(19,5,29,.25); }.form-heading { display: flex; gap: .7rem; align-items: flex-start; margin-bottom: 1.35rem; }.form-glyph { display: grid; place-items: center; flex: 0 0 29px; height: 29px; border-radius: .5rem; color: white; background: var(--violet); font-size: .8rem; }.form-heading b, .form-heading small { display: block; }.form-heading b { font-size: .79rem; }.form-heading small { max-width: 260px; margin-top: .22rem; color: #796d7c; font-size: .6rem; line-height: 1.45; }.form-row { margin: .85rem 0; }.form-row label { display: block; margin-bottom: .4rem; color: #513c59; font-size: .67rem; font-weight: 800; }.form-row label > span { margin-left: .15rem; color: #a0486a; }.optional { color: #9a8e9c; font-weight: 500; }.form-row input, .form-row select { width: 100%; padding: .75rem .75rem; outline: 0; border: 1px solid #ded2e0; border-radius: .45rem; background: #fff; color: var(--ink); font-size: .75rem; transition: border .2s, box-shadow .2s; }.form-row input::placeholder { color: #aa9eac; }.form-row input:focus, .form-row select:focus { border-color: #8f51a8; box-shadow: 0 0 0 3px rgba(143,81,168,.15); }.form-row input.is-invalid, .form-row select.is-invalid { border-color: #bd5a72; box-shadow: 0 0 0 3px rgba(189,90,114,.13); }.field-error { display: block; min-height: .8rem; padding-top: .24rem; color: #ab3b5b; font-size: .58rem; }.consent { display: flex; gap: .55rem; align-items: flex-start; margin-top: .5rem; color: #705f73; font-size: .61rem; line-height: 1.45; }.consent input { width: .85rem; height: .85rem; margin: .05rem 0 0; accent-color: var(--plum); }.consent-error { margin-left: 1.42rem; }.form-status { min-height: 1.1rem; margin: 1rem 0 0; color: #5e316d; font-size: .66rem; line-height: 1.5; }.form-status.success { padding: .65rem .75rem; border-radius: .4rem; background: #e9f3ee; color: #266048; }.form-status.error { padding: .65rem .75rem; border-radius: .4rem; background: #fae8eb; color: #98354e; }

.site-footer { background: #fffdf9; }.footer-top { display: grid; grid-template-columns: .8fr 1.4fr auto; gap: 2rem; align-items: center; padding-block: 3rem; border-bottom: 1px solid var(--line); }.footer-brand { width: 158px; }.footer-top p { max-width: 280px; margin: 0; color: #6f626f; font-size: .72rem; line-height: 1.6; }.footer-cta { justify-self: end; color: var(--plum); font-size: .75rem; font-weight: 800; }.footer-cta span { margin-left: .4rem; }.footer-bottom { display: flex; align-items: center; gap: 1.2rem; padding-block: 1.5rem; color: #837487; font-size: .59rem; }.footer-bottom > p { margin: 0; white-space: nowrap; }.legal-links { display: flex; gap: 1rem; }.legal-links button { padding: 0; border: 0; color: inherit; background: transparent; font-size: inherit; }.legal-links button:hover { color: var(--plum); text-decoration: underline; }.venture-mark { display: flex; align-items: center; gap: .55rem; margin-left: auto; color: #77697c; font-size: .58rem; white-space: nowrap; }.venture-mark img { width: 63px; height: auto; }

.legal-dialog { width: min(100% - 2rem, 580px); padding: 2.2rem; border: 0; border-radius: 1rem; color: var(--ink); box-shadow: 0 22px 60px rgba(31,13,35,.35); }.legal-dialog::backdrop { background: rgba(47,17,58,.54); backdrop-filter: blur(3px); }.legal-dialog h2 { margin: 0 0 .85rem; color: var(--eggplant); font: 700 2rem/1.04 var(--serif); letter-spacing: -.05em; }.legal-dialog > p:not(.eyebrow) { margin-bottom: 0; color: #645a66; font-size: .85rem; line-height: 1.75; }.dialog-close { position: absolute; width: 30px; height: 30px; right: 1rem; top: 1rem; border: 0; border-radius: 50%; color: var(--plum); background: var(--mist); font-size: 1.35rem; line-height: 1; }.legal-dialog .button { margin-top: 1.4rem; }

@media (max-width: 850px) {
  .hero { min-height: auto; grid-template-columns: 1fr; gap: .5rem; padding-top: 2.5rem; }.hero-copy { padding-top: 1rem; }.hero-visual { width: min(100%, 610px); min-height: 475px; margin-inline: auto; }.feature-collection { grid-template-columns: 1fr 1fr; }.feature-card-large { grid-row: auto; grid-column: span 2; min-height: 390px; }.feature-card-wide { grid-column: span 2; }.comparison, .beta-content { grid-template-columns: 1fr; }.comparison { gap: 3.5rem; }.steps-list { gap: .8rem; }.steps-list li { min-height: 340px; }.footer-top { grid-template-columns: 1fr 1fr; }.footer-top p { grid-row: 2; }.footer-cta { grid-column: 2; grid-row: 1; }
}

@media (max-width: 620px) {
  .section-frame, .site-header { width: min(100% - 2rem, 1230px); }.site-header { min-height: 72px; }.brand { width: 148px; }.menu-toggle { display: block; }.site-nav { position: fixed; inset: 0; display: flex; visibility: hidden; align-items: flex-start; flex-direction: column; gap: .55rem; padding: 7rem 1.8rem 2rem; background: rgba(255,253,249,.98); color: var(--eggplant); opacity: 0; transition: opacity .22s, visibility .22s; }.site-nav.open { visibility: visible; opacity: 1; }.site-nav > a:not(.nav-cta) { padding: .9rem 0; font: 600 1.85rem/1.1 var(--serif); }.nav-cta { margin-top: .7rem; }.menu-toggle[aria-expanded="true"] span:nth-child(2) { transform: translateY(3px) rotate(45deg); }.menu-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-3px) rotate(-45deg); }
  h1 { font-size: clamp(3.05rem, 15vw, 4.2rem); }.hero { padding: 2.1rem 0 3.5rem; }.hero-lede { font-size: .92rem; }.hero-note { margin-top: 2.2rem; }.hero-visual { min-height: 370px; }.hero-art { height: 360px; }.card-screen-time { top: 13%; right: -2%; }.card-checkin { left: -2%; bottom: 9%; }.signal-card { padding: .55rem .6rem; }.signal-card > strong { display: none; }.hero-spark { font-size: 1rem; }.signal-band { gap: .65rem; padding: 1rem; flex-direction: column; }.intro, .how-it-works { padding-block: 5rem; }.section-intro { margin-bottom: 2.4rem; }.section-intro h2, .how-header h2 { font-size: 2.5rem; }.feature-collection { display: block; }.feature-card { min-height: 285px; margin-bottom: 1rem; }.feature-card-large { min-height: 355px; }.feature-card-wide { min-height: 305px; }.feature-aware .feature-content { max-width: 72%; }.feature-habits { min-height: 260px; }.comparison { width: 100%; padding: 4.5rem 1rem; border-radius: 0; }.comparison h2 { font-size: 3rem; }.comparison-points { gap: 1.5rem; }.steps-list { display: block; }.steps-list li { min-height: 320px; margin-bottom: .85rem; }.beta-content { min-height: auto; gap: 2.6rem; padding-block: 4.5rem; }.beta-copy h2 { font-size: 3.1rem; }.beta-form { padding: 1.15rem; }.footer-top { display: flex; flex-direction: column; align-items: flex-start; gap: 1.2rem; padding-block: 2.5rem; }.footer-cta { align-self: flex-start; }.footer-bottom { flex-wrap: wrap; gap: 1rem; }.venture-mark { width: 100%; margin-left: 0; }.legal-links { order: 3; }
}

@media (prefers-reduced-motion: no-preference) { .hero-art { animation: float 7s ease-in-out infinite; }.hero-spark { animation: twinkle 3.4s ease-in-out infinite; }.spark-b { animation-delay: -1.7s; }.signal-card { animation: float 5s ease-in-out infinite; }.card-checkin { animation-delay: -2.4s; } @keyframes float { 50% { transform: translateY(-8px); } } @keyframes twinkle { 50% { transform: scale(.75) rotate(25deg); opacity: .55; } } }