.conference-header { max-width: 96rem; margin: auto; padding: 1rem 2rem; display: flex; align-items: center; }
.conference-stage { max-width: 96rem; margin: auto; padding: 1rem 2rem 2rem; outline: none; }
.conference-intro { background: #aaa2c4; padding: 2rem; margin-bottom: 1.5rem; }
.conference-intro h1, .conference-confirmation h1 { color: #102c75; font-size: clamp(2rem, 4vw, 3.5rem); line-height: 1.1; font-weight: 700; margin-bottom: 1rem; }
.conference-intro > p { font-size: 1.125rem; }
.conference-choice-groups { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }
.conference-choice-group { min-width: 0; background: #b8cbe9; padding: 1.5rem; }
.conference-choice-group legend { float: left; width: 100%; margin-bottom: 1rem; color: #102c75; font-weight: 700; font-size: 1.25rem; }
.conference-choice-group legend > span { display: inline-grid; place-items: center; width: 2rem; height: 2rem; background: #102c75; color: #f4ebdf; margin-right: .5rem; }
.conference-options { clear: both; display: grid; gap: .75rem; }
.conference-option { display: flex; align-items: center; gap: 1rem; padding: 1rem; min-height: 4rem; background: #f4ebdf; color: #102c75; cursor: pointer; border: 2px solid transparent; font-size: 1.125rem; font-weight: 700; }
.conference-option:has(input:checked) { border-color: #102c75; background: white; }
.conference-option:focus-within { outline: 2px solid #102c75; outline-offset: 3px; }
.conference-actions { display: flex; justify-content: flex-end; align-items: center; }
.conference-confirmation { text-align: center; padding: 2rem; background: #aaa2c4; }
.conference-selected { display: grid; grid-template-columns: 1fr auto 1fr; gap: 1.5rem; align-items: center; margin: 2rem auto; max-width: 64rem; }
.conference-selected > div { position: relative; isolation: isolate; display: grid; place-items: center; aspect-ratio: 4 / 3; padding: 2rem; overflow: hidden; background: #102c75; }
.conference-selected > div::after { position: absolute; z-index: -1; inset: 0; content: ""; background: rgb(10 32 90 / 68%); }
.conference-selected-image { position: absolute; z-index: -2; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.conference-selected-copy { position: relative; }
.conference-selected p { margin-bottom: .5rem; color: #f4ebdf; }
.conference-selected h2 { font-size: clamp(1.5rem, 3vw, 2.5rem); font-weight: 700; line-height: 1.15; color: #fff; overflow-wrap: anywhere; }
.conference-plus { font-size: 3rem; color: #102c75; }
.conference-confirmation-copy { font-size: 1.25rem; margin-bottom: 2rem; }
.conference-confirmation-actions { display: grid; justify-items: center; gap: .75rem; }
.conference-primary-action { width: min(100%, 30rem); }
.conference-reveal-button { width: 100%; min-height: 4rem; font-size: 1.25rem; padding-inline: 2rem; }
.conference-reset-button { min-height: 2.75rem; height: 2.75rem; padding-inline: 1rem; font-size: .875rem; }
.conference-result-heading { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; margin-bottom: 1.25rem; }
.conference-result-heading h1 { max-width: 58rem; font-size: clamp(1.75rem, 3vw, 2.75rem); line-height: 1.1; font-weight: 700; color: #102c75; letter-spacing: -.02em; overflow-wrap: anywhere; }
.conference-result-heading h1 span { color: #454547; }
.conference-result-heading .btn { flex-shrink: 0; }
.conference-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; }
.conference-card { --concept-accent: #2457a7; --concept-number: #fff; position: relative; display: grid; grid-template-rows: auto 1fr; min-width: 0; background: #fff; border-top: 4px solid var(--concept-accent); overflow-wrap: anywhere; }
.conference-card--2 { --concept-accent: #b34b21; }
.conference-card--3 { --concept-accent: #08776f; }
.conference-card-placeholder { position: absolute; z-index: 2; inset: 0; display: grid; place-items: center; background: #102c75; pointer-events: none; animation: conference-placeholder-dismiss .45s cubic-bezier(.22, 1, .36, 1) 2.6s forwards; }
.conference-card:nth-child(2) .conference-card-placeholder { animation-delay: 2.85s; }
.conference-card:nth-child(3) .conference-card-placeholder { animation-delay: 3.1s; }
.conference-card-placeholder img { width: 5rem; height: 5rem; animation: conference-logo-pulse 1.15s ease-in-out infinite; }
.conference-card-heading { min-height: 12rem; padding: 1.75rem 1.75rem 1.5rem; display: flex; flex-direction: column; align-items: flex-start; gap: 1.25rem; }
.conference-card-number { display: grid; place-items: center; width: 2.75rem; height: 2.75rem; background: var(--concept-accent); color: var(--concept-number); font-size: 1.25rem; line-height: 1; font-weight: 700; font-variant-numeric: tabular-nums; flex-shrink: 0; }
.conference-card h2 { color: #102c75; font-size: clamp(1.625rem, 2.25vw, 2.125rem); line-height: 1.12; font-weight: 700; letter-spacing: -.025em; text-wrap: balance; }
.conference-card-copy { display: grid; align-content: start; gap: 1.75rem; min-width: 0; padding: 0 1.75rem 2rem; }
.conference-card-section { padding: 0; }
.conference-card-copy h3 { color: #454547; font-size: .75rem; line-height: 1.25; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; margin-bottom: .75rem; }
.conference-card-copy p { color: #17171a; font-size: clamp(1.125rem, 1.2vw, 1.25rem); line-height: 1.5; white-space: normal; }
.conference-card-problem { font-weight: 400; }
@keyframes conference-placeholder-dismiss {
  from { opacity: 1; transform: scale(1); }
  to { visibility: hidden; opacity: 0; transform: scale(1.015); }
}
@keyframes conference-logo-pulse {
  0%, 100% { opacity: .72; transform: scale(.94); }
  50% { opacity: 1; transform: scale(1.04); }
}
@media (prefers-reduced-motion: reduce) {
  .conference-card-placeholder { display: none; }
}
.conference-network-error { position: fixed; bottom: 1rem; left: 1rem; right: 1rem; width: auto; }
.conference-network-error[hidden] { display: none; }
@media (min-width: 640px) and (max-width: 1199px) {
  .conference-header { padding: .75rem 1.5rem; }
  .conference-stage { padding: .75rem 1.5rem 1.5rem; }
  .conference-result-heading { margin-bottom: 1rem; }
  .conference-cards { gap: 1rem; }
  .conference-card-heading { padding: 1.5rem 1.25rem; }
  .conference-card-copy { padding: 0 1.25rem 1.75rem; }
}
@media (min-width: 640px) and (max-width: 1023px) {
  .conference-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 639px) {
  .conference-header { padding: 1rem; flex-wrap: wrap; }
  .conference-stage { padding: .5rem 1rem 1rem; }
  .conference-intro, .conference-confirmation { padding: 1.5rem; }
  .conference-choice-groups, .conference-selected { grid-template-columns: 1fr; }
  .conference-selected { gap: .75rem; }
  .conference-selected > div { padding: 1rem; }
  .conference-plus { font-size: 1.5rem; line-height: 1; }
  .conference-result-heading { align-items: flex-start; flex-direction: column; }
  .conference-choice-group { padding: 1rem; }
  .conference-result-heading { margin-bottom: 1.25rem; }
  .conference-result-heading .btn { align-self: stretch; }
  .conference-cards { grid-template-columns: 1fr; }
  .conference-card-heading { min-height: 0; padding: 1.5rem; }
  .conference-card-copy { padding: 0 1.5rem 1.75rem; }
}
.conference-layout { min-height: 100dvh; background: #f4ebdf; }