/* Smooth heading entry and sticky navigation without changing page layout. */
#header{
    background:#fff;
    -webkit-backdrop-filter:none;
    backdrop-filter:none;
    transition:border-color .18s ease,box-shadow .18s ease;
}
.page-head .ph-word{
    --sn-word:0;
    animation:sn-heading-rise .72s cubic-bezier(.22,1,.36,1) both;
    animation-delay:calc(.08s + var(--sn-word)*.065s);
    white-space:nowrap;
    will-change:transform,opacity;
}
/* Animate complete words so their characters stay aligned while moving. */
.page-head .ph-ch,.page-head .h1-accent .ph-ch{
    animation:none;
    opacity:1;
    transform:none;
    filter:none;
    text-shadow:none;
}
/* The glint runs on letters independently of the smooth whole-word entrance. */
.page-head .h1-accent .ph-ch{
    color:var(--yellow);
    animation:sn-header-glint 7s ease-in-out infinite;
    animation-delay:calc(1.6s + var(--i,0)*.07s);
}
.hero-titles h1 span{animation:sn-header-glint 7s ease-in-out 1.6s infinite}
.page-head .rot[data-sn-width="content"]{min-width:0;width:auto}
.page-head .head-chip{animation:sn-heading-rise .6s cubic-bezier(.22,1,.36,1) .02s both,sn-header-glint 7s ease-in-out 1.6s infinite}
.page-head .ph-rule{animation:sn-heading-rule .65s cubic-bezier(.22,1,.36,1) .2s both}
.page-head .ph-sub{animation:sn-heading-rise .65s cubic-bezier(.22,1,.36,1) .24s both}
.page-head .head-cta{animation:sn-heading-rise .65s cubic-bezier(.22,1,.36,1) .34s both}
.page-head .head-facts li{animation:sn-heading-rise .65s cubic-bezier(.22,1,.36,1) both;animation-delay:calc(.34s + var(--i,0)*.05s)}
.page-head .rot-word{animation:sn-header-glint 7s ease-in-out 1.6s infinite;transition:opacity .32s ease,transform .32s cubic-bezier(.22,1,.36,1);filter:none}
.page-head .rot-word.out{opacity:0;transform:translateY(-35%);filter:none}
.page-head .rot-word.in{animation:sn-rotating-word .45s cubic-bezier(.22,1,.36,1) both,sn-header-glint 7s ease-in-out 1.6s infinite;filter:none}
.page-head.sn-heading-settled .ph-word{will-change:auto}
html.sn-motion-pending .page-head .ph-word,
html.sn-motion-pending .page-head .head-chip,
html.sn-motion-pending .page-head .ph-rule,
html.sn-motion-pending .page-head .ph-sub,
html.sn-motion-pending .page-head .head-cta,
html.sn-motion-pending .page-head .head-facts li{animation:none;opacity:0;transform:translate3d(0,12px,0)}
.hero-titles .ht{transition:opacity .75s ease,transform .75s cubic-bezier(.22,1,.36,1)}
@keyframes sn-header-glint{0%,7%,100%{color:var(--yellow);text-shadow:none}3%{color:#fff;text-shadow:0 0 18px rgba(252,223,36,.8)}}
@keyframes sn-heading-rise{from{opacity:0;transform:translate3d(0,14px,0)}to{opacity:1;transform:translate3d(0,0,0)}}
@keyframes sn-heading-rule{from{opacity:0;transform:scaleX(.35)}to{opacity:1;transform:scaleX(1)}}
@keyframes sn-rotating-word{from{opacity:0;transform:translate3d(0,35%,0)}to{opacity:1;transform:translate3d(0,0,0)}}
@media(prefers-reduced-motion:reduce){
    html.sn-motion-pending .page-head .ph-word,
    html.sn-motion-pending .page-head .head-chip,
    html.sn-motion-pending .page-head .ph-rule,
    html.sn-motion-pending .page-head .ph-sub,
    html.sn-motion-pending .page-head .head-cta,
    html.sn-motion-pending .page-head .head-facts li,
    .page-head .ph-word,.page-head .head-chip,.page-head .ph-rule,
    .page-head .ph-sub,.page-head .head-cta,.page-head .head-facts li{
        animation:none;opacity:1;transform:none;will-change:auto;
    }
    .page-head .h1-accent .ph-ch,.hero-titles h1 span{animation:none;color:var(--yellow);text-shadow:none}
    .page-head .rot-word{animation:none;transition:none;transform:none}
    #header,.hero-titles .ht{transition:none}
}
