/* A compact stationery-inspired arch; the supplied artwork is never cropped. */
.journal {
  background: #f8f3f0;
  border-top: 1px solid #e5d9d2;
  padding: 64px 0 58px;
}
.journal-heading { text-align: center; margin-bottom: 30px; }
.journal-heading .eyebrow { color: #826559; }
.journal-heading h2 { margin: 12px 0; font-size: 30px; }
.journal-heading > p:last-child { font-size: 12px; color: var(--muted); }
.journal-carousel { max-width: 650px; margin: auto; }
.journal-window {
  overflow: visible;
}
.journal-track { display: flex; flex-wrap: wrap; gap: 26px; align-items: stretch; }
.journal-enhanced .journal-window {
  overflow: hidden;
  scroll-snap-type: x mandatory;
  overscroll-behavior-x: contain;
}
.journal-enhanced .journal-track { flex-wrap: nowrap; }
.journal-card {
  flex: 0 0 calc((100% - 26px) / 2);
  min-width: 0;
  position: relative;
  padding: 30px 22px 21px;
  border: 1px solid #b99b8c;
  border-radius: 50% 50% 30px 30px / 100px 100px 30px 30px;
  background: radial-gradient(#b99b8c38 .7px, transparent .9px) 0 0 / 8px 8px, #fffaf5;
  scroll-snap-align: start;
  text-align: center;
}
.journal-card::before {
  content: '';
  position: absolute;
  inset: 6px;
  border: 1px solid #d7c3b7;
  border-radius: inherit;
  pointer-events: none;
}
.journal-ornament { display: block; color: #aa8573; font: 21px/1 Georgia, serif; margin-bottom: 13px; }
.journal-card img {
  width: 190px;
  max-width: 100%;
  aspect-ratio: 1;
  object-fit: contain;
  margin: auto;
  border: 1px solid #e2cfc6;
  border-radius: 20px;
}
.journal-category { color: #816355; font-size: 9px; letter-spacing: .14em; margin-top: 14px; }
.journal-card h3 { font: 18px/1.7 var(--jp); margin: 9px 0; letter-spacing: .035em; }
.journal-card .journal-copy { font-size: 11px; line-height: 1.95; max-width: 260px; margin: auto; }
.journal-card .journal-mark { font: italic 14px/1.5 var(--serif); color: #97715e; margin-top: 12px; }
.journal-controls { display: flex; align-items: center; justify-content: center; gap: 24px; margin-top: 23px; }
.journal-controls[hidden] { display: none; }
.journal-controls button {
  width: 44px;
  height: 44px;
  border: 1px solid #b89989;
  border-radius: 50%;
  background: transparent;
  font-size: 20px;
  cursor: pointer;
}
.journal-controls button:disabled { opacity: .3; cursor: default; }
.journal-position { font: 12px var(--serif); letter-spacing: .12em; min-width: 74px; text-align: center; }
.journal-note { text-align: center; font-size: 10px; color: #786a61; max-width: 610px; margin: 18px auto 0; }
/* Motion is opt-in, only after the observer is available. */
.reveal-ready { opacity: 0; transform: translateY(14px); transition: opacity .65s ease, transform .65s ease; }
.reveal-ready.is-visible { opacity: 1; transform: none; }
@media (max-width: 700px) {
  .journal { padding: 48px 0; }
  .journal-heading h2 { font-size: clamp(21px, 6vw, 27px); letter-spacing: .02em; }
  .journal-heading > p:last-child { font-size: 11px; }
  .journal-carousel { max-width: 300px; }
  .journal-card { flex-basis: 100%; padding-inline: 24px; }
  .journal-card img { width: 190px; }
  .journal-note { font-size: 9px; max-width: 330px; }
}
@media (prefers-reduced-motion: reduce) {
  .reveal-ready { opacity: 1; transform: none; transition: none; }
  .journal-window { scroll-behavior: auto; }
}