@import url("/font-faces.css");
@import url("/project.css");
/* Import also supports pages already open with the previous navigation runtime. */
/* Page-specific values and layout; shared rules are in ../project.css. */
:root {
  --project-gutter: 0%;
  --project-width: 100%;
}

.page-container { margin-left: auto; margin-right: auto; max-width: 100%; padding-bottom: 0px; padding-top: 0px; }

.standard-modules .modules .project-module-media_collection[data-id="m5d7a268e5f3964069156d37c3bcece67412c575e071bb26c9bc03"] .grid__item-container { border-bottom: 20px solid transparent; border-left: calc(10px) solid transparent; border-right: calc(10px) solid transparent; }
.standard-modules .modules .project-module-media_collection[data-id="m5d7a268e5f3964069156d37c3bcece67412c575e071bb26c9bc03"] .grid--main { margin: 0px calc(-10px); }
.splash-modules .modules .project-module-media_collection[data-id="m5d7a268e5f3964069156d37c3bcece67412c575e071bb26c9bc03"] .grid__item-container { border-bottom: 20px solid transparent; border-left: calc(10px) solid transparent; border-right: calc(10px) solid transparent; }
.splash-modules .modules .project-module-media_collection[data-id="m5d7a268e5f3964069156d37c3bcece67412c575e071bb26c9bc03"] .grid--main { margin: 0px calc(-10px); }

/* Show the visualization and installed piece together at their natural ratios. */
.standard-modules .modules .joan-outcome {
  display: grid;
  grid-template-columns: minmax(0, 5152fr) minmax(0, 1629fr);
  gap: 20px;
  align-items: start;
  padding-bottom: 60px;
}
.standard-modules .modules .joan-outcome > .project-module-image {
  min-width: 0;
  margin: 0;
  padding: 0;
}
.standard-modules .modules .joan-outcome .media-frame { width: 100%; }

/* The finished piece spans three process rows, with all image ratios preserved.
   The column split balances the sum of the three row ratios and their 20px gaps. */
.standard-modules .modules .joan-process-gallery[data-id] .joan-process-grid {
  display: grid;
  grid-template-columns: minmax(0, calc(69.053272526% - 19.130273308px)) minmax(0, 1fr);
  gap: 20px;
  align-items: start;
  margin: 0;
}
.joan-process-steps { display: grid; gap: 20px; min-width: 0; }
.joan-process-row { display: flex; gap: 20px; min-width: 0; align-items: start; }
.standard-modules .modules .joan-process-gallery[data-id] .grid__item-container {
  width: 100%;
  max-width: none;
  min-width: 0;
  border: 0;
  flex-basis: 0;
  align-self: start;
}
@media (max-width: 932px) {
  .standard-modules .modules .joan-process-gallery { width: 90%; margin-inline: 5%; }
  .standard-modules .modules .joan-process-gallery[data-id] .joan-process-grid { grid-template-columns: minmax(0, 1fr); }
  .standard-modules .modules .joan-process-gallery[data-id] .joan-step-14 { max-width: 340px; }
}
@media (max-width: 700px) {
  .joan-process-row-2 { display: grid; grid-template-columns: minmax(0, 1.332500000000fr) minmax(0, 0.456000000000fr); }
  .joan-process-row-2 .joan-step-09 { grid-column: 1 / -1; }
  .joan-process-row-3 { display: grid; grid-template-columns: minmax(0, 0.805970149254fr) minmax(0, 0.755905511811fr); }
  .joan-process-row-3 .joan-step-10 { grid-column: 1 / -1; }
}
@media (max-width: 540px) {
  .joan-process-row-1 { display: grid; grid-template-columns: minmax(0, 1fr); }
}