/* A coffee cup drawn as the first v in kávéval. Real text stays available to assistive tools. */
.teal .hero-copy h1 .coffee-word{display:inline-block;position:relative;white-space:nowrap;color:var(--ink)}.coffee-word-visual{display:inline;white-space:nowrap}.teal .hero-copy h1 .coffee-word-visual{color:var(--ink)}.coffee-letter{display:inline-block;position:relative;width:.63em;height:.94em;vertical-align:-.13em;margin:0 -.035em 0 -.015em}.coffee-letter>svg{display:block;width:100%;height:100%;overflow:visible}.letter-cup-body{transform-origin:29px 67px;transition:transform .35s cubic-bezier(.2,.8,.2,1)}.coffee-word:hover .letter-cup-body{transform:rotate(-7deg)}.letter-cup-fill{animation:letter-coffee-wave 10s linear infinite}.letter-cup-steam path{opacity:.6;transform-origin:center;animation:letter-coffee-steam 3.8s ease-in-out infinite}.letter-cup-steam .letter-steam-two{animation-delay:-1.8s}
@keyframes letter-coffee-wave{from{transform:translateX(0)}to{transform:translateX(-56px)}}
@keyframes letter-coffee-steam{0%{opacity:0;transform:translateY(4px)}25%{opacity:.65}75%{opacity:.45}100%{opacity:0;transform:translateY(-8px)}}
@media(max-width:560px){.coffee-letter{width:.65em;height:.97em;vertical-align:-.14em}.letter-cup-steam path{animation-iteration-count:3;animation-fill-mode:forwards}}
@media(prefers-reduced-motion:reduce){.letter-cup-fill,.letter-cup-steam path{animation:none;transform:none}.letter-cup-steam path{opacity:.55}.letter-cup-body{transition:none}.coffee-word:hover .letter-cup-body{transform:none}}
