
.operation-fields { max-width: 1680px; margin: 88px auto 0; }
.operation-fields-heading { margin-bottom: 48px; }
.operation-fields-heading > p { margin: 0 0 18px; font-size: 11.5px; color: #747474; letter-spacing: .14em; text-transform: uppercase; }
html body .operation-fields-heading h2 { max-width: 24em; }
.operation-fields-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 20px; }
.operation-field { padding: 26px; border: 1px solid #ccc; border-radius: 7px; background: #fff; color: #121212; transition: background 220ms ease, color 220ms ease, border-color 220ms ease; }
.operation-field-top { display: flex; align-items: center; gap: 12px; margin-bottom: 22px; }
.operation-field-top span { font-size: 10px; letter-spacing: .12em; color: #747474; }
.operation-field h3 { margin: 0 0 22px; font-size: 22px; font-weight: 400; line-height: 1.16; letter-spacing: -.025em; }
.operation-field-perspectives { display: grid; }
.operation-field-perspectives p { grid-area: 1 / 1; margin: 0; font-size: 16px; line-height: 1.45; transition: opacity 220ms ease; }
.operation-field-description { color: #747474; }
.operation-field-gap { opacity: 0; visibility: hidden; }
.operation-field-gap span { display: block; margin-bottom: 8px; font-size: 11px; letter-spacing: .06em; }
.operation-field:is(:hover,:focus) { background: #121212; color: #fff; border-color: #121212; }
.operation-field:is(:hover,:focus) .operation-field-top span { color: #aaa; }
.operation-field:is(:hover,:focus) .operation-field-description { opacity: 0; visibility: hidden; }
.operation-field:is(:hover,:focus) .operation-field-gap { opacity: 1; visibility: visible; }
.operation-field:focus-visible { outline: 1px solid #121212; outline-offset: 4px; }
.operation-fields-closing { margin: 0; padding: 72px 0 8px; background: linear-gradient(#fff0,#fff); font-size: 20px; line-height: 1.3; color: #747474; }
@media(max-width:1400px) { .operation-fields-grid { grid-template-columns: repeat(3,minmax(0,1fr)); } }
@media(max-width:1000px) { .operation-fields-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media(max-width:600px) { .operation-fields-grid { grid-template-columns: 1fr; } .operation-fields { margin-top: 56px; } }
@media(prefers-reduced-motion:reduce) { .operation-field, .operation-field-perspectives p { transition: none; } }

/* Compact two-column library with Pandect typography and category navigation. */
html body .operation-fields-heading h2 { margin: 0; max-width: 24em; font-size: 50px; line-height: 1.08; font-weight: 400; letter-spacing: -.04em; }
.operation-fields-layout { display: grid; grid-template-columns: minmax(180px,.65fr) minmax(0,2fr); gap: clamp(40px,5vw,88px); }
.operation-fields-filters { display: flex; flex-direction: column; gap: 12px; align-items: flex-start; }
.operation-fields-filters button { padding: 6px 0; background: none; border: 0; color: #797979; font: inherit; font-size: 16px; cursor: pointer; text-align: left; }
.operation-fields-filters button[aria-pressed="true"], .operation-fields-filters button:hover { color: #121212; }
.operation-fields-filters button[aria-pressed="true"] { text-decoration: underline; text-underline-offset: 6px; }
.operation-fields-filters button:focus-visible { outline: 1px solid #121212; outline-offset: 4px; }
.operation-fields-results { position: relative; }
.operation-fields-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; }
.operation-field { padding: 26px; }
.operation-field[hidden] { display: none !important; }
.operation-field--preview { filter: blur(4px); opacity: .35; pointer-events: none; user-select: none; }
.operation-fields-contact { display: flex; justify-content: center; padding-top: 32px; }
.operation-fields--faded .operation-fields-contact { position: absolute; bottom: 0; left: 0; right: 0; padding: 76px 0 32px; background: linear-gradient(transparent,#fff 80%); }
html body .operation-fields-contact .implementation-hero__cta { background: #121212; border-color: #121212; color: #fff; }@media (min-width: 721px) { /* Desktop CTA hover. */

html body .operation-fields-contact .implementation-hero__cta:is(:hover,:focus-visible) { background: transparent; color: #121212; }
}
.operation-fields-closing { padding-top: 32px; font-size: 16px; }
@media(max-width:1000px) { .operation-fields-layout { grid-template-columns: 150px minmax(0,1fr); gap: 32px; } }
@media(max-width:720px) { .operation-fields-layout { grid-template-columns: 1fr; } .operation-fields-filters { flex-direction: row; flex-wrap: wrap; gap: 12px 24px; } html body .operation-fields-heading h2 { font-size: clamp(30px,8.8vw,42px); } .operation-fields-grid { gap: 16px; } .operation-field { padding: 20px; } }
@media(max-width:560px) { .operation-fields-grid { grid-template-columns: 1fr; } }

/* Major category labels match the main page's category typography. */
.operation-fields-layout { grid-template-columns: minmax(220px,1fr) minmax(0,780px); gap: clamp(48px,6vw,110px); }
.operation-fields-filters { gap: 28px; }
.operation-fields-filters button { position: relative; padding: 0 0 0 clamp(40px,4vw,64px); color: #aaa; font-size: clamp(22px,1.55vw,30px); line-height: 1.18; font-weight: 400; letter-spacing: -.02em; }
.operation-fields-filters button[aria-pressed="true"] { text-decoration: none; }
.operation-fields-filters button::before { content: ''; position: absolute; left: 0; top: .42em; width: 12px; height: 12px; background: #ccc; -webkit-mask-image: radial-gradient(circle,#000 1px,transparent 1.05px); mask-image: radial-gradient(circle,#000 1px,transparent 1.05px); -webkit-mask-size: 4px 4px; mask-size: 4px 4px; }
.operation-fields-filters button[aria-pressed="true"]::before, .operation-fields-filters button:hover::before { background: #121212; }
.operation-field { padding: 20px; }
.operation-field-top { margin-bottom: 14px; }
.operation-field h3 { margin-bottom: 16px; font-size: 21px; }
.operation-field-perspectives p { font-size: 14px; line-height: 1.4; }
.operation-field:is(:hover,:focus) { background: #fff; color: #121212; border-color: #777; }
.operation-field:is(:hover,:focus) .operation-field-top span { color: #747474; }
.operation-field--preview-light { filter: blur(1.4px); opacity: .65; pointer-events: none; user-select: none; }
.operation-field--preview { filter: blur(4px); opacity: .3; }
@media(max-width:1000px) { .operation-fields-layout { grid-template-columns: minmax(180px,.8fr) minmax(0,1.6fr); gap: 32px; } }
@media(max-width:720px) { .operation-fields-layout { grid-template-columns: 1fr; } .operation-fields-filters { gap: 20px 28px; } .operation-fields-filters button { padding-left: 24px; font-size: 22px; } }

/* Center category navigation and cards together; remove category markers. */
.operation-fields-layout { width: 100%; max-width: 1160px; margin: 0 auto; grid-template-columns: minmax(220px,300px) minmax(0,780px); gap: 72px; }
.operation-fields-filters button { padding-left: 0; }
.operation-fields-filters button::before { content: none; }
.operation-field--preview-light { filter: blur(1.4px); opacity: .7; }
.operation-field--preview { filter: blur(4px); opacity: .3; }
.operation-fields--faded .operation-fields-contact { z-index: 2; padding-top: 48px; background: linear-gradient(transparent,rgba(255,255,255,.8) 85%); }
@media(max-width:1000px) { .operation-fields-layout { grid-template-columns: minmax(180px,.8fr) minmax(0,1.6fr); gap: 32px; } }
@media(max-width:720px) { .operation-fields-layout { grid-template-columns: 1fr; } .operation-fields-filters button { padding-left: 0; } }

/* Three rows: two clear rows and one moderately blurred CTA preview. */
.operation-field--preview-light { filter: blur(2.6px); opacity: .5; }

/* Tangible process names with one shared text panel. */
.operation-process-layout { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: clamp(56px,7vw,120px); max-width: 1280px; margin: 0 auto; align-items: start; }
.operation-process-list { display: flex; flex-direction: column; gap: 22px; }
.operation-process { display: flex; align-items: center; gap: 20px; padding: 0; border: 0; background: none; color: #aaa; font: inherit; font-size: clamp(22px,1.55vw,30px); line-height: 1.18; font-weight: 400; letter-spacing: -.02em; text-align: left; cursor: pointer; }
.operation-process[aria-pressed="true"] { color: #121212; }
.operation-process:focus-visible { outline: 1px solid #777; outline-offset: 6px; }
.operation-process--own svg { flex: none; transition: transform 420ms cubic-bezier(.22,1,.36,1); }
.operation-process-row:is(:hover,:focus-within) .operation-process--own svg,
.operation-process--own:is(:hover,:focus-visible) svg { transform: rotate(180deg); }
.operation-process-details { position: sticky; top: 120px; min-height: 210px; }
.operation-process-panel[hidden] { display: none; }
.operation-process-category { margin: 0 0 24px; font-size: 11.5px; line-height: 1.5; letter-spacing: .14em; color: #747474; }
.operation-process-text { margin: 0; font-size: 16px; line-height: 1.5; color: #747474; }
@media(max-width:720px) { .operation-process-layout { grid-template-columns: 1fr; gap: 40px; } .operation-process-details { position: static; } .operation-process-list { gap: 18px; } }
@media(prefers-reduced-motion:reduce) { .operation-process--own svg { transition: none; } }

.operation-process { position: relative; }
.operation-process::before { content: ''; position: absolute; left: -18px; top: .05em; bottom: .05em; width: 1px; background: #121212; opacity: 0; }
.operation-process[aria-pressed="true"]::before { opacity: 1; }

/* Dark process section, spanning the full page width. */
html body .operation-fields--processes { background: #000; color: #fff; max-width: none; margin-left: calc(-1 * var(--pandect-nav-gutter)); margin-right: calc(-1 * var(--pandect-nav-gutter)); padding: clamp(72px,10vh,120px) var(--pandect-nav-gutter); }
.operation-fields--processes .operation-fields-heading { max-width: 1680px; margin-left: auto; margin-right: auto; }
html body .operation-fields--processes .operation-fields-heading h2 { color: #fff !important; }
.operation-fields--processes .operation-fields-heading > p,
.operation-fields--processes .operation-process-category,
.operation-fields--processes .operation-process-text { color: #a3a3a3; }
.operation-fields--processes .operation-process { color: #777; }
.operation-fields--processes .operation-process[aria-pressed="true"] { color: #fff; }
.operation-fields--processes .operation-process::before { background: #fff; }
.operation-fields--processes .operation-process:focus-visible { outline-color: #fff; }

/* The entire enclosing section is dark, including its side gutters. */
html body .operations-adaptive--accordion:has(.operation-fields--processes) { background: #000 !important; color: #fff !important; }
html body .operations-adaptive--accordion:has(.operation-fields--processes) .operations-adaptive-copy h2,
html body .operations-adaptive--accordion:has(.operation-fields--processes) .operations-accordion-trigger { color: #fff !important; }
html body .operations-adaptive--accordion:has(.operation-fields--processes) .operations-adaptive-lead,
html body .operations-adaptive--accordion:has(.operation-fields--processes) .operations-adaptive-row p { color: #a3a3a3 !important; }
html body .operations-adaptive--accordion:has(.operation-fields--processes) .operations-adaptive-row { border-color: rgba(255,255,255,.18) !important; }
html body .operations-adaptive--accordion:has(.operation-fields--processes) .operations-accordion-trigger:focus-visible { outline-color: #fff; }
html body .deployment-team-section { background: #fff !important; color: #121212 !important; }
html body .deployment-team-section .deployment-team-copy h2,
html body .deployment-team-section .deployment-team-stat strong { color: #121212 !important; }
html body .deployment-team-section .deployment-team-copy p,
html body .deployment-team-section .deployment-team-stat p { color: #747474 !important; }
html body .deployment-team-section .deployment-team-stat { border-color: rgba(18,18,18,.14) !important; }

/* Process selection uses text color only; the own-operation cross leads its label. */
.operation-process::before { content: none; }
.operation-process--own svg { order: -1; }

/* Intro and accordion remain light; the process block below stays dark. */
html body .operations-adaptive--accordion:has(.operation-fields--processes) { background: #fff !important; color: #121212 !important; }
html body .operations-adaptive--accordion:has(.operation-fields--processes) .operations-adaptive-copy h2,
html body .operations-adaptive--accordion:has(.operation-fields--processes) .operations-accordion-trigger { color: #121212 !important; }
html body .operations-adaptive--accordion:has(.operation-fields--processes) .operations-adaptive-lead,
html body .operations-adaptive--accordion:has(.operation-fields--processes) .operations-adaptive-row p { color: #747474 !important; }
html body .operations-adaptive--accordion:has(.operation-fields--processes) .operations-adaptive-row { border-color: rgba(18,18,18,.14) !important; }
html body .operations-adaptive--accordion:has(.operation-fields--processes) .operations-accordion-trigger:focus-visible { outline-color: #121212; }
html body .operations-adaptive--accordion:has(.operation-fields--processes) { padding-bottom: 0; }

.operation-process-list { gap: 9px; }
@media(max-width:720px) { .operation-process-list { gap: 9px; } }

/* Independent full-width section avoids percentage-based nested gutter offsets. */
html body .operation-fields--processes { width: 100%; max-width: none; margin: 0; box-sizing: border-box; background: #000; padding: clamp(72px,10vh,120px) var(--pandect-nav-gutter); font-family: 'General Sans', 'Helvetica Neue', Helvetica, sans-serif; }

/* Deployment returns to dark, while the eight characteristics stay light. */
html body .deployment-team-section { background: #000 !important; color: #fff !important; }
html body .deployment-team-section .deployment-team-copy h2,
html body .deployment-team-section .deployment-team-stat strong { color: #fff !important; }
html body .deployment-team-section .deployment-team-copy p,
html body .deployment-team-section .deployment-team-stat p { color: #a3a3a3 !important; }
html body .deployment-team-section .deployment-team-stat { border-color: rgba(255,255,255,.18) !important; }
html body .operations-pillars--eight { background: #fff !important; color: #121212 !important; }
html body .operations-pillars--eight h2,
html body .operations-pillars--eight h3 { color: #121212 !important; }
html body .operations-pillars--eight p { color: #747474 !important; }
html body .operations-pillars--eight .operations-pillar { border-color: rgba(18,18,18,.14) !important; }
html body .operations-pillars--eight .operations-pillar svg { color: #000 !important; }
html body .operations-pillars--eight .operations-pillar svg[data-pandect-dots] g,
html body .operations-pillars--eight .operations-pillar svg[data-pandect-dots] circle { fill: #000 !important; stroke: none !important; }

/* Tighter transition from deployment photo to process catalogue. */
html body .deployment-team-section:has(+ .operation-fields--processes) { padding-bottom: 72px; }
html body .deployment-team-section + .operation-fields--processes { padding-top: 88px; }

/* Simple operation definition, using the former accordion title typography. */
.operations-adaptive-definition p { margin: 0; max-width: 30em; color: #121212; font-size: 20px; line-height: 1.18; font-weight: 400; letter-spacing: -.018em; }

html body .operations-adaptive--definition .operations-adaptive-shell { display: flex; flex-direction: column; gap: 12px; }
html body .operations-adaptive--definition .operations-adaptive-copy h2,
html body .operations-adaptive--definition .operations-adaptive-definition p {
  max-width: none;
  font-size: 50px;
  line-height: 1.08;
  font-weight: 400;
  letter-spacing: -.04em;
  text-align: left;
}
html body .operations-adaptive--definition .operations-adaptive-copy h2 { color: #121212; }
html body .operations-adaptive--definition .operations-adaptive-definition p { color: #121212; }
@media (max-width: 720px) {
  html body .operations-adaptive--definition .operations-adaptive-copy h2,
  html body .operations-adaptive--definition .operations-adaptive-definition p { font-size: clamp(30px, 8.8vw, 42px); }
}

/* Balanced white introduction and left-copy/right-photo deployment. */
html body .operations-adaptive--definition { padding-top: clamp(80px,10vh,120px); padding-bottom: clamp(80px,10vh,120px); }
.deployment-team-split { max-width: 1680px; margin: 0 auto; display: grid; grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr); gap: clamp(48px,5vw,96px); align-items: start; }
html body .deployment-team-section--split .deployment-team-copy p { max-width: 42ch; margin-top: 28px; font-size: 16px; line-height: 1.5; }
html body .deployment-team-section--split .deployment-team-copy .deployment-team-cta { position: static; margin-top: 32px; }
html body .deployment-team-section--split .deployment-team-card { width: 100%; height: auto; aspect-ratio: 3 / 2; margin: 0; }
html body .deployment-team-section--split .deployment-team-card img { object-fit: cover; object-position: right top; }
@media(max-width:900px) { .deployment-team-split { grid-template-columns: 1fr; gap: 40px; } }

/* Center a narrower, balanced process/text pair with a smaller column gap. */
.operation-process-layout { max-width: 1040px; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 56px; margin-left: auto; margin-right: auto; }
.operation-process-text { max-width: 40ch; }
@media(max-width:720px) { .operation-process-layout { grid-template-columns: 1fr; gap: 32px; } .operation-process-text { max-width: none; } }

/* Bottom-align the deployment paragraph and CTA; show the photo at natural brightness. */
.deployment-team-split { align-items: stretch; }
html body .deployment-team-section--split .deployment-team-copy { display: flex; flex-direction: column; align-items: flex-start; }
html body .deployment-team-section--split .deployment-team-copy p { margin-top: 28px; padding-top: 0; }
html body .deployment-team-section--split .deployment-team-copy .deployment-team-cta { flex: none; margin-top: auto; }
html body .deployment-team-section--split .deployment-team-card img { filter: none !important; }
html body .deployment-team-section--split .deployment-team-card::after { display: none !important; }
@media(max-width:900px) {
  html body .deployment-team-section--split .deployment-team-copy p { margin-top: 28px; padding-top: 0; }
  html body .deployment-team-section--split .deployment-team-copy .deployment-team-cta { margin-top: 24px; }
}

/* Align names with the page gutter; keep the existing description width. */
.operation-process-layout { max-width: 1680px; grid-template-columns: minmax(0,1fr) minmax(0,492px); gap: 56px; }
@media(max-width:1100px) { .operation-process-layout { grid-template-columns: minmax(0,1fr) minmax(0,1fr); } }
@media(max-width:720px) { .operation-process-layout { grid-template-columns: 1fr; gap: 32px; } }

html body .deployment-team-section--split .deployment-team-copy .deployment-team-cta { align-self: flex-start !important; justify-self: start !important; margin-left: 0 !important; margin-right: auto !important; left: auto !important; right: auto !important; }

html body .deployment-team-section--split .deployment-team-card::after { display: block !important; background: rgba(0,0,0,.16) !important; }

/* Editorial composition: headline left, description above the list on the right. */
.operation-process-shell { max-width: 1280px; margin: 0 auto; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); column-gap: clamp(56px,6vw,96px); row-gap: 48px; align-items: start; }
.operation-process-shell .operation-process-layout { display: contents; }
.operation-process-shell .operation-fields-heading { grid-column: 1; grid-row: 1; margin: 0; }
.operation-process-shell .operation-process-details { grid-column: 2; grid-row: 1; position: static; min-height: 190px; }
.operation-process-shell .operation-process-list { grid-column: 2; grid-row: 2; }
.operation-process-shell .operation-process-text { max-width: 40ch; }
@media(max-width:720px) { .operation-process-shell { grid-template-columns: 1fr; row-gap: 32px; } .operation-process-shell .operation-fields-heading { grid-column: 1; grid-row: 1; } .operation-process-shell .operation-process-details { grid-column: 1; grid-row: 2; } .operation-process-shell .operation-process-list { grid-column: 1; grid-row: 3; } }

/* Longer description lines and a more inset headline. */
.operation-process-shell .operation-process-text { max-width: none; }
.operation-process-shell .operation-fields-heading { padding-left: 88px; }
@media(max-width:720px) { .operation-process-shell .operation-fields-heading { padding-left: 0; } }

/* Light process catalogue; deployment above keeps its dark background. */
html body .operation-fields--processes { background: #fff; color: #121212; }
html body .operation-fields--processes .operation-fields-heading h2 { color: #121212 !important; }
.operation-fields--processes .operation-process { color: #aaa; }
.operation-fields--processes .operation-process[aria-pressed="true"] { color: #121212; }
.operation-fields--processes .operation-process-category,
.operation-fields--processes .operation-process-text { color: #747474; }
.operation-fields--processes .operation-process:focus-visible { outline-color: #121212; }

/* Light characteristics section with dark headings and dot icons. */
html body .operations-pillars--eight { background: #fff !important; color: #121212 !important; }
html body .operations-pillars--eight h2,
html body .operations-pillars--eight h3 { color: #121212 !important; }
html body .operations-pillars--eight p { color: #747474 !important; }
html body .operations-pillars--eight .operations-pillar { border-color: rgba(18,18,18,.14) !important; }
html body .operations-pillars--eight .operations-pillar svg { color: #121212 !important; }
html body .operations-pillars--eight .operations-pillar svg[data-pandect-dots] g,
html body .operations-pillars--eight .operations-pillar svg[data-pandect-dots] circle { fill: #121212 !important; stroke: none !important; }

.operation-process--own { text-decoration: none; }

/* Compact editorial rows aligned to the page grid. */
.operation-process-shell { display: block; max-width: 1680px; }
.operation-process-shell .operation-fields-heading { padding-left: 0; margin-bottom: 48px; }
.operation-process-shell .operation-process-layout { display: block; max-width: none; }
.operation-process-shell .operation-process-list { display: block; width: 100%; }
.operation-process-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(32px, 4vw, 64px);
  align-items: start;
  min-height: 136px;
  padding: 22px 0;
  box-sizing: border-box;
  border-top: 1px solid #dedede;
}
.operation-process-row:last-child { border-bottom: 1px solid #dedede; }
.operation-fields--processes .operation-process-row .operation-process {
  color: #121212;
  min-height: 28px;
  align-items: flex-start;
}
.operation-process-row .operation-process-panel { min-width: 0; }
.operation-process-row .operation-process-category { margin-bottom: 8px; }
.operation-process-row .operation-process-text { max-width: 58ch; }
.operation-process-row .operation-process--own svg { margin-top: 2px; }
@media (max-width: 720px) {
  .operation-process-shell .operation-fields-heading { margin-bottom: 32px; }
  .operation-process-row { grid-template-columns: 1fr; gap: 16px; min-height: 76px; padding: 20px 0; }
}

/* Permanent descriptions with an editorial introduction on the left. */
.operation-fields--static .operation-process-shell {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: clamp(40px, 5vw, 80px);
  row-gap: 48px;
}
.operation-fields--static .operation-fields-heading,
.operation-fields--static .operation-process-layout { display: contents; }
.operation-fields--static .operation-fields-heading h2 { grid-column: 1; grid-row: 1; max-width: 20ch; }
.operation-process-intro { grid-column: 1; grid-row: 2; border-top: 1px solid #dedede; padding-top: 22px; }
.operation-process-intro p { margin: 0 0 24px; max-width: 56ch; font-size: 16px; line-height: 1.5; color: #747474; }
.operation-fields--static .operation-process-list { grid-column: 2; grid-row: 2; }
.operation-fields--static .operation-process-row { grid-template-columns: 1fr; gap: 10px; min-height: 0; padding: 20px 0; }
.operation-fields--static .operation-process { margin: 0; gap: 16px; cursor: default; font-size: 23px; }
.operation-fields--static .operation-process--own { cursor: pointer; }
.operation-fields--static .operation-process-dots { flex: none; margin-top: 2px; }
.operation-process-label { display: inline-block; }
.operation-process-number {
  display: inline-grid;
  place-items: center;
  flex: none;
  width: 24px;
  height: 24px;
  margin-top: 2px;
  border-radius: 5px;
  background: #f1f1f1;
  color: #505050;
  font-size: 11px;
  line-height: 1;
  font-weight: 400;
  letter-spacing: .02em;
}
.operation-fields--static .operation-process--own svg { order: 0; }
.operation-fields--static .operation-process-category { display: none; }
.operation-fields--static .operation-process-panel { padding-left: 40px; }
.operation-fields--static .operation-process-text { font-size: 16px; }
@media (max-width: 900px) {
  .operation-fields--static .operation-process-shell { display: block; }
  .operation-fields--static .operation-fields-heading { display: block; margin-bottom: 32px; }
  .operation-process-intro { margin-top: 32px; }
}
@media (prefers-reduced-motion: reduce) {
  .operation-process-label { transition: none; }
}

/* Dark editorial catalogue: open text columns and numbering above each title. */
html body .operation-fields--static {
  background: #000;
  color: #fff;
  padding-inline: var(--pandect-nav-gutter);
}
.operation-fields--static .operation-process-shell {
  max-width: none;
  column-gap: clamp(32px, 3vw, 48px);
  row-gap: 64px;
}
html body .operation-fields--static .operation-fields-heading h2 {
  max-width: none;
  color: #fff !important;
}
.operation-fields--static .operation-process-intro {
  border-color: rgba(255, 255, 255, .5);
  padding-top: 22px;
  padding-right: clamp(32px, 3vw, 56px);
}
.operation-fields--static .operation-process-intro p {
  max-width: none;
  font-size: 23px;
  color: #e1e1e1;
}
@media (max-width: 900px) {
  .operation-fields--static .operation-process-intro { padding-right: 0; }
}
.operation-fields--static .operation-process-row {
  padding: 16px 0 28px;
  gap: 12px;
  border-color: rgba(255, 255, 255, .5);
}
html body .operation-fields--static .operation-process-row .operation-process {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px 12px;
  color: #fff;
  line-height: 1.25;
  font-weight: 400;
}
.operation-fields--static .operation-process-number {
  grid-column: 1 / -1;
  width: 26px;
  height: 22px;
  margin: 0;
  background: #252525;
  color: #e1e1e1;
}
.operation-fields--static .operation-process-label { grid-column: 1; }
.operation-fields--static .operation-process-arrow {
  grid-column: 1 / -1;
  display: inline-block;
  width: 26px;
  color: #fff;
  font-size: 23px;
  line-height: 22px;
  font-weight: 400;
}
html body .operation-fields--static .operation-process-row .operation-process--own {
  grid-template-columns: 24px minmax(0, 1fr);
  align-items: center;
}
.operation-fields--static .operation-process--own .operation-process-label { grid-column: 2; }
.operation-fields--static .operation-process--own svg {
  grid-column: 1;
  grid-row: 1;
  width: 24px;
  height: 24px;
  margin-top: 0;
  color: #fff;
}
.operation-fields--static .operation-process-panel { padding-left: 0; }
.operation-fields--static .operation-process-text {
  max-width: none;
  color: #d1d1d1;
  line-height: 1.5;
}
.operation-fields--static .operation-process:focus-visible { outline-color: #fff; }
@media (max-width: 900px) {
  .operation-fields--static .operation-process-intro { margin-bottom: 40px; }
}

/* Hook arrow, title and category share one aligned header. */
html body .operation-fields--static .operation-process-row .operation-process {
  display: flex;
  align-items: center;
  column-gap: 14px;
}
.operation-fields--static .operation-process-arrow,
.operation-fields--static .operation-process--own svg {
  grid-column: 1;
  grid-row: 1;
  width: 34px;
  height: 24px;
  margin-top: 0;
  flex: 0 0 34px;
}
.operation-fields--static .operation-process-arrow svg { display: block; }
.operation-fields--static .operation-process-arrow { transition: transform 420ms cubic-bezier(.22,1,.36,1); }
.operation-fields--static .operation-process-row:is(:hover, :focus-within) .operation-process-arrow { transform: translateX(16px); }
.operation-fields--static .operation-process--own .operation-process-wheel {
  width: 24px;
  height: 24px;
}
.operation-fields--static .operation-process .operation-process-label {
  grid-column: 2;
  grid-row: 1;
  margin-right: 0;
  flex: 0 1 auto;
  transition: transform 420ms cubic-bezier(.22, 1, .36, 1);
}
.operation-fields--static .operation-process-row:is(:hover, :focus-within) .operation-process-label {
  transform: translateX(16px);
}
.operation-fields--static .operation-process .operation-process-category {
  display: inline-block;
  grid-column: 3;
  grid-row: 1;
  margin: 0 16px 0 0;
  flex: none;
  padding: 5px 9px;
  border: 1px solid rgba(255, 255, 255, .65);
  border-radius: 5px;
  background: #000;
  color: #fff;
  font-size: 10px;
  line-height: 1.2;
  letter-spacing: .08em;
  white-space: nowrap;
  opacity: 0;
  visibility: hidden;
  transition: opacity 200ms ease, transform 420ms cubic-bezier(.22, 1, .36, 1), visibility 200ms;
}
.operation-fields--static .operation-process-row:is(:hover, :focus-within) .operation-process-category {
  opacity: 1;
  visibility: visible;
  transform: translateX(16px);
}
.operation-fields--static .operation-process--own .operation-process-category {
  background: #fff;
  color: #000;
  border-color: #fff;
}
.operation-fields--static .operation-process-panel { padding-left: 48px; }
.operation-fields--static .operation-process-row--own { padding-top: 28px; padding-bottom: 32px; }
html body .operation-fields--static .operation-process-row--own .operation-process { min-height: 42px; flex-wrap: wrap; row-gap: 20px; }
.operation-fields--static .operation-process-cta { flex: none; margin-left: 24px; opacity: 0; visibility: hidden; }@media (min-width: 721px) { /* Desktop CTA hover. */

.operation-fields--static .operation-process-row--own:is(:hover, :focus-within) .operation-process-cta { opacity: 1; visibility: visible; }
}
@media (max-width: 560px) {
  .operation-fields--static .operation-process-cta { margin-left: 48px; }
  html body .operation-fields--static .operation-process-row .operation-process { column-gap: 10px; }
  .operation-fields--static .operation-process .operation-process-category { padding: 5px 6px; font-size: 9px; }
  .operation-fields--static .operation-process-panel { padding-left: 44px; }
}
@media (prefers-reduced-motion: reduce) {
  .operation-fields--static .operation-process-arrow { transition: none; }
  .operation-fields--static .operation-process-row:is(:hover, :focus-within) .operation-process-arrow { transform: none; }
  .operation-fields--static .operation-process .operation-process-label { transition: none; }
  .operation-fields--static .operation-process-row:is(:hover, :focus-within) .operation-process-label { transform: none; }
  .operation-fields--static .operation-process .operation-process-category { transition: none; }
  .operation-fields--static .operation-process-row:is(:hover, :focus-within) .operation-process-category { transform: none; }
}

/* Two equally sized catalogue punchlines, with no introductory body copy. */
html body .operation-fields--static .operation-fields-heading .operation-catalogue-title { grid-column: 1 / -1; max-width: none; }
.operation-catalogue-title > span { display: block; }
.operation-catalogue-title__secondary { color: #797979; }
.operation-catalogue-title > span { max-width: 100%; white-space: normal; overflow-wrap: break-word; }

/* Align the catalogue list with the first punchline on desktop. */
@media (min-width: 901px) {
  html body .operation-fields--static .operation-fields-heading .operation-catalogue-title { grid-column: 1; grid-row: 1; font-size: clamp(28px, 2.6vw, 50px); }
  .operation-fields--static .operation-process-list { grid-column: 2; grid-row: 1; }
  .operation-fields--static .operation-process-row:first-child { padding-top: 6px; }
}

/* Keep catalogue text inside its column as the window narrows. */
html body .operation-fields--static .operation-fields-heading .operation-catalogue-title,
.operation-fields--static .operation-process-list { min-width: 0; }
.operation-fields--static .operation-process-label { min-width: 0; overflow-wrap: break-word; }
