/* Four connected stages: artwork, fine route, one short concrete explanation. */
#possibilities .workflow {
  --workflow-active: 0;
  --workflow-left: 0%;
  --workflow-right: 75%;
  --workflow-progress: 0;
  --workflow-ease: cubic-bezier(.22, 1, .36, 1);
  width:100%;
  margin-inline:0;
  color:#f6f6f1;
}
#possibilities .workflow-art {
  position:relative;
  isolation:isolate;
  width:100%;
  aspect-ratio:1928 / 720;
  margin:0;
  overflow:hidden;
}
#possibilities .workflow-art img {
  position:absolute;
  inset:-12% 0 auto;
  display:block;
  width:100%;
  height:auto;
  max-width:none;
  pointer-events:none;
}
#possibilities .workflow-art-base { opacity:1; transition:opacity .7s; }
#possibilities .workflow-art-focus { display:none; }
#possibilities .workflow.is-enhanced .workflow-art-base { opacity:.34; }
#possibilities .workflow.is-enhanced .workflow-art-focus {
  display:block;
  clip-path:inset(0 var(--workflow-right) 0 var(--workflow-left));
  transition:clip-path .7s var(--workflow-ease);
}
#possibilities .workflow-navigation { position:relative; margin-top:6px; }
#possibilities .workflow-track {
  position:absolute;
  top:6px;
  left:12.5%;
  width:75%;
  height:1px;
  background:#ffffff2b;
  pointer-events:none;
}
#possibilities .workflow-track::after {
  content:"";
  position:absolute;
  inset:0;
  background:#f4f4ed;
  transform:scaleX(var(--workflow-progress));
  transform-origin:left;
  transition:transform .7s var(--workflow-ease);
}
#possibilities .workflow-cursor {
  position:absolute;
  z-index:2;
  left:calc(var(--workflow-active) * 33.333333%);
  top:50%;
  width:9px;
  height:9px;
  border-radius:50%;
  background:#fafaf5;
  box-shadow:0 0 0 5px #ffffff13;
  transform:translate(-50%,-50%);
  transition:left .7s var(--workflow-ease),box-shadow .3s;
}
#possibilities .workflow-tabs {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:0;
  list-style:none;
  padding:0;
  margin:0;
}
#possibilities .workflow-tabs > li { padding:0; min-width:0; position:relative; }
#possibilities .workflow-tabs > li::before {
  content:"";
  position:absolute;
  top:4px;
  left:50%;
  width:5px;
  height:5px;
  background:#a4a6a0;
  border-radius:50%;
  transform:translateX(-50%);
}
#possibilities .workflow-tab {
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  gap:9px;
  padding:25px 8px 22px;
  min-height:88px;
  color:inherit;
  text-decoration:none;
  text-align:center;
  font-size:clamp(12px,1.3vw,18px);
  font-weight:600;
  line-height:1.65;
  letter-spacing:.02em;
  cursor:pointer;
  opacity:.62;
  -webkit-tap-highlight-color:transparent;
  transition:opacity .25s,transform .45s var(--workflow-ease);
}
#possibilities .workflow-tab-number { font:400 10px/1.2 Arial,sans-serif; letter-spacing:.12em; opacity:.65; }
#possibilities .workflow-tab[aria-selected="true"],
#possibilities .workflow-tab:hover { opacity:1; }
#possibilities .workflow-tab[aria-selected="true"] { transform:translateY(-2px); }
#possibilities .workflow-tab:focus-visible {
  outline:1px solid #f3f3ed;
  outline-offset:-4px;
  border-radius:3px;
  opacity:1;
}
#possibilities .workflow-hint { color:#babdb4; font-size:11px; line-height:1.8; text-align:right; margin:4px 0 0; }
#possibilities .workflow-panels {
  margin-top:20px;
  border-top:1px solid #ffffff2b;
}
#possibilities .workflow-panel {
  display:grid;
  grid-template-columns:56px minmax(180px,.9fr) minmax(0,1.2fr);
  align-items:start;
  gap:32px;
  padding:36px 0 0;
  margin:0;
  min-width:0;
  color:inherit;
  background:none;
  scroll-margin-top:100px;
}
#possibilities .workflow-panel + .workflow-panel { margin-top:36px; border-top:1px solid #ffffff2b; }
#possibilities .workflow-panel-number { font:400 38px/1.2 Arial,sans-serif; letter-spacing:-.045em; opacity:.36; }
#possibilities .workflow-panel h4 { font-size:clamp(21px,2.35vw,31px); line-height:1.55; font-weight:650; letter-spacing:-.035em; margin:0; }
#possibilities .workflow-panel p { font-size:14px; line-height:2; color:#d9dbd3; margin:0; max-width:460px; overflow-wrap:anywhere; }
#possibilities .workflow-panel:focus-visible { outline:1px solid #a9aaa2; outline-offset:7px; }
#possibilities .workflow-panel[hidden] { display:none; }
#possibilities .workflow.is-enhanced .workflow-panels { min-height:156px; }
#possibilities .workflow.is-enhanced .workflow-panel { margin-top:0; border:0; }
#possibilities .workflow:not(.is-enhanced) .workflow-track { display:none; }
#possibilities .workflow:not(.is-enhanced) .workflow-tab { opacity:1; }
@media (max-width:1023px) {
  #possibilities .workflow-panel { grid-template-columns:42px minmax(160px,.85fr) minmax(0,1.15fr); gap:22px; }
  #possibilities .workflow-panel h4 { font-size:25px; }
  #possibilities .workflow-panel p { font-size:13px; }
  #possibilities .workflow.is-enhanced .workflow-panels { min-height:164px; }
}
@media (max-width:767px) {
  #possibilities .workflow-art { width:calc(100% + 12px); margin-inline:-6px; }
  #possibilities .workflow-navigation { margin-top:10px; }
  #possibilities .workflow-tab { font-size:11px; letter-spacing:0; gap:7px; padding:22px 2px 17px; min-height:78px; }
  #possibilities .workflow-tab-number { font-size:9px; }
  #possibilities .workflow-hint { font-size:10px; text-align:center; }
  #possibilities .workflow-panels { margin-top:12px; }
  #possibilities .workflow-panel { grid-template-columns:32px minmax(0,1fr); gap:12px 14px; padding-top:24px; }
  #possibilities .workflow-panel-number { font-size:25px; margin-top:3px; }
  #possibilities .workflow-panel h4 { font-size:22px; line-height:1.55; }
  #possibilities .workflow-panel h4 br { display:none; }
  #possibilities .workflow-panel p { grid-column:2; font-size:12px; line-height:1.95; }
  #possibilities .workflow.is-enhanced .workflow-panels { min-height:156px; }
}
@media (max-width:359px) {
  #possibilities .workflow-tab { font-size:10px; }
  #possibilities .workflow-panel h4 { font-size:19px; }
  #possibilities .workflow-panel { grid-template-columns:26px minmax(0,1fr); gap:10px; }
  #possibilities .workflow-panel-number { font-size:23px; }
  #possibilities .workflow.is-enhanced .workflow-panels { min-height:174px; }
}
@media (hover:hover) and (pointer:fine) {
  #possibilities .workflow.is-enhanced .workflow-art { cursor:pointer; }
}
@media (prefers-reduced-motion:reduce) {
  #possibilities .workflow *, #possibilities .workflow *::before, #possibilities .workflow *::after { transition:none !important; animation:none !important; }
  #possibilities .workflow-tab[aria-selected="true"] { transform:none; }
}