
.gp-title {
  margin-top: 14px;
  font-size: clamp(44px, 7.4vw, 104px); line-height: .86; font-weight: 900;
  letter-spacing: -.04em; text-transform: uppercase;
  color: transparent; -webkit-text-stroke: 2px var(--white);
  transition: color .6s;
}
.gp-title:hover { color: var(--white); }
.gp-sub {
  margin-top: 22px; font-size: 15px; font-weight: 600; color: rgba(255, 255, 255, .6);
  font-variant-numeric: tabular-nums;
}
.gp-sub span + span::before { content: "\00b7"; margin: 0 9px; color: rgba(255, 255, 255, .32); }
.gp-title, .gp-sub { animation: gx-rise 1s cubic-bezier(.16, 1, .3, 1) both; }
.gp-title { animation-delay: .08s; }
.gp-sub { animation-delay: .22s; }

.gp-body { background: var(--white); padding: var(--sect) 0; }
.gp-main { max-width: none; }
.gp-main > h2, .gp-main > h3, .gp-main > p, .gp-main > ul { max-width: 78ch; }
.gp-main > h2 {
  margin-top: 56px; font-size: clamp(23px, 2.6vw, 30px); font-weight: 900;
  letter-spacing: -.02em; line-height: 1.15; color: var(--zinc-950);
  scroll-margin-top: 90px;
}
.gp-main > h2:first-child { margin-top: 0; }
.gp-main > h3 {
  margin-top: 34px; font-size: 18px; font-weight: 800; color: var(--zinc-950);
  scroll-margin-top: 90px;
}
.gp-main p { margin-top: 16px; font-size: 17px; line-height: 1.62; color: var(--zinc-600); overflow-wrap: anywhere; }
.gp-main p b { color: var(--zinc-950); font-weight: 700; }
.gp-main a { color: var(--zinc-950); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; transition: color .3s; }
.gp-main a:hover { color: var(--red); }
.gp-main ul { margin-top: 16px; padding-left: 20px; }
.gp-main li { font-size: 17px; line-height: 1.62; color: var(--zinc-600); margin-top: 8px; }

.prose.gp-ref { max-width: none; }
.prose.gp-ref > h2, .prose.gp-ref > h3, .prose.gp-ref > p, .prose.gp-ref > ul { max-width: 78ch; }
.prose.gp-ref > .tbl-wrap { max-width: none; }

.gp-tbl { margin-top: 26px; }
.gp-tbl .gr-tbl { border-top-color: var(--acc, var(--red)); }
.gp-tbl .gr-tbl tbody td.gp-wrap { white-space: normal; min-width: 200px; }
.gp-tbl .gr-tbl tbody td.gp-basis { font-size: 12px; color: var(--zinc-500); }

