:root{
  --motion-fast:160ms;
  --motion-base:280ms;
  --motion-slow:540ms;
  --ease-standard:cubic-bezier(.2,.8,.2,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
  --ease-soft:cubic-bezier(.22,.61,.36,1)
}

html{scroll-padding-top:96px}
section[id]{scroll-margin-top:96px}

/* Page assembly */
.hero-nav,.hero-title,.hero-copy,.hero-art{transition:opacity var(--motion-slow) var(--ease-out),transform var(--motion-slow) var(--ease-out)}
.motion-ready .hero-nav,.motion-ready .hero-title,.motion-ready .hero-copy,.motion-ready .hero-art{opacity:0;transform:translateY(14px)}
.motion-ready.hero-loaded .hero-nav,.motion-ready.hero-loaded .hero-title,.motion-ready.hero-loaded .hero-copy,.motion-ready.hero-loaded .hero-art{opacity:1;transform:none}
.motion-ready.hero-loaded .hero-nav{transition-delay:0ms}
.motion-ready.hero-loaded .hero-title{transition-delay:80ms}
.motion-ready.hero-loaded .hero-copy{transition-delay:150ms}
.motion-ready.hero-loaded .hero-art{transition-delay:230ms}

/* Reusable one-time section entrances */
.reveal{opacity:0;transform:translateY(18px);transition:opacity var(--motion-slow) var(--ease-out),transform var(--motion-slow) var(--ease-out);transition-delay:var(--reveal-delay,0ms)}
.reveal.reveal-scale{transform:translateY(10px) scale(.985)}
.reveal.is-visible{opacity:1;transform:none}

/* Quiet, consistent surface feedback */
.calendar-day,.step-feature,.persona-card,.use-card{transition:transform var(--motion-base) var(--ease-out),box-shadow var(--motion-base) var(--ease-soft),filter var(--motion-base) var(--ease-soft)!important}
@media(hover:hover) and (pointer:fine){
  .calendar-day:hover,.calendar-day:focus-within{transform:translateY(-3px)!important;box-shadow:0 14px 30px rgba(10,42,33,.10)!important}
  .step-feature:hover{transform:translateY(-4px) scale(1.005)!important;box-shadow:0 24px 48px rgba(8,37,29,.14)!important}
  .persona-card:hover{transform:translateY(-3px) scale(1.005)!important;filter:saturate(1.04)}
  .use-card:hover,.use-card:focus-visible{transform:translateY(-3px)!important}
}

button,.btn,.faq-action,.hero-links a,.footer-col a{transition:color var(--motion-fast) var(--ease-standard),background-color var(--motion-fast) var(--ease-standard),border-color var(--motion-fast) var(--ease-standard),opacity var(--motion-fast) var(--ease-standard),transform var(--motion-fast) var(--ease-standard),box-shadow var(--motion-fast) var(--ease-standard)}
button:not(:disabled):active,.btn:not(:disabled):active{transform:scale(.98)}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,[tabindex="0"]:focus-visible{outline:2px solid var(--green);outline-offset:3px}
button:disabled{transform:none!important}

.hero-links a{position:relative}
.hero-links a::after{content:"";position:absolute;left:0;right:0;bottom:-5px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform var(--motion-fast) var(--ease-standard)}
.hero-links a:hover::after,.hero-links a:focus-visible::after{transform:scaleX(1);transform-origin:left}
.hero-nav{transition:background-color var(--motion-base) var(--ease-soft),border-color var(--motion-base) var(--ease-soft),box-shadow var(--motion-base) var(--ease-soft),opacity var(--motion-slow) var(--ease-out),transform var(--motion-slow) var(--ease-out)}
.hero-nav.is-scrolled{background:rgba(250,250,245,.97);border-bottom-color:rgba(15,35,28,.11);box-shadow:0 8px 24px rgba(15,35,28,.055)}

/* Calculator values change without disturbing layout. */
.result-amount,.result-sub,.result-meta{transition:opacity var(--motion-fast) var(--ease-soft),transform var(--motion-fast) var(--ease-out)}
.calc-right.is-updating .result-amount,.calc-right.is-updating .result-sub,.calc-right.is-updating .result-meta{opacity:.42;transform:translateY(3px)}
.freq-toggle button.active{transition-duration:var(--motion-base)!important}

/* Measured FAQ motion; JS supplies exact content height. */
.faq-content{height:0;max-height:none!important;opacity:0;transform:translateY(-6px);transition:height var(--motion-base) var(--ease-soft),opacity var(--motion-fast) var(--ease-soft),transform var(--motion-base) var(--ease-out)}
.faq-item.open .faq-content{max-height:none!important;opacity:1;transform:none}
.faq-item{transition:background-color var(--motion-fast) var(--ease-soft),border-color var(--motion-fast) var(--ease-soft)}
.faq-item.open{background:rgba(0,200,150,.025)}

input,textarea{transition:border-color var(--motion-fast) var(--ease-standard),box-shadow var(--motion-fast) var(--ease-standard),background-color var(--motion-fast) var(--ease-standard)}
.snackbar{transition:opacity var(--motion-base) var(--ease-out),transform var(--motion-base) var(--ease-out)}

@media(max-width:760px){
  html{scroll-padding-top:80px}section[id]{scroll-margin-top:80px}
  .motion-ready .hero-nav,.motion-ready .hero-title,.motion-ready .hero-copy,.motion-ready .hero-art,.reveal{transform:translateY(10px)}
  .reveal.reveal-scale{transform:translateY(8px) scale(.99)}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto!important}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .motion-ready .hero-nav,.motion-ready .hero-title,.motion-ready .hero-copy,.motion-ready .hero-art,.reveal{opacity:1!important;transform:none!important}
}