/* Guide only: a compact question index and five independently expandable booklets. */
.paper-site:has(.gvoc) main > section:first-child .paper-intro-object {
  display: none;
}

.paper-site:has(.gvoc) main > section:first-child .gvoc-hero-phrase {
  position: relative;
  isolation: isolate;
  display: inline-block;
  max-width: 100%;
}

.paper-site:has(.gvoc) main > section:first-child .gvoc-hero-phrase::before {
  position: absolute;
  z-index: -1;
  inset: -.15em -.3em -.2em;
  content: "";
  background: url("collage-assets/c3_sheet.webp") center / 100% 100% no-repeat;
  transform: rotate(-1.8deg);
  pointer-events: none;
}

.paper-site .gvoc {
  padding: 76px 0 84px;
  color: var(--paper-ink, #24211d);
}

.paper-site .gvoc-heading {
  max-width: 850px;
  margin-bottom: 32px;
}

.paper-site .gvoc-heading h2 {
  max-width: 790px;
  font-size: clamp(28px, 3.15vw, 42px);
  line-height: 1.35;
  text-align: left;
}

.paper-site .gvoc-heading > p {
  margin-top: 20px;
  color: #61594d;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.85;
}

.paper-site .gvoc-index {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0;
  margin: 0 0 52px;
  border-top: 1px solid #bda98a;
  border-bottom: 1px solid #bda98a;
}

.paper-site .gvoc-index > a {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 16px;
  align-content: start;
  gap: 8px 8px;
  min-width: 0;
  padding: 20px 22px;
  border-right: 1px solid #d1c3ae;
  background: #f5eee0;
  color: #393226;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.65;
  text-decoration: none;
  overflow-wrap: anywhere;
  transition: background-color .15s ease;
}

.paper-site .gvoc-index > a:last-child { border-right: 0; }
.paper-site .gvoc-index-number {
  grid-column: 1 / -1;
  color: #9a4936;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .04em;
}
.paper-site .gvoc-index-arrow { justify-self: end; }
.paper-site .gvoc-index > a:hover { background: #fff8eb; }

.paper-site .gvoc-groups { display: grid; gap: 44px; }
.paper-site .gvoc-group {
  display: grid;
  grid-template-columns: minmax(180px, .8fr) minmax(0, 2.35fr);
  gap: 46px;
  align-items: start;
  min-width: 0;
  padding: 0;
  scroll-margin-top: 125px;
}
.paper-site .gvoc-group-heading { padding: 13px 0 0; min-width: 0; }
.paper-site .gvoc-group-number {
  display: inline-block;
  padding-bottom: 5px;
  border-bottom: 2px solid #ae4d38;
  color: #92523d;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: .035em;
}
.paper-site .gvoc-group-heading h3 {
  margin: 16px 0 10px;
  color: #332d24;
  font-size: 22px;
  line-height: 1.5;
  text-align: left;
  text-wrap: pretty;
}
.paper-site .gvoc-group-heading > p {
  color: #6d6252;
  font-size: 13px;
  line-height: 1.8;
  font-weight: 400;
}
.paper-site .gvoc-questions {
  min-width: 0;
  border: 1px solid #c5b697;
  background: #f8f2e6;
  box-shadow: 4px 5px 0 #c5b69770;
}
.paper-site .gvoc-question {
  margin: 0;
  padding: 0;
  border: 0;
  border-bottom: 1px solid #d4c7af;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.paper-site .gvoc-question:last-child { border-bottom: 0; }
.paper-site .gvoc-question > summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 20px;
  align-items: center;
  gap: 20px;
  min-height: 76px;
  margin: 0;
  padding: 23px 28px;
  color: #342f27;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.75;
  list-style: none;
  cursor: pointer;
  text-align: left;
  overflow-wrap: anywhere;
}
.paper-site .gvoc-question > summary::-webkit-details-marker { display: none; }
.paper-site .gvoc-question > summary::after {
  content: "+";
  align-self: center;
  justify-self: center;
  margin: 0;
  color: #a34935;
  font-size: 24px;
  font-weight: 400;
  line-height: 1;
}
.paper-site .gvoc-question[open] > summary::after { content: "−"; }
.paper-site .gvoc-question > summary:hover { background: #eee3cf70; }
.paper-site .gvoc-answer {
  margin: 0;
  padding: 0 68px 27px 28px;
}
.paper-site .gvoc-answer > p {
  margin: 0;
  color: #5b5143;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.95;
  overflow-wrap: anywhere;
}
.paper-site .gvoc-answer > a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  margin-top: 15px;
  color: #963d2b;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.7;
  text-decoration: underline;
  text-underline-offset: 5px;
  text-decoration-thickness: 1px;
}
.paper-site .gvoc-answer > a > span { flex-shrink: 0; }
.paper-site .gvoc a:focus-visible,
.paper-site .gvoc summary:focus-visible {
  position: relative;
  outline: 2px solid #a04732;
  outline-offset: -4px;
  z-index: 1;
}
.paper-site .gvoc-answer > a:focus-visible { outline-offset: 4px; }

.paper-site .gvoc-prep {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.35fr);
  gap: 52px;
  margin-top: 76px;
  padding: 40px 0 0;
  border-top: 1px solid #bfae92;
}
.paper-site .gvoc-prep-heading h2 {
  max-width: 360px;
  color: #332d24;
  font-size: clamp(25px, 2.2vw, 29px);
  line-height: 1.5;
  text-wrap: pretty;
  text-align: left;
}
.paper-site .gvoc-prep-heading > p {
  margin-top: 15px;
  color: #6d6252;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.8;
}
.paper-site .gvoc-prep-list { margin: 0; padding: 0; list-style: none; }
.paper-site .gvoc-prep-list > li {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  align-items: baseline;
  gap: 14px;
  padding: 16px 0;
  border-bottom: 1px solid #cdbfa6;
  color: #4f4536;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.8;
}
.paper-site .gvoc-prep-list > li:first-child { padding-top: 8px; }
.paper-site .gvoc-check { color: #9c422e; font-weight: 600; }

@media (max-width: 900px) {
  .paper-site .gvoc-index { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .paper-site .gvoc-index > a:nth-child(3) { border-right: 0; }
  .paper-site .gvoc-index > a:nth-child(n+4) { border-top: 1px solid #d1c3ae; }
  .paper-site .gvoc-index > a { padding: 16px 18px; }
  .paper-site .gvoc-group { gap: 26px; grid-template-columns: minmax(140px, .75fr) minmax(0, 2fr); }
  .paper-site .gvoc-group-heading h3 { font-size: 20px; }
}

@media (max-width: 680px) {
  .paper-site:has(.gvoc) main > section:first-child h1 { font-size: clamp(26px, 7vw, 36px); }
  .paper-site:has(.gvoc) main > section:first-child .gvoc-hero-phrase {
    display: table;
    margin: .1em auto 0;
  }
  .paper-site .gvoc { padding: 55px 0 58px; }
  .paper-site .gvoc-heading { margin-bottom: 26px; }
  .paper-site .gvoc-heading h2 { font-size: 29px; line-height: 1.5; }
  .paper-site .gvoc-heading > p { font-size: 14px; margin-top: 17px; }
  .paper-site .gvoc-desktop-break { display: none; }
  .paper-site .gvoc-index { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-bottom: 40px; }
  .paper-site .gvoc-index > a { padding: 15px 16px; font-size: 13px; gap: 5px 8px; }
  .paper-site .gvoc-index > a:nth-child(n+3) { border-top: 1px solid #d1c3ae; }
  .paper-site .gvoc-index > a:nth-child(3) { border-right: 1px solid #d1c3ae; }
  .paper-site .gvoc-index > a:nth-child(even) { border-right: 0; }
  .paper-site .gvoc-index > a:last-child { grid-column: 1 / -1; }
  .paper-site .gvoc-groups { gap: 34px; }
  .paper-site .gvoc-group { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  .paper-site .gvoc-group-heading { display: grid; grid-template-columns: 27px minmax(0, 1fr); gap: 2px 14px; padding: 0; }
  .paper-site .gvoc-group-number { grid-row: 1 / 3; align-self: start; margin-top: 2px; }
  .paper-site .gvoc-group-heading h3 { margin: 0; font-size: 20px; line-height: 1.55; }
  .paper-site .gvoc-group-heading > p { grid-column: 2; font-size: 12px; }
  .paper-site .gvoc-question > summary { padding: 20px; gap: 14px; font-size: 15px; min-height: 72px; }
  .paper-site .gvoc-answer { padding: 0 20px 23px; }
  .paper-site .gvoc-answer > p { font-size: 14px; }
  .paper-site .gvoc-prep { grid-template-columns: minmax(0, 1fr); gap: 24px; margin-top: 52px; padding-top: 32px; }
  .paper-site .gvoc-prep-heading h2 { max-width: 430px; font-size: 25px; }
  .paper-site .gvoc-prep-list > li { font-size: 14px; }
}

@media (prefers-reduced-motion: reduce) {
  .paper-site .gvoc-index > a { transition: none; }
}
