.ending-faq,
.closing-download {
  width: min(48rem, calc(100% - 2 * clamp(16px, 4vw, 32px)));
  margin-inline: auto;
}
.ending-faq {
  --faq-inset: clamp(1rem, 3vw, 1.75rem);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 36px;
  padding-block-start: 160px;
  color: rgb(0 0 0 / 96%);
}
.ending-faq-heading,
.ending-faq-list {
  width: 100%;
}
.ending-faq-list {
  container-type: inline-size;
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.ending-faq-list > li {
  border-radius: 18px;
  background: rgb(0 0 0 / 4%);
}
@supports (corner-shape: squircle) {
  .ending-faq-list > li {
    border-radius: 32px;
    corner-shape: squircle;
  }
}
.ending-faq summary {
  cursor: pointer;
  list-style: none;
  border-radius: inherit;
}
.ending-faq summary::-webkit-details-marker { display: none; }
.ending-faq summary:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 2px;
}
.ending-faq h3 {
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 0;
  padding: clamp(1rem, 2.75cqi, 1.375rem) var(--faq-inset);
  font-size: clamp(1.125rem, .9rem + 1cqi, 1.375rem);
  line-height: 1.45;
  font-weight: 500;
}
.ending-faq h3 span { flex: 1; min-width: 0; text-wrap: pretty; overflow-wrap: anywhere; }
.ending-faq details[open] h3 { padding-bottom: .5em; }
.ending-faq-chevron {
  width: 1em;
  height: 1em;
  flex: none;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.ending-faq details[open] .ending-faq-chevron { transform: rotate(180deg); }
.ending-faq-answer {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 0 var(--faq-inset) clamp(1.25rem, 3.5cqi, 1.75rem);
}
.ending-faq-answer p {
  margin: 0;
  font-size: clamp(1rem, .9rem + .5cqi, 1.125rem);
  line-height: 1.65;
  color: var(--muted);
  text-wrap: pretty;
  overflow-wrap: anywhere;
}
@media (max-width: 767px) {
  .ending-faq { padding-block-start: 56px; gap: 24px; }
}

/* A fragment inside the answer opens the native disclosure. Position its
   destination at the question so wrapped summaries clear the sticky header. */
.ending-faq details { position: relative; }
.chapter-motion .ending-faq-list > li:has(.faq-destination:target) {
  opacity: 1;
  transform: none;
  transition: none;
}
.faq-destination {
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: 0;
  width: 1px;
  height: 1px;
  scroll-margin-block-start: var(--nav-height, 88px);
  pointer-events: none;
}

.closing-download {
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:clamp(24px, 3vw, 32px);
  padding-block:clamp(64px, 8vw, 104px);
  color:rgb(0 0 0 / .96);
  text-align:center;
}
.closing-copy { display:grid; justify-items:center; gap:16px; width:100%; container-type:inline-size; }
.closing-copy h2 {
  font-size:min(var(--type-section),9.5cqi);
  white-space:nowrap;
}
.closing-copy p {
  max-width:20ch;
  margin:0;
  font-size:var(--type-lead);
  line-height:1.5;
  color:var(--muted);
  text-wrap:balance;
}
.site-footer {
  padding-inline: clamp(16px, 3.5vw, 48px);
  padding-block-end: clamp(24px, 4vw, 48px);
  scroll-margin-block-start: var(--nav-height);
  background: var(--paper);
  color: rgb(0 0 0 / 96%);
  font-size: var(--type-body);
  line-height: 1.5;
}
.site-footer p { margin: 0; }
.site-footer a {
  color: inherit;
  text-decoration: none;
}
.site-footer a:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 4px;
}
.footer-directory,
.footer-colophon {
  border-top: 1px solid var(--line);
  padding-top: 24px;
}
.footer-directory {
  display: grid;
  grid-template-columns: 1fr 1fr 1.5fr 1fr;
  align-items: start;
  gap: 24px;
}
.footer-brand { display: flex; justify-self: start; }
.footer-brand img { display: block; width: auto; height: 24px; }
.footer-links {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  gap: 8px;
}
.footer-links h2 {
  margin: 0 0 4px;
  color: var(--muted);
  font-size: var(--type-label);
  font-weight: 500;
}
.footer-links a { max-width: 100%; overflow-wrap: anywhere; }
.site-footer nav a {
  justify-self: start;
  transition: opacity 150ms cubic-bezier(.4, 0, .2, 1);
}
@media (hover:hover) {
  .site-footer nav a:hover { opacity: .6; }
}
.footer-colophon {
  display:flex;
  flex-wrap:wrap;
  align-items:baseline;
  justify-content:flex-start;
  gap:8px clamp(8px, 1vw, 16px);
  margin-top:clamp(28px, 4vw, 48px);
  font-size:var(--type-label);
  color:var(--muted);
}
.footer-release { display:flex; gap:clamp(4px, 1vw, 16px); white-space:nowrap; }
.footer-colophon a { flex:none; margin-inline-start:auto; }
.footer-colophon a:hover { text-decoration:underline; text-underline-offset:.2em; }
.footer-signature { margin-top:clamp(32px, 5vw, 64px); }
.footer-signature img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 2945 / 512;
  filter: invert(1);
}
@media (max-width:700px) {
  .footer-directory { grid-template-columns:minmax(0,1fr); }
  .footer-links { flex-flow:row wrap; align-items:baseline; gap:4px 18px; }
  .footer-links h2 { flex-basis:100%; }
  .footer-links a { padding-block:3px; }
  .footer-colophon { font-size:clamp(.75rem, 3.6vw, .875rem); }
}
@media (max-width:30rem) {
  .footer-colophon { display:grid; grid-template-columns:minmax(0,1fr) auto; row-gap:4px; }
  .footer-colophon a { grid-column:2; grid-row:1; }
}
@media (prefers-reduced-motion:reduce) {
  .site-footer nav a { transition: none; }
}
