html.framio-portal{
  --ap-spring:linear(0,.18 6%,.52 14%,.8 23%,.96 33%,1.03 42%,1.04 50%,1.02 62%,1 80%,1);
  --ap-snap:cubic-bezier(.2,.8,.2,1);
  --ap-glass:color-mix(in srgb,var(--nav-bg) 62%,transparent);
  --ap-edge:color-mix(in srgb,#fff 38%,transparent);
}
html.framio-portal :is(.section-sub,.feat-text,.prod-desc){line-height:1.55;text-wrap:pretty;}
html.framio-portal :is(.hero h1,.section-title){text-wrap:balance;}
.ap-sentinel{position:absolute;top:0;left:0;width:1px;height:8px;pointer-events:none;visibility:hidden;}
html.framio-portal nav{
  background:var(--ap-glass);
  -webkit-backdrop-filter:blur(22px) saturate(180%);
  backdrop-filter:blur(22px) saturate(180%);
  border-bottom:0;
  box-shadow:inset 0 1px 0 var(--ap-edge);
  transition:background .35s var(--ap-snap),box-shadow .35s var(--ap-snap);
}
html.framio-portal nav::after{
  content:"";position:absolute;left:0;right:0;bottom:-24px;height:24px;pointer-events:none;
  background:linear-gradient(to bottom,color-mix(in srgb,var(--bg) 55%,transparent),transparent);
  opacity:0;transition:opacity .35s var(--ap-snap);
}
html.framio-portal nav.is-scrolled{
  background:color-mix(in srgb,var(--nav-bg) 74%,transparent);
  box-shadow:inset 0 1px 0 var(--ap-edge),0 10px 30px -18px rgba(0,0,0,.45);
}
html.framio-portal nav.is-scrolled::after{opacity:1;}
html.framio-portal :is(.btn-primary,.nav-demo,.nav-btn,.pricing-cta,.auth-submit,.text-link,.nav-link){
  transition:transform .5s var(--ap-spring),background .2s,border-color .2s,box-shadow .3s var(--ap-snap);
  -webkit-tap-highlight-color:transparent;
}
html.framio-portal :is(.btn-primary,.nav-demo,.nav-btn,.pricing-cta,.auth-submit):hover{transform:translateY(-1px);}
html.framio-portal :is(.btn-primary,.nav-demo,.nav-btn,.pricing-cta,.auth-submit,.prod-card,.pricing-card,.feat-card):active,
html.framio-portal .is-pressed{
  transform:scale(.975);
  transition-duration:.1s;
  transition-timing-function:ease-out;
}
html.framio-portal :is(.feat-card,.prod-card,.pricing-card,.journey-step){
  transition:transform .6s var(--ap-spring),opacity .6s var(--ap-snap),box-shadow .35s var(--ap-snap),border-color .25s;
  box-shadow:inset 0 1px 0 color-mix(in srgb,#fff 10%,transparent);
}
@media (hover:hover){
  html.framio-portal :is(.feat-card,.prod-card,.pricing-card):hover{
    transform:translateY(-3px);
    box-shadow:inset 0 1px 0 var(--ap-edge),0 24px 48px -28px rgba(0,0,0,.5);
  }
}
html.framio-portal :is(.browser-bar,.mobile-nav){
  -webkit-backdrop-filter:blur(18px) saturate(170%);
  backdrop-filter:blur(18px) saturate(170%);
}
html.framio-portal :focus-visible{outline:2px solid var(--ui-link);outline-offset:3px;border-radius:8px;}
@media (prefers-reduced-motion:reduce){
  html.framio-portal :is(.btn-primary,.nav-demo,.nav-btn,.pricing-cta,.auth-submit,.feat-card,.prod-card,.pricing-card,.journey-step){transition:opacity .2s ease;transform:none !important;}
}
@media (prefers-reduced-transparency:reduce){
  html.framio-portal nav,html.framio-portal nav.is-scrolled{background:var(--nav-bg);-webkit-backdrop-filter:none;backdrop-filter:none;}
  html.framio-portal :is(.browser-bar,.mobile-nav){-webkit-backdrop-filter:none;backdrop-filter:none;}
}
@media (prefers-contrast:more){
  html.framio-portal nav{background:var(--nav-bg);border-bottom:1px solid var(--border2);}
}