/* ==========================================================================
   Standfast — generated documents (the pack itself)
   Paper, not web page.
   ========================================================================== */

/* --------------------------------------------------------------- viewer */
.pack-viewer {
  display: grid; grid-template-columns: 268px 1fr; gap: var(--s-6);
  align-items: start; max-width: 1180px; margin: 0 auto;
}
@media (max-width: 960px) { .pack-viewer { grid-template-columns: 1fr; } }

.pack-nav {
  position: sticky; top: 92px;
  background: var(--white); border: 1px solid var(--rule);
  border-radius: var(--radius-lg); padding: var(--s-4);
  box-shadow: var(--shadow-sm);
}
@media (max-width: 960px) { .pack-nav { position: static; } }
.pack-nav__head {
  font-size: .72rem; letter-spacing: .12em; text-transform: uppercase;
  font-weight: 700; color: var(--muted-light); padding: 4px 10px 12px;
}
.pack-nav__item {
  display: block; width: 100%; text-align: left; cursor: pointer;
  background: none; border: none; border-radius: 8px;
  padding: 11px 12px; margin-bottom: 2px;
  font-family: var(--sans); color: var(--ink-soft);
  transition: background .12s ease, color .12s ease;
}
.pack-nav__item:hover { background: var(--paper-2); color: var(--green-900); }
.pack-nav__item.is-active { background: var(--green-050); color: var(--green-900); }
.pack-nav__item.is-active .pack-nav__t { color: var(--green-800); }
.pack-nav__t { display: block; font-weight: 600; font-size: .97rem; line-height: 1.3; }
.pack-nav__s { display: block; font-size: .78rem; color: var(--muted-light); margin-top: 2px; }
.pack-nav__foot {
  border-top: 1px solid var(--rule); margin-top: var(--s-3); padding: var(--s-4) 10px 4px;
  font-size: .82rem; color: var(--muted-light); line-height: 1.5;
}

.pack-stage { min-width: 0; }
.pack-stage__bar {
  display: flex; align-items: center; gap: var(--s-3);
  margin-bottom: var(--s-4); flex-wrap: wrap;
}
.pack-stage__bar .pill { background: var(--white); }

/* --------------------------------------------------------------- the page */
.doc {
  background: var(--white);
  border: 1px solid var(--rule);
  border-radius: 4px;
  box-shadow: var(--shadow-lg);
  padding: 62px 72px 40px;
  font-size: 1.02rem;
  line-height: 1.68;
  color: var(--ink-soft);
  position: relative;
}
@media (max-width: 720px) { .doc { padding: 34px 26px 26px; } }

.doc::before {   /* the punch-hole margin of a real binder page */
  content: ""; position: absolute; left: 26px; top: 0; bottom: 0;
  width: 1px; background: linear-gradient(180deg, transparent, var(--paper-2) 12%, var(--paper-2) 88%, transparent);
}
@media (max-width: 720px) { .doc::before { display: none; } }

