.hero {
  background-image:
    linear-gradient(90deg, #000d33fc, #000d33ed 34%, #000d3378 62%, #000d3324),
    linear-gradient(180deg, rgba(0, 13, 51, 0.28), transparent 50%, rgba(0, 13, 51, 0.5)),
    url('./event-conference-hero.webp');
}

.cr-form [hidden] {
  display: none !important;
}

.contact-list a[href^="https://wa.me/"] svg {
  color: #25d366;
}

.safari-photo.safari-video {
  height: auto;
  aspect-ratio: 16 / 9;
  background: #000d33;
}

.safari-photo.safari-video iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
}

@media (min-width: 769px) {
  .audience-grid {
    grid-template-areas:
      "safari mountain"
      "guides guides"
      "welcome welcome";
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 30px 42px;
  }

  .safari-photo.safari-video {
    grid-area: safari;
  }

  .audience-right {
    display: contents;
  }

  .mountain-photo {
    grid-area: mountain;
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
  }

  .guide-list {
    display: grid;
    grid-area: guides;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 0;
    border-left: 1px solid rgba(212, 175, 55, .85);
  }

  .guide-list > div {
    min-width: 0;
    padding: 0 22px;
    border-right: 1px solid rgba(212, 175, 55, .85);
  }

  .also-welcome {
    grid-area: welcome;
    margin-top: -6px;
  }
}