/* Event pages (/event-details-registration/*). */

/* Grey band behind the title area that ends halfway down the image. */
.event-top { background: linear-gradient(#e8e6e2 calc(100% - min(276px, 28.2vw)), transparent 0); }
.event-hero { width: 843px; max-width: calc(100% - 32px); margin: 0 auto; padding-top: 65px; text-align: center; }
.event-hero__title { font: italic 400 60px/72px var(--f-display); }
.event-hero__when { margin-top: 25px; font: 300 18px/25.2px var(--f-body); }
.event-hero__sep { display: inline-block; width: 19px; }
.event-hero__teaser { width: 560px; max-width: 100%; margin: 17px auto 0; font: 300 16px/24px var(--f-body); }
.event-hero__status { margin-top: 42px; padding-top: 43px; border-top: 1px solid #c9c8c8; font: 300 16px/24px var(--f-body); }
.event-hero__status a { text-underline-offset: 2px; }
.event-hero__status a:hover { color: var(--gold); }

.event-image { width: 979px; max-width: 100%; height: auto; aspect-ratio: 979 / 552; margin: 60px auto 0; object-fit: cover; }

.event-body { width: 843px; max-width: calc(100% - 32px); margin: 0 auto; }
.event-body section { margin-top: 50px; }
.event-body section + section { margin-top: 60px; }
.event-body h2 { margin-bottom: 15px; font: italic 400 30px/39px var(--f-display); }
.event-body p { font: 300 16px/24px var(--f-body); }
.event-body .event-body__line { font: 300 16px/22.4px var(--f-body); }
.event-body .event-body__line + .event-body__line { margin-top: 5px; }

.event-map { display: block; width: 979px; max-width: 100%; height: 314px; margin: 45px auto 0; border: 0; }

.event-share { padding: 60px 0 44px; }
.event-share h2 { margin-bottom: 26px; }
.event-share ul { display: flex; gap: 30px; margin: 0; padding: 0 0 0 1px; list-style: none; }
.event-share a { display: block; width: 18px; height: 18px; color: var(--navy); }
.event-share svg { width: 18px; height: 18px; fill: currentColor; }

/* Mobile: Wix 320px units, see site.css */
@media (max-width: 760px) {
  .event-top { display: flex; flex-direction: column; background: none; }
  .event-image { order: -1; width: 100%; height: calc(180 * var(--m)); margin: 0; }
  .event-hero { width: auto; max-width: none; margin: 0; padding: calc(20 * var(--m)) calc(20 * var(--m)) calc(20 * var(--m)); background: #e8e6e2; }
  .event-hero__title { font-size: calc(28 * var(--m)); line-height: calc(36.4 * var(--m)); }
  .event-hero__when { margin-top: calc(1 * var(--m)); font-size: calc(14 * var(--m)); line-height: calc(19.6 * var(--m)); }
  .event-hero__sep { width: calc(15 * var(--m)); }
  .event-hero__teaser { margin-top: calc(15 * var(--m)); font-size: calc(14 * var(--m)); line-height: calc(21 * var(--m)); }
  .event-hero__status { margin-top: calc(20 * var(--m)); padding-top: calc(20 * var(--m)); font-size: calc(14 * var(--m)); line-height: calc(21 * var(--m)); }
  .event-body { width: auto; max-width: none; padding: 0 calc(20 * var(--m)); }
  .event-body section { margin-top: calc(20 * var(--m)); }
  .event-body section + section { margin-top: calc(20 * var(--m)); }
  .event-body h2 { margin-bottom: calc(16 * var(--m)); font-size: calc(20 * var(--m)); line-height: calc(26 * var(--m)); }
  .event-body p, .event-body .event-body__line { font-size: calc(14 * var(--m)); line-height: calc(19.6 * var(--m)); }
  .event-body .event-body__line + .event-body__line { margin-top: 0; }
  .event-map { width: 100%; height: calc(180 * var(--m)); margin-top: calc(40 * var(--m)); }
  .event-share { padding: calc(20 * var(--m)) calc(20 * var(--m)) calc(40 * var(--m)); }
  .event-share h2 { margin-bottom: calc(26 * var(--m)); }
  .event-share ul { gap: calc(31 * var(--m)); }
  .event-share a, .event-share svg { width: calc(18 * var(--m)); height: calc(18 * var(--m)); }
}