.tracks li .description ul { margin-left: 2em; }
.tracks li .description ul li { margin-top: 0; }

/* --- Header canvas --- */
.confheader {
  position: relative;
  background:
    linear-gradient(90deg, rgba(16, 19, 23, 0.80) 0%, rgba(16, 19, 23, 0.60) 50%, rgba(16, 19, 23, 0.05) 100%),
    url('images/51436-cs3-2027-bg-graphite.jpg') 88% center / cover no-repeat,
    #101317;
}
.confheader::after {
  content: "";
  display: block;
  background: linear-gradient(90deg, #ff4f43 0%, #ff8c7e 55%, rgba(255, 140, 126, 0) 100%);
}

/* --- Title --- */
.confTitleBox { background: none; backdrop-filter: none; }
.conference-title-link {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 28px;
  padding: 48px 24px 44px;
  color: #fff;
  font-size: 26pt;
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -0.01em;
  text-shadow: 0 2px 18px rgba(0, 0, 0, 0.45);
}
.conference-title-link:hover,
.conference-title-link:focus { color: #fff; text-decoration: none; }
.confLogoBox {
  margin-right: 0;
  padding-right: 28px;
  border-right: 1px solid rgba(255, 255, 255, 0.25);
}
.confLogo {
  max-height: 100px;
  filter: drop-shadow(0 2px 10px rgba(255, 106, 92, 0.35));
}

/* --- Date / place bar --- */
.confSubTitleBox {
  background: rgba(12, 14, 17, 0.5);
  backdrop-filter: blur(10px) saturate(140%);
  -webkit-backdrop-filter: blur(10px) saturate(140%);
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  border-bottom: none;
}
.confSubTitleContent {
  color: #eceff2;
  align-items: center;
  padding-top: 12px;
  padding-bottom: 12px;
}
.datePlace { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 16px; }
.datePlace .date {
  font-weight: 700;
  color: #ffffff;
  background: linear-gradient(90deg, #ff6a5c, #ff4f43);
  padding: 4px 14px;
  border-radius: 999px;
  letter-spacing: 0.02em;
}
.datePlace .place { color: #eceff2; opacity: 0.92; }
.datePlace .timezone { display: none; }

/* --- Search field --- */
.confSubTitleBox input[type="search"],
.confSubTitleBox input[type="text"] {
  background: rgba(255, 255, 255, 0.10);
  border: 1px solid rgba(255, 255, 255, 0.25);
  border-radius: 999px;
  color: #fff;
  padding-left: 16px;
  transition: background 0.2s, border-color 0.2s;
}
.confSubTitleBox input[type="search"]::placeholder,
.confSubTitleBox input[type="text"]::placeholder { color: rgba(255, 255, 255, 0.6); }
.confSubTitleBox input[type="search"]:focus,
.confSubTitleBox input[type="text"]:focus {
  background: rgba(255, 255, 255, 0.18);
  border-color: #ff6a5c;
  outline: none;
}

.confSubTitleBox #event-search-box .ui.search .ui.input > input.prompt {
  background: rgba(255, 255, 255, 0.10);
  border: 1px solid rgba(255, 255, 255, 0.25);
  border-radius: 4px;
  box-shadow: none;
  color: #fff;
  padding-left: 14px;
  transition: background 0.2s, border-color 0.2s;
}

.confSubTitleBox #event-search-box .ui.search .ui.input > input.prompt::placeholder {
  color: rgba(255, 255, 255, 0.6);
  opacity: 1;
}

.confSubTitleBox #event-search-box .ui.search .ui.input > input.prompt:focus {
  background: rgba(255, 255, 255, 0.18);
  border-color: #ff6a5c;
  box-shadow: 0 0 0 3px rgba(255, 106, 92, 0.25);
  color: #fff;
  outline: none;
}

/* Magnifier icon */
.confSubTitleBox #event-search-box .ui.icon.input > i.icon {
  color: #fff;
  opacity: 0.6;
}

.confSubTitleBox #event-search-box .ui.icon.input > input.prompt:focus ~ i.icon {
  color: #ff8c7e;
  opacity: 1;
}

/* --- Small screens --- */
@media (max-width: 800px) {
  .conference-title-link { flex-direction: column; gap: 16px; padding: 32px 16px 28px; font-size: 18pt; text-align: center; }
  .confLogoBox { padding-right: 0; padding-bottom: 16px; border-right: none; border-bottom: 1px solid rgba(255, 255, 255, 0.25); }
  .confheader { background-position: 0 0, 65% center, 0 0; }
}