/* Blend section colours in the surrounding space; content stays sharp. */
.portfolio-home {
  --flow-depth: clamp(96px, 10vw, 152px);
  --flow-mid: #a8b1a2;
  --flow-deep: #505a4b;
}
.portfolio-home .hero-bottomline,
.portfolio-home .work-section,
.portfolio-home .studio-section {
  border-block: 0;
}
.portfolio-home .work-gallery {
  padding-top: calc(var(--flow-depth) + 2rem);
  padding-bottom: calc(var(--flow-depth) + 1.5rem);
  background:
    linear-gradient(to bottom, var(--paper) 0%, #e8ece3 18%, var(--flow-mid) 47%, var(--flow-deep) 74%, var(--charcoal) 100%) top / 100% var(--flow-depth) no-repeat,
    linear-gradient(to bottom, var(--charcoal) 0%, var(--flow-deep) 26%, var(--flow-mid) 53%, #e8ece3 82%, var(--paper) 100%) bottom / 100% var(--flow-depth) no-repeat,
    var(--charcoal);
}
/* The gallery canvas retains its solid clear colour within the dark centre. */
.portfolio-home .studio-section {
  background: linear-gradient(to bottom, var(--paper) 0%, var(--paper) 35%, #e9eee4 65%, var(--sage) 100%);
}
.portfolio-home .physics-section {
  padding-bottom: calc(var(--flow-depth) * .65);
  background:
    linear-gradient(to bottom, var(--sage), #e8eee3 55%, var(--paper)) bottom / 100% var(--flow-depth) no-repeat,
    var(--sage);
}
.portfolio-home .physics-stage { border-block: 0; }
.portfolio-home .physics-toolbar { border-top-color: #a9b5a533; }
.portfolio-home .about-section,
.portfolio-home .contact-section { border-block: 0; }
.portfolio-home .contact-section {
  padding-bottom: calc(var(--flow-depth) + 3.5rem);
  background:
    linear-gradient(to bottom, var(--paper) 0%, #e8ece3 18%, var(--flow-mid) 47%, var(--flow-deep) 74%, var(--charcoal) 100%) bottom / 100% var(--flow-depth) no-repeat,
    var(--paper);
}
@media (max-width:699px) {
  .portfolio-home { --flow-depth: 88px; }
  .portfolio-home .work-gallery { padding-top: calc(var(--flow-depth) + 1.75rem); }
  .portfolio-home .studio-section { padding-top: 2rem; }
}
@media (forced-colors:active) {
  .portfolio-home :is(.work-gallery,.studio-section,.physics-section,.contact-section) { background:Canvas; }
}