/* Clarity Brief dossier — the page layer for /decision-brief/ (LB Task 9b).

   Cascade: private-health-research.css states the Living Brief system,
   this states the dossier, pattern-shell.css is linked last and states
   colour, type and the responsive contract. Because the shell is last,
   every rule here is rooted at the full page scope
   .pattern-shell.private-health-research.decision-brief-dossier, which
   out-weighs the shell's own selectors on the properties it re-states and
   cannot reach any other page.

   Tokens only, no url(), no @import, no @font-face, no animation, no
   transition, no !important. */

/* ============================== Layout ============================== */
/* One reading column on a phone, an index rail beside it from 960px.
   960 is the shell's own header boundary (Task 9h): below it the header
   is a disclosure and the page is linear, above it both open out. */

/* 24px gutters, dropping to 16px on phones: the same pair the shell uses
   for every other page, so the dossier sits on the site's rhythm rather
   than inventing one. */
.pattern-shell.private-health-research.decision-brief-dossier .decision-dossier {
  width: min(100% - 48px, 1024px);
  max-width: 1024px;
  margin-inline: auto;
  padding: 40px 0 64px;
}

.pattern-shell.private-health-research.decision-brief-dossier .decision-dossier__layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
}

.pattern-shell.private-health-research.decision-brief-dossier .decision-dossier__body {
  min-width: 0;
  max-width: 680px;
}

/* The shell offsets fragment jumps 96px through scroll-padding-top, and
   .pattern-shell [id] adds another 96px of scroll-margin. Both apply, so
   a section would land 192px down with the tail of the previous section
   above its heading. The element half is neutralised here; the document
   half still clears the sticky header. */
.pattern-shell.private-health-research.decision-brief-dossier .service-section[id] {
  scroll-margin-top: 0;
}

/* =============================== Index ============================== */
/* A reading index, not a component: hairlines, a compact mono number and
   a 48px target. No card, no panel, no pill, and no scroll spy, which
   would need script and would move under a reader mid-sentence. */

.pattern-shell.private-health-research.decision-brief-dossier .decision-dossier__index {
  display: none;
}

.pattern-shell.private-health-research.decision-brief-dossier .decision-dossier__index ol {
  margin: 0;
  padding: 0;
  border-top: 1px solid var(--research-rule);
  list-style: none;
}

.pattern-shell.private-health-research.decision-brief-dossier .decision-dossier__index li {
  margin: 0;
  border-bottom: 1px solid var(--research-rule);
}

.pattern-shell.private-health-research.decision-brief-dossier .decision-dossier__index a {
  display: flex;
  min-height: 48px;
  align-items: baseline;
  gap: 12px;
  padding-block: 12px;
  color: var(--pattern-ink-82);
  font-size: 15px;
  line-height: 1.4;
  text-decoration: none;
}

.pattern-shell.private-health-research.decision-brief-dossier .decision-dossier__index a:hover {
  color: var(--research-established);
}

.pattern-shell.private-health-research.decision-brief-dossier .decision-dossier__number {
  flex: none;
  color: var(--pattern-ink-66);
  font-family: var(--pattern-mono);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.1em;
}

/* ============================ Reading body =========================== */

.pattern-shell.private-health-research.decision-brief-dossier .decision-dossier__intro {
  margin: 0;
  padding: 0;
  border: 0;
}

.pattern-shell.private-health-research.decision-brief-dossier .service-section {
  margin-top: var(--pattern-space-5);
}

.pattern-shell.private-health-research.decision-brief-dossier .service-section h2 {
  margin-top: 0;
}

.pattern-shell.private-health-research.decision-brief-dossier .service-section :is(ul, ol) {
  margin: 12px 0 0 20px;
}

.pattern-shell.private-health-research.decision-brief-dossier .service-section li {
  margin-top: 8px;
}

.pattern-shell.private-health-research.decision-brief-dossier .service-section li::marker {
  color: var(--pattern-mineral);
}

.pattern-shell.private-health-research.decision-brief-dossier .scope-block--excluded {
  margin-top: 20px;
  padding: 16px 20px;
  border: 1px solid var(--pattern-mineral);
  border-inline-start-width: 8px;
  background: var(--pattern-mist);
}

.pattern-shell.private-health-research.decision-brief-dossier .page-boundary {
  margin-top: var(--pattern-space-4);
}

/* ============================== Fit form ============================= */
/* Research paper, not a product card: a square sheet, one hairline, and
   an aubergine rule across the top the way the Brief sheet carries one.
   No shadow and no radius on the container. */

.pattern-shell.private-health-research.decision-brief-dossier .fit-form {
  margin-block: var(--pattern-space-3) 0;
  padding: 40px;
  border: 1px solid var(--research-rule);
  border-top: 4px solid var(--pattern-aubergine);
  border-radius: 0;
  background: var(--research-paper);
  box-shadow: none;
}

/* One margin per row, on one side, so a row gap is never the sum of two. */
.pattern-shell.private-health-research.decision-brief-dossier .fit-form > p {
  margin-block: 0 var(--pattern-space-3);
}

.pattern-shell.private-health-research.decision-brief-dossier .fit-form > p:last-of-type {
  margin-bottom: 0;
}

.pattern-shell.private-health-research.decision-brief-dossier .fit-form br {
  display: none;
}

.pattern-shell.private-health-research.decision-brief-dossier .fit-form label {
  display: block;
  margin-bottom: 6px;
  font-weight: 700;
}

