/* =========================================================
   Register / Thank-you / 404 — shared page styles.
   Left: PDF p15 content (logo, headline, address, contact).
   Right: registration form card.
   ========================================================= */

.register__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
  gap: clamp(2rem, 1rem + 4vw, 4rem);
  align-items: start;
}

.register__intro {
  position: relative;
  overflow: hidden;
  padding-bottom: 1rem;
}

.register__p15 {
  padding-top: clamp(1.75rem, 1.4rem + 1vw, 2.25rem);
  border-top: 1px solid var(--c-line);
}
.register__p15-title {
  font-size: clamp(1.5rem, 1.15rem + 1.4vw, 2rem);
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -.01em;
  color: var(--c-ink);
  max-width: 18ch;
}
.register__p15-company {
  margin-top: 1rem;
  color: var(--c-orange);
  font-weight: 700;
  font-size: .9375rem;
  letter-spacing: .01em;
}
.register__p15-block { margin-top: 1.5rem; }
.register__p15-label {
  font-size: var(--fs-small);
  font-weight: 600;
  color: var(--c-ink);
  margin-bottom: .35rem;
}
.register__p15-text {
  font-size: var(--fs-small);
  line-height: 1.6;
  color: var(--c-text);
}
.register__p15-text a { color: var(--c-text); text-decoration: none; border-bottom: 1px solid var(--c-card-line); }
.register__p15-text a:hover { color: var(--c-orange-title); border-color: var(--c-orange-title); }

/* subtle decorative sketch, purely visual */
.register__decor {
  position: absolute;
  right: -3rem;
  bottom: -3rem;
  width: 260px;
  height: 260px;
  border-radius: 50%;
  background: url("/assets/img/contact-building.jpg") center / cover no-repeat;
  opacity: .06;
  filter: grayscale(1);
  pointer-events: none;
  z-index: -1;
}

/* ---------- form card ---------- */
.register-form {
  background: #fff;
  border: 1px solid var(--c-card-line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-card);
  padding: clamp(1.5rem, 1rem + 2vw, 2.5rem);
  display: grid;
  gap: 1.3rem;
}

.field { display: grid; gap: .5rem; }
.field__label { font-size: .9375rem; font-weight: 700; color: var(--c-ink); }
.field__required { color: var(--c-red-num); }
.field__input {
  min-height: 46px;
  padding: .65rem .85rem;
  border: 1px solid var(--c-card-line);
  border-radius: var(--radius);
  background: var(--c-bg-soft);
  font-size: 1rem;
  color: var(--c-ink);
  transition: border-color var(--dur) var(--ease), background var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.field__input:hover { border-color: #c9ced4; }
.field__input:focus { outline: none; border-color: var(--c-orange); background: #fff; box-shadow: 0 0 0 3px rgba(255, 156, 0, .18); }
.field__input[aria-invalid="true"] { border-color: var(--c-red-num); background: #fff; }
.field__error { margin: 0; font-size: var(--fs-xs); font-weight: 600; color: var(--c-red-num); }
.field__error:empty { display: none; }

.field--role { border: 0; padding: 0; margin: 0; }
.field--role legend { padding: 0; }
.role-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem; }
.role-option {
  display: flex; align-items: center; gap: .6rem;
  padding: .75rem .85rem;
  border: 1px solid var(--c-card-line);
  border-radius: var(--radius);
  background: var(--c-bg-soft);
  font-size: .9375rem;
  cursor: pointer;
  transition: border-color var(--dur) var(--ease), background var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.role-option:hover { border-color: #c9ced4; }
.role-option:has(input:checked) { border-color: var(--c-orange); background: var(--c-orange-tint); box-shadow: 0 0 0 1px var(--c-orange); }
.role-option input { width: 18px; height: 18px; accent-color: var(--c-orange); flex-shrink: 0; }

.field--checkbox { gap: 0; }
.checkbox-row { display: flex; align-items: flex-start; gap: .7rem; font-size: .875rem; line-height: 1.5; color: var(--c-text); cursor: pointer; }
.checkbox-row input { width: 18px; height: 18px; margin-top: .15rem; accent-color: var(--c-orange); flex-shrink: 0; }
.checkbox-row a { color: var(--c-orange-title); text-decoration: underline; }

/* honeypot — off-canvas, not display:none, so bots that skip hidden fields still fill it in */
.hp-field { position: absolute; left: -9999px; top: auto; width: 1px; height: 1px; overflow: hidden; }

.register-form__status { font-size: .875rem; font-weight: 600; color: var(--c-red-num); }
.register-form__status:empty { display: none; }
.register-form__status[data-ok="true"] { color: #1c7a3e; }

.register-form__submit { width: 100%; }
.register-form__submit[aria-busy="true"] { opacity: .75; cursor: progress; }

.cf-turnstile { margin-top: -.2rem; }

@media (max-width: 900px) {
  .register__grid { grid-template-columns: 1fr; gap: 2.5rem; }
  .register__decor { display: none; }
}
@media (max-width: 560px) {
  .role-options { grid-template-columns: 1fr; }
}

/* ---------- simple status pages: thank-you, 404 ---------- */
.status-page { padding-block: var(--section-y); }
.status-page__inner { max-width: 640px; margin-inline: auto; text-align: center; }
.status-page__icon { width: 64px; height: 64px; margin: 0 auto 1.5rem; color: var(--c-orange); }
.status-page .title { margin-bottom: 1rem; }
.status-page .lead { margin-bottom: 2rem; }
.status-page__actions { display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; }