/* Original Favorit silhouettes, rebuilt as SVG. Plays once on page load. */
.header .brand{width:286px;display:block;line-height:0}
.favorit-logo{display:block;width:100%;height:auto;overflow:visible}
footer .brand{width:216px}
.logo-animated .word-outline{stroke-dasharray:1;stroke-dashoffset:0;animation:logo-outline 1.05s cubic-bezier(.4,0,.2,1) calc(var(--letter)*.12s) both}
.logo-animated .word-fill{animation:logo-ink .55s ease-out calc(.55s + var(--letter)*.12s) both}
.logo-animated .bubble-big{transform-box:fill-box;transform-origin:center;stroke-dasharray:1;animation:bubble-draw .6s ease 1.95s both,bubble-fill .5s ease 2.1s both}
.logo-animated .bubble-small{transform-box:fill-box;transform-origin:center;stroke-dasharray:1;animation:bubble-draw .45s ease 2.3s both,bubble-fill .4s ease 2.42s both}
.bubble-glint{opacity:0;animation:bubble-glint .72s ease-in-out 2.95s both}
.bubble-spark{opacity:0;transform-box:fill-box;transform-origin:center;animation:bubble-spark .6s ease-out 3.24s both}
@keyframes logo-outline{0%{stroke-dashoffset:1;opacity:1}75%{opacity:1}100%{stroke-dashoffset:0;opacity:0}}
@keyframes logo-ink{from{fill-opacity:0}to{fill-opacity:1}}
@keyframes bubble-draw{from{stroke-dashoffset:1;opacity:0;transform:scale(.88)}25%{opacity:1}to{stroke-dashoffset:0;opacity:1;transform:scale(1)}}
@keyframes bubble-fill{from{fill-opacity:0}to{fill-opacity:1}}
@keyframes bubble-glint{0%{opacity:0;transform:translateX(0)}20%{opacity:.95}85%{opacity:.8}100%{opacity:0;transform:translateX(85px)}}
@keyframes bubble-spark{0%{opacity:0;transform:scale(.4) rotate(-15deg)}35%{opacity:1;transform:scale(1.3) rotate(0)}100%{opacity:0;transform:scale(.6) rotate(15deg)}}
.drop-icon{width:46px;height:46px;min-width:46px;flex:0 0 46px;aspect-ratio:1;border-radius:50%;padding:0;line-height:1}
@media(max-width:1150px) and (min-width:781px){.header .brand{width:255px}.header{gap:25px}}
@media(max-width:780px){.header .brand{width:228px}.header{gap:20px}.mobile-nav{top:100px}footer .brand{width:195px}}
@media(max-width:350px){.header .brand{width:196px}.header{gap:14px}}
@media(prefers-reduced-motion:reduce){.logo-animated .word-outline{display:none}.logo-animated .word-fill,.logo-animated .bubble-big,.logo-animated .bubble-small{animation:none;fill-opacity:1;opacity:1;transform:none}.bubble-glint,.bubble-spark{display:none}}