/* Registration chooser (2026-10-18): the same two options everywhere — bottom of every event page, and as a pop-up when
   someone presses Register on the map, the Upcoming cards or the editions list (js/site.js → regChooser). */
.rc { position: relative; overflow: hidden; isolation: isolate; padding-block: 96px 88px; background: #08121a; color: #fff; scroll-margin-top: var(--header-stuck-h, 64px); }
.rc__bg { position: absolute; inset: 0; z-index: -2; }
.rc__bg img { width: 100%; height: 100%; object-fit: cover; opacity: 0.22; filter: blur(2px) saturate(0.9); transform: scale(1.04); }
.rc::before { content: ""; position: absolute; inset: 0; z-index: -1; background:
  radial-gradient(60% 70% at 12% 0%, rgb(0 179 173 / 0.28), transparent 70%),
  radial-gradient(50% 60% at 100% 100%, rgb(0 179 173 / 0.16), transparent 70%),
  linear-gradient(180deg, rgb(8 18 26 / 0.72), #08121a 85%); }
.rc__kicker { margin: 0; font-family: var(--font-display); font-size: 15px; font-weight: 600; letter-spacing: 0.24em; text-transform: uppercase; color: var(--accent-bright); }
.rc__title { margin: 12px 0 0; max-width: 20ch; font-family: var(--font-display); font-size: clamp(34px, 4.2vw, 58px); line-height: 1.04; font-weight: 700; letter-spacing: 0.01em; text-transform: uppercase; }
.rc__title em { font-style: normal; color: var(--accent-bright); }
.rc__lede { margin: 16px 0 0; max-width: 60ch; font-size: 18px; line-height: 1.6; color: rgb(255 255 255 / 0.76); }
.rc__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; margin-top: 40px; }
.rc__card {
  position: relative; display: flex; flex-direction: column; min-height: 340px; padding: 36px 36px 32px; border-radius: 20px;
  text-decoration: none; color: inherit; transition: transform 0.3s var(--ease-float, ease), box-shadow 0.3s, border-color 0.3s;
}
.rc__card--media { background: linear-gradient(160deg, rgb(255 255 255 / 0.09), rgb(255 255 255 / 0.03)); border: 1px solid rgb(25 218 211 / 0.45); box-shadow: 0 0 0 1px rgb(0 0 0 / 0.2) inset, 0 24px 60px rgb(0 0 0 / 0.35); backdrop-filter: blur(8px); }
.rc__card--brand { background: #fff; color: #0f2126; border: 1px solid #fff; box-shadow: 0 24px 60px rgb(0 0 0 / 0.35); }
.rc__icon { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 14px; background: rgb(25 218 211 / 0.14); color: var(--accent-bright); }
.rc__card--brand .rc__icon { background: #0f2126; color: #fff; }
.rc__icon svg { width: 26px; height: 26px; }
.rc__who { margin-top: 22px; font-family: var(--font-display); font-size: 14px; font-weight: 600; letter-spacing: 0.2em; text-transform: uppercase; color: var(--accent-bright); }
.rc__card--brand .rc__who { color: var(--map-ink); }
.rc__name { margin-top: 8px; font-family: var(--font-display); font-size: clamp(28px, 2.6vw, 38px); line-height: 1.08; font-weight: 700; }
.rc__list { list-style: none; margin: 18px 0 0; padding: 0; display: grid; gap: 9px; font-size: 16.5px; line-height: 1.45; color: rgb(255 255 255 / 0.82); }
.rc__card--brand .rc__list { color: #3b4a4f; }
.rc__list li { position: relative; padding-left: 28px; }
.rc__list li::before { content: ""; position: absolute; left: 0; top: 4px; width: 17px; height: 17px; border-radius: 50%; background: rgb(25 218 211 / 0.18) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8.4l2.5 2.4L12 5.4' fill='none' stroke='%2319dad3' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 13px no-repeat; }
.rc__card--brand .rc__list li::before { background-color: rgb(0 117 111 / 0.12); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8.4l2.5 2.4L12 5.4' fill='none' stroke='%2300756f' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
.rc__btn { display: inline-flex; align-self: flex-start; align-items: center; gap: 10px; margin-top: auto; padding: 15px 26px; border-radius: 999px; font-weight: 700; font-size: 16px; letter-spacing: 0.01em; background: var(--accent); color: #08121a; transition: background 0.2s, gap 0.2s; }
.rc__card--brand .rc__btn { background: #0f2126; color: #fff; }
.rc__list + .rc__btn { margin-top: 28px; }
.rc__btn svg { width: 16px; height: 16px; }
@media (hover: hover) {
  .rc__card:hover { transform: translateY(-4px); }
  .rc__card--media:hover { border-color: var(--accent-bright); box-shadow: 0 0 0 1px rgb(25 218 211 / 0.4), 0 30px 70px rgb(0 179 173 / 0.22); }
  .rc__card--brand:hover { box-shadow: 0 30px 70px rgb(0 0 0 / 0.45); }
  .rc__card:hover .rc__btn { gap: 16px; }
  .rc__card--media:hover .rc__btn { background: var(--accent-bright); }
  .rc__card--brand:hover .rc__btn { background: #000; }
}
.rc__card:focus-visible { outline: 3px solid var(--accent-bright); outline-offset: 4px; }
.rc__foot { display: flex; flex-wrap: wrap; gap: 8px 22px; margin: 30px 0 0; font-size: 15px; color: rgb(255 255 255 / 0.7); }
.rc__foot span { display: inline-flex; align-items: center; gap: 8px; }
.rc__foot span::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--accent-bright); }
.rc__foot a { color: #fff; }
@media (max-width: 767px) {
  .rc { padding-block: 60px 56px; }
  .rc__grid { grid-template-columns: 1fr; gap: 14px; margin-top: 28px; }
  .rc__card { min-height: 0; padding: 26px 22px 24px; }
  .rc__list + .rc__btn { margin-top: 22px; }
}

/* the pop-up */
.rc-dialog { width: min(1040px, calc(100vw - 32px)); max-width: none; max-height: calc(100dvh - 32px); margin: auto; padding: 0; border: 0; border-radius: 24px; background: transparent; color: #fff; overflow: auto; }
.rc-dialog::backdrop { background: rgb(4 10 14 / 0.72); backdrop-filter: blur(6px); }
.rc-dialog .rc { padding: 52px 48px 40px; border-radius: 24px; }
.rc-dialog .rc__title { font-size: clamp(30px, 3.6vw, 46px); }
.rc-dialog .rc__grid { margin-top: 30px; }
.rc-dialog .rc__card { min-height: 0; }
.rc__close { position: absolute; top: 18px; right: 18px; z-index: 2; display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid rgb(255 255 255 / 0.25); border-radius: 50%; background: rgb(255 255 255 / 0.06); color: #fff; font-size: 24px; line-height: 1; cursor: pointer; }
.rc__close:hover { background: rgb(255 255 255 / 0.14); }
.rc-dialog[open] { animation: rc-in 0.28s var(--ease-float, ease); }
@keyframes rc-in { from { opacity: 0; transform: translateY(14px) scale(0.98); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .rc-dialog[open] { animation: none; } .rc__card { transition: none; } }
@media (max-width: 767px) { .rc-dialog .rc { padding: 48px 18px 26px; } .rc__close { top: 10px; right: 10px; } }