.pattern-shell.private-health-research.decision-brief-dossier .fit-form :is(input[type="text"], input[type="email"], select, textarea) {
  display: block;
  width: 100%;
  min-height: 48px;
  padding: 12px 16px;
  border: 1.5px solid var(--pattern-mineral);
  border-radius: 2px;
  background: var(--pattern-surface);
  color: var(--pattern-aubergine);
  font-family: var(--pattern-body);
  font-size: 17px;
  line-height: 24px;
}

.pattern-shell.private-health-research.decision-brief-dossier .fit-form textarea {
  min-height: 96px;
  resize: vertical;
}

.pattern-shell.private-health-research.decision-brief-dossier .fit-form :is(input, select, textarea):hover {
  border-color: var(--pattern-aubergine);
}

.pattern-shell.private-health-research.decision-brief-dossier .fit-form :is(input, select, textarea):focus-visible {
  outline: 3px solid var(--pattern-mineral);
  outline-offset: 3px;
}

.pattern-shell.private-health-research.decision-brief-dossier .fit-form__hint {
  display: block;
  margin-top: 6px;
  color: var(--pattern-ink-66);
  font-size: 14px;
  line-height: 1.5;
}

/* The consent row: a 24px box with a 48px usable label beside it. */
.pattern-shell.private-health-research.decision-brief-dossier .fit-form .fit-form__acknowledgement {
  display: flex;
  gap: 12px;
  align-items: flex-start;
}

.pattern-shell.private-health-research.decision-brief-dossier .fit-form .fit-form__acknowledgement input[type="checkbox"] {
  flex: none;
  width: 24px;
  height: 24px;
  margin-top: 2px;
  accent-color: var(--pattern-aubergine);
}

/* Block flow, not flex: as a flex container the label made its text and its
   link two items that shrank independently, so the sentence stopped being a
   sentence. The scope root sets overflow-wrap: anywhere and the shell adds
   word-break to anchors, which together split "privacy notice" mid-word; the
   label opts out of both and the link never wraps at all. */
.pattern-shell.private-health-research.decision-brief-dossier .fit-form .fit-form__acknowledgement label {
  display: block;
  min-height: 48px;
  margin-bottom: 0;
  overflow-wrap: normal;
  word-break: normal;
  font-weight: 400;
}

.pattern-shell.private-health-research.decision-brief-dossier .fit-form .fit-form__acknowledgement label a {
  white-space: nowrap;
}

.pattern-shell.private-health-research.decision-brief-dossier .fit-form button[type="submit"] {
  min-width: 220px;
  min-height: 48px;
  margin-top: var(--pattern-space-2);
  border-radius: 2px;
}

.pattern-shell.private-health-research.decision-brief-dossier .fit-form__errors:empty {
  margin: 0;
}

/* =============================== Phones ============================== */
/* 16px gutters, a full-width submit under a thumb, and the sheet's
   padding brought in so the controls keep their measure. */

@media (max-width: 759px) {
  .pattern-shell.private-health-research.decision-brief-dossier .decision-dossier {
    width: min(100% - 32px, 1024px);
  }

  .pattern-shell.private-health-research.decision-brief-dossier .fit-form {
    padding: 16px;
  }

  .pattern-shell.private-health-research.decision-brief-dossier .fit-form button[type="submit"] {
    width: 100%;
    min-width: 0;
  }
}

@media (min-width: 760px) and (max-width: 959px) {
  .pattern-shell.private-health-research.decision-brief-dossier .fit-form {
    padding: 24px;
  }
}

/* ============================ The rail opens ========================= */
/* From the shell's own header boundary the index becomes a rail beside
   the reading column. 192px of rail, a 48px gutter, and the body keeps
   its 680px measure. The rail sticks 96px down, which is the same offset
   the shell gives every fragment, so it never sits under the header. */

@media (min-width: 960px) {
  .pattern-shell.private-health-research.decision-brief-dossier .decision-dossier__layout {
    grid-template-columns: 192px minmax(0, 1fr);
    gap: 48px;
    align-items: start;
  }

  .pattern-shell.private-health-research.decision-brief-dossier .decision-dossier__index {
    display: block;
    position: sticky;
    top: 96px;
  }
}

/* ================================ Print ============================== */
/* The index is navigation and prints as noise. Everything else prints,
   including the whole form, on white, with the sheet's outline and its
   top rule kept so the request still reads as a document. */

@media print {
  .pattern-shell.private-health-research.decision-brief-dossier .decision-dossier__index {
    display: none;
    position: static;
  }

  .pattern-shell.private-health-research.decision-brief-dossier .decision-dossier {
    width: 100%;
    max-width: none;
    padding: 0;
  }

  .pattern-shell.private-health-research.decision-brief-dossier .decision-dossier__layout {
    display: block;
  }

  .pattern-shell.private-health-research.decision-brief-dossier .decision-dossier__body {
    max-width: none;
  }

  .pattern-shell.private-health-research.decision-brief-dossier .fit-form {
    padding: 16px;
    border: 1px solid #000000;
    border-top: 4px solid #000000;
    background: #FFFFFF;
    color: #000000;
  }

  /* Keep a heading with the text it opens and a field with its label,
     without declaring the whole form unbreakable, which would push a long
     form onto a page of its own and leave a blank one behind it. */
  .pattern-shell.private-health-research.decision-brief-dossier .service-section h2 {
    break-after: avoid;
  }

  .pattern-shell.private-health-research.decision-brief-dossier .fit-form > p,
  .pattern-shell.private-health-research.decision-brief-dossier .offer-path__step {
    break-inside: avoid;
  }
}