.gp-eq { margin-top: 26px; max-width: 940px; border-top: 2px solid var(--acc, var(--slate-900)); }
.gp-eq-row {
  display: grid; grid-template-columns: 108px 1fr auto; align-items: baseline; gap: 20px;
  padding: 15px 0; border-bottom: 1px solid var(--slate-200);
}
.gp-eq-std { font-size: 13px; font-weight: 700; color: var(--acc, var(--red)); }
.gp-eq-val {
  font-size: 19px; font-weight: 800; color: var(--zinc-950);
  font-variant-numeric: tabular-nums;
}
.gp-eq-val i { display: block; margin-top: 4px; font-style: normal; font-size: 13.5px; font-weight: 500; color: var(--zinc-500); }
.gp-eq-basis { font-size: 12px; font-weight: 600; color: var(--zinc-500); text-align: right; }
.gp-eq-basis.is-inherited { color: #a85519; }

.gp-figs { display: flex; flex-wrap: wrap; gap: 1px; margin-top: 26px; max-width: 660px; background: var(--slate-200); border: 1px solid var(--slate-200); }
.gp-fig { flex: 1 1 200px; background: var(--white); padding: 24px 22px; }
.gp-fig b {
  display: block; font-size: clamp(38px, 5vw, 56px); font-weight: 900; line-height: 1;
  letter-spacing: -.03em; color: var(--zinc-950); font-variant-numeric: tabular-nums;
}
.gp-fig span { display: block; margin-top: 12px; font-size: 13.5px; font-weight: 600; color: var(--zinc-500); }

.gp-qs { margin-top: 26px; border-top: 1px solid var(--slate-200); counter-reset: gpq; }
.gp-q { display: grid; grid-template-columns: 54px 1fr; gap: 18px; padding: 24px 0; border-bottom: 1px solid var(--slate-200); }
.gp-q::before {
  counter-increment: gpq; content: "0" counter(gpq);
  font-size: 13px; font-weight: 700; color: var(--red); font-variant-numeric: tabular-nums;
}
.gp-q h3 { margin: 0; font-size: 18px; font-weight: 800; color: var(--zinc-950); scroll-margin-top: 90px; }
.gp-q h3, .gp-q p { max-width: 78ch; }
.gp-q p { margin-top: 10px; }

.gp-links { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; margin-top: 26px; }
.gp-link {
  display: block; background: var(--white); padding: 18px 20px;
  box-shadow: 0 0 0 1px var(--slate-200);
  transition: background-color .3s, color .3s;
}
.gp-link b { display: block; font-size: 16px; font-weight: 800; color: var(--zinc-950); }
.gp-link span { display: block; margin-top: 5px; font-size: 13px; color: var(--zinc-500); }
.gp-link:hover { background: var(--zinc-950); }
.gp-link:hover b, .gp-link:hover span { color: var(--white); }
.gp-main .gp-link { text-decoration: none; }

.gp-basis-line { margin-top: 20px; font-size: 13.5px; line-height: 1.6; color: var(--zinc-500); }
.gp-basis-line a { color: var(--zinc-600); }

.gp-back { margin-top: 56px; padding-top: 26px; border-top: 1px solid var(--slate-200); }

@media (max-width: 1023px) {
  .gp-links { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 767px) {
  .gp-body { padding: 72px 0; }
  .gp-main > h2 { margin-top: 44px; }
  .gp-main p, .gp-main li { font-size: 16px; }
  .gp-eq-row { grid-template-columns: 92px 1fr; }
  .gp-eq-basis { grid-column: 2; text-align: left; margin-top: 2px; }
}
@media (max-width: 559px) {
  .gp-links { grid-template-columns: 1fr; }
  .gp-q { grid-template-columns: 40px 1fr; gap: 12px; }
  .gp-fig { padding: 20px 18px; }
}

@media (prefers-reduced-motion: reduce) {
  .gp-title, .gp-link { transition: none; }
  .gp-title, .gp-sub { animation: none; opacity: 1; transform: none; }
}

.gx-refs { display: flex; flex-wrap: wrap; gap: 22px; margin-top: 26px; }
.gx-refs a {
  font-size: 14px; font-weight: 600; color: rgba(255, 255, 255, .82);
  border-bottom: 1px solid rgba(255, 255, 255, .3); padding-bottom: 3px;
  transition: color .3s, border-color .3s;
}
.gx-refs a:hover { color: var(--red); border-color: var(--red); }
.gr-fam-link { margin-top: 14px; }
.gr-fam-link a {
  font-size: 14px; font-weight: 700; color: var(--acc, var(--slate-900));
  border-bottom: 1px solid currentColor; padding-bottom: 2px;
  transition: color .3s;
}
.gr-fam-link a:hover { color: var(--red); }
.gr-tbl tbody th a {
  color: inherit; text-decoration: underline; text-underline-offset: 3px;
  text-decoration-thickness: 1px; text-decoration-color: var(--acc, var(--slate-300));
  transition: color .3s;
}
.gr-tbl tbody th a:hover { color: var(--red); }

.tbl td.gp-wrap { white-space: normal; min-width: 190px; }
.tbl td.gp-basis { font-size: 12px; color: var(--zinc-500); white-space: nowrap; }
