:root {
  --urgent-red: #ef1b24;
  --urgent-red-dark: #a90f18;
  --urgent-ink: #2c2020;
  --urgent-cream: #fff8ec;
  --urgent-peach: #fad89e;
  --urgent-blue: #49baf2;
  --event-banner-height: 420px;
  --event-image-gap: 12px;
  --event-subtitle-height: 0px;
}

body {
  background:
    radial-gradient(circle at 8% 12%, rgba(73, 186, 242, 0.12), transparent 24rem),
    linear-gradient(180deg, #fffaf1 0%, #fff4df 100%);
  color: var(--urgent-ink);
}

.conf {
  position: relative;
  max-width: 1180px;
  margin: 24px auto 56px;
  border: 0;
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.82);
  box-shadow: 0 24px 70px rgba(92, 42, 24, 0.14);
  overflow: hidden;
}

.confheader,
.confTitleBox,
.confSubTitleBox {
  background: var(--urgent-peach) !important;
  border-color: transparent !important;
}

.confTitleBox {
  padding: 0 !important;
  height: calc(var(--event-banner-height) + var(--event-image-gap));
  overflow: visible;
}

.confTitleBox h1 {
  margin: 0;
}

.confLogoBannerBox,
.confLogoBannerBox .confLogo {
  display: block;
}

.confLogoBannerBox {
  max-height: var(--event-banner-height);
  overflow: visible;
}

.confLogoBannerBox .confLogo {
  box-sizing: border-box;
  width: auto;
  max-width: 100%;
  height: var(--event-banner-height);
  margin: 0 auto;
  padding: 22px 30px;
  object-fit: contain;
  object-position: center;
}

.confSubTitleBox {
  display: none;
}

.confSubTitle,
.conference-title-link {
  color: var(--urgent-ink) !important;
}

.simpleTextAnnouncement {
  position: relative;
  margin: 0;
  padding: 18px 72px 18px 30px;
  border: 0;
  background: linear-gradient(110deg, var(--urgent-red-dark), var(--urgent-red));
  color: #fff;
  font-size: 1.15rem;
  font-weight: 800;
  letter-spacing: 0.02em;
  text-align: center;
  box-shadow: inset 0 -1px rgba(0, 0, 0, 0.12);
  transition: filter 160ms ease, box-shadow 160ms ease;
}

/* Place the overview page's real registration anchor over the announcement. */
.conference-page .action-box,
.conference-page .action-box .section,
.conference-page .action-box .toolbar {
  position: static !important;
}

.conference-page .action-box .toolbar a[href="/event/18539/registrations/"] {
  position: absolute;
  z-index: 50;
  top: calc(var(--event-banner-height) + var(--event-image-gap) + var(--event-subtitle-height));
  right: 0;
  left: 0;
  display: block;
  box-sizing: border-box;
  width: 100%;
  min-width: 100%;
  height: 58px;
  margin: 0;
  padding: 0;
  border: 0 !important;
  opacity: 0;
  cursor: pointer;
}

/* Keep the announcement clickable outside the Overview page too. */
.conf_leftMenu a[href="/event/18539/registrations/"]::after {
  content: "";
  position: absolute;
  z-index: 40;
  top: calc(var(--event-banner-height) + var(--event-image-gap) + var(--event-subtitle-height));
  right: 0;
  left: 0;
  height: 58px;
  cursor: pointer;
}

.conf:has(.conference-page .action-box .toolbar a[href="/event/18539/registrations/"]:hover) .simpleTextAnnouncement {
  filter: brightness(1.08);
  box-shadow: inset 0 -1px rgba(0, 0, 0, 0.12), 0 5px 18px rgba(169, 15, 24, 0.22);
}

.simpleTextAnnouncement::after {
  content: "→";
  position: absolute;
  right: 28px;
  top: 50%;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: #fff;
  color: var(--urgent-red);
  line-height: 34px;
  transform: translateY(-50%);
}

#confSectionsBox {
  padding: 28px;
  background: transparent;
}

.conf_leftMenu {
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 0 18px !important;
  border: 0;
  border-radius: 12px;
  background: transparent;
  box-shadow: none;
  overflow: visible !important;
}

.conf_leftMenu nav {
  border: 1px solid rgba(169, 15, 24, 0.12);
  border-radius: 12px;
  background: #fff;
  overflow: visible !important;
}

.conf_leftMenu #outer,
.conf_leftMenu li {
  position: static !important;
  overflow: visible !important;
}

.conf_leftMenu .event-menu-heading {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}

.conf_leftMenu #outer {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
}

