/* Landing only. Transform and opacity preserve the existing editorial layout. */
:root{--ease-ocean:cubic-bezier(.22,1,.36,1);--motion-fast:200ms;--motion-medium:350ms;--motion-slow:700ms}
.hero-line,.hero-stoke{display:inline-block}
.hero-line-first{animation:hero-enter 700ms var(--ease-ocean) 100ms both}
.hero-line-second{animation:hero-enter 700ms var(--ease-ocean) 250ms both}
.hero-stoke{animation:stoke-reveal 800ms var(--ease-ocean) 400ms both}
.hero .pill,.hero .lede{animation:hero-enter 600ms var(--ease-ocean) 550ms both}
.hero .js-cta{animation:hero-enter 500ms var(--ease-ocean) 700ms both}
@keyframes hero-enter{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
@keyframes stoke-reveal{from{opacity:0;transform:translateY(24px);clip-path:inset(0 0 100%)}to{opacity:1;transform:translateY(0);clip-path:inset(-10% -10% -20%)}}
.cards .card{transition:transform 250ms var(--ease-ocean),scale 250ms var(--ease-ocean),box-shadow 250ms var(--ease-ocean)}
.cards.motion-waiting .card{opacity:0;transform:translateY(30px) scale(.97)}
.cards.motion-enter .card{animation:card-enter 700ms var(--ease-ocean) both;animation-delay:calc(var(--card-delay,0ms) + var(--card-index)*120ms)}
.cards .card:nth-child(1){--card-index:0}.cards .card:nth-child(2){--card-index:1}.cards .card:nth-child(3){--card-index:2}.cards .card:nth-child(4){--card-index:3}
@keyframes card-enter{from{opacity:0;transform:translateY(30px) scale(.97)}to{opacity:1;transform:none}}
@keyframes card-float{from{translate:0 0}to{translate:0 -4px}}
@media(min-width:1101px) and (hover:hover) and (pointer:fine){
  .cards.motion-settled .card:nth-child(1){animation:card-float 8s ease-in-out infinite alternate}
  .cards.motion-settled .card:nth-child(3){animation:card-float 9s ease-in-out infinite alternate-reverse}
}
@media(hover:hover) and (pointer:fine){
  .cards .card:hover{transform:translateY(-6px);scale:1.015;box-shadow:0 30px 66px rgba(15,31,68,.28)}
  .cards.motion-settled .card:hover{animation-play-state:paused}
}
@media(hover:none){.cards .card:hover{transform:none}}
#big-val{font-variant-numeric:tabular-nums;display:inline-block;width:4ch;min-width:0}
#big-qual{min-width:9ch}
.srange{touch-action:pan-y}
.srange:focus-visible{outline:3px solid var(--gold);outline-offset:9px}
.bolt.stoke-pulse{animation:bolt-pulse 300ms var(--ease-ocean)}
@keyframes bolt-pulse{0%,100%{scale:1}50%{scale:1.05}}
/* Intrinsic grid expansion accommodates wrapping at every breakpoint. */
.acc .panel,.acc .item.open .panel{display:grid;grid-template-rows:0fr;padding:0;visibility:hidden;transition:grid-template-rows 300ms var(--ease-ocean),visibility 0s 300ms}
.acc .item.open .panel{grid-template-rows:1fr;visibility:visible;transition:grid-template-rows 300ms var(--ease-ocean),visibility 0s}
.panel-inner{min-height:0;overflow:hidden}
.panel-content{padding:0 22px 22px;opacity:0;transform:translateY(8px);transition:opacity 200ms var(--ease-ocean),transform 200ms var(--ease-ocean)}
.item.open .panel-content{opacity:1;transform:none}
.acc .item{transition:background 300ms var(--ease-ocean),color 200ms var(--ease-ocean)}
.item.open .qform{animation:preview-enter 300ms var(--ease-ocean)}
@keyframes preview-enter{from{opacity:0;transform:translateX(12px)}to{opacity:1;transform:none}}
.app .photo{transform-origin:center center}
.app .photo.motion-waiting{transform:scale(1.06);opacity:.85}
.app .photo.motion-enter{animation:photo-enter 1000ms var(--ease-ocean) both}
@keyframes photo-enter{from{transform:scale(1.06);opacity:.85}to{transform:scale(1);opacity:1}}
@media(max-width:1100px){.cards.motion-enter .card{animation-duration:550ms}}
@media(max-width:640px){
  .hero-line-first,.hero-line-second,.hero-stoke,.hero .pill,.hero .lede,.hero .js-cta{animation-duration:450ms}
  .cards.motion-enter .card{animation-duration:450ms}
  .app .photo.motion-waiting{transform:scale(1.03)}
  @keyframes photo-enter{from{transform:scale(1.03);opacity:.85}to{transform:scale(1);opacity:1}}
}
@media(prefers-reduced-motion:reduce){
  .hero-line,.hero-stoke,.hero .pill,.hero .lede,.hero .js-cta,.cards .card,.bolt.stoke-pulse,.item.open .qform,.app .photo{animation:none!important;transition:none!important;transform:none!important;translate:none!important;scale:none!important;opacity:1!important;clip-path:none!important}
  .acc .panel,.acc .item.open .panel,.panel-content,.acc .item{transition:none!important;transform:none!important}
}
