/* Architectural planes — preview only.
   The same 45-degree return recurs at every section joint.  No crossfade
   between navy and ivory: each plane retains its original material. */

:root { --architectural-joint: 48px; --architectural-axis: 61%; }

.hero {
  padding-bottom: 112px;
}
.hero::after,
.editorial-sequence .magazine::after,
.editorial-sequence .project-magazine::after,
.nrf-background::after {
  content: none !important;
}

.editorial-sequence {
  position: relative;
  isolation: isolate;
}

.editorial-sequence .magazine {
  margin-top: calc(-1 * var(--architectural-joint));
  padding-bottom: 82px;
  min-height: 680px;
  clip-path: polygon(
    0 var(--architectural-joint),
    var(--architectural-axis) var(--architectural-joint),
    calc(var(--architectural-axis) + var(--architectural-joint)) 0,
    100% 0, 100% 100%, 0 100%
  );
}
.editorial-sequence .magazine .inner {
  padding-top: 96px;
  padding-bottom: 22px;
}
.nrf-background {
  background-position: center 46%;
}
.nrf-connected-veil {
  top: 44px;
}

.editorial-sequence .project-magazine {
  position: relative;
  z-index: 1;
  margin-top: calc(-1 * var(--architectural-joint));
  padding-bottom: 56px;
  clip-path: polygon(
    0 0,
    var(--architectural-axis) 0,
    calc(var(--architectural-axis) + var(--architectural-joint)) var(--architectural-joint),
    100% var(--architectural-joint),
    100% 100%, 0 100%
  );
}
.editorial-sequence .project-magazine .project-hero {
  padding-top: 82px;
  padding-bottom: 58px;
  min-height: 410px;
}
.editorial-sequence .project-magazine .project-drawing {
  top: 0;
  opacity: .32;
}
.editorial-sequence .project-magazine .project-body {
  padding-bottom: 72px;
}

.editorial-sequence .qa-magazine {
  position: relative;
  z-index: 2;
  margin-top: calc(-1 * var(--architectural-joint));
  padding-top: 104px;
  padding-bottom: 74px;
  clip-path: polygon(
    0 var(--architectural-joint),
    var(--architectural-axis) var(--architectural-joint),
    calc(var(--architectural-axis) + var(--architectural-joint)) 0,
    100% 0, 100% 100%, 0 100%
  );
}

@media (max-width: 760px) {
  :root { --architectural-joint: 24px; --architectural-axis: 62%; }
  .hero { padding-bottom: 70px; }
  .editorial-sequence .magazine {
    min-height: 0;
    padding-bottom: 44px;
  }
  .editorial-sequence .magazine .inner {
    padding-top: 59px;
    padding-bottom: 15px;
  }
  .nrf-connected-veil { top: 22px; }
  .editorial-sequence .project-magazine { padding-bottom: 24px; }
  .editorial-sequence .project-magazine .project-hero {
    min-height: 0;
    padding-top: 56px;
    padding-bottom: 35px;
  }
  .editorial-sequence .project-magazine .project-body {
    padding-bottom: 46px;
  }
  .editorial-sequence .qa-magazine {
    padding-top: 64px;
    padding-bottom: 44px;
  }
}