/* Longer, readable biographies on Jesus og vennene hans. */
#jesus .bible-place,
#mariaene .bible-place,
#apostlene .bible-place {
  white-space: normal;
  overflow-wrap: anywhere;
}

[data-jv-spoken] {
  line-height: 1.7;
}

#jesus,
#jomfru-maria,
#maria-magdalena,
.apostle-card {
  scroll-margin-top: 100px;
}

.jv-sources {
  padding-block: 28px 48px;
}

.jv-sources > details {
  border: 1px solid rgba(18, 59, 83, 0.18);
  border-radius: 18px;
  background: #fffaf1;
}

.jv-sources summary {
  padding: 20px 24px;
  font-weight: 700;
  cursor: pointer;
}

.jv-sources__copy {
  padding: 0 24px 24px;
  line-height: 1.65;
  overflow-wrap: anywhere;
}

.jv-sources__copy li + li {
  margin-top: 20px;
}

.jv-sources__copy a {
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* The reader follows the viewport while the child scrolls through a biography. */
body:has([data-bible-card]) { overflow-x: clip; }
.apostle-card, .biblical-feature { overflow: clip; }
/* Raising an open card would also move its sticky Pause/Fortsett button. */
.apostle-card[open]:hover { transform: none; }

/* Approved responsive images and a bounded reading surface. */
.jv-page .jv-hero-picture { display: contents; }
.jv-page :is(#jesus, .apostle-card, .apostle-card > summary, .biblical-feature, #velg) {
  scroll-margin-top: 1rem;
}
.jv-page :is([data-jv-spoken], .apostle-card__body > p) {
  max-width: 31em;
  font-size: 1.0625rem;
  line-height: 1.7;
}
.jv-page .faith-center .split__image img { height: auto; }
.jv-page .jv-portrait { display: block; min-width: 0; }
.jv-page .biblical-feature > .jv-portrait {
  align-self: start;
  background: #fff2df;
}
.jv-page .biblical-feature > .jv-portrait > img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 3 / 5;
  object-fit: cover;
  object-position: center 14%;
}
.jv-page .apostle-grid {
  grid-template-columns: 1fr;
  max-width: 820px;
  margin-inline: auto;
}
.jv-page .apostle-grid + .apostles-note { margin-top: 32px; }
.jv-page .jv-apostle-picture {
  display: block;
  width: 112px;
  height: 112px;
}
.jv-page .jv-apostle-picture > img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  border-radius: 20px;
  background: #fff2df;
}
.jv-page .jv-apostle-picture > .apostle-card__matthias { object-position: center 14%; }
.jv-page .apostle-card__less,
.jv-page .apostle-card[open] .apostle-card__more { display: none; }
.jv-page .apostle-card[open] .apostle-card__less { display: inline; }
.jv-page .apostle-card[open] .apostle-card__action { font-size: .82rem; }
.jv-page .apostle-card[open] .apostle-card__action::after { content: none; }
.jv-page :is(a, button, summary):focus-visible {
  outline: 3px solid #123b53;
  outline-offset: 3px;
}
.jv-page .apostle-card:has(> summary:focus-visible) {
  outline: 4px solid #123b53;
  outline-offset: 3px;
}
.jv-page .apostle-card > summary:focus-visible { outline: none; }
.jv-page :is(.page-hero, .site-footer, .section--blue) :is(a, button, summary):focus-visible {
  outline-color: #ffc84d;
}
.jv-page .bible-adult-note > summary {
  display: list-item;
  min-height: 48px;
  padding: 14px 18px;
  font-size: 1rem;
  list-style: revert;
}
.jv-page .bible-adult-note > summary::-webkit-details-marker { display: revert; }
.jv-page .bible-adult-note__copy { max-width: 34em; }
.jv-page .jv-adult-sources a { display: inline-block; padding-block: 8px; }
.jv-page .bible-tools { margin-top: 22px; }

@media (min-width: 981px) {
  .jv-page .biblical-feature:nth-child(even) {
    grid-template-columns: minmax(0, 1.14fr) minmax(360px, .86fr);
  }
  .jv-page .biblical-feature:nth-child(even) > .jv-portrait { order: 2; }
  .jv-page .biblical-feature > .jv-portrait { position: sticky; top: 96px; }
}
@media (max-width: 980px) {
  .jv-page .biblical-feature { grid-template-columns: 1fr; }
  .jv-page .biblical-feature > .jv-portrait { order: 0; }
  .jv-page .biblical-feature > .jv-portrait > img { max-height: 70vh; }
  .jv-page .jv-apostle-picture { width: 88px; height: 88px; }
  .jv-page .apostle-card > summary { grid-template-columns: 88px auto minmax(0, 1fr) auto; }
}
@media (max-width: 680px) {
  .jv-page .page-hero--friends { padding-top: 230px; }
  .jv-page .page-hero--friends .page-hero__image { object-position: center top; }
  .jv-page :is(#mariaene, #apostlene) { scroll-margin-top: -40px; }
  .jv-page .biblical-feature > .jv-portrait > img { height: min(48vh, 380px); aspect-ratio: auto; }
  .jv-page .apostle-grid { gap: 14px; }
  .jv-page .apostle-card > summary {
    grid-template-columns: 88px minmax(0, 1fr) auto;
    min-height: 112px;
  }
  .jv-page .jv-apostle-picture > img { border-radius: 16px; }
  .jv-page .apostle-card[open] > summary { grid-template-columns: 88px minmax(0, 1fr); }
  .jv-page .apostle-card[open] .jv-apostle-picture { grid-row: 1 / 3; }
  .jv-page .apostle-card[open] .apostle-card__heading { grid-column: 2; grid-row: 1; align-self: end; }
  .jv-page .apostle-card[open] .apostle-card__action { grid-column: 2; grid-row: 2; justify-self: start; }
}
@media print {
  .jv-page .skip-link { display: none; }
}

/* Keep the apostle shortcut close enough to the cards on short phone screens. */
.jv-page #apostlene { padding-top: 48px; }
.jv-page .section-heading--apostles { margin: 0 auto 20px; }
.jv-page .section-heading--apostles h2 { margin: 12px 0 16px; }
.jv-page .section-heading--apostles .text-narration { margin-bottom: 14px; }
.jv-page .section-heading--apostles > p { margin: 14px 0 0; font-size: 1.0625rem; line-height: 1.55; }
@media (max-width: 680px) {
  .jv-page #apostlene { padding-top: 32px; }
  .jv-page .section-heading--apostles h2 { font-size: 1.75rem; }
}