@media (min-width: 1101px) {
  .fpc-system-grid { grid-template-columns: 1fr 1fr; }
  .fpc-components {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 28px;
    min-height: 0 !important;
  }
  .fpc-components > small { grid-column: 1 / -1; margin-bottom: 6px; }
  .fpc-components > div { margin-top: 0; align-self: start; }
}

@media (min-width: 651px) {
  .fpc-hero-copy i { font-size: clamp(23px, 1.2vw, 30px); }
  .fpc-browser-bar { height: 46px; }
  .fpc-browser-bar span { font-size: clamp(18px, .95vw, 23px); }
  .fpc-overview-grid b { font-size: clamp(27px, 1.35vw, 35px); }
  .fpc-overview-grid strong { font-size: clamp(60px, 3.2vw, 78px); }
  .fpc-overview-grid p { font-size: clamp(26px, 1.35vw, 34px); line-height: 1.7; }
  .fpc-flow span { font-size: clamp(28px, 1.45vw, 36px); }
  .fpc-system-grid small { font-size: clamp(24px, 1.25vw, 31px); }
  .fpc-colors b { font-size: clamp(22px, 1.08vw, 28px); }
  .fpc-colors span,
  .fpc-type span { font-size: clamp(23px, 1.15vw, 30px); }
  .fpc-type b { font-size: clamp(32px, 1.6vw, 40px); }
  .fpc-type > div { grid-template-columns: 180px minmax(0, 1fr); }
  .fpc-filter-demo label,
  .fpc-filter-demo span,
  .fpc-filter-demo button { font-size: clamp(21px, 1.05vw, 27px); }
  .fpc-state-demo i { font-size: clamp(20px, 1vw, 25px); }
  .fpc-table-demo > * { font-size: clamp(18px, .9vw, 23px); }
  .fpc-feature-stage aside > span { font-size: clamp(23px, 1.15vw, 29px); }
  .fpc-feature-stage p { font-size: clamp(29px, 1.55vw, 40px); line-height: 1.72; }
  .fpc-feature-stage li { font-size: clamp(28px, 1.45vw, 36px); }
  .fpc-feature-stage li b,
  .fpc-spatial-main article b,
  .fpc-inspection-notes b { font-size: clamp(22px, 1.1vw, 28px); }
  .fpc-spatial-main h3,
  .fpc-inspection-notes h3 { font-size: clamp(36px, 2vw, 50px); }
  .fpc-spatial-main p,
  .fpc-inspection-notes p { font-size: clamp(27px, 1.4vw, 36px); line-height: 1.7; }
  .fpc-matrix-item figcaption b { font-size: clamp(23px, 1.12vw, 29px); }
  .fpc-matrix-item figcaption span { font-size: clamp(28px, 1.45vw, 37px); }
  .fpc-matrix-item figcaption small { font-size: clamp(21px, 1.05vw, 27px); }
  .fpc-ai article b { font-size: clamp(23px, 1.12vw, 29px); }
  .fpc-ai h3 { font-size: clamp(37px, 2vw, 50px); }
  .fpc-ai p,
  .fpc-summary p { font-size: clamp(27px, 1.4vw, 36px); line-height: 1.72; }
  .fpc-summary article b { font-size: clamp(42px, 2.3vw, 58px); }
}

