/* Baby care page motion (see js/baby-care-fx.js). Everything is decoration: content never depends on it.
   Off for "reduce motion", off with the Pause switch (html.calm), off in print. */
.bcfx-bar-spacer{display:none}
.pg.bc main{position:relative;isolation:isolate}
.bcfx-sky{position:absolute;left:0;right:0;top:0;height:520px;overflow:hidden;pointer-events:none;z-index:-1}
.bcfx-sky span{position:absolute;bottom:-40px;left:var(--x);font-size:var(--s);opacity:0;filter:saturate(1.1)}
.bcfx-top{position:fixed;right:max(16px,env(safe-area-inset-right,0px));bottom:max(18px,env(safe-area-inset-bottom,0px));width:50px;height:50px;border-radius:50%;border:1.5px solid var(--line);background:var(--card);color:var(--ink);font-size:24px;line-height:1;cursor:pointer;box-shadow:0 10px 24px -8px rgba(31,42,68,.4);display:grid;place-items:center;opacity:0;transform:translateY(20px) scale(.7);pointer-events:none;transition:opacity .3s,transform .4s cubic-bezier(.3,1.5,.5,1);z-index:9990}
.bcfx-top.on{opacity:1;transform:none;pointer-events:auto}
.bcfx-top:hover{border-color:var(--coral)}
.bcfx-top:focus-visible{outline:3px solid var(--coral);outline-offset:2px}
.bcfx-prog{height:7px;border-radius:99px;background:color-mix(in srgb,var(--ink) 12%,transparent);margin:12px 0 2px;overflow:hidden;position:relative}
.bcfx-prog i{display:block;height:100%;width:0;border-radius:99px;background:linear-gradient(90deg,#F26B5B,#FFB347);transition:width .6s cubic-bezier(.2,.8,.2,1)}
.bcfx-prog-t{font-size:12.5px;font-weight:800;color:var(--mut);margin:0 0 2px}
.bcfx-done{box-shadow:0 0 0 2px color-mix(in srgb,#F5B301 70%,transparent),0 12px 28px -12px rgba(245,179,1,.6)}
.bcfx-done .bcfx-prog i{background:linear-gradient(90deg,#3DBE8B,#F5B301)}
.bc-jump a.on{border-color:var(--coral);background:color-mix(in srgb,var(--coral) 14%,var(--card));color:var(--ink)}
@media print{.bcfx-sky,.bcfx-top,.bcfx-prog,.bcfx-prog-t{display:none!important}.bcfx-pre .bc-card,.bcfx-pre .bc-h2,.bcfx-pre details,.bcfx-pre .bc-tablewrap,.bcfx-pre .bc-lead{opacity:1!important;transform:none!important}}

@media (prefers-reduced-motion:no-preference){
 @keyframes bcfx-up{from{opacity:0;transform:translateY(22px)}}
 @keyframes bcfx-pop{from{opacity:0;transform:translateY(26px) scale(.94)}}
 @keyframes bcfx-chip{from{opacity:0;transform:translateY(10px) scale(.85)}}
 @keyframes bcfx-rise{0%{transform:translate(0,0) rotate(0);opacity:0}12%{opacity:.32}100%{transform:translate(var(--dx),-520px) rotate(var(--r));opacity:0}}
 @keyframes bcfx-bob{0%,100%{transform:translateY(0) rotate(-6deg)}50%{transform:translateY(-6px) rotate(6deg)}}
 @keyframes bcfx-glow{0%,100%{box-shadow:0 0 0 0 rgba(182,58,40,.45)}60%{box-shadow:0 0 0 12px rgba(182,58,40,0)}}
 @keyframes bcfx-icon{0%{opacity:0;transform:scale(.3) rotate(-30deg)}60%{opacity:1;transform:scale(1.25) rotate(8deg)}100%{transform:none}}
 @keyframes bcfx-sway{0%,100%{transform:rotate(-14deg)}50%{transform:rotate(14deg)}}
 @keyframes bcfx-poke{0%,100%{transform:translateX(0) rotate(0)}30%{transform:translateX(10px) rotate(-12deg)}55%{transform:translateX(-2px)}}
 @keyframes bcfx-beat{0%,40%,100%{transform:scale(1)}10%{transform:scale(1.28)}22%{transform:scale(1)}30%{transform:scale(1.18)}}
 @keyframes bcfx-hop{0%,100%{transform:translateY(0)}35%{transform:translateY(-9px) scale(1.1)}60%{transform:translateY(0)}}
 @keyframes bcfx-fly{0%{transform:translateX(-18px) rotate(-8deg);opacity:0}30%{opacity:1}100%{transform:translateX(0) rotate(0)}}
 @keyframes bcfx-flick{0%,100%{transform:scale(1) rotate(-3deg);filter:brightness(1)}50%{transform:scale(1.12) rotate(3deg);filter:brightness(1.25)}}
 @keyframes bcfx-twinkle{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.25) rotate(12deg);opacity:.75}}
 @keyframes bcfx-zzz{0%{opacity:0;transform:translate(0,6px) scale(.6)}30%{opacity:.9}100%{opacity:0;transform:translate(16px,-22px) scale(1.2)}}
 @keyframes bcfx-panel{from{opacity:0;transform:translateX(18px)}}
 @keyframes bcfx-tick{0%{transform:scale(1)}40%{transform:scale(1.5) rotate(-8deg)}100%{transform:scale(1)}}
 @keyframes bcfx-open{from{opacity:0;transform:translateY(-10px)}}
 @keyframes bcfx-plus{from{transform:rotate(-90deg) scale(.5);opacity:0}}
 @keyframes bcfx-bump{40%{transform:scale(1.07)}}
 @keyframes bcfx-soon{0%,100%{background-color:color-mix(in srgb,#F5B301 14%,var(--card))}50%{background-color:color-mix(in srgb,#F5B301 30%,var(--card))}}
 @keyframes bcfx-slide{from{opacity:0;transform:translateX(-14px);background:color-mix(in srgb,var(--coral) 18%,transparent)}}
 @keyframes bcfx-press{40%{transform:scale(.92)}70%{transform:scale(1.06)}}

 /* top of page */
 .pg.bc h1{position:relative;display:inline-block}
 .pg.bc h1:after{content:"\1F37C";display:inline-block;margin-left:.3em;font-size:.8em;animation:bcfx-bob 3s ease-in-out infinite}
 .pg.bc .lead{animation:bcfx-up .7s .3s cubic-bezier(.2,.7,.2,1) both}
 .bc-sos{animation:bcfx-up .7s .45s cubic-bezier(.2,.7,.2,1) both,bcfx-glow 2.6s 1.4s ease-out 3}
 .bc-jump li{animation:bcfx-chip .5s cubic-bezier(.2,.7,.2,1) backwards;animation-delay:calc(.5s + var(--i,0)*35ms)}
 .bc-jump a{transition:transform .2s,border-color .2s,background-color .25s}.bc-jump a:hover{transform:translateY(-2px) scale(1.04)}
 .bcfx-sky span{animation:bcfx-rise var(--t) linear var(--d) infinite}

 /* sections appear as you scroll (only sections that start below the fold get hidden, and only by script) */
 .bcfx-pre .bc-h2,.bcfx-pre .bc-lead,.bcfx-pre .bc-card,.bcfx-pre details,.bcfx-pre .bc-tablewrap,.bcfx-pre .bc-tabs{opacity:0}
 .bcfx-in .bc-h2{animation:bcfx-up .6s cubic-bezier(.2,.7,.2,1) backwards}
 .bcfx-in .bc-lead{animation:bcfx-up .6s .08s cubic-bezier(.2,.7,.2,1) backwards}
 .bcfx-in .bc-tabs,.bcfx-in .bc-tablewrap{animation:bcfx-up .6s .12s cubic-bezier(.2,.7,.2,1) backwards}
 .bcfx-in .bc-card,.bcfx-in details{animation:bcfx-pop .6s cubic-bezier(.2,.7,.2,1) backwards;animation-delay:calc(.12s + var(--i,0)*70ms)}
 .bc-card{transition:transform .3s cubic-bezier(.2,.7,.2,1),box-shadow .3s}
 .bc-card:hover{transform:translateY(-3px);box-shadow:0 14px 28px -16px rgba(31,42,68,.4)}

 /* the little picture before each heading */
 .bc-ic{display:inline-block}
 .bcfx-in .bc-ic{animation:bcfx-icon .8s .1s cubic-bezier(.3,1.4,.5,1) backwards}
 .bc-h2:hover .bc-ic{animation:bcfx-hop .6s ease}
 #bc-sleep.bcfx-in .bc-ic{animation:bcfx-icon .8s .1s backwards,bcfx-sway 4s .9s ease-in-out infinite;transform-origin:50% 90%}
 #bc-sleep .bc-h2{position:relative}
 #bc-sleep .bc-h2:after{content:"z z Z";position:absolute;left:2.1em;top:-.5em;font:800 .62em var(--fb);letter-spacing:.2em;color:var(--mut);opacity:0;animation:bcfx-zzz 3.4s 1s ease-out infinite;pointer-events:none}
 #bc-vaccine.bcfx-in .bc-ic{animation:bcfx-icon .8s .1s backwards,bcfx-poke 1.1s 1s ease-in-out 2}
 #bc-firstaid.bcfx-in .bc-ic,#bc-recovery.bcfx-in .bc-ic,#bc-mother.bcfx-in .bc-ic{animation:bcfx-icon .8s .1s backwards,bcfx-beat 1.8s 1s ease-in-out infinite}
 #bc-recovery.bcfx-in .bc-ic{animation:bcfx-icon .8s .1s backwards,bcfx-beat 1.8s 1s ease-in-out infinite}
 #bc-happy.bcfx-in .bc-ic,#bc-feeding.bcfx-in .bc-ic,#bc-age.bcfx-in .bc-ic{animation:bcfx-icon .8s .1s backwards,bcfx-hop 1.2s 1s ease-in-out 3}
 #bc-travel.bcfx-in .bc-ic{animation:bcfx-fly 1s .1s cubic-bezier(.2,.8,.2,1) backwards}
 #bc-tradition.bcfx-in .bc-ic{animation:bcfx-icon .8s .1s backwards,bcfx-flick 1.6s 1s ease-in-out infinite}
 #bc-skills.bcfx-in .bc-ic,#bc-grand.bcfx-in .bc-ic,#bc-milestones.bcfx-in .bc-ic{animation:bcfx-icon .8s .1s backwards,bcfx-twinkle 2s 1s ease-in-out 3}

 /* tabs, ticking, accordions */
 .bc-panel:not([hidden]){animation:bcfx-panel .45s cubic-bezier(.2,.7,.2,1)}
 .bc-panel:not([hidden]) .bc-card{animation:bcfx-pop .5s cubic-bezier(.2,.7,.2,1) backwards;animation-delay:calc(var(--i,0)*60ms)}
 .bc-tab[aria-selected="true"]{animation:bcfx-press .4s ease}
 .bc-check input:checked,.bc-table input[type=checkbox]:checked{animation:bcfx-tick .45s cubic-bezier(.3,1.4,.5,1)}
 .bc-check span{transition:color .3s}
 .pg.bc details[open] .bc-body{animation:bcfx-open .35s cubic-bezier(.2,.7,.2,1)}
 .pg.bc details[open] summary::after{animation:bcfx-plus .3s ease}
 .pg.bc summary{transition:background-color .25s}.pg.bc summary:hover{background:color-mix(in srgb,var(--coral) 7%,var(--card))}

 /* calculator and tracker */
 #bc-age-out.bcfx-b{animation:bcfx-bump .5s ease;display:inline-block;transform-origin:left}
 .bc-table tr.is-soon{animation:bcfx-soon 2.6s ease-in-out infinite}
 #bc-trk-sum.bcfx-b{animation:bcfx-bump .5s ease;transform-origin:left}
 .bc-trk .btn.bcfx-p{animation:bcfx-press .4s ease}
 .bc-trklist.bcfx-new li:first-child{animation:bcfx-slide .5s ease}
 #bc-print{transition:transform .2s}#bc-print:hover{transform:rotate(-2deg) scale(1.03)}
}
html.calm .pg.bc *,html.calm .pg.bc *:before,html.calm .pg.bc *:after{animation:none!important}
html.calm .pg.bc .bcfx-pre .bc-h2,html.calm .pg.bc .bcfx-pre .bc-lead,html.calm .pg.bc .bcfx-pre .bc-card,html.calm .pg.bc .bcfx-pre details,html.calm .pg.bc .bcfx-pre .bc-tablewrap,html.calm .pg.bc .bcfx-pre .bc-tabs{opacity:1}
html.calm .bcfx-sky{display:none}
@media (prefers-reduced-motion:reduce){.bcfx-sky{display:none}.bcfx-top{transition:none}.bcfx-prog i{transition:none}}
