/* Product objects share the homepage's perspective and physical paper edges.
   Only illustrations are tilted; forms, navigation and reading columns stay flat. */
.software-story {
  --sw-depth-shadow: 0 36px 58px -24px #1e202970;
  --sw-depth-edge: #d9d9de;
}
.software-story h1 {
  font-size: var(--type-1);
  line-height: var(--lh-1);
  letter-spacing: var(--ls-1);
  font-weight: 500;
  text-wrap: balance;
}
.software-story :is(
  .sw-overview-dossier, .sw-ib-folder, .sw-vpb-bridge,
  .sw-icp-import, .sw-authority-register, .sw-yearwork-sheet,
  .sw-owr-archive, .sw-oss-destinations, .sw-dividend-decision,
  .sw-client-window, .sw-review-finding, .sw-uitstel-board
) {
  position: relative;
  transform-style: preserve-3d;
  transform: perspective(1600px) rotateX(var(--sw-tilt-x, 5deg)) rotateY(var(--sw-tilt-y, -10deg)) rotateZ(var(--sw-tilt-z, 1deg));
  border-radius: var(--radius-medium);
  box-shadow: 1px 2px 0 var(--surface), 4px 6px 0 var(--sw-depth-edge), 8px 12px 0 #bfc0c7, var(--sw-depth-shadow);
}
/* Different objects face into their own composition. */
.sw-ib-folder { --sw-tilt-y: -12deg; --sw-tilt-z: 2deg; }
.sw-vpb-bridge { --sw-tilt-y: -8deg; --sw-tilt-z: -2deg; }
.sw-icp-import { --sw-tilt-x: 8deg; --sw-tilt-y: -9deg; --sw-depth-edge: #41434e; }
.sw-authority-register { --sw-tilt-y: -12deg; --sw-tilt-z: 2deg; }
.sw-yearwork-sheet { --sw-tilt-x: 6deg; --sw-tilt-z: -2deg; }
.sw-owr-archive { --sw-tilt-y: -11deg; --sw-tilt-z: 2deg; }
.sw-oss-destinations { --sw-tilt-x: 7deg; --sw-tilt-y: -8deg; }
.sw-dividend-decision { --sw-tilt-y: -12deg; --sw-tilt-z: -1deg; }
.sw-client-window { --sw-tilt-y: -9deg; --sw-tilt-z: 1deg; }
.sw-review-finding { --sw-tilt-x: 5deg; --sw-tilt-z: -2deg; }
.sw-uitstel-board { --sw-tilt-x: 8deg; --sw-tilt-y: -3deg; --sw-tilt-z: -1deg; }

/* Raised information planes sit in front of their supporting document. */
.software-story :is(
  .sw-ib-shared, .sw-vpb-result, .sw-yearwork-file,
  .sw-oss-quarter, .sw-client-task, .sw-review-owner
) {
  transform: translateZ(26px) translateX(8px);
  border: 1px solid #ffffff55;
  border-radius: var(--radius-small);
  box-shadow: 0 5px 0 -1px var(--accent-hover), 0 16px 24px -12px #1e202980;
}
.sw-icp-import figcaption {
  transform: translateZ(22px) translate(10px, 6px);
  border-radius: 0 0 var(--radius-small) var(--radius-small);
  box-shadow: 0 5px 0 var(--accent-hover), 0 16px 24px -12px #1e202980;
}
.sw-authority-register .sw-authority-entry {
  background: var(--surface);
  color: var(--ink);
  border: 1px solid var(--line);
  border-radius: var(--radius-small);
  padding: 18px;
  margin-top: 14px;
  transform: translateZ(18px);
  box-shadow: 0 5px 0 -2px var(--sw-depth-edge), 0 12px 20px -16px var(--ink);
}
.sw-authority-register .sw-authority-entry small { color: var(--muted); }
.sw-authority-register .sw-authority-entry:nth-of-type(2) strong { color: var(--on-accent); }
.sw-owr-archive .sw-owr-files > div {
  position: relative;
  border-radius: var(--radius-small);
  box-shadow: 0 5px 0 -1px var(--sw-depth-edge), 0 14px 22px -16px var(--ink);
  transform: translateZ(16px);
  margin-bottom: 14px;
}
.sw-owr-archive .sw-owr-files > div:nth-child(2) {
  transform: translateZ(30px) translateX(10px);
  box-shadow: 0 5px 0 -1px var(--accent-hover), 0 14px 22px -16px var(--ink);
}
.sw-oss-branches > div {
  padding: 18px 6px;
  border: 1px solid var(--line);
  border-radius: var(--radius-small);
  box-shadow: 0 5px 0 -2px var(--sw-depth-edge), 0 10px 18px -14px var(--ink);
  transform: translateZ(16px);
}
.sw-oss-branches > div:nth-child(2) { transform: translateZ(30px) translateY(-8px); }

/* Btw: two independent ledgers, separated by the actual difference. */
.software-story .sw-btw-comparison {
  background: transparent;
  padding: 28px 12px 44px;
  color: var(--on-accent);
  gap: 36px;
}
.sw-btw-comparison > div {
  padding: clamp(24px, 3vw, 42px);
  background: var(--surface);
  color: var(--ink);
  border-radius: var(--radius-medium);
  transform: perspective(1300px) rotateY(8deg) rotateX(5deg) rotateZ(-2deg);
  box-shadow: 3px 5px 0 var(--sw-depth-edge), 7px 10px 0 #bfc0c7, var(--sw-depth-shadow);
}
.sw-btw-comparison > div:last-of-type {
  transform: perspective(1300px) rotateY(-8deg) rotateX(5deg) rotateZ(2deg);
}
.sw-btw-comparison .sw-btw-versus,
.software-story .sw-btw-comparison figcaption { color: var(--on-accent); }
.sw-btw-comparison figcaption { padding-top: 18px; }
.sw-btw-quarters { border-bottom: 1px solid var(--line-on-dark); }
.sw-btw-quarters > strong { border-radius: var(--radius-small) var(--radius-small) 0 0; }

/* Suppletie: the old and new version are separate sheets on the same desk. */
.software-story .sw-suppletie-versions { gap: 28px; padding-block: 16px; }
.software-story .sw-suppletie-versions > div {
  border-radius: var(--radius-medium);
  transform: perspective(1400px) rotateY(8deg) rotateX(4deg) rotateZ(-2deg);
  box-shadow: 3px 5px 0 var(--sw-depth-edge), 7px 10px 0 #bfc0c7, var(--sw-depth-shadow);
}
.software-story .sw-suppletie-versions > div:last-of-type {
  transform: perspective(1400px) rotateY(-8deg) rotateX(4deg) rotateZ(2deg);
}
.sw-suppletie-versions figcaption { padding-top: 20px; }

/* Uitstel: tangible tickets above the planning board. */
.sw-uitstel-board { padding: 12px; color: var(--ink); }
.sw-uitstel-board > div { border-radius: var(--radius-small); }
.sw-uitstel-board section { background: transparent; }
.sw-uitstel-board article {
  border-radius: var(--radius-small);
  transform: translateZ(22px) rotateZ(-1deg);
  box-shadow: 0 6px 0 -2px var(--sw-depth-edge), 0 16px 26px -16px var(--ink);
}
.sw-uitstel-board section:nth-child(2) article {
  transform: translateZ(38px) rotateZ(2deg);
  box-shadow: 0 6px 0 -2px var(--accent-hover), 0 16px 26px -16px var(--ink);
}

/* Deponeren: the selected publication sits ahead of source and response. */
.sw-deposit-route { padding: 22px 8px; }
.sw-deposit-route > div {
  border-radius: var(--radius-medium);
  background: var(--surface);
  transform: perspective(1100px) rotateX(6deg) rotateY(-8deg);
  box-shadow: 3px 5px 0 var(--sw-depth-edge), 7px 10px 0 #bfc0c7, 0 28px 45px -24px #1e202980;
}
.sw-deposit-route > div:nth-of-type(2) {
  background: var(--accent);
  transform: perspective(1100px) rotateX(6deg) rotateY(-8deg) translateY(-16px);
  box-shadow: 3px 5px 0 var(--accent-hover), 7px 10px 0 var(--accent-ink), 0 28px 45px -24px #1e202980;
}

/* The secondary illustrations carry the same depth throughout the page. */
.software-story :is(
  .sw-overview-source, .sw-vpb-evidence > div, .sw-btw-delta,
  .sw-uitstel-envelope, .sw-authority-chain > article, .sw-client-dossier,
  .sw-review-source, .sw-dividend-documents > div, .sw-oss-export
) {
  border-radius: var(--radius-medium);
  transform: perspective(1400px) rotateX(3deg) rotateY(-5deg);
  box-shadow: 2px 4px 0 var(--sw-depth-edge), 0 22px 38px -24px #1e202970;
}
.software-story :is(
  .sw-overview-flow > li, .sw-vpb-files > li, .sw-suppletie-trail > li,
  .sw-yearwork-trace > article, .sw-oss-sort > div, .sw-dividend-records > article,
  .sw-ib-subjects > article, .sw-client-reply, .sw-client-version,
  .sw-review-comments, .sw-icp-columns > span
) {
  border-radius: var(--radius-small);
  box-shadow: 0 6px 0 -2px #1e202914, 0 18px 30px -22px #1e202960;
}
.sw-overview-flow > li,
.sw-suppletie-trail > li {
  padding: 28px;
  border: 1px solid var(--line);
  background: var(--surface);
  color: var(--ink);
}
.software-story .sw-overview-flow p { color: var(--muted); }
.sw-overview-flow .sw-link { color: var(--ink); }
.sw-overview-flow > li > span { color: var(--accent-ink); }
.sw-vpb-files > li,
.sw-yearwork-trace > article { border-top: 3px solid var(--accent); }
.sw-client-reply { transform: perspective(1400px) rotateY(4deg); }
.sw-client-version { box-shadow: 4px 6px 0 var(--accent-hover), 0 24px 40px -25px #0009; }

/* Objects are static. Small screens retain the material edges without skewed text. */
@media (max-width: 850px), (prefers-reduced-motion: reduce) {
  .software-story :is(
    .sw-overview-dossier, .sw-ib-folder, .sw-vpb-bridge, .sw-icp-import,
    .sw-authority-register, .sw-yearwork-sheet, .sw-owr-archive,
    .sw-oss-destinations, .sw-dividend-decision, .sw-client-window,
    .sw-review-finding, .sw-uitstel-board, .sw-overview-source,
    .sw-vpb-evidence > div, .sw-btw-delta, .sw-uitstel-envelope,
    .sw-authority-chain > article, .sw-client-dossier, .sw-review-source,
    .sw-dividend-documents > div, .sw-oss-export, .sw-client-reply,
    .sw-btw-comparison > div, .sw-suppletie-versions > div,
    .sw-deposit-route > div, .sw-uitstel-board article,
    .sw-ib-shared, .sw-vpb-result, .sw-yearwork-file, .sw-oss-quarter,
    .sw-client-task, .sw-review-owner, .sw-icp-import figcaption,
    .sw-authority-entry, .sw-owr-files > div, .sw-oss-branches > div
  ) {
    transform: none;
  }
  .software-story .sw-btw-comparison { gap: 14px; padding-inline: 0; }
  .sw-btw-comparison > div { padding: 22px 14px; }
  .software-story .sw-suppletie-versions { gap: 16px; }
  .sw-uitstel-board { padding: 8px; }
  .sw-uitstel-board section { padding: 18px; }
}
@media (max-width: 540px) {
  .software-story .sw-btw-comparison { grid-template-columns: 1fr; }
  .sw-btw-comparison .sw-btw-versus { justify-self: center; }
  .sw-btw-comparison > div { padding: 26px; }
  .sw-btw-comparison strong { font-size: 2.5rem; }
  .sw-btw-comparison figcaption { grid-column: 1; }
}

/* Large display accents use the logo orange; small source links keep their ink. */
.software-story h1 em { color: var(--accent); }
.software-story :is(.sw-orange, .sw-ib-hero, .sw-suppletie-hero, .sw-uitstel-hero, .sw-owr-hero, .sw-dividend-hero) h1 em {
  color: var(--on-accent);
}
/* Secondary scenes: distinct physical objects, not flat rows on the page. */
.sw-ib-subjects { gap: 20px; }
.sw-ib-subjects > article:not(.sw-ib-missing),
.sw-authority-chain > article {
  background: #292c37;
  border: 1px solid var(--line-on-dark);
  padding: 28px;
  border-radius: var(--radius-medium);
  box-shadow: 3px 5px 0 #13151d, 0 24px 40px -24px #0009;
}
.sw-ib-subjects > .sw-ib-missing {
  transform: perspective(1200px) rotateY(-5deg) translateY(-6px);
  border: 1px solid #ffffff55;
  box-shadow: 3px 5px 0 var(--accent-hover), 0 24px 40px -24px #0009;
}
.sw-authority-chain > article:nth-of-type(2) {
  transform: perspective(1400px) rotateX(4deg) rotateY(-6deg) translateY(-12px);
}
.sw-oss-sort { border: 0; gap: 22px; }
.sw-oss-sort > div {
  border: 1px solid var(--line);
  background: var(--surface);
  transform: perspective(1300px) rotateY(-4deg);
}
.sw-oss-sort > div:nth-child(2) {
  background: var(--accent);
  border-color: var(--accent);
  transform: perspective(1300px) rotateY(-4deg) translateY(-10px);
}
.sw-review-source {
  border: 1px solid var(--line);
  padding: 30px;
}
.sw-review-comments {
  border: 1px solid #ffffff55;
  box-shadow: 3px 5px 0 var(--accent-hover), 0 24px 40px -24px #1e202970;
}
.sw-client-dossier { border: 1px solid var(--line); }
.sw-client-version { border-radius: var(--radius-medium); }
.sw-icp-columns { gap: 14px; background: transparent; }
.sw-icp-columns > span {
  background: var(--surface);
  border-radius: var(--radius-small);
  box-shadow: 2px 4px 0 var(--sw-depth-edge), 0 16px 24px -16px #1e202970;
}
.software-story .sw-tint .sw-icp-columns > span { color: var(--ink); }
@media (max-width: 850px), (prefers-reduced-motion: reduce) {
  .sw-ib-subjects > .sw-ib-missing,
  .sw-authority-chain > article:nth-of-type(2),
  .sw-oss-sort > div,
  .sw-oss-sort > div:nth-child(2) { transform: none; }
}
.sw-ib-subjects { border: 0; }
.sw-icp-workbench {
  background: #292c37;
  border-radius: var(--radius-medium);
  box-shadow: 4px 6px 0 #13151d, 0 30px 50px -24px #0008;
}
.sw-owr-source-lines article {
  background: #292c37;
  border: 1px solid var(--line-on-dark);
  border-radius: var(--radius-small);
  padding: 26px;
  margin-bottom: 18px;
  transform: perspective(1400px) rotateY(-3deg);
  box-shadow: 3px 5px 0 #13151d, 0 20px 32px -24px #0009;
}
.sw-dividend-company {
  background: var(--surface);
  border-radius: var(--radius-small);
  box-shadow: 2px 4px 0 var(--sw-depth-edge), 0 18px 26px -20px #1e202970;
}
.sw-dividend-records { border: 0; gap: 24px; }
.sw-dividend-records article {
  background: var(--surface);
  border: 1px solid var(--line);
  padding: 28px;
}
.sw-yearwork-trace > article { background: var(--surface); }
@media (max-width: 850px), (prefers-reduced-motion: reduce) {
  .sw-owr-source-lines article { transform: none; }
}
@media (max-width: 850px), (prefers-reduced-motion: reduce) {
  .software-story .sw-suppletie-versions > div:last-of-type,
  .software-story .sw-owr-archive .sw-owr-files > div:nth-child(2) {
    transform: none;
  }
}

/* Material edges follow the face: dark panels and orange cards are not white paper. */
.software-story .sw-icp-import {
  box-shadow: 2px 3px 0 #41434e, 6px 9px 0 #13151d, var(--sw-depth-shadow);
}
.software-story .sw-authority-register {
  box-shadow: 2px 3px 0 var(--accent-hover), 6px 9px 0 var(--accent-ink), var(--sw-depth-shadow);
}
.software-story :is(.sw-vpb-evidence > div:last-child, .sw-client-reply) {
  box-shadow: 2px 4px 0 var(--accent-hover), 0 22px 38px -24px #1e202970;
}
.software-story .sw-authority-chain > article {
  box-shadow: 2px 4px 0 #41434e, 5px 7px 0 #13151d, 0 24px 40px -24px #0009;
}
.sw-oss-sort > div:nth-child(2) {
  box-shadow: 0 5px 0 var(--accent-hover), 0 18px 30px -22px #1e202960;
}
.sw-client-version {
  background: #292c37;
  box-shadow: 3px 5px 0 #13151d, 0 24px 40px -25px #0009;
}
/* The folder tab meets the paper edge and stays visible against the orange hero. */
.sw-ib-folder::before {
  top: auto;
  bottom: 100%;
  left: 20px;
  background: var(--surface);
  color: var(--ink);
  border: 1px solid var(--line);
  border-bottom: 0;
  padding: 9px 16px;
  max-width: calc(100% - 40px);
}
/* Inset the raised ICP caption instead of leaving a detached, full-width footer. */
.sw-icp-import figcaption {
  margin: 0 16px 20px;
  border: 1px solid #ffffff55;
  border-radius: var(--radius-small);
  transform: translateZ(22px);
}
.sw-review-desk {
  border: 0;
  gap: 30px;
  align-items: start;
}
.sw-review-comments details { border-bottom-color: var(--line-on-dark); }
.sw-review-comments { border-radius: var(--radius-medium); }
@media (max-width: 850px), (prefers-reduced-motion: reduce) {
  .sw-icp-import figcaption { transform: none; }
}

/* Cards in a grid share one top line; the global list rhythm would stagger them. */
.sw-overview-flow > li + li,
.sw-vpb-files > li + li,
.sw-suppletie-trail > li + li { margin-top: 0; }
/* Card faces need their own inset, not the flat list's top-only padding. */
.sw-vpb-files > li,
.sw-yearwork-trace > article {
  padding: 26px 28px 28px;
  background: var(--surface);
  border-inline: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.sw-vpb-files h3 { margin-top: 24px; }
.sw-yearwork-trace h3 { margin-top: 22px; }
/* The client's source sheet tucks behind the dossier instead of floating above it. */
.sw-overview-scene { position: relative; }
.software-story .sw-overview-source {
  position: relative;
  z-index: 0;
  margin-bottom: -18px;
  padding-bottom: 30px;
  background: #fbfbfc;
  color: var(--ink);
  border: 1px solid var(--line);
}
.software-story .sw-overview-source svg { color: var(--accent); }
.software-story .sw-overview-dossier { z-index: 1; }
/* ICP columns are separate cards; the old table frame cut through their edges. */
.software-story .sw-icp-columns { border: 0; padding-bottom: 6px; }
.software-story .sw-icp-columns > span { border: 1px solid var(--line); }
/* OSS: heading and source list are separated. */
.sw-oss-export h3 { margin-bottom: 22px; }
.sw-oss-export li { border-top-color: #ffffff66; }
/* Dividend: the company connects to the three records; the sources are separate sheets. */
.sw-dividend-company { position: relative; }
.sw-dividend-company::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  width: 1px;
  height: 17px;
  background: var(--line-strong);
}
.sw-dividend-records { position: relative; }
.sw-dividend-records::before {
  content: "";
  position: absolute;
  bottom: 100%;
  left: calc((100% - 48px) / 6);
  right: calc((100% - 48px) / 6);
  height: 18px;
  border: 1px solid var(--line-strong);
  border-bottom: 0;
  border-radius: var(--radius-small) var(--radius-small) 0 0;
}
.sw-dividend-documents { display: grid; gap: 14px; }
.software-story .sw-dividend-documents > div {
  padding: 22px 26px;
  border: 1px solid var(--line);
  background: var(--surface);
}
/* Full-width source rows lean back evenly, so they stay inside the content column. */
.sw-owr-source-lines article { transform: perspective(1400px) rotateX(4deg); transform-origin: center top; }
/* Machtigingen: the orange marker runs into the row line. */
.sw-authority-follow li { gap: 0; }
.sw-authority-follow li > span { flex: 0 0 58px; }
/* Numbers never break across two lines on narrow screens. */
.sw-btw-start li > span { flex-shrink: 0; min-width: 1.6em; }
@media (max-width: 760px) {
  .sw-dividend-records::before { display: none; }
  .sw-dividend-company::after { height: 35px; }
}
@media (max-width: 850px), (prefers-reduced-motion: reduce) {
  .sw-owr-source-lines article { transform: none; }
}
@media (max-width: 850px), (prefers-reduced-motion: reduce) {
  .software-story .sw-uitstel-board section:nth-child(2) article { transform: none; }
  /* Room for the folder tab above the IB dossier once the columns stack. */
  .software-story .sw-ib-folder { margin-top: 44px; }
}