
.f-ghl {
  background: var(--brand-bg, #fcfcfc);
  color: var(--brand-ink, #333);
  min-height: 70svh;
  padding: calc(var(--f-header-h) + var(--f-space-l)) 0 var(--f-space-xl);
}
.f-ghl-inner {
  width: min(1180px, 92vw);
  margin-inline: auto;
}
.f-ghl-head {
  display: grid;
  justify-items: center;
  gap: var(--f-space-s);
  margin: 0 auto var(--f-space-l);
  text-align: center;
}
.f-ghl-title {
  max-width: 22ch;
  margin: 0;
  font-size: var(--f-h1);
  line-height: var(--f-lh-h1);
  letter-spacing: var(--f-track-h1);
}
.f-ghl-intro {
  max-width: var(--f-measure);
  margin: 0;
  color: var(--brand-ink, #333);
  font-size: var(--f-text-lead);
  white-space: pre-line;
}
.f-ghl-skip {
  color: var(--f-accent-ink);
  font-size: var(--f-text-small);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.22em;
}
.f-ghl-skip[hidden] { display: none; }
.f-ghl-skip:hover { text-decoration-thickness: 2px; }
.f-ghl-skip:focus-visible {
  outline: 2px solid var(--f-accent-ink);
  outline-offset: 4px;
}
.f-ghl-end {
  display: block;
  width: 1px;
  height: 1px;
  overflow: hidden;
  pointer-events: none;
  scroll-margin-top: calc(100vh - 24px);
  scroll-margin-top: calc(100svh - 24px);
}
.f-ghl-frame {
  position: relative;
  width: 100%;
  min-height: var(--f-ghl-height);
  overflow: hidden;
}
.f-ghl-loading {
  position: absolute;
  z-index: 2;
  inset: 0;
  display: grid;
  place-content: start center;
  justify-items: center;
  gap: var(--f-space-xs);
  padding-top: var(--f-space-l);
  background: var(--brand-bg, #fcfcfc);
  color: var(--brand-ink, #333);
  font-size: var(--f-text-small);
  text-align: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity 180ms ease-out;
}
.f-ghl-loading[hidden] { display: none; }
.f-ghl-frame.is-loading .f-ghl-loading { opacity: 1; }
.f-ghl-loading-mark {
  position: relative;
  width: 4rem;
  height: 2px;
  overflow: hidden;
  background: color-mix(in srgb, var(--brand-ink, #333) 12%, transparent);
}
.f-ghl-loading-mark::after {
  position: absolute;
  inset: 0;
  background: var(--brand-accent, #0074c8);
  content: "";
  transform: translateX(-100%);
  animation: f-ghl-loading 1.2s ease-in-out infinite;
}
.f-ghl-iframe {
  display: block;
  width: 100%;
  height: var(--f-ghl-height);
  border: 0;
  background: var(--brand-bg, #fcfcfc);
}
@keyframes f-ghl-loading {
  0% { transform: translateX(-100%); }
  55%, 100% { transform: translateX(100%); }
}
@media (prefers-reduced-motion: reduce) {
  .f-ghl-loading { transition: none; }
  .f-ghl-loading-mark::after {
    animation: none;
    transform: none;
  }
}
.f-ghl-frame-ph {
  display: grid;
  align-content: start;
  justify-items: center;
  padding: var(--f-space-m);
  border: 1px solid color-mix(in srgb, var(--brand-ink, #333) 28%, transparent);
  background-image: repeating-linear-gradient(
    -45deg,
    color-mix(in srgb, var(--brand-ink, #333) 12%, transparent) 0 3px,
    transparent 3px 14px
  );
}
.f-ghl-ph {
  display: grid;
  gap: var(--f-space-2xs);
  justify-items: start;
  width: min(52ch, 100%);
  padding: var(--f-space-s) var(--f-space-m) var(--f-space-m);
  border: 1px solid color-mix(in srgb, var(--brand-ink, #333) 20%, transparent);
  background: var(--brand-bg, #fcfcfc);
  text-align: left;
}
.f-ghl-ph-label {
  margin: 0 0 var(--f-space-2xs);
  padding-bottom: var(--f-space-2xs);
  border-bottom: 1px solid color-mix(in srgb, var(--f-accent-ink) 35%, transparent);
  color: var(--f-accent-ink);
  font-size: var(--f-text-caption);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.f-ghl-ph-gap {
  margin: 0 0 var(--f-space-2xs);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: var(--f-text);
  font-weight: 600;
  overflow-wrap: anywhere;
}
.f-ghl-ph-note {
  max-width: var(--f-measure);
  margin: 0;
  color: color-mix(in srgb, var(--brand-ink, #333) 78%, var(--brand-bg, #fcfcfc));
  font-size: var(--f-text-small);
  text-wrap: pretty;
}
@media (max-width: 640px) {
  .f-ghl-frame-ph {
    min-height: min(var(--f-ghl-height), 70svh);
    padding: var(--f-space-m) var(--f-space-s);
  }
}
@media print {
  .f-ghl-frame-ph { display: none; }
}
.f-ghl-noscript,
.f-ghl-empty {
  width: min(var(--f-measure), 100%);
  margin: var(--f-space-m) auto 0;
  color: var(--brand-ink, #333);
  font-size: var(--f-text-small);
  text-align: center;
}
.f-ghl-empty {
  padding: var(--f-space-l) var(--f-space-m);
  border-block: 1px solid color-mix(in srgb, var(--brand-ink, #333) 18%, transparent);
}
@media (max-width: 640px) {
  .f-ghl {
    padding-top: calc(var(--f-header-h) + var(--f-space-m));
    padding-bottom: var(--f-space-l);
  }
  .f-ghl-inner {
    width: calc(100% - 2 * var(--f-space-s));
    max-width: 1180px;
  }
  .f-ghl-head { margin-bottom: var(--f-space-m); }
  .f-ghl-intro { font-size: var(--f-text); }
}
@media print {
  .f-ghl { min-height: 0; padding: var(--f-space-m) 0; }
  .f-ghl-frame { display: none; }
  .f-ghl-head { margin-bottom: var(--f-space-m); }
  .f-ghl-skip,
  .f-ghl-end { display: none; }
  .f-ghl::after {
    content: "Complete this booking online or contact the academy for help.";
    display: block;
    text-align: center;
    font-size: var(--f-text-small);
  }
}
