/* Original typography, illustration and motion examples for the ProSuite sections. */
#prosuite.cv-rich-prosuite {
  --cv-rich-ink: #30233d;
  --cv-rich-muted: #61596a;
  --cv-rich-line: #ded4e8;
  --cv-rich-wash: #f6f2fa;
  --cv-rich-purple: #6b32a8;
}
#prosuite .cv-rich-figure {
  min-width: 0;
  max-width: none;
  margin: 0;
  overflow: hidden;
  border: 1px solid var(--cv-rich-line);
  border-radius: 8px;
  background: #f4f1ff;
}
#prosuite .cv-rich-figure img {
  display: block;
  width: 100%;
  height: auto;
  max-height: none;
  object-fit: contain;
  mix-blend-mode: normal;
}
#prosuite .cv-rich-figure figcaption {
  margin: 0;
  padding: 13px 18px;
  border-top: 1px solid var(--cv-rich-line);
  background: #fff;
  color: var(--cv-rich-muted);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.7;
  letter-spacing: -.015em;
  word-break: keep-all;
  overflow-wrap: anywhere;
}
/* The overview is a compact introduction with a generous view of the work. */
#prosuite .ps-overview__panel {
  grid-template-columns: minmax(0, .85fr) minmax(0, 1.25fr);
  align-items: center;
  gap: 28px 48px;
  padding-block: 36px;
}
#prosuite .ps-overview__visual { width: 100%; }
#prosuite .ps-overview__terms { grid-column: 1 / -1; }
/* The detailed introduction gives the exhibition its own full-width spread. */
#prosuite .fnc-suite-opening {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 22px;
  margin: 32px 0 28px;
}
#prosuite .fnc-suite-statement {
  max-width: 24em;
  margin: 0;
  padding: 0;
  color: var(--cv-rich-ink);
  font-family: inherit;
  font-size: clamp(25px, 2.8vw, 36px);
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: -.04em;
}
#prosuite .fnc-suite-opening .cv-rich-figure { width: 100%; }
#prosuite .fnc-app-index {
  justify-content: flex-start;
  column-gap: 32px;
  margin-top: 32px;
  margin-bottom: 0;
  padding-block: 14px;
}
/* Each craft gets a different spread instead of a row of identical thumbnails. */
#prosuite .cv-rich-app {
  display: grid;
  align-items: start;
  grid-template-columns: 28px minmax(0, 1.25fr) minmax(0, .8fr);
  gap: 24px 32px;
  padding: 48px 0;
  scroll-margin-top: 96px;
}
#prosuite .cv-rich-app .fnc-entry-index {
  grid-column: 1;
  grid-row: 1;
  padding-top: 4px;
  color: var(--cv-rich-purple);
  font-size: 14px;
  line-height: 1.7;
  font-variant-numeric: tabular-nums;
}
#prosuite .cv-rich-app .cv-rich-figure {
  grid-column: 2;
  grid-row: 1 / 3;
  width: 100%;
  max-width: none;
  align-self: start;
}
#prosuite .cv-rich-app__copy {
  grid-column: 3;
  grid-row: 1;
  min-width: 0;
  padding-top: 4px;
}
#prosuite .cv-rich-app .fnc-small-label {
  margin: 0 0 8px;
  color: var(--cv-rich-purple);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.6;
}
#prosuite .cv-rich-app h3 {
  margin: 0 0 18px;
  color: var(--cv-rich-ink);
  font-size: clamp(28px, 3vw, 36px);
  font-weight: 500;
  line-height: 1.25;
  letter-spacing: -.04em;
}
#prosuite .cv-rich-app__copy > p:last-child {
  max-width: 38em;
  margin: 0;
  color: var(--cv-rich-muted);
  font-size: 15px;
  line-height: 1.9;
  word-break: keep-all;
  overflow-wrap: anywhere;
}
#prosuite .cv-rich-app .fnc-app-condition {
  grid-column: 3;
  grid-row: 2;
  align-self: start;
  margin: 0;
  padding: 0 0 0 16px;
  border-left: 2px solid #8a6fbd;
}
#prosuite .cv-rich-app .fnc-app-condition > span {
  margin-bottom: 5px;
  color: var(--cv-rich-muted);
  font-size: 14px;
  line-height: 1.7;
}
#prosuite .cv-rich-app .fnc-app-condition p {
  margin: 0;
  color: var(--cv-rich-purple);
  font-size: 14px;
  line-height: 1.8;
}
/* Motion: a wide contact sheet below its short introduction. */
#prosuite .cv-rich-app--cavalry {
  grid-template-columns: 28px minmax(0, 1.25fr) minmax(0, .8fr);
}
#prosuite .cv-rich-app--cavalry .cv-rich-app__copy { grid-column: 2; grid-row: 1; }
#prosuite .cv-rich-app--cavalry .fnc-app-condition { grid-column: 3; grid-row: 1; margin-top: 36px; }
#prosuite .cv-rich-app--cavalry .cv-rich-figure { grid-column: 2 / -1; grid-row: 2; }
/* Image generation: an immersive gallery, followed by its explanation. */
#prosuite .cv-rich-app--leonardo .cv-rich-figure { grid-column: 2 / -1; grid-row: 1; }
#prosuite .cv-rich-app--leonardo .cv-rich-app__copy { grid-column: 2; grid-row: 2; }
#prosuite .cv-rich-app--leonardo .fnc-app-condition { grid-column: 3; grid-row: 2; margin-top: 36px; }
/* Data: a quieter editorial page with the infographic on the right. */
#prosuite .cv-rich-app--flourish {
  grid-template-columns: 28px minmax(0, .75fr) minmax(0, 1.25fr);
}
#prosuite .cv-rich-app--flourish .cv-rich-figure { grid-column: 3; grid-row: 1 / 3; }
#prosuite .cv-rich-app--flourish .cv-rich-app__copy { grid-column: 2; grid-row: 1; }
#prosuite .cv-rich-app--flourish .fnc-app-condition { grid-column: 2; grid-row: 2; }
#prosuite .fnc-suite-notes { margin-top: 12px; }
/* Spanning artwork must not distribute empty space through the adjacent copy. */
@media (min-width: 900px) {
  #prosuite .cv-rich-app--affinity,
  #prosuite .cv-rich-app--flourish { grid-template-rows: min-content 1fr; }
}
@media (max-width: 1023px) {
  #prosuite .ps-overview__panel { gap: 28px; }
  #prosuite .cv-rich-app { gap: 22px 24px; }
}
@media (max-width: 899px) {
  #prosuite .ps-overview__panel { grid-template-columns: minmax(0, 1fr); }
  #prosuite .ps-overview__visual { max-width: none; }
  #prosuite .cv-rich-app,
  #prosuite .cv-rich-app--cavalry,
  #prosuite .cv-rich-app--flourish {
    grid-template-columns: 24px minmax(0, 1fr);
    gap: 20px 18px;
    padding-block: 36px;
  }
  #prosuite .cv-rich-app .fnc-entry-index { grid-column: 1; grid-row: 1; }
  #prosuite .cv-rich-app .cv-rich-app__copy { grid-column: 2; grid-row: 1; padding-top: 0; }
  #prosuite .cv-rich-app .cv-rich-figure { grid-column: 2; grid-row: 2; width: 100%; max-width: none; }
  #prosuite .cv-rich-app .fnc-app-condition { grid-column: 2; grid-row: 3; margin: 0; }
  #prosuite .cv-rich-app h3 { font-size: 30px; margin-bottom: 14px; }
}
@media (max-width: 599px) {
  #prosuite .ps-overview__panel { gap: 24px; padding-block: 28px; }
  #prosuite .fnc-suite-opening { margin-top: 24px; gap: 18px; }
  #prosuite .fnc-suite-statement { font-size: 26px; }
  #prosuite .fnc-app-index { column-gap: 22px; row-gap: 4px; margin-top: 24px; }
  #prosuite .cv-rich-app,
  #prosuite .cv-rich-app--cavalry,
  #prosuite .cv-rich-app--flourish { gap: 16px 12px; padding-block: 30px; }
  #prosuite .cv-rich-app .cv-rich-figure { grid-column: 1 / -1; }
  #prosuite .cv-rich-figure { border-radius: 5px; }
  #prosuite .cv-rich-figure figcaption { padding: 11px 13px; }
  #prosuite .cv-rich-app .fnc-app-condition { grid-column: 2; }
  #prosuite .cv-rich-app__copy > p:last-child { font-size: 15px; line-height: 1.85; }
}
/* These working examples have no dependency on a product editor or external service. */
#prosuite .cv-motion-art { display:block;width:100%;height:auto; }
#prosuite .cv-art-toolbar { display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 20px;background:#fff;color:#514262;font-size:14px;line-height:1.5; }
#prosuite :is(.cv-motion-toggle,.cv-chart-controls button) { min-height:44px;border:1px solid #6b32a8;border-radius:6px;padding:9px 16px;background:#fff;color:#5c2498;font:inherit;font-size:14px;font-weight:700;cursor:pointer; }
#prosuite :is(.cv-motion-toggle,.cv-chart-controls button):hover { background:#f1e9fc; }
#prosuite :is(.cv-motion-toggle,.cv-chart-controls button):focus-visible { outline:3px solid #6422d8;outline-offset:3px; }
#prosuite [hidden] { display:none; }
#prosuite .cv-motion-orbit { transform-box:fill-box;transform-origin:center;animation:cv-crafted-orbit 12s linear infinite;animation-play-state:paused; }
#prosuite .cv-motion-fan { transform-box:fill-box;transform-origin:center;animation:cv-crafted-fan 10s linear infinite;animation-play-state:paused; }
#prosuite .cv-motion-word { animation:cv-crafted-type 5s ease-in-out infinite;animation-play-state:paused; }
#prosuite .cv-motion-word--two { animation-delay:.15s; }
#prosuite .cv-motion-lines { animation:cv-crafted-lines 5s ease-in-out infinite;animation-play-state:paused; }
#prosuite .cv-motion[data-playing="true"] :is(.cv-motion-orbit,.cv-motion-fan,.cv-motion-word,.cv-motion-lines) { animation-play-state:running; }
@keyframes cv-crafted-orbit { to { rotate:360deg; } }
@keyframes cv-crafted-fan { to { rotate:-360deg; } }
@keyframes cv-crafted-type { 0%,100% { translate:0 0; } 35%,65% { translate:12px -8px; } }
@keyframes cv-crafted-lines { 0%,100% { stroke-dasharray:600;stroke-dashoffset:0; } 50% { stroke-dasharray:600;stroke-dashoffset:160; } }
#prosuite .cv-chart { background:#fbfaff; }
#prosuite .cv-chart-heading { display:flex;flex-direction:column;align-items:flex-start;padding:32px 32px 20px;gap:14px; }
#prosuite .cv-chart-kicker { color:#6422d8;font-size:14px;line-height:1.5;letter-spacing:.08em;font-weight:700; }
#prosuite .cv-chart-heading strong { font-size:clamp(26px,3.2vw,44px);line-height:1.2;letter-spacing:-.04em;color:#211337;font-weight:800; }
#prosuite .cv-chart-note { font-size:14px;line-height:1.5;color:#61596a; }
#prosuite .cv-chart-plot { padding:10px 32px 24px; }
#prosuite .cv-chart-row { display:grid;grid-template-columns:42px minmax(0,1fr) 26px;align-items:center;gap:14px;margin:18px 0;color:#30233d;font-size:15px;line-height:1.6; }
#prosuite .cv-chart-row b { font-weight:700;text-align:right; }
#prosuite .cv-chart-track { --cv-value:80%;--cv-color:#7d2ae8;position:relative;min-width:0;height:30px;background:repeating-linear-gradient(to right,#ded4e8 0,#ded4e8 1px,transparent 1px,transparent 33.333%); }
#prosuite .cv-chart-track--draw { --cv-value:60%;--cv-color:#07877f; }
#prosuite .cv-chart-track--write { --cv-value:40%;--cv-color:#9e4a10; }
#prosuite .cv-chart-track--move { --cv-value:20%;--cv-color:#3562bc; }
#prosuite .cv-chart-track i { display:block;width:var(--cv-value);height:100%;border-radius:0 4px 4px 0;background:var(--cv-color); }
#prosuite .cv-chart-track::after { position:absolute;left:var(--cv-value);top:50%;width:18px;height:18px;border-radius:50%;background:var(--cv-color);translate:-50% -50%;content:"";opacity:0; }
#prosuite .cv-chart[data-view="dots"] .cv-chart-track i { height:2px;position:absolute;top:calc(50% - 1px); }
#prosuite .cv-chart[data-view="dots"] .cv-chart-track::after { opacity:1; }
#prosuite .cv-chart-axis { margin-left:56px;margin-right:40px;display:flex;justify-content:space-between;color:#61596a;font-size:14px;line-height:1.5; }
#prosuite .cv-chart-controls { padding:18px 32px 24px;border-top:1px solid #ded4e8;display:flex;gap:10px;flex-wrap:wrap; }
#prosuite .cv-chart-controls button[aria-pressed="true"] { color:#fff;background:#6422d8; }
#prosuite .cv-art-sr { position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0; }
@media (max-width:599px) {
 #prosuite .cv-chart-heading { padding:24px 20px 16px; }
 #prosuite .cv-chart-plot { padding:4px 20px 20px; }
 #prosuite .cv-chart-row { grid-template-columns:34px minmax(0,1fr) 22px;gap:10px;font-size:14px; }
 #prosuite .cv-chart-axis { margin-left:44px;margin-right:32px; }
 #prosuite .cv-chart-controls { padding:16px 20px 20px;gap:8px; }
 #prosuite .cv-art-toolbar { padding:12px 16px; }
}