.fpc-page-display { overflow: hidden; }
.fpc-page-wall {
  position: relative;
  height: 1380px;
  overflow: hidden;
  border-top: 1px solid rgba(32, 222, 244, .24);
  border-bottom: 1px solid rgba(32, 222, 244, .16);
  background:
    linear-gradient(rgba(32, 222, 244, .025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(32, 222, 244, .025) 1px, transparent 1px),
    radial-gradient(circle at 50% 45%, rgba(52, 120, 255, .13), transparent 48%),
    #080d13;
  background-size: 72px 72px, 72px 72px, auto, auto;
}
.fpc-page-wall::before {
  content: "PAGE DISPLAY / FIRE SAFETY PC SYSTEM";
  position: absolute;
  z-index: 8;
  top: 34px;
  left: 38px;
  color: rgba(32, 222, 244, .62);
  font: clamp(17px, .95vw, 23px) ui-monospace, monospace;
  letter-spacing: .12em;
}
.fpc-page-wall::after {
  content: "";
  position: absolute;
  z-index: 7;
  inset: 0;
  pointer-events: none;
  box-shadow: inset 0 0 110px rgba(2, 6, 10, .82);
}
.fpc-page-wall-canvas {
  position: absolute;
  inset: -70px -9% -100px;
  transform: rotate(-7deg) skewX(-1deg);
  transform-origin: 50% 48%;
}
.fpc-page-wall figure {
  position: absolute;
  z-index: 2;
  overflow: hidden;
  width: 32%;
  aspect-ratio: 16 / 10;
  margin: 0;
  border: 1px solid rgba(192, 220, 230, .3);
  border-radius: 8px;
  background: #eaf2fc;
  box-shadow: 0 36px 80px rgba(0, 0, 0, .56), 0 0 28px rgba(32, 222, 244, .06);
  transition: z-index 0s, transform .4s ease, box-shadow .4s ease;
}
.fpc-page-wall figure:hover {
  z-index: 9;
  transform: translateY(-10px) scale(1.025);
  box-shadow: 0 44px 96px rgba(0, 0, 0, .66), 0 0 34px rgba(32, 222, 244, .14);
}
.fpc-page-wall figure img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: top; }
.fpc-page-wall figcaption { display: none; }
.fpc-page-wall figure:nth-child(1) { z-index: 5; top: 25%; left: 29%; width: 45%; box-shadow: 0 48px 110px rgba(0,0,0,.72), 0 0 45px rgba(52,120,255,.16); }
.fpc-page-wall figure:nth-child(2) { top: -3%; left: 30%; width: 40%; }
.fpc-page-wall figure:nth-child(3) { top: 10%; left: -6%; width: 33%; }
.fpc-page-wall figure:nth-child(4) { top: 35%; left: -2%; width: 30%; }
.fpc-page-wall figure:nth-child(5) { top: 62%; left: -7%; width: 34%; }
.fpc-page-wall figure:nth-child(6) { top: 1%; right: -4%; width: 35%; }
.fpc-page-wall figure:nth-child(7) { top: 28%; right: -5%; width: 34%; }
.fpc-page-wall figure:nth-child(8) { top: 57%; right: -6%; width: 36%; }
.fpc-page-wall figure:nth-child(9) { top: 67%; left: 29%; width: 44%; }
.fpc-page-wall figure:nth-child(10) { z-index: 3; top: 48%; left: 8%; width: 28%; }
.fpc-page-wall figure:nth-child(11) { z-index: 3; top: 49%; right: 9%; width: 28%; }
.fpc-page-wall figure:nth-child(12) { top: 88%; left: 31%; width: 40%; }

@media (max-width: 1100px) {
  .fpc-page-wall { height: 1100px; }
}