.conf_leftMenu ul,
.conf_leftMenu li {
  margin: 0;
  padding: 0;
  list-style: none;
}

.conf_leftMenu li a {
  display: block;
  padding: 10px 16px;
  border-right: 1px solid #f3e6d2;
  color: #513a36;
  line-height: 1.3;
  transition: background-color 160ms ease, color 160ms ease;
}

.conf_leftMenu li {
  flex: 1 1 auto;
  min-width: 130px;
  text-align: center;
}

.conf_leftMenu .inner {
  display: none;
}

.conf_leftMenu li a:hover,
.conf_leftMenu li.selected > a {
  background: #fff0d5;
  color: var(--urgent-red-dark);
}

.conf_leftMenu li.selected > a {
  box-shadow: inset 4px 0 var(--urgent-red);
  font-weight: 700;
}

.confBodyBox {
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  border: 0;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 10px 34px rgba(70, 36, 28, 0.08);
}

.conference-page {
  padding: 8px 10px 22px;
}

.conferenceDetails h2,
.conferenceDetails h3,
.conference-page h2,
.conference-page h3 {
  color: var(--urgent-red-dark);
}

.conferenceDetails a,
.conference-page a {
  color: var(--urgent-red-dark);
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

.conferenceDetails img {
  max-width: 100%;
  height: auto;
  border-radius: 14px;
  box-shadow: 0 8px 24px rgba(70, 36, 28, 0.1);
}

.urgent-programme {
  --programme-red: #c26a72;
  --programme-blue: #5aa7cf;
  max-width: 980px;
  margin: 0 auto;
  color: #302323;
}

.urgent-programme__intro {
  margin-bottom: 12px;
  padding: 10px 16px;
  border-radius: 10px;
  background: linear-gradient(135deg, #ffdca3, #ffc987);
  text-align: center;
}

.urgent-programme__intro h2 {
  margin: 0;
  color: var(--programme-red);
  font-size: 1.35rem;
  line-height: 1.2;
  text-transform: uppercase;
}

.urgent-programme__eyebrow,
.urgent-programme__intro > p:last-child {
  margin: 0;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.urgent-day {
  min-width: 0;
  margin: 0;
  padding: 12px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.48);
}

.urgent-days {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  align-items: start;
  margin: 28px 0;
}

.urgent-day > h2 {
  margin: 0 0 12px;
  padding: 16px 20px;
  border-radius: 12px;
  background: #b05c64;
  color: #fff !important;
  font-size: clamp(1.35rem, 4vw, 2rem);
  text-align: center;
}

.urgent-day--thursday,
.urgent-day--friday {
  border: 2px solid #000;
}

.urgent-day--friday > h2 {
  background: #b05c64;
  color: #fff !important;
}

.urgent-programme__grid {
  display: grid;
  gap: 9px;
}

.urgent-programme__grid--afternoon {
  margin-top: 28px;
}

.urgent-item {
  display: grid;
  grid-template-columns: minmax(94px, 0.22fr) 1fr;
  overflow: hidden;
  border: 1px solid #f1dfc5;
  border-radius: 10px;
  background: #fff8eb;
}

.urgent-item .urgent-time {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px 12px;
  border-right: 3px solid #ffd99f;
  color: var(--programme-red);
  font-weight: 900;
  text-align: center;
}

.urgent-item > div {
  padding: 16px 20px;
  text-align: center;
}

.urgent-item h3,
.urgent-item p {
  margin: 0;
}

.urgent-item h3 {
  color: #2f2222 !important;
  font-size: clamp(1rem, 2.3vw, 1.28rem);
  line-height: 1.3;
}

.urgent-item p + p {
  margin-top: 10px;
}

.urgent-item strong {
  color: var(--programme-red);
}

.urgent-label {
  display: block;
  margin-bottom: 4px;
  color: var(--programme-blue);
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.urgent-item--featured {
  border-color: var(--programme-red);
  background: var(--programme-red);
  color: #fff;
}

.urgent-item--featured .urgent-time {
  border-color: rgba(255, 255, 255, 0.55);
  color: #ffe4e6;
}

.urgent-item--featured h3,
.urgent-item--featured p,
.urgent-item--featured strong {
  color: #fff !important;
}

.urgent-item--break {
  background: #ffb3ad;
}

.urgent-item--title {
  display: block;
  padding: 16px 20px;
  border: 0;
  border-radius: 12px;
  background: #b05c64;
  text-align: center;
}

.urgent-item--title > div {
  padding: 0;
}

.urgent-item--title h3 {
  color: #fff !important;
  font-size: clamp(1.15rem, 3vw, 1.5rem);
  text-transform: uppercase;
}

.urgent-item--title .urgent-time-inline {
  display: block;
  margin-bottom: 4px;
  color: #ffe4e6;
  font-weight: 900;
  letter-spacing: 0.04em;
}

.urgent-item--people .urgent-time:empty {
  min-height: 20px;
}

.urgent-programme__notice {
  margin: 28px 0 8px;
  padding: 18px 20px;
  border-left: 6px solid var(--programme-red);
  border-radius: 8px;
  background: #fff0d6;
  font-size: 1.05rem;
}

.urgent-programme__contact {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 8px 14px;
  margin-top: 20px;
  padding: 16px 20px;
  border-radius: 10px;
  background: #2c2020;
  color: #fff;
  text-align: center;
}

.urgent-programme__contact strong {
  color: var(--programme-blue);
  text-transform: uppercase;
}

.urgent-programme__contact a {
  color: #fff !important;
  overflow-wrap: anywhere;
}

.cfa-announcement {
  box-sizing: border-box;
  padding: 18px 22px;
  text-align: center;
}

.cfa-announcement ul {
  display: inline-block;
  box-sizing: border-box;
  width: min(100%, 760px);
  margin: 10px auto 0;
  padding-left: 1.4em;
  list-style-position: outside;
  text-align: left;
}

.cfa-announcement li {
  margin: 6px 0;
  text-align: justify;
}

.i-button.highlight,
.i-button.primary,
button.highlight,
input.highlight {
  border-color: var(--urgent-red-dark) !important;
  background: linear-gradient(135deg, var(--urgent-red-dark), var(--urgent-red)) !important;
  color: #fff !important;
  box-shadow: 0 6px 16px rgba(169, 15, 24, 0.22);
}

.i-button.highlight:hover,
.i-button.primary:hover {
  filter: brightness(1.07);
}

@media (max-width: 1100px) {
  .urgent-days {
    display: block;
  }

  .urgent-day + .urgent-day {
    margin-top: 24px;
  }
}

@media (max-width: 900px) {
  .conf {
    width: 100% !important;
    min-width: 0 !important;
    margin: 0;
    border-radius: 0;
    box-shadow: none;
  }

  #confSectionsBox {
    padding: 14px;
  }

  .conf_leftMenu,
  .confBodyBox {
    float: none !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
  }

  .conf_leftMenu {
    margin-bottom: 14px !important;
  }

  .conf_leftMenu,
  .confBodyBox {
    border-radius: 12px;
  }

  .conference-page,
  .conferenceDetails,
  .mainContent,
  .mainContent .col2,
  .page-content {
    width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box;
  }

  .urgent-days {
    display: block;
    grid-template-columns: none;
  }
}

@media (max-width: 600px) {
  :root {
    --event-banner-height: 300px;
  }

  .confLogoBannerBox,
  .confLogoBannerBox .confLogo {
    height: var(--event-banner-height);
    max-height: var(--event-banner-height);
  }

  .confLogoBannerBox .confLogo {
    padding: 14px 16px;
  }

  .simpleTextAnnouncement {
    padding: 15px 52px 15px 18px;
    font-size: 1rem;
  }

  .simpleTextAnnouncement::after {
    right: 14px;
  }

  .conference-page .action-box .toolbar a[href="/event/18539/registrations/"] {
    height: 52px;
  }

  #confSectionsBox {
    padding: 8px;
  }

  .conf_leftMenu .event-menu-heading {
    padding: 0;
  }

  .conf_leftMenu #outer {
    flex-wrap: nowrap;
    overflow-x: auto !important;
    overflow-y: visible !important;
    -webkit-overflow-scrolling: touch;
  }

  .conf_leftMenu li {
    flex: 0 0 auto;
    min-width: 120px;
  }

  .conf_leftMenu li a {
    padding: 11px 14px;
  }

  .conference-page {
    padding: 4px 2px 16px;
  }

  .conferenceDetails img {
    border-radius: 8px;
  }

  .urgent-programme__intro {
    padding: 8px 12px;
    border-radius: 8px;
  }

  .urgent-programme__eyebrow {
    font-size: 0.72rem;
  }

  .urgent-item {
    grid-template-columns: 1fr;
  }

  .urgent-item .urgent-time {
    justify-content: flex-start;
    padding: 9px 14px;
    border-right: 0;
    border-bottom: 2px solid #ffd99f;
  }

  .urgent-item > div {
    padding: 14px;
    text-align: left;
  }

  .urgent-item--featured .urgent-time {
    border-color: rgba(255, 255, 255, 0.45);
  }

  .urgent-item--people .urgent-time:empty {
    display: none;
  }
}