/* ---------- Логотип в шапке: зацикленное «стаканчик падает в стаканчик» ----------
   Логотип встроен SVG, чтобы двигать части стакана по отдельности:
   .cup__base    — нижний стакан с заплаткой, приседает от удара;
   .cup__faller  — падающая копия корпуса (создаёт logo.js);
   .cup__rim     — полоса-край внутреннего стакана, проявляется на ударе;
   .cup__ring    — кольцо волны от удара;
   .cup__splash  — всплеск, вырывается из горлышка;
   .cup__drop    — капля справа, вылетает и садится на своё место;
   .cup__spray   — мелкие брызги, гаснут;
   .cup__patch   — заплатка на вырезе корпуса, пока нет всплеска.
   Сама анимация — в logo.js (Web Animations), здесь только точки трансформаций
   в координатах viewBox 74×32. */

/* Встроенный <svg> по умолчанию режет всё за viewBox, а всплеск, капля
   и падающий стакан выходят за рамку. */
.brand__logo { overflow: visible; }

.brand__logo :is(.cup__base, .cup__faller, .cup__rim, .cup__ring, .cup__splash, .cup__drop, .cup__spray) {
  transform-box: view-box;
  will-change: transform, opacity;
}

.brand__logo .cup__base { transform-origin: 12px 31.5px; }
.brand__logo .cup__faller { transform-origin: 12px 23px; }
.brand__logo .cup__ring { transform-origin: 12.5px 11.6px; }
.brand__logo .cup__splash { transform-origin: 12.5px 12px; }
.brand__logo .cup__drop { transform-origin: 23.3px 6.8px; }
.brand__logo .cup__spray { transform-origin: 12.5px 10px; }

/* Детали, которых нет в статике, видны только во время анимации. */
.brand__logo :is(.cup__faller, .cup__patch, .cup__ring, .cup__spray) { opacity: 0; }