/* Brokbase · start.html (request access) and privacy.html */
[hidden] { display: none !important; }
.start { min-height: 100svh; }
.start__panel {
  position: relative; z-index: 2;
  width: min(var(--col), calc(100% - 2 * var(--gutter)));
  margin: 0 0 0 var(--gutter); padding: calc(var(--nav-h) + 2rem) 0 4rem;
  display: grid; gap: 1.25rem;
}
html[dir="rtl"] .start__panel { margin: 0 var(--gutter) 0 0; }
.start__panel .chapter__text { margin: 0.25rem 0 0.5rem; }
.seg { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; margin: 0; padding: 0; border: 0; }
.seg__opt { position: relative; display: block; }
.seg__opt input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.seg__opt span {
  display: flex; align-items: center; justify-content: center; min-height: 3.125rem; padding: 0 0.75rem;
  border: 1px solid rgb(240 240 250 / 0.35); color: var(--ink);
  transition: border-color 200ms var(--ease), background-color 200ms var(--ease), color 200ms var(--ease);
}
.seg__opt input:checked + span { border-color: var(--ink); background: var(--ink); color: #000; }
.seg__opt input:focus-visible + span { outline: 2px solid var(--ink); outline-offset: 4px; }
.field { display: grid; gap: 0.5rem; color: var(--ink-soft); }
.field em { font-style: normal; text-transform: none; letter-spacing: 0; color: var(--ink-faint); }
.field input {
  width: 100%; min-height: 3.125rem; padding: 0 1rem;
  background: rgb(0 0 0 / 0.35); border: 1px solid rgb(240 240 250 / 0.35); border-radius: 0;
  color: var(--ink); font-size: 1rem;
  transition: border-color 200ms var(--ease);
}
.field input::placeholder { color: var(--ink-faint); }
.field input:hover { border-color: rgb(240 240 250 / 0.6); }
.field input:focus-visible { outline: none; border-color: var(--ink); }
.field input[aria-invalid="true"] { border-color: #e0776b; }
.hp { position: absolute; left: -9999px; top: auto; width: 1px; height: 1px; overflow: hidden; }
.start__error { margin: 0; color: #f0a49a; }
.start__submit { width: 100%; }
.start__note { margin: 0; color: var(--ink-soft); }
.page-start .foot { border-top: 0; }

/* privacy */
.prose { position: relative; z-index: 2; width: min(44rem, calc(100% - 2 * var(--gutter))); margin: 0 auto; padding: calc(var(--nav-h) + 3rem) 0 5rem; }
.prose h1 { font-size: var(--t-h2); line-height: 1.1; margin: 0 0 2rem; }
.prose h2 { font-family: var(--display); font-weight: 700; font-size: 1.25rem; letter-spacing: 0.04em; text-transform: uppercase; line-height: 1.2; margin: 3rem 0 0.9rem; }
html[lang="ar"] .prose h2 { text-transform: none; }
.prose p, .prose li { color: var(--ink-soft); line-height: 1.62; text-wrap: pretty; }
.prose p { margin: 0 0 1.1rem; }
.prose ul { padding-inline-start: 1.2em; margin: 0 0 1.1rem; }
.prose li + li { margin-top: 0.5rem; }
.prose strong { color: var(--ink); font-weight: 600; }
.prose a { color: var(--ink); text-underline-offset: 0.2em; }
.prose .prose__date { display: block; margin: -1rem 0 2rem; color: var(--ink-soft); }
