/* Homepage motion uses individual transforms so the watch sizes and angles stay intact. */
.home-page .secondary{background:#f1f5eb;border:2px solid #718966;color:#35533a;font-weight:700;min-height:48px;box-shadow:0 2px 0 #35533a0a}
.home-page .secondary:is(:hover,:focus-visible){background:#e1ead8;border-color:#355d40;box-shadow:0 5px 14px #365d4318}
.home-page .hero-actions{flex-wrap:wrap;gap:14px}
.home-page .hero-actions>.button{width:154px;min-height:44px;height:44px;padding:11px 16px;font-size:12px;gap:14px}
.home-page .hero-actions .hero-activate{border-width:1px;border-color:#c2ceba;background:#edf2e7;box-shadow:none}
.home-page .hero-actions .hero-activate:is(:hover,:focus-visible)>span,.home-page .tutorial-cta:is(:hover,:focus-visible)>span{translate:3px -2px}
.home-page .guide-intro .tutorial-cta{display:inline-flex;margin-top:18px;padding:11px 16px;font-size:12px;gap:17px;max-width:100%;min-height:44px;border-width:1px;border-color:#c2ceba;box-shadow:none}
@media(max-width:380px){.home-page .hero-actions .button{width:100%;min-height:44px}.home-page .guide-intro .tutorial-cta{font-size:12px;padding:11px 14px;gap:12px}}
.home-page .header nav a{position:relative;padding-bottom:4px}
.home-page .header nav a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:#789568;transform:scaleX(0);transform-origin:left;transition:transform .25s ease}
.home-page .header nav a:is(:hover,:focus-visible)::after{transform:scaleX(1)}
.home-page :is(.button,.nav-cta,.details-link)>span{display:inline-block;transition:translate .25s ease}
.home-page :is(.nav-cta,.details-link):is(:hover,:focus-visible)>span{translate:3px -2px}
.home-page .hero-actions .button:is(:hover,:focus-visible)>span{translate:0 3px}
.home-page .product-card{transition:translate .3s ease,box-shadow .3s ease,border-color .3s ease}
.home-page .product-visual>img,.home-page .visual-doodle{transition:translate .35s ease,rotate .35s ease}
.home-page .faq-list summary span{transition:transform .25s ease}
.home-page :is(.button,.nav-cta){transition:background .2s ease,transform .2s ease,box-shadow .2s ease}
.home-page .primary:is(:hover,:focus-visible){box-shadow:0 6px 18px #365d4324}
.home-page .orbit{width:95%;max-width:540px}
@media(max-width:900px) and (min-width:761px){.home-page .watch-psy{left:68%;transform:rotate(17deg) scale(.75)}.home-page .orbit{width:90%;left:0}}

@media(hover:hover) and (prefers-reduced-motion:no-preference){
 .home-page .product-card:hover{translate:0 -6px;box-shadow:0 14px 30px #365d4310}
 .home-page .product-card:hover .product-visual>img{translate:0 -5px;rotate:4deg}
 .home-page .product-card:hover .visual-doodle{rotate:-5deg;translate:3px 0}
}

@media(prefers-reduced-motion:no-preference){
 .home-page .hero-copy>.eyebrow,.home-page .hero-copy>h1,.home-page .hero-copy>p,.home-page .hero-actions{animation:home-enter .75s cubic-bezier(.22,1,.36,1) both}
 .home-page .hero-copy>h1{animation-delay:.1s}
 .home-page .hero-copy>p{animation-delay:.2s}
 .home-page .hero-actions{animation-delay:.3s}
 .home-page h1 svg path{stroke-dasharray:650;animation:home-underline 1.2s ease .3s both}
 .home-page .watch{animation:home-watch-float 6.5s ease-in-out infinite}
 .home-page .watch-pro{animation-delay:-1.1s}
 .home-page .watch-burger{animation-delay:-3.3s;animation-duration:7.2s}
 .home-page .watch-psy{animation-delay:-5.2s;animation-duration:6.8s}
 .home-page .spark{animation:home-spark 9s ease-in-out infinite}
 .home-page .spark-two{animation-delay:-4s}
 .home-page .orbit{animation:home-orbit 12s ease-in-out infinite}
 .home-page .orbit-two{animation-delay:-6s}
 .home-page.hero-paused :is(.watch,.spark,.orbit){animation-play-state:paused}
 .home-page .reveal-ready{opacity:0;translate:0 22px;transition:opacity .65s ease,translate .65s cubic-bezier(.22,1,.36,1),box-shadow .3s ease,border-color .3s ease}
 .home-page .reveal-ready.is-revealed{opacity:1;translate:0 0;transition-delay:var(--reveal-delay,0ms),var(--reveal-delay,0ms),0ms,0ms}
 .home-page .motion-delay-1{--reveal-delay:85ms}
 .home-page .motion-delay-2{--reveal-delay:170ms}
 .home-page .reveal-ready:focus-within{opacity:1;translate:0 0;transition-delay:0ms}
 .home-page .faq-list details[open] p{animation:home-faq .3s ease both}
 @media(max-width:760px){.home-page .watch{animation-name:home-watch-float-small}.home-page .reveal-ready{translate:0 14px}.home-page .reveal-ready.is-revealed{translate:0 0}}
}

@media(hover:hover) and (prefers-reduced-motion:no-preference){
 .home-page .product-card.is-revealed:hover{translate:0 -6px;transition-delay:0ms}
}

@media(prefers-reduced-motion:reduce){
 .home-page *,.home-page *::before,.home-page *::after{animation:none!important;transition:none!important}
 .home-page .reveal-ready{opacity:1;translate:none}
}

@keyframes home-enter{from{opacity:0;translate:0 16px}to{opacity:1;translate:0 0}}
@keyframes home-underline{from{stroke-dashoffset:650}to{stroke-dashoffset:0}}
@keyframes home-watch-float{0%,100%{translate:0 4px}50%{translate:0 -6px}}
@keyframes home-watch-float-small{0%,100%{translate:0 3px}50%{translate:0 -4px}}
@keyframes home-spark{0%,100%{rotate:-8deg;opacity:.6}50%{rotate:15deg;opacity:1}}
@keyframes home-orbit{0%,100%{scale:1;opacity:.65}50%{scale:1.025;opacity:1}}
@keyframes home-faq{from{opacity:0;translate:0 -4px}to{opacity:1;translate:0 0}}