/* Registration is part of the hero, always visible in the page flow. */
.hero {
  height:auto;
  min-height:100svh;
  max-height:none
}
/* Keep the slogan on the header's left edge while preserving the card's position. */
.hero-content {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(480px,680px);
  gap:clamp(32px,4vw,80px);
  align-items:center;
  align-content:center;
  width:100%;
  max-width:none;
  margin-inline:0;
  padding-inline-end:calc(var(--gutter) + max(0px,(100% - 1720px)/2));
  padding-top:44px;
  padding-bottom:44px
}
.hero-copy {
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:flex-start
}
.hero-copy h1 {
  font-size:clamp(76px,7.2vw,138px)
}
.hero-copy .hero-details {
  margin-top:35px;
  padding:0
}
.hero-copy .hero-story {
  position:static;
  flex-direction:row;
  gap:18px;
  margin-top:28px
}
.hero-copy .circle-link {
  width:64px;
  height:64px
}
.hero-copy .circle-link svg {
  width:28px;
  height:28px
}
.hero-copy .hero-story .eyebrow {
  font-size:11px
}
.preregister-panel {
  position:relative;
  min-width:0;
  width:100%;
  justify-self:center;
  padding:36px;
  border:1px solid #ffffff29;
  border-radius:8%;
  background:linear-gradient(135deg,#ffffff07,transparent 55%),#080c1294;
  color:var(--paper);
  box-shadow:0 16px 56px #00000040,inset 0 1px 0 #ffffff12;
  -webkit-backdrop-filter:blur(20px) saturate(125%);
  backdrop-filter:blur(20px) saturate(125%)
}
.preregister-top {
  margin-bottom:20px
}
.preregister-top .eyebrow {
  font:400 12px/1.5 var(--display);
  letter-spacing:.04em;
  color:var(--accent);
  text-transform:uppercase
}
.preregister-panel h2 {
  font:700 clamp(38px,3.2vw,54px)/1.08 var(--display);
  letter-spacing:-.025em;
  text-transform:uppercase;
  text-wrap:balance
}
.preregister-event {
  margin-top:16px;
  font:500 13px/1.5 var(--body);
  color:var(--accent)
}
#preregister-intro {
  margin-top:12px;
  font:400 15px/1.5 var(--body);
  color:#cdced3
}
.preregister-availability {
  margin-top:14px;
  font:400 12px/1.5 var(--body);
  color:var(--muted)
}
.preregister-form {
  margin-top:20px
}
.preregister-form label {
  display:block;
  font:500 14px/1.4 var(--body);
  margin-bottom:15px
}
.preregister-names {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px
}
.preregister-form input {
  display:block;
  width:100%;
  min-width:0;
  min-height:46px;
  margin-top:7px;
  padding:11px 12px;
  border:1px solid #ffffff3d;
  border-radius:4px;
  background:#080c1273;
  color:var(--paper);
  font:400 16px/1.4 var(--body)
}
.preregister-form input:focus-visible {
  outline:2px solid var(--accent);
  outline-offset:2px
}
.preregister-help {
  font:400 12px/1.5 var(--body);
  color:var(--muted);
  margin:-7px 0 17px
}
.preregister-trap {
  position:absolute;
  width:1px;
  height:1px;
  overflow:hidden;
  clip-path:inset(50%)
}
.preregister-submit {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px;
  width:100%;
  min-height:52px;
  margin-top:4px;
  padding:15px 20px;
  background:var(--accent);
  border:1px solid var(--accent);
  border-radius:4px;
  color:var(--ink);
  font:700 15px/1.3 var(--body);
  text-transform:uppercase;
  transition:box-shadow .2s,background .2s
}
.preregister-submit:hover:not(:disabled) {
  background:#a2e8ff;
  box-shadow:0 0 25px #5ccbef40
}
.preregister-submit:disabled {
  opacity:.45;
  cursor:default
}
.preregister-notice {
  margin-top:14px;
  color:var(--muted);
  font:400 12px/1.5 var(--body)
}
.preregister-error,.preregister-result {
  margin-top:20px;
  font:400 16px/1.55 var(--body)
}
.preregister-error {
  color:#ffb8b8
}
.preregister-result {
  padding:20px;
  border:1px solid #5ccbef65;
  background:#5ccbef0d
}
.preregister-result strong {
  display:block;
  font-weight:600;
  color:var(--accent);
  margin-bottom:8px
}
.preregister-fallback {
  display:inline-block;
  margin-top:20px;
  color:var(--muted);
  text-decoration:underline;
  text-underline-offset:4px;
  font:400 12px/1.5 var(--body)
}
.preregister-fallback:hover {
  color:var(--accent)
}
.preregister-panel [hidden] {
  display:none!important
}
@media(max-width:1120px) {
  .hero-content {
    grid-template-columns:1fr;
    gap:42px
  }
  .hero-copy h1 {
    font-size:clamp(84px,13vw,130px)
  }
  .preregister-panel {
    max-width:none;
    justify-self:stretch
  }
  .hero-copy .hero-story {
    margin-top:22px
  }
  .hero-copy .hero-details {
    margin-top:28px
  }
}
@media(max-width:540px) {
  .hero-content {
    padding-top:34px;
    padding-bottom:32px;
    gap:34px
  }
  .hero-copy h1 {
    font-size:clamp(76px,19.5vw,106px)
  }
  .preregister-panel {
    padding:22px
  }
  .preregister-panel h2 {
    font-size:clamp(22px,7vw,38px)
  }
  .preregister-names {
    gap:10px
  }
  .hero-copy .hero-story .eyebrow {
    max-width:none;
    text-align:left;
    font-size:11px
  }
  .hero-copy .hero-details {
    padding-right:0
  }
  .hero-copy .hero-details p:first-child {
    font-size:18px
  }
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) {
  .preregister-panel {
    background:#080c12eb
  }
}
@media(prefers-reduced-motion:reduce) {
  .preregister-submit {
    transition:none
  }
}