.doc__head {
  display: flex; align-items: center; gap: 13px;
  padding-bottom: 16px; border-bottom: 1px solid var(--rule);
  margin-bottom: 34px;
}
.doc__crest {
  width: 30px; height: 35px; flex: none; border-radius: 3px 3px 15px 15px;
  background: linear-gradient(160deg, var(--green-600), var(--green-800));
}
.doc__crest--amber { background: linear-gradient(160deg, #C98A3C, #8A5A1E); }
.doc__ident { flex: 1; min-width: 0; }
.doc__org {
  font-family: var(--serif); font-size: 1.1rem; font-weight: 600;
  color: var(--green-900); line-height: 1.25;
}
.doc__org span { font-weight: 400; color: var(--muted); }
.doc__scheme {
  font-size: .7rem; letter-spacing: .08em; text-transform: uppercase;
  color: var(--muted-light); font-weight: 600; margin-top: 2px;
}
.doc__stamp {
  font-family: var(--serif); font-size: .82rem; font-weight: 600;
  color: var(--green-600); letter-spacing: .04em; flex: none;
  background: var(--green-050);
  border: 1px solid var(--green-100); border-radius: 999px; padding: 4px 12px;
}

.doc__title {
  font-family: var(--serif); font-size: clamp(2rem, 3.4vw, 2.7rem);
  font-weight: 600; color: var(--green-900); letter-spacing: -0.02em;
  line-height: 1.1; margin: 0 0 16px;
}
.doc__rule { height: 3px; width: 58px; background: var(--green-700); border-radius: 2px; margin-bottom: 30px; }
.doc__rule--amber { background: var(--amber); }

.doc__lede {
  font-size: 1.16rem; line-height: 1.6; color: var(--ink-soft);
  margin: 0 0 26px;
}
.doc__lede strong { color: var(--green-900); }

.doc__h2 {
  font-family: var(--serif); font-size: 1.35rem; font-weight: 600;
  color: var(--green-900); letter-spacing: -0.01em;
  margin: 36px 0 12px; padding-top: 4px;
}
.doc p { margin: 0 0 15px; }
.doc strong { color: var(--green-900); font-weight: 650; }
.doc em { font-style: italic; }

.doc__big {
  font-family: var(--serif); font-size: 1.55rem; line-height: 1.35;
  color: var(--green-800); font-weight: 600;
  border-left: 3px solid var(--green-500); padding: 4px 0 4px 20px;
  margin: 0 0 18px;
}

.doc__callout {
  background: var(--green-050); border: 1px solid var(--green-100);
  border-radius: 8px; padding: 18px 22px; margin: 0 0 26px;
  font-size: .99rem; line-height: 1.6; color: var(--green-900);
}
.doc__callout--amber { background: var(--amber-soft); border-color: #EBD9BE; color: #6E4A19; }
.doc__callout--amber strong { color: #5A3B12; }

.doc__script {
  background: var(--paper-2); border-left: 3px solid var(--amber);
  border-radius: 0 8px 8px 0; padding: 16px 22px; margin: 0 0 20px;
}
.doc__script-label {
  font-size: .68rem; letter-spacing: .12em; text-transform: uppercase;
  font-weight: 700; color: var(--amber); margin-bottom: 8px;
}
.doc__script p {
  margin: 0; font-family: var(--serif); font-size: 1.14rem;
  line-height: 1.55; color: var(--green-900); font-style: italic;
}
.doc__script .doc__ol { margin-bottom: 0; }

.doc__ol, .doc__ul { margin: 0 0 20px; padding-left: 24px; }
.doc__ol li, .doc__ul li { margin-bottom: 9px; padding-left: 4px; }
.doc__ol { list-style: decimal; }
.doc__ul { list-style: none; padding-left: 0; }
.doc__ul li {
  position: relative; padding-left: 24px;
}
.doc__ul li::before {
  content: ""; position: absolute; left: 4px; top: 11px;
  width: 6px; height: 6px; border-radius: 999px; background: var(--green-500);
}
.doc__script .doc__ol li { color: var(--ink-soft); font-family: var(--sans); font-size: 1rem; font-style: normal; }

.doc__aside {
  font-size: .93rem; color: var(--muted); font-style: italic;
  border-left: 2px solid var(--rule); padding-left: 14px; margin: 0 0 18px;
}

/* The pack says "standard tier". That is an answer, not a ruling, and this is where every
   document says so. Deliberately quiet — paper tone, no colour, no icon. It is here to be
   read and understood by a volunteer, not to alarm one. */
.doc__disclaimer {
  background: var(--paper-2); border: 1px solid var(--rule); border-radius: 6px;
  padding: 14px 18px; margin: 28px 0 22px;
  font-size: .88rem; line-height: 1.62; color: var(--muted);
}
.doc__disclaimer strong { color: var(--green-800); }

/* tables */
.doc__table {
  width: 100%; border-collapse: collapse; margin: 0 0 24px;
  font-size: .95rem;
}
.doc__table th {
  text-align: left; font-size: .7rem; letter-spacing: .09em; text-transform: uppercase;
  font-weight: 700; color: var(--muted); padding: 0 12px 8px 0;
  border-bottom: 1.5px solid var(--green-800);
}
.doc__table td {
  padding: 11px 12px 11px 0; border-bottom: 1px solid var(--rule);
  vertical-align: top; line-height: 1.5;
}
.doc__table tr:last-child td { border-bottom: 1px solid var(--rule); }
.doc__blank { background: repeating-linear-gradient(90deg, var(--paper-2) 0 6px, transparent 6px 12px); min-height: 30px; }

.doc__table--form td { padding: 13px 14px 13px 0; }
.doc__form-label {
  width: 38%; font-weight: 600; color: var(--muted); font-size: .93rem;
}
.doc__form-answer { font-weight: 600; color: var(--green-900); font-size: 1.02rem; }
.doc__form-note {
  display: block; font-weight: 400; font-size: .9rem; color: var(--muted);
  margin-top: 5px; line-height: 1.5; font-style: italic;
}

/* signature */
.doc__sign { margin-top: 44px; padding-top: 26px; border-top: 1px solid var(--rule); }
.doc__sign-row { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; }
@media (max-width: 620px) { .doc__sign-row { grid-template-columns: 1fr; gap: 26px; } }
.doc__sign-line {
  display: block; height: 34px; border-bottom: 1px solid var(--rule-strong);
}
.doc__sign-label {
  display: block; margin-top: 7px; font-size: .78rem;
  color: var(--muted-light); letter-spacing: .03em;
}

.doc__foot {
  display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap;
  margin-top: 30px; padding-top: 14px; border-top: 1px solid var(--rule);
  font-size: .76rem; color: var(--muted-light);
}

/* --------------------------------------------------------------- briefing */
.brief { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 28px; }
@media (max-width: 720px) { .brief { grid-template-columns: 1fr; } }
.brief__card {
  border: 1px solid var(--rule); border-radius: 10px; padding: 20px;
  background: #FDFCFA; position: relative;
}
.brief__n {
  position: absolute; top: -11px; left: 18px;
  width: 26px; height: 26px; border-radius: 999px;
  background: var(--green-700); color: #fff;
  font-size: .84rem; font-weight: 700;
  display: grid; place-items: center;
}
.brief__title {
  font-family: var(--serif); font-size: 1.2rem; font-weight: 600;
  color: var(--green-900); margin: 6px 0 5px;
}
.brief__sub {
  font-size: .9rem; color: var(--muted); margin: 0 0 12px; line-height: 1.5;
}
.brief__sub em { color: var(--green-700); font-weight: 600; font-style: italic; }
.brief__card ul { list-style: none; margin: 0; padding: 0; }
.brief__card li {
  position: relative; padding-left: 20px; margin-bottom: 8px;
  font-size: .94rem; line-height: 1.5;
}
.brief__card li::before {
  content: ""; position: absolute; left: 2px; top: 9px;
  width: 5px; height: 5px; border-radius: 999px; background: var(--green-500);
}

/* --------------------------------------------------------------- binder */
.binder {
  background: var(--white); border: 1px solid var(--rule);
  border-top: 10px solid var(--green-800);
  border-radius: 4px; box-shadow: var(--shadow-lg);
  padding: 60px 70px 44px; text-align: center;
}
@media (max-width: 720px) { .binder { padding: 36px 26px 28px; } }
.binder__crest {
  width: 52px; height: 60px; margin: 0 auto 22px; border-radius: 4px 4px 26px 26px;
  background: linear-gradient(160deg, var(--green-600), var(--green-800));
  position: relative;
}
.binder__crest::after {
  content: ""; position: absolute; inset: 0;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 12.5l3.4 3.4L17.5 8.5' stroke='%23DDEAE5' stroke-width='2' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/28px no-repeat;
}
.binder__scheme {
  font-size: .72rem; letter-spacing: .13em; text-transform: uppercase;
  font-weight: 700; color: var(--muted-light); margin-bottom: 18px;
}
.binder__title {
  font-family: var(--serif); font-size: clamp(2.2rem, 4vw, 3.1rem); font-weight: 600;
  color: var(--green-900); line-height: 1.1; letter-spacing: -0.02em; margin: 0 0 26px;
}
.binder__venue {
  font-family: var(--serif); font-size: 1.6rem; font-weight: 600; color: var(--green-800);
}
.binder__town { font-size: 1.02rem; color: var(--muted); margin-top: 2px; }
.binder__rule { width: 64px; height: 2px; background: var(--amber); margin: 30px auto; border-radius: 2px; }

.binder__table {
  width: 100%; max-width: 520px; margin: 0 auto 36px;
  border-collapse: collapse; text-align: left; font-size: .97rem;
}
.binder__table td { padding: 12px 0; border-bottom: 1px solid var(--rule); vertical-align: top; }
.binder__table td:first-child { color: var(--muted); width: 48%; padding-right: 16px; }
.binder__table strong { color: var(--green-900); }
.binder__blank { background: repeating-linear-gradient(90deg, var(--paper-2) 0 6px, transparent 6px 12px); }

/* Sits directly under the tier, the responsible person and the headcount — the three
   things this cover asserts — and above the line where the committee signs for them. */
.binder__note {
  background: var(--paper-2); border: 1px solid var(--rule); border-radius: 8px;
  padding: 18px 24px; text-align: left; max-width: 520px; margin: 0 auto 28px;
  font-size: .88rem; line-height: 1.62; color: var(--muted);
}
.binder__note strong { color: var(--green-800); }

.binder__contents {
  background: var(--paper-2); border-radius: 10px;
  padding: 24px 30px; text-align: left; max-width: 520px; margin: 0 auto 36px;
}
.binder__contents-head {
  font-size: .7rem; letter-spacing: .12em; text-transform: uppercase;
  font-weight: 700; color: var(--green-600); margin-bottom: 12px;
}
.binder__contents ol { margin: 0; padding-left: 20px; font-size: .95rem; color: var(--ink-soft); }
.binder__contents li { margin-bottom: 7px; line-height: 1.5; }

.binder__sign {
  display: grid; grid-template-columns: 1fr 1fr; gap: 40px;
  max-width: 520px; margin: 0 auto 30px; text-align: left;
}
@media (max-width: 620px) { .binder__sign { grid-template-columns: 1fr; gap: 22px; } }

.binder__foot {
  border-top: 1px solid var(--rule); padding-top: 16px;
  font-size: .8rem; color: var(--muted-light); line-height: 1.6;
}

/* --------------------------------------------------------------- stage nav */
.pack-stage__nav {
  display: flex; align-items: center; justify-content: space-between; gap: var(--s-4);
  margin-top: var(--s-5);
}
.pack-stage__nav .btn { padding: 11px 20px; font-size: .95rem; }

/* preview watermark — visible, but never in the way of reading */
.doc.is-preview, .plainwrap.is-preview .binder { position: relative; }
.doc.is-preview::after, .plainwrap.is-preview .binder::after {
  content: "PREVIEW"; position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  font-family: var(--serif); font-size: clamp(4rem, 12vw, 9rem); font-weight: 700;
  color: rgba(44, 91, 79, 0.05);
  letter-spacing: .2em; transform: rotate(-24deg);
  pointer-events: none; overflow: hidden; user-select: none;
}

/* --------------------------------------------------------------- print */
.print-all { display: none; }

@media print {
  .doc, .binder { box-shadow: none; border: none; padding: 0; }
  .doc, .plainwrap { page-break-after: always; }
  .doc:last-child, .plainwrap:last-child { page-break-after: auto; }
  .pack-viewer { display: none !important; }
  .print-all { display: block; }
  .pack-nav, .pack-stage__bar, .pack-stage__nav { display: none !important; }
  .doc__table { page-break-inside: avoid; }
  .brief__card, .doc__callout, .doc__script { page-break-inside: avoid; }
}