@media (max-width: 650px) {
  .fpc-page-wall { height: auto; padding: 80px 18px 30px; overflow: visible; }
  .fpc-page-wall-canvas { position: static; display: grid; grid-template-columns: 1fr; gap: 28px; transform: none; }
  .fpc-page-wall figure,
  .fpc-page-wall figure:nth-child(n) { position: static; width: 100%; transform: none; }
  .fpc-page-wall figcaption { display: flex; gap: 12px; padding: 14px 0; color: #dceff3; }
  .fpc-page-wall figcaption b { color: #20def4; }
}

@media (min-width: 651px) {
  .fpc-page-display { overflow: visible; }
  .fpc-page-wall {
    height: auto;
    overflow: visible;
    padding: 130px 54px 150px;
  }
  .fpc-page-wall-canvas {
    position: static;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 94px 54px;
    transform: none;
  }
  .fpc-page-wall figure,
  .fpc-page-wall figure:nth-child(n) {
    position: relative;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    z-index: 2;
    width: 100%;
    aspect-ratio: 16 / 10;
    transform: rotate(-3deg) skewX(-.5deg);
  }
  .fpc-page-wall figure:hover {
    z-index: 5;
    transform: rotate(-3deg) skewX(-.5deg) translateY(-8px) scale(1.018);
  }
  .fpc-page-wall figure.is-core {
    z-index: 4;
    border-color: rgba(32, 222, 244, .78);
    box-shadow: 0 42px 90px rgba(0, 0, 0, .68), 0 0 38px rgba(32, 222, 244, .2);
    transform: rotate(-3deg) skewX(-.5deg) scale(1.035);
  }
  .fpc-page-wall figcaption {
    position: absolute;
    top: calc(100% + 18px);
    left: 0;
    display: flex;
    align-items: baseline;
    gap: 14px;
    color: rgba(225, 239, 243, .82);
    transform: skewX(.5deg);
  }
  .fpc-page-wall figcaption b { color: #20def4; font: 19px ui-monospace, monospace; }
  .fpc-page-wall figcaption span { font-size: 23px; }
}

/* Fire PC: match Black Ant PC detail readability and fixed return bar. */
.fpc-study {
  --detail-nav-height: clamp(128px, 11.7vw, 240px);
  padding-top: var(--detail-nav-height) !important;
}
.fpc-study::before {
  content: "";
  position: fixed;
  z-index: 101;
  top: calc(var(--detail-nav-height) - 24px);
  right: 6.5vw;
  left: 6.5vw;
  height: 1px;
  pointer-events: none;
  background: rgba(238, 244, 248, .86);
}
.fpc-study::after {
  content: "";
  position: fixed;
  z-index: 99;
  inset: 0 0 auto;
  height: var(--detail-nav-height);
  pointer-events: none;
  background: rgba(7, 11, 17, .86);
  box-shadow: 0 8px 24px rgba(2, 6, 10, .22);
  backdrop-filter: blur(12px);
}
.fpc-study > .big-screen-back {
  position: fixed !important;
  z-index: 102 !important;
  top: 0 !important;
  left: 6.5vw !important;
  width: auto !important;
  height: calc(var(--detail-nav-height) - 24px) !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 20px !important;
  gap: 18px !important;
  border: 0 !important;
  color: rgba(244, 247, 250, .9) !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  font-size: clamp(32px, 2.16vw, 46px) !important;
  font-weight: 500 !important;
  letter-spacing: .1em !important;
}
.fpc-study > .big-screen-back span {
  color: inherit !important;
  font-size: 1.05em !important;
}
.fpc-study > .big-screen-back:hover {
  color: #2ce7f5 !important;
  text-shadow: 0 0 14px rgba(44, 231, 245, .45);
  box-shadow: none !important;
}

.fpc-study .fpc-hero-copy > span,
.fpc-study .fpc-section > header > span,
.fpc-study .fpc-system-grid small,
.fpc-study .fpc-feature-stage aside > span,
.fpc-study .fpc-ai article b,
.fpc-study .fpc-matrix-item figcaption b,
.fpc-study .fpc-browser-bar span {
  font-size: clamp(18px, .92vw, 30px) !important;
  font-weight: 450 !important;
  line-height: 1.6 !important;
}
.fpc-study .fpc-hero-copy h1 {
  font-size: clamp(58px, 5vw, 92px) !important;
  font-weight: 500 !important;
  line-height: 1.12 !important;
}
.fpc-study .fpc-section > header h2 {
  font-size: clamp(42px, 3.4vw, 64px) !important;
  font-weight: 500 !important;
  line-height: 1.22 !important;
}
.fpc-study .fpc-feature-stage h3 {
  font-size: clamp(42px, 3vw, 64px) !important;
  font-weight: 500 !important;
}
.fpc-study .fpc-spatial-main h3,
.fpc-study .fpc-inspection-notes h3,
.fpc-study .fpc-ai h3 {
  font-size: clamp(30px, 1.55vw, 50px) !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
}
.fpc-study .fpc-hero-copy p {
  font-size: clamp(26px, 1.65vw, 34px) !important;
  font-weight: 350 !important;
  line-height: 1.75 !important;
  color: rgba(220, 235, 240, .82) !important;
}
.fpc-study .fpc-section > header p,
.fpc-study .fpc-feature-stage p,
.fpc-study .fpc-spatial-main p,
.fpc-study .fpc-inspection-notes p,
.fpc-study .fpc-ai p,
.fpc-study .fpc-summary p {
  font-size: clamp(22px, 1.14vw, 38px) !important;
  font-weight: 400 !important;
  line-height: 1.78 !important;
  color: rgba(211, 229, 236, .72) !important;
}
.fpc-study .fpc-hero-copy i,
.fpc-study .fpc-overview-grid b,
.fpc-study .fpc-overview-grid p,
.fpc-study .fpc-flow span,
.fpc-study .fpc-colors b,
.fpc-study .fpc-colors span,
.fpc-study .fpc-type span,
.fpc-study .fpc-filter-demo label,
.fpc-study .fpc-filter-demo span,
.fpc-study .fpc-filter-demo button,
.fpc-study .fpc-state-demo i,
.fpc-study .fpc-table-demo > *,
.fpc-study .fpc-feature-stage li,
.fpc-study .fpc-spatial-main article b,
.fpc-study .fpc-inspection-notes b,
.fpc-study .fpc-matrix-item figcaption span,
.fpc-study .fpc-matrix-item figcaption small {
  font-size: clamp(18px, .92vw, 30px) !important;
  font-weight: 400 !important;
  line-height: 1.65 !important;
}
.fpc-study .fpc-overview-grid strong {
  font-size: clamp(48px, 3vw, 66px) !important;
  font-weight: 450 !important;
}
.fpc-study .fpc-summary article b {
  font-size: clamp(34px, 2vw, 52px) !important;
  font-weight: 450 !important;
}
.fpc-study .fpc-type b {
  font-size: clamp(26px, 1.34vw, 44px) !important;
  font-weight: 450 !important;
}

@media (max-width: 900px) {
  .fpc-study {
    --detail-nav-height: 96px;
    padding-top: var(--detail-nav-height) !important;
  }
  .fpc-study::before {
    top: 72px;
    right: 14px;
    left: 14px;
  }
  .fpc-study::after {
    height: var(--detail-nav-height);
  }
  .fpc-study > .big-screen-back {
    left: 14px !important;
    height: 72px !important;
    padding: 0 12px !important;
    font-size: 19px !important;
  }
}

/* Fire PC page display: keep screenshots crisp and readable. */
@media (min-width: 651px) {
  .fpc-study .fpc-page-wall {
    padding: 110px 46px 140px !important;
    background:
      linear-gradient(rgba(32, 222, 244, .025) 1px, transparent 1px),
      linear-gradient(90deg, rgba(32, 222, 244, .025) 1px, transparent 1px),
      radial-gradient(circle at 50% 45%, rgba(52, 120, 255, .1), transparent 48%),
      #080d13 !important;
  }
  .fpc-study .fpc-page-wall-canvas {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 104px 60px !important;
    transform: none !important;
  }
  .fpc-study .fpc-page-wall figure,
  .fpc-study .fpc-page-wall figure:nth-child(n),
  .fpc-study .fpc-page-wall figure.is-core {
    width: 100% !important;
    transform: none !important;
    border-radius: 4px !important;
    border-color: rgba(32, 222, 244, .42) !important;
    background: #eef5fb !important;
    box-shadow: 0 28px 70px rgba(0, 0, 0, .48), 0 0 24px rgba(32, 222, 244, .08) !important;
  }
  .fpc-study .fpc-page-wall figure:hover {
    transform: translateY(-8px) scale(1.01) !important;
  }
  .fpc-study .fpc-page-wall figure img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: top center !important;
    image-rendering: auto;
  }
  .fpc-study .fpc-page-wall figcaption {
    transform: none !important;
  }
  .fpc-study .fpc-page-wall figcaption b {
    font-size: clamp(22px, 1.08vw, 30px) !important;
  }
  .fpc-study .fpc-page-wall figcaption span {
    font-size: clamp(26px, 1.35vw, 36px) !important;
    font-weight: 400 !important;
  }
}

/* Match the actual desktop type scale used by project 01. */
@media (min-width: 901px) {
  .fpc-study .fpc-hero { grid-template-columns: .9fr 1.1fr !important; gap: 3vw !important; }
  .fpc-study .fpc-hero-copy > span,
  .fpc-study .fpc-section > header > span,
  .fpc-study .fpc-system-grid small,
  .fpc-study .fpc-feature-stage aside > span,
  .fpc-study .fpc-ai article b,
  .fpc-study .fpc-browser-bar span { font-size: 18px !important; line-height: 1.6 !important; }
  .fpc-study .fpc-hero-copy h1 { font-size: 61.44px !important; line-height: 1.15 !important; }
  .fpc-study .fpc-hero-copy > p,
  .fpc-study .fpc-section > header > p { font-size: 56px !important; font-weight: 350 !important; line-height: 1.65 !important; }
  .fpc-study .fpc-hero-copy i { font-size: 34px !important; line-height: 1.35 !important; }
  .fpc-study .fpc-section > header h2 { font-size: 43.52px !important; line-height: 1.22 !important; }
  .fpc-study .fpc-overview-grid b { font-size: 30px !important; }
  .fpc-study .fpc-overview-grid strong { font-size: 48px !important; }
  .fpc-study .fpc-overview-grid p { font-size: 36px !important; line-height: 1.65 !important; }
  .fpc-study .fpc-flow span { font-size: 25px !important; line-height: 1.55 !important; }
  .fpc-study .fpc-colors b,
  .fpc-study .fpc-colors span { font-size: 30px !important; line-height: 1.5 !important; }
  .fpc-study .fpc-type b { font-size: 40px !important; }
  .fpc-study .fpc-type span { font-size: 34px !important; line-height: 1.5 !important; }
  .fpc-study .fpc-filter-demo label,
  .fpc-study .fpc-filter-demo span,
  .fpc-study .fpc-filter-demo button,
  .fpc-study .fpc-state-demo i { font-size: 24px !important; line-height: 1.5 !important; }
  .fpc-study .fpc-table-demo > * { font-size: 22px !important; line-height: 1.5 !important; }
  .fpc-study .fpc-feature-stage h3,
  .fpc-study .fpc-spatial-main h3,
  .fpc-study .fpc-inspection-notes h3,
  .fpc-study .fpc-ai h3 { font-size: 42px !important; line-height: 1.35 !important; }
  .fpc-study .fpc-feature-stage p,
  .fpc-study .fpc-spatial-main p,
  .fpc-study .fpc-inspection-notes p,
  .fpc-study .fpc-ai p { font-size: 36px !important; font-weight: 350 !important; line-height: 1.65 !important; }
  .fpc-study .fpc-feature-stage li { font-size: 40px !important; line-height: 1.55 !important; }
  .fpc-study .fpc-feature-stage li b,
  .fpc-study .fpc-spatial-main article b,
  .fpc-study .fpc-inspection-notes b { font-size: 25px !important; }
  .fpc-study .fpc-page-wall figcaption b { font-size: 20px !important; }
  .fpc-study .fpc-page-wall figcaption span { font-size: 56px !important; font-weight: 450 !important; line-height: 1.5 !important; }
  .fpc-study .fpc-summary article b { font-size: 34px !important; }
  .fpc-study .fpc-summary article p { font-size: 24px !important; font-weight: 350 !important; line-height: 1.75 !important; }
  .fpc-study .fpc-ai article,
  .fpc-study .fpc-summary article { min-height: 520px !important; }
}

/* Final: large editorial boards, readable and less rigid than a plain list. */
@media (min-width: 651px) {
  .fpc-study .fpc-page-wall {
    width: 100% !important;
    height: auto !important;
    overflow: visible !important;
    padding: 120px 4.2vw 170px !important;
    border-top: 1px solid rgba(32, 222, 244, .24) !important;
    border-bottom: 1px solid rgba(32, 222, 244, .16) !important;
    background:
      radial-gradient(circle at 22% 10%, rgba(32, 222, 244, .08), transparent 32%),
      radial-gradient(circle at 78% 48%, rgba(52, 120, 255, .08), transparent 34%),
      linear-gradient(180deg, rgba(6, 16, 22, .98), rgba(4, 9, 14, .98)) !important;
  }
  .fpc-study .fpc-page-wall-canvas {
    position: static !important;
    inset: auto !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 130px !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    transform: none !important;
  }
  .fpc-study .fpc-page-wall figure,
  .fpc-study .fpc-page-wall figure:nth-child(n),
  .fpc-study .fpc-page-wall figure.is-core {
    position: relative !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    z-index: 2 !important;
    width: min(86vw, 1680px) !important;
    max-width: none !important;
    aspect-ratio: 16 / 9 !important;
    margin: 0 !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
  }
  .fpc-study .fpc-page-wall figure:nth-child(odd) {
    align-self: flex-start !important;
  }
  .fpc-study .fpc-page-wall figure:nth-child(even) {
    align-self: flex-end !important;
  }
  .fpc-study .fpc-page-wall figure.is-core,
  .fpc-study .fpc-page-wall figure:nth-child(5) {
    width: min(92vw, 1840px) !important;
  }
  .fpc-study .fpc-page-wall figure::before {
    content: "";
    position: absolute;
    inset: -18px;
    border: 1px solid rgba(32, 222, 244, .34);
    pointer-events: none;
    box-shadow: 0 0 38px rgba(32, 222, 244, .08);
  }
  .fpc-study .fpc-page-wall figure::after {
    content: "";
    position: absolute;
    top: -18px;
    left: -18px;
    width: 88px;
    height: 2px;
    background: #20def4;
    box-shadow: 0 0 16px rgba(32, 222, 244, .45);
  }
  .fpc-study .fpc-page-wall figure:hover {
    transform: translateY(-10px) !important;
  }
  .fpc-study .fpc-page-wall figure img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: top center !important;
    border: 1px solid rgba(192, 232, 238, .44) !important;
    background: #f2f7fb !important;
    box-shadow: 0 36px 88px rgba(0, 0, 0, .5), 0 0 28px rgba(32, 222, 244, .09) !important;
    transform: none !important;
    filter: none !important;
  }
  .fpc-study .fpc-page-wall figcaption {
    position: absolute !important;
    top: calc(100% + 24px) !important;
    left: 0 !important;
    display: flex !important;
    align-items: baseline !important;
    gap: 18px !important;
    padding: 0 !important;
    color: rgba(225, 239, 243, .86) !important;
    transform: none !important;
  }
  .fpc-study .fpc-page-wall figcaption b {
    color: #20def4 !important;
    font: 26px ui-monospace, monospace !important;
    font-weight: 400 !important;
  }
  .fpc-study .fpc-page-wall figcaption span {
    font-size: 32px !important;
    font-weight: 400 !important;
  }
}

@media (min-width: 901px) {
  .fpc-study .fpc-page-wall figcaption b { font-size: 20px !important; }
  .fpc-study .fpc-page-wall figcaption span { font-size: 56px !important; font-weight: 450 !important; line-height: 1.5 !important; }
}

/* Repair page display: stable large showcase, no disappearing or over-cropping. */
@media (min-width: 651px) {
  .fpc-study .fpc-page-display {
    overflow: visible !important;
  }
  .fpc-study .fpc-page-wall {
    position: relative !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
    padding: 110px 56px 150px !important;
    border-top: 1px solid rgba(32, 222, 244, .24) !important;
    border-bottom: 1px solid rgba(32, 222, 244, .16) !important;
    background:
      linear-gradient(rgba(32, 222, 244, .025) 1px, transparent 1px),
      linear-gradient(90deg, rgba(32, 222, 244, .025) 1px, transparent 1px),
      radial-gradient(circle at 50% 12%, rgba(32, 222, 244, .08), transparent 36%),
      #071017 !important;
    background-size: 56px 56px, 56px 56px, auto, auto !important;
  }
  .fpc-study .fpc-page-wall-canvas {
    position: static !important;
    inset: auto !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 92px 56px !important;
    width: 100% !important;
    max-width: 1760px !important;
    margin: 0 auto !important;
    transform: none !important;
  }
  .fpc-study .fpc-page-wall figure,
  .fpc-study .fpc-page-wall figure:nth-child(n),
  .fpc-study .fpc-page-wall figure.is-core {
    position: relative !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    z-index: 1 !important;
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    aspect-ratio: auto !important;
    margin: 0 !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
    align-self: auto !important;
  }
  .fpc-study .fpc-page-wall figure:first-child,
  .fpc-study .fpc-page-wall figure.is-core {
    grid-column: 1 / -1 !important;
    width: min(100%, 1600px) !important;
    justify-self: center !important;
  }
  .fpc-study .fpc-page-wall figure::before {
    content: "" !important;
    position: absolute !important;
    inset: -14px !important;
    border: 1px solid rgba(32, 222, 244, .35) !important;
    pointer-events: none !important;
    box-shadow: 0 0 28px rgba(32, 222, 244, .08) !important;
  }
  .fpc-study .fpc-page-wall figure::after {
    content: "" !important;
    position: absolute !important;
    top: -14px !important;
    left: -14px !important;
    width: 72px !important;
    height: 2px !important;
    background: #20def4 !important;
    box-shadow: 0 0 14px rgba(32, 222, 244, .48) !important;
  }
  .fpc-study .fpc-page-wall figure:hover {
    transform: translateY(-8px) !important;
  }
  .fpc-study .fpc-page-wall figure img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    object-fit: contain !important;
    object-position: top center !important;
    border: 1px solid rgba(32, 222, 244, .44) !important;
    background: #f3f7fb !important;
    box-shadow: 0 30px 70px rgba(0, 0, 0, .42), 0 0 24px rgba(32, 222, 244, .08) !important;
    transform: none !important;
    filter: none !important;
  }
  .fpc-study .fpc-page-wall figcaption {
    position: static !important;
    display: flex !important;
    align-items: baseline !important;
    gap: 16px !important;
    padding: 22px 2px 0 !important;
    color: rgba(225, 239, 243, .86) !important;
    transform: none !important;
  }
  .fpc-study .fpc-page-wall figcaption b {
    color: #20def4 !important;
    font: 24px ui-monospace, monospace !important;
    font-weight: 400 !important;
  }
  .fpc-study .fpc-page-wall figcaption span {
    font-size: 30px !important;
    font-weight: 400 !important;
    line-height: 1.4 !important;
  }
}

