/* Motion explains changes of state and runs once on entry. */
:root { --motion-ease:cubic-bezier(.22,.7,.28,1); }
.site-navigation a { position:relative; }
.site-navigation a:not(.nav-download)::after { content:""; position:absolute; inset:auto 0 -7px; height:2px; background:var(--green); transform:scaleX(0); transform-origin:left; transition:transform .22s var(--motion-ease); }
.site-navigation a:hover::after,.site-navigation a[aria-current=location]::after { transform:scaleX(1); }
.site-navigation .nav-download[aria-current=location] { background:var(--green); color:var(--on-green); }
.hero-demo-link { padding-block:12px; }
.product-stage { scroll-margin-top:110px; }
.product-tabs button { transition:background .2s,color .2s,border-color .2s; }
.product-shot>a { cursor:zoom-in; }
.product-shot img { transition:transform .4s var(--motion-ease); }
@media(hover:hover) and (pointer:fine) { .product-shot>a:hover img { transform:scale(1.025); } }
.js .hero-copy,.js .hero-summary { animation:content-arrive .65s var(--motion-ease) both; }
.js .hero-summary { animation-delay:.07s; }
.js .product-stage { animation:content-arrive .7s .12s var(--motion-ease) both; }
/* Background tabs can pause motion; text must retain its full contrast. */
@keyframes content-arrive { from { transform:translateY(14px); } to { transform:none; } }
.feature-ledger.motion-entered>div,.integration-table article.motion-entered { animation:content-arrive .55s var(--motion-ease) both; }
.feature-ledger.motion-entered>div:nth-child(2) { animation-delay:.08s; }
.feature-ledger.motion-entered>div:nth-child(3) { animation-delay:.16s; }
.data-route.motion-entered .route-steps li:not(:last-child)::after { animation:route-signal 2.4s ease-in-out 1 both; }
.data-route.motion-entered .route-steps li:nth-child(2)::after { animation-delay:.6s; }
.data-route.motion-entered .route-steps li:nth-child(3)::after { animation-delay:1.2s; }
.faq-list details { padding-inline:0; }
.faq-list details[open] { padding-inline:0; background:transparent; }
.faq-list summary { list-style:none; display:flex; align-items:center; justify-content:space-between; gap:20px; }
.faq-list summary::-webkit-details-marker { display:none; }
.faq-list summary::after { content:'+'; font-size:24px; font-weight:400; line-height:1; transition:transform .2s; }
.faq-list details[open] summary::after { transform:rotate(45deg); }
.faq-list details[open] p { animation:content-arrive .3s var(--motion-ease); }
.screen-dialog[open] { animation:content-arrive .22s var(--motion-ease); }
html:has(.screen-dialog[open]) { overflow:hidden; }
.gallery-status { min-height:1.7em; margin-block:8px; font-size:12px; color:var(--muted); }
.gallery-status:empty { display:none; }
.gallery-recovery { display:flex; align-items:center; gap:18px; flex-wrap:wrap; }
.gallery-recovery a { font-size:12px; }
.gallery-recovery button { min-height:44px; padding:8px 14px; border:1px solid var(--line); border-radius:8px; background:var(--soft); color:var(--ink); }
.screen-dialog-image[aria-busy=true] { min-height:220px; }
.code-tools { display:flex; flex-wrap:wrap; gap:12px; align-items:center; margin:-4px 0 24px; }
.code-copy { padding:8px 13px; min-height:44px; border:1px solid var(--line); border-radius:8px; background:var(--soft); color:var(--ink); font-size:12px; }
.copy-status { font-size:12px; color:var(--muted); }
.guide-page pre { tab-size:2; }
.button:active,.product-tabs button:active { transform:translateY(1px); }
@media(max-width:760px) {
  .js .site-navigation { max-height:calc(100dvh - 76px); overflow-y:auto; overscroll-behavior:contain; }
  .js .site-navigation a { padding-block:13px; }
  .site-navigation a:not(.nav-download)::after { inset:auto auto 7px 0; width:24px; }
  .product-panel-copy { min-height:88px; }
  .product-shot>a,.product-phone>a { height:310px; }
  .product-tabs button { min-height:48px; }
}
@media(max-width:480px) { .product-panel-copy { min-height:116px; } .product-shot>a,.product-phone>a { height:265px; } }
@media(max-width:360px) { .product-panel-copy { min-height:135px; } .product-shot>a,.product-phone>a { height:240px; } }
/* In landscape, reserve space for controls and fit the image into what remains. */
@media(max-height:500px) {
  .screen-dialog[open] { display:flex; flex-direction:column; gap:8px; height:calc(100dvh - 24px); }
  .screen-dialog .dialog-bar,.screen-dialog .gallery-recovery,.screen-dialog .dialog-controls,.screen-dialog>.quiet,.screen-dialog .gallery-status { flex-shrink:0; margin:0; }
  .screen-dialog-image,.screen-dialog-image[aria-busy=true] { display:flex; align-items:center; justify-content:center; flex:1 1 auto; min-height:0; max-height:none; }
  .screen-dialog-image img { height:100%; width:auto; max-height:100%; object-fit:contain; }
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after { scroll-behavior:auto!important; animation:none!important; transition:none!important; }
  .product-shot>a:hover img,.button:active,.product-tabs button:active { transform:none; }
}
