:root{--background-wallpaper:#f2f4ee}@media (prefers-color-scheme:dark){:root{--background-wallpaper:color(display-p3 .0774 .0809 .0669)}}.page-patter{--content-width:52rem}.hero{text-align:center;max-width:var(--content-width);margin:0 auto;padding:5rem 1.5rem 3rem}.hero-logo{box-shadow:0 2px 8px var(--shadow-primary), 0 0 0 1px var(--shadow-secondary);border-radius:22px;margin-bottom:1.25rem}.app-name{margin:0 0 1rem;font-family:Martian Grotesk,sans-serif;font-size:clamp(3rem,8vw,4.5rem);font-weight:900;line-height:1.05}.tagline{color:var(--text-secondary);max-width:30ch;margin:0 auto 2.5rem;font-size:clamp(1.125rem,2.5vw,1.375rem);line-height:1.5}.hero-screenshot{max-width:320px;height:360px;margin:0 auto;overflow:hidden}.hero-screenshot img{object-fit:cover;object-position:top;width:100%;height:100%;display:block}.cta-group{flex-wrap:wrap;justify-content:center;gap:.75rem;display:flex}.btn{border-radius:100px;align-items:center;gap:.5rem;padding:.875rem 1.75rem;font-size:1rem;font-weight:500;text-decoration:none;transition:transform .15s,box-shadow .15s;display:inline-flex}.btn:hover{transform:translateY(-1px)}.btn-primary{background:var(--surface-button);color:var(--surface-button-label);box-shadow:0 2px 8px var(--shadow-primary)}.btn-primary:hover{box-shadow:0 4px 16px var(--shadow-primary);color:var(--surface-button-label)}.btn-secondary{background:var(--surface-card);color:var(--text-primary);box-shadow:0 1px 4px var(--shadow-secondary)}.btn-secondary:hover{box-shadow:0 2px 8px var(--shadow-primary);color:var(--text-primary)}.section-pitch{max-width:var(--content-width);margin:0 auto;padding:1rem 1.5rem 3rem}.pitch-inner{max-width:38rem;margin:0 auto}.pitch-lead{color:var(--text-secondary);margin:0 0 2rem;font-size:clamp(1.75rem,4vw,2.5rem);font-weight:300;line-height:1.25}.section-pitch p{color:var(--text-secondary);margin:0 0 1.25rem;font-size:clamp(1.0625rem,2vw,1.1875rem);line-height:1.55}.section-features{padding:0 1.5rem}.feature-section{max-width:64rem;margin:0 auto;padding:4rem 0}.feature-header{background:#e8ebe2;border-radius:20px;align-items:center;gap:1rem;margin-bottom:3rem;padding:1rem 1.375rem;display:flex}@media (prefers-color-scheme:dark){.feature-header{background:var(--background-tertiary)}}.feature-icon-wrap{--icon-sage:#93a37d;--icon-sage-deep:#4f5841;flex-shrink:0;justify-content:center;align-items:center;width:clamp(2.5rem,5vw,3rem);height:clamp(2.5rem,5vw,3rem);display:flex}@media (prefers-color-scheme:dark){.feature-icon-wrap{--icon-sage:#7d9169;--icon-sage-deep:#c8d0bc}}.feature-title{border-left:1.5px solid var(--surface-sunken);margin:0;padding-left:1rem;font-size:clamp(1.75rem,3.5vw,2.25rem);font-weight:800;line-height:1}.feature-body{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;gap:2rem;display:grid}.feature-text{flex-direction:column;gap:.625rem;display:flex}.feature-card{background:#e8ebe2;border-radius:20px;padding:1.125rem 1.375rem}@media (prefers-color-scheme:dark){.feature-card{background:var(--background-tertiary)}}.feature-card p{color:var(--text-secondary);margin:0;font-size:clamp(1rem,2vw,1.0625rem);line-height:1.55}.feature-card p a{color:var(--accent-primary)}.feature-visual{flex-direction:column;align-items:center;gap:1rem;width:100%;display:flex}.feature-visual picture{display:block}.feature-visual img{border-radius:10px;width:100%;max-width:380px;height:auto;margin:0 auto;display:block}.feature-visual .watch-img{border-radius:28px;width:auto;max-width:none;height:380px;transform:translate(5%)}.screenshot-toggle{background:#e8ebe2;border-radius:100px;gap:2px;padding:3px;display:flex;transform:translate(12%)}@media (prefers-color-scheme:dark){.screenshot-toggle{background:var(--background-tertiary)}}.toggle-btn{cursor:pointer;color:var(--text-secondary);background:0 0;border:none;border-radius:100px;padding:.4375rem 1.125rem;font-family:Martian Grotesk,sans-serif;font-size:.9375rem;font-weight:500;transition:background .15s,color .15s,box-shadow .15s}.toggle-btn.is-active{color:var(--text-primary);box-shadow:0 1px 4px var(--shadow-primary);background:#f2f4ee}@media (prefers-color-scheme:dark){.toggle-btn.is-active{background:var(--background-secondary)}}.screenshot-panel{display:none}.screenshot-panel.is-active{display:block}@supports (animation-timeline:view()){@keyframes feature-fade-up{0%{opacity:0;transform:translateY(1rem)}to{opacity:1;transform:translateY(0)}}.feature-header,.feature-card{animation:linear both feature-fade-up view();animation-range:entry 5% entry 30%}}.section-closing{background:var(--surface-card);margin-top:2rem;padding:3rem 1.5rem}.closing-inner{max-width:38rem;margin:0 auto}.closing-inner p{color:var(--text-secondary);margin:0 0 1rem;font-size:clamp(1rem,2vw,1.0625rem);line-height:1.55}.closing-inner p:last-child{margin-bottom:0}@media (width<=720px){.feature-body{grid-template-columns:minmax(0,1fr)}.feature-visual{order:-1}.feature-visual img{max-width:300px}.feature-visual img:not(.watch-img){transform:translate(-5.5%)}.feature-visual .watch-img{width:auto;max-width:450px;height:auto;margin:0;transform:none}.screenshot-panel[data-panel=watch]{justify-content:center;width:100%;overflow:clip visible}.screenshot-panel[data-panel=watch].is-active{display:flex}.screenshot-toggle{transform:none}.feature-section{padding:3rem 0}}.section-download{background:var(--surface-card);padding:3rem 1.5rem 4rem}.section-download-inner{text-align:center;max-width:var(--content-width);margin:0 auto}.download-lead{color:var(--text-primary);max-width:32ch;margin:0 auto .75rem;font-size:clamp(1.25rem,3vw,1.5rem);font-weight:300;line-height:1.4}.download-sub{color:var(--text-tertiary);margin:0 auto 2rem;font-size:clamp(1rem,2vw,1.125rem)}.download-footnote{color:var(--text-tertiary);margin:1rem auto 0;font-size:clamp(.875rem,1.5vw,.9375rem)}.app-store-badge{transition:transform .15s;display:inline-block}.app-store-badge:hover{background-color:#0000;transform:translateY(-1px)}.app-store-badge img{width:auto;height:48px}.badge-dark{display:none}@media (prefers-color-scheme:dark){.badge-light{display:none}.badge-dark{display:inline}}@media (width<=480px){.hero{padding:3rem 1.5rem 2rem}}