/* Enlarge the two-up perspective wall for better readability. */
@media (min-width: 651px) {
  .fpc-study .fpc-page-wall {
    padding-left: 18px !important;
    padding-right: 18px !important;
  }
  .fpc-study .fpc-page-wall-canvas {
    max-width: 1960px !important;
    gap: 118px 34px !important;
  }
  .fpc-study .fpc-page-wall figure:first-child,
  .fpc-study .fpc-page-wall figure.is-core {
    width: min(100%, 1780px) !important;
  }
  .fpc-study .fpc-page-wall figure,
  .fpc-study .fpc-page-wall figure:nth-child(n) {
    transform-origin: center center !important;
  }
  .fpc-study .fpc-page-wall figure:nth-child(odd) {
    transform: perspective(1600px) rotateY(3deg) rotateZ(-.8deg) scale(1.08) !important;
  }
  .fpc-study .fpc-page-wall figure:nth-child(even) {
    transform: perspective(1600px) rotateY(-3deg) rotateZ(.8deg) translateY(42px) scale(1.08) !important;
  }
  .fpc-study .fpc-page-wall figure:hover {
    transform: perspective(1600px) rotateY(0deg) rotateZ(0deg) translateY(-10px) scale(1.1) !important;
  }
}

/* Make the perspective board use the full viewport width, not the narrow content column. */
@media (min-width: 901px) {
  .fpc-study .fpc-page-wall {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  .fpc-study .fpc-page-wall-canvas {
    width: calc(100vw - 112px) !important;
    max-width: none !important;
    margin-left: 50% !important;
    margin-right: 0 !important;
    gap: 126px 42px !important;
    transform: translateX(-50%) !important;
  }
  .fpc-study .fpc-page-wall figure:first-child,
  .fpc-study .fpc-page-wall figure.is-core {
    width: 82vw !important;
  }
  .fpc-study .fpc-page-wall figure:nth-child(odd) {
    transform: perspective(1600px) rotateY(2.5deg) rotateZ(-.7deg) scale(1.02) !important;
  }
  .fpc-study .fpc-page-wall figure:nth-child(even) {
    transform: perspective(1600px) rotateY(-2.5deg) rotateZ(.7deg) translateY(48px) scale(1.02) !important;
  }
  .fpc-study .fpc-page-wall figure:hover {
    transform: perspective(1600px) rotateY(0deg) rotateZ(0deg) translateY(-10px) scale(1.04) !important;
  }
}

/* Final page display direction: two-up perspective wall. */
@media (min-width: 651px) {
  .fpc-study .fpc-page-display {
    overflow: visible !important;
  }
  .fpc-study .fpc-page-wall {
    position: relative !important;
    height: auto !important;
    overflow: visible !important;
    padding: 120px 54px 170px !important;
    background:
      linear-gradient(rgba(32, 222, 244, .025) 1px, transparent 1px),
      linear-gradient(90deg, rgba(32, 222, 244, .025) 1px, transparent 1px),
      radial-gradient(circle at 52% 28%, rgba(32, 222, 244, .09), transparent 44%),
      #071017 !important;
    background-size: 58px 58px, 58px 58px, auto, auto !important;
    perspective: 1800px !important;
  }
  .fpc-study .fpc-page-wall-canvas {
    position: static !important;
    inset: auto !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 108px 64px !important;
    width: 100% !important;
    max-width: 1780px !important;
    margin: 0 auto !important;
    transform: none !important;
  }
  .fpc-study .fpc-page-wall figure,
  .fpc-study .fpc-page-wall figure:nth-child(n),
  .fpc-study .fpc-page-wall figure.is-core {
    position: relative !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    display: block !important;
    width: 100% !important;
    aspect-ratio: auto !important;
    margin: 0 !important;
    overflow: visible !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    transform-style: preserve-3d !important;
  }
  .fpc-study .fpc-page-wall figure:nth-child(odd) {
    transform: perspective(1600px) rotateY(4deg) rotateZ(-1.2deg) !important;
  }
  .fpc-study .fpc-page-wall figure:nth-child(even) {
    transform: perspective(1600px) rotateY(-4deg) rotateZ(1.2deg) translateY(42px) !important;
  }
  .fpc-study .fpc-page-wall figure.is-core {
    transform: perspective(1600px) rotateY(3deg) rotateZ(-1deg) !important;
  }
  .fpc-study .fpc-page-wall figure::before {
    content: "" !important;
    position: absolute !important;
    inset: -12px !important;
    border: 1px solid rgba(32, 222, 244, .34) !important;
    pointer-events: none !important;
    box-shadow: 0 0 28px rgba(32, 222, 244, .08) !important;
  }
  .fpc-study .fpc-page-wall figure::after {
    content: "" !important;
    position: absolute !important;
    top: -12px !important;
    left: -12px !important;
    width: 70px !important;
    height: 2px !important;
    background: #20def4 !important;
    box-shadow: 0 0 14px rgba(32, 222, 244, .48) !important;
  }
  .fpc-study .fpc-page-wall figure:hover {
    z-index: 8 !important;
    transform: perspective(1600px) rotateY(0deg) rotateZ(0deg) translateY(-10px) scale(1.02) !important;
  }
  .fpc-study .fpc-page-wall figure img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
    object-position: top center !important;
    border: 1px solid rgba(32, 222, 244, .42) !important;
    background: #f3f7fb !important;
    box-shadow: 0 34px 80px rgba(0, 0, 0, .48), 0 0 28px rgba(32, 222, 244, .08) !important;
    filter: none !important;
  }
  .fpc-study .fpc-page-wall figcaption {
    position: static !important;
    display: flex !important;
    align-items: baseline !important;
    gap: 16px !important;
    padding: 22px 2px 0 !important;
    color: rgba(225, 239, 243, .86) !important;
    transform: none !important;
  }
  .fpc-study .fpc-page-wall figcaption b {
    color: #20def4 !important;
    font: 24px ui-monospace, monospace !important;
    font-weight: 400 !important;
  }
  .fpc-study .fpc-page-wall figcaption span {
    font-size: 30px !important;
    font-weight: 400 !important;
    line-height: 1.4 !important;
  }
}