.hero-logo-letter {
  position: relative;
  display: inline-block;
  width: .4em;
  letter-spacing: 0;
  text-align: center;
}
/* Keep the wider bottle gap inside the original headline margins. */
@media (min-width: 1100px) {
  .hero h1 { font-size: calc(var(--site-unit) * 16.7); }
}
@media (min-width: 761px) and (max-width: 1099px) {
  .hero h1 { font-size: calc(var(--site-unit) * 18.1); }
}
.hero-logo-glyph {
  display: inline-block;
  transform-origin: 50% 65%;
  transition: opacity .28s cubic-bezier(.22,1,.36,1), transform .45s cubic-bezier(.22,1,.36,1);
}
.hero-logo-bottle {
  position: absolute;
  top: .075em;
  left: 50%;
  width: .58em;
  height: .79em;
  opacity: 0;
  padding: 0;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: inherit;
  font: inherit;
  line-height: 1;
  min-width: 44px;
  min-height: 44px;
  cursor: pointer;
  touch-action: manipulation;
  transform: translateX(-50%) scale(.65);
  pointer-events: none;
  transition: opacity .35s cubic-bezier(.22,1,.36,1), transform .55s cubic-bezier(.22,1,.36,1);
}
.hero-logo-bottle canvas { display: block; width: 100%; height: 100%; }
.hero-logo-letter.is-bottle .hero-logo-glyph { opacity: 0; transform: scaleX(.15); }
.hero-logo-letter.is-bottle .hero-logo-bottle {
  opacity: 1;
  transform: translateX(-50%) scale(1);
  animation: hero-bottle-pop .6s both;
  pointer-events: auto;
}
.hero-logo-bottle:focus-visible { outline: 2px solid #fff; outline-offset: 5px; }
@keyframes hero-bottle-pop {
  0% { opacity: 0; transform: translateX(-50%) translateY(.13em) scale(.25) rotate(-10deg); animation-timing-function: cubic-bezier(.16,1,.3,1); }
  68% { opacity: 1; transform: translateX(-50%) translateY(-.018em) scale(1.1) rotate(3deg); animation-timing-function: cubic-bezier(.22,1,.36,1); }
  100% { opacity: 1; transform: translateX(-50%) translateY(0) scale(1) rotate(0deg); }
}
@media (prefers-reduced-motion: reduce) {
  .hero-logo-glyph, .hero-logo-bottle { transition: none; }
  .hero-logo-letter.is-bottle .hero-logo-bottle { animation: none; }
}
