.form-about-toggle { display: none; }
html:has(#form-about-dialog[open]) { overflow: hidden; }
.form-about-dialog {
  width: min(480px, calc(100% - 24px));
  max-height: calc(100dvh - 32px);
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--theme-line);
  border-radius: 12px;
  background: var(--theme-bg);
  color: var(--theme-ink);
  box-shadow: 0 24px 80px #0005;
}
.form-about-dialog[open] { animation: form-about-in .2s cubic-bezier(.2,.7,.2,1) both; }
.form-about-dialog::backdrop { background: #0009; backdrop-filter: blur(4px); }
.form-about-dialog-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 16px 12px 24px; border-bottom: 1px solid var(--theme-line); }
.form-about-dialog-header > span { font: 600 10px/1.5 var(--font-body); letter-spacing: .12em; text-transform: uppercase; }
.form-about-dialog-header button { display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 0; background: transparent; color: var(--theme-ink); font: 400 26px/1 var(--font-body); cursor: pointer; }
.form-about-dialog-body { max-height: calc(100dvh - 110px); overflow-y: auto; overscroll-behavior: contain; padding: 24px; }
.form-about-dialog-body :is(.explorer-about-label, .enquiry-aside-label) { display: none; }
.form-about-dialog-body h3 { margin: 0 0 20px; font: 500 26px/1.16 var(--font-body); letter-spacing: -.04em; }
.form-about-dialog-body p { margin: 0 0 20px; color: var(--theme-muted); font: 400 14px/1.7 var(--font-body); }
.form-about-dialog-body p:last-child { margin-bottom: 0; }
.form-about-dialog-body :is(.explorer-about-note, .enquiry-aside-note) { padding-top: 18px; border-top: 1px solid var(--theme-line); font: 400 12px/1.65 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; }
@media (max-width: 760px) {
  html.has-mobile-about :is(.explorer-about, .enquiry-aside) { display: none; }
  html.has-mobile-about :is(.explorer-heading, .enquiry-heading) { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
  html.has-mobile-about :is(.explorer-heading, .enquiry-heading) h2 { flex: 1; min-width: 0; }
  html.has-mobile-about .form-about-toggle { display: grid; flex: none; place-items: center; width: 44px; height: 44px; margin: 0 -10px 0 0; padding: 10px; border: 0; background: transparent; color: var(--theme-muted); cursor: pointer; transition: color .2s ease; }
  .form-about-toggle svg { width: 24px; height: 24px; }
  html.has-mobile-about .form-about-toggle:hover,
  html.has-mobile-about .form-about-toggle[aria-expanded="true"] { color: var(--theme-accent); }
  .form-about-toggle:focus-visible, .form-about-dialog-header button:focus-visible { outline: 2px solid var(--theme-accent); outline-offset: 2px; }
  html.has-mobile-about .enquiry-form { padding-bottom: var(--enquiry-bottom-space); }
}
@keyframes form-about-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) {
  .form-about-dialog[open] { animation: none; }
  html.has-mobile-about .form-about-toggle { transition: none; }
}
