/* Hanging two-part sign for the upcoming events scenario. */
.scenario-module .audience:nth-child(3) .scenario-coming-sign {
  isolation: isolate;
  position: absolute;
  z-index: 20;
  top: 20px;
  right: 24px;
  bottom: auto;
  overflow: visible;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-end;
  box-sizing: border-box;
  width: 152px;
  min-width: 152px;
  height: 118px;
  min-height: 118px;
  padding: 26px 0 0;
  border-radius: 0;
  color: #fff !important;
  background: transparent;
  transform: none;
  box-shadow: none;
  display: inline-flex;
}

.scenario-module .audience:nth-child(3) .scenario-coming-sign.is-assistant-swinging {
  transform-origin: 50% 4px;
  animation: scenarioSignAssistantSwing 2.42s cubic-bezier(.36, .02, .22, 1) both;
}

@keyframes scenarioSignAssistantSwing {
  0% { transform: rotate(0deg); }
  8% { transform: rotate(9deg); }
  18% { transform: rotate(-7deg); }
  30% { transform: rotate(6deg); }
  42% { transform: rotate(-5deg); }
  54% { transform: rotate(4deg); }
  66% { transform: rotate(-3deg); }
  78% { transform: rotate(2deg); }
  89% { transform: rotate(-1deg); }
  100% { transform: rotate(0deg); }
}

.scenario-module .audience:nth-child(3) .scenario-coming-sign::before {
  content: "";
  position: absolute;
  z-index: 0;
  top: 0;
  left: 14px;
  width: 124px;
  height: 37px;
  background:
    linear-gradient(
      to bottom right,
      transparent 47.5%,
      #26334d 48%,
      #26334d 52%,
      transparent 52.5%
    ) left top / 50% 100% no-repeat,
    linear-gradient(
      to bottom left,
      transparent 47.5%,
      #26334d 48%,
      #26334d 52%,
      transparent 52.5%
    ) right top / 50% 100% no-repeat;
  filter: drop-shadow(0 1px 1px rgba(255, 255, 255, .35));
  pointer-events: none;
}

.scenario-module .audience:nth-child(3) .scenario-coming-sign::after {
  content: "";
  position: absolute;
  z-index: 3;
  inset: 0;
  background:
    radial-gradient(
      circle at 18px 37px,
      #f8f6ed 0 4px,
      #26334d 4.5px 6px,
      transparent 6.5px
    ),
    radial-gradient(
      circle at 134px 37px,
      #f8f6ed 0 4px,
      #26334d 4.5px 6px,
      transparent 6.5px
    );
  pointer-events: none;
}

.scenario-module .audience:nth-child(3) .scenario-coming-sign-line {
  position: relative;
  z-index: 2;
  flex: none;
  justify-content: center;
  align-items: center;
  box-sizing: border-box;
  color: #fff;
  -webkit-text-fill-color: #fff;
  font-family: Rockwell, "Roboto Slab", Georgia, serif;
  font-weight: 900;
  line-height: 1;
  text-transform: uppercase;
  text-shadow: 0 2px 2px rgba(110, 6, 4, .36);
  filter:
    drop-shadow(0 6px 5px rgba(42, 67, 111, .2))
    drop-shadow(0 1px 0 rgba(109, 7, 4, .34));
  display: inline-flex;
}

.scenario-module .audience:nth-child(3) .scenario-coming-sign-line-primary {
  width: 152px;
  height: 46px;
  padding: 0 14px;
  background: linear-gradient(102deg, #d60f0a 0%, #fa2118 48%, #dc0f09 100%);
  clip-path: polygon(
    0 9%,
    7% 12%,
    13% 4%,
    20% 11%,
    27% 5%,
    34% 13%,
    42% 6%,
    49% 12%,
    56% 4%,
    63% 11%,
    70% 5%,
    77% 13%,
    84% 6%,
    91% 12%,
    100% 7%,
    98% 31%,
    100% 49%,
    97% 68%,
    100% 94%,
    91% 90%,
    84% 97%,
    76% 91%,
    68% 98%,
    60% 90%,
    52% 96%,
    44% 89%,
    36% 97%,
    28% 90%,
    20% 96%,
    12% 89%,
    0 95%,
    3% 72%,
    0 54%,
    4% 37%
  );
  font-size: 18px;
  letter-spacing: .07em;
}

.scenario-module .audience:nth-child(3) .scenario-coming-sign-line-secondary {
  width: 132px;
  height: 47px;
  margin-top: -1px;
  margin-right: 5px;
  padding: 0 12px 2px;
  background: linear-gradient(100deg, #bd0c08 0%, #ea1610 50%, #c10a07 100%);
  clip-path: polygon(
    2% 8%,
    12% 12%,
    21% 4%,
    31% 11%,
    41% 5%,
    51% 13%,
    61% 6%,
    71% 12%,
    82% 4%,
    91% 11%,
    100% 6%,
    97% 30%,
    100% 48%,
    96% 67%,
    100% 93%,
    90% 88%,
    80% 96%,
    70% 89%,
    60% 97%,
    50% 90%,
    40% 98%,
    30% 89%,
    20% 96%,
    10% 88%,
    1% 94%,
    4% 71%,
    0 52%,
    5% 34%
  );
  font-size: 22px;
  letter-spacing: .1em;
  transform: rotate(-3deg);
}

@media (prefers-reduced-motion: reduce) {
  .scenario-module .audience:nth-child(3) .scenario-coming-sign.is-assistant-swinging {
    animation: none;
  }
}