/* Runa designs a tailored API → Qonquester executes the private workflow. */
.qcw-product-path {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-block: 24px;
  border-bottom: 1px solid #3b3027;
  scroll-margin-top: 0;
}
.qcw-product-path a {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 7px;
  min-width: 0;
  min-height: 92px;
  padding: 16px 24px;
  border-bottom: 2px solid transparent;
  color: #c6beb3;
}
.qcw-product-path a + a { border-left: 1px solid #3b3027; }
.qcw-product-path a[aria-current="page"] {
  border-bottom-color: #ea5b1e;
  background: linear-gradient(180deg, transparent, rgba(234,91,30,.07));
  color: #fff1e7;
}
.qcw-path-name { font-size: 18px; font-weight: 500; line-height: 1.3; letter-spacing: -.025em; }
.qcw-path-name > span { margin-left: 8px; color: #c99576; }
.qcw-path-role { font-size: 13px; line-height: 1.55; color: #aaa195; }
.qcw-product-path a:hover { color: #ffc49e; }
.qcw-product-path a:focus-visible { outline: 2px solid #ffc49e; outline-offset: 4px; }
@media (max-width: 700px) {
  .qcw-product-path { margin-block: 16px; }
  .qcw-product-path a { padding: 14px 12px; min-height: 100px; }
  .qcw-path-name { font-size: 16px; }
  .qcw-path-name > span { margin-left: 4px; }
  .qcw-path-role { font-size: 12px; }
}
.qcw-overview {
  background: #0a0a0b;
  color: #f4f2ef;
  padding: clamp(56px, 7vw, 104px) 0;
  scroll-margin-top: 100px;
}
.qcw-container { width: min(100% - 80px, 1320px); margin-inline: auto; }
.qcw-lead, .qcw-two-column {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(28px, 4vw, 56px);
  align-items: start;
}
.qcw-overview .qcw-lead { align-items: center; }
.qcw-eyebrow, .qdd-section .qcw-eyebrow {
  color: #f09a6c;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .14em;
  line-height: 1.5;
  text-transform: uppercase;
  margin: 0 0 18px;
  overflow-wrap: anywhere;
}
.qcw-overview h2 {
  font-size: clamp(30px, 3.3vw, 48px);
  font-weight: 500;
  line-height: 1.13;
  letter-spacing: -.04em;
  margin: 0 0 24px;
  max-width: 18ch;
  text-wrap: balance;
}
.qcw-overview p { font-size: 17px; line-height: 1.7; color: #bdb8b1; margin: 0 0 18px; }
.qcw-overview .qcw-eyebrow { color: #f09a6c; font-size: 12px; line-height: 1.5; }
.qcw-overview strong { color: #efebe5; font-weight: 500; }
.qcw-service-boundary {
  margin-top: 26px;
  padding: 16px 0 16px 20px;
  border-left: 2px solid #bb5c2e;
}
.qcw-service-boundary p:last-child { margin-bottom: 0; }
.qcw-service-boundary strong { color: #f4ede5; }
.qcw-service-boundary:has(> div) { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 36px; border-left: 0; border-top: 1px solid #443225; padding: 26px 0 0; }
.qcw-service-boundary > div { min-width: 0; }
.qcw-workflow, .qdd-section .qcw-workflow {
  list-style: none;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 24px;
  padding: 0;
  margin: 44px 0 32px;
}
.qcw-step, .qdd-section .qcw-step { position: relative; min-width: 0; padding: 0; margin: 0; }
.qcw-workflow-three, .qdd-section .qcw-workflow-three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.qcw-step:not(:last-child)::after {
  content: '';
  position: absolute;
  left: 48px;
  right: -24px;
  top: 20px;
  height: 1px;
  background: linear-gradient(90deg, #854b2f, #3f2c21);
}
.qcw-step-number {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border: 1px solid #8b5133;
  border-radius: 50%;
  color: #f1a47a;
  font-size: 12px;
  font-weight: 500;
  margin-bottom: 22px;
}
.qcw-step h3, .qdd-section .qcw-step h3 { color: #f0ece6; font-size: 19px; font-weight: 500; line-height: 1.35; margin: 0 0 10px; letter-spacing: -.025em; }
.qcw-step p, .qdd-section .qcw-step p { color: #b5afa6; font-size: 15px; line-height: 1.65; margin: 0; }
.qcw-demo { margin: 0; min-width: 0; }
.qcw-demo-poster {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border: 1px solid #64412c;
  border-radius: 3px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: clamp(18px, 3vw, 32px);
  isolation: isolate;
  background: #15120f;
}
.qcw-demo-poster > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  opacity: .65;
  z-index: -2;
}
.qcw-demo-poster::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(180deg, rgba(8,8,9,.12), rgba(8,8,9,.6) 55%, rgba(8,8,9,.92));
}
.qcw-demo-label, .qdd-section .qcw-demo-label {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  color: #efe6dc;
  font-size: 11px;
  line-height: 1.4;
  font-weight: 500;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.qcw-demo-label > span { color: #ffb288; }
.qcw-demo-play {
  display: grid;
  place-items: center;
  width: 50px;
  height: 50px;
  border: 1px solid rgba(255,189,145,.55);
  border-radius: 50%;
  color: #ffd2b3;
  margin-bottom: auto;
}
.qcw-demo-play svg { width: 18px; height: 18px; margin-left: 3px; }
.qcw-demo-title { color: #fff6ed; font-size: clamp(20px, 2.2vw, 28px); font-weight: 500; line-height: 1.15; letter-spacing: -.03em; margin: 12px 0 0; max-width: 21ch; }
.qcw-runa-demo { background: radial-gradient(ellipse at 78% 45%, #332218, #15110f 60%, #0c0b0b); }
.qcw-runa-demo > img { left: auto; right: 0; width: 46%; object-fit: contain; object-position: right center; opacity: .85; }
.qcw-runa-demo::before { background: linear-gradient(90deg, rgba(8,8,9,.28), rgba(8,8,9,.12)), linear-gradient(0deg, rgba(8,8,9,.86), transparent 65%); }
.qcw-runa-demo .qcw-demo-title { max-width: 66%; }
.qcw-platform-overview .qcw-links { margin-top: 28px; }
.qcw-demo-caption { color: #a8a298; font-size: 13px; line-height: 1.6; margin: 12px 0 0; }
.qcw-overview .qcw-demo-caption { font-size: 13px; line-height: 1.6; margin: 12px 0 0; }
.qcw-example { border-top: 1px solid #463226; padding-top: 32px; margin-top: 44px; }
.qcw-example h3 { color: #f4ede4; font-size: 26px; font-weight: 500; letter-spacing: -.03em; margin: 0 0 16px; }
.qcw-example h4 { color: #f4ede4; font-size: 19px; line-height: 1.4; font-weight: 500; letter-spacing: -.02em; margin: 0 0 16px; }
#scheduling-api-design, #api-contract { scroll-margin-top: 0; }
.qcw-case-path { margin: 28px 0 36px; padding: 20px 0; border-block: 1px solid #443225; }
.qcw-case-path > p:last-child { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; margin: 0; }
.qcw-case-path a { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; color: #ffc099; font-size: 16px; }
.qcw-case-path > p > span { color: #a06d4d; }
.qcw-contract { margin-top: 44px; padding-top: 32px; border-top: 1px solid #65412d; }
.qcw-contract > p > a { display: inline-block; max-width: 100%; color: #ffc099; text-decoration: underline; text-underline-offset: 4px; }
.qcw-contract-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; margin-top: 28px; padding: 24px; border: 1px solid #443225; background: #14100e; }
.qcw-contract-fields > div { min-width: 0; }
.qcw-contract-fields .qcw-eyebrow { margin-bottom: 10px; }
.qcw-contract-fields p:last-child { margin: 0; font-size: 16px; }
.qcw-case-path a:focus-visible, .qcw-contract > p > a:focus-visible { outline: 2px solid #ffc49e; outline-offset: 5px; }
.qcw-example .qcw-two-column { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); }
.qcw-input-list, .qdd-section .qcw-input-list { list-style: none; padding: 0; margin: 18px 0 24px; }
.qcw-input-list li, .qdd-section .qcw-input-list li { color: #bdb6ac; padding: 10px 0; margin: 0; border-bottom: 1px solid #28221d; font-size: 15px; line-height: 1.65; }
.qcw-input-list strong { display: block; color: #f1e5d7; margin-bottom: 2px; font-weight: 500; }
.qcw-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin: 0 0 24px; padding: 0; }
.qcw-metrics > div { min-width: 0; }
.qcw-metrics dt { color: #b6aea2; font-size: 12px; line-height: 1.5; }
.qcw-metrics dd { color: #ffc49e; font-size: clamp(27px, 2.6vw, 36px); letter-spacing: -.04em; font-weight: 500; line-height: 1.2; margin: 7px 0 0; }
.qcw-metrics strong { display: block; color: #ffc49e; font-size: clamp(27px, 2.6vw, 36px); font-weight: 500; line-height: 1.2; margin-bottom: 7px; }
.qcw-metrics span { display: block; color: #b6aea2; font-size: 12px; line-height: 1.5; }
.qdd-section .qcw-demo { max-width: 900px; margin: 32px auto 0; }
.qdd-section .qcw-demo-poster > div > p:last-child { font-size: 14px; color: #d6bba6; margin: 12px 0 0; }
.qdd-section .qcw-demo-title { max-width: 24ch; font-size: clamp(26px, 3vw, 40px); }
.qdd-section .qcw-demo-play { margin-bottom: 28px; }
.qcw-table-wrap { overflow-x: auto; max-width: 100%; border: 1px solid #3b3027; margin: 20px 0; }
.qcw-table { width: 100%; border-collapse: collapse; font-size: 14px; line-height: 1.5; color: #d5cec3; text-align: left; }
.qcw-table caption { color: #f1e5d7; font-size: 13px; font-weight: 500; text-align: left; padding: 14px 16px; border-bottom: 1px solid #3b3027; }
.qcw-table th, .qcw-table td { padding: 12px 16px; border-bottom: 1px solid #2e2721; vertical-align: top; }
.qcw-table thead th { background: #14110f; color: #eeb089; font-size: 12px; font-weight: 500; }
.qcw-table tbody th { font-weight: 500; color: #e4d9ca; }
.qcw-table tbody tr:last-child > * { border-bottom: 0; }
.qcw-note, .qdd-section .qcw-note { font-size: 13px; line-height: 1.65; color: #a99f93; margin: 16px 0; }
.qcw-overview .qcw-note { font-size: 13px; line-height: 1.65; }
.qcw-links, .qcw-downloads { display: flex; flex-wrap: wrap; gap: 12px 24px; margin-top: 20px; }
.qcw-links a, .qcw-downloads a { display: inline-flex; align-items: center; min-height: 44px; color: #ffc099; border-bottom: 1px solid #735039; font-size: 14px; line-height: 1.5; }
.qcw-links a:hover, .qcw-downloads a:hover { color: #ffe0c9; border-color: #ffc099; }
.qcw-details { border-top: 1px solid #443225; margin-top: 20px; }
.qcw-details summary { color: #f3b68e; cursor: pointer; font-size: 15px; line-height: 1.5; padding: 18px 0; }
.qcw-details[open] summary { border-bottom: 1px solid #33271e; margin-bottom: 20px; }
.qcw-code { max-width: 100%; overflow-x: auto; white-space: pre; tab-size: 2; padding: 20px; border: 1px solid #3a2e25; background: #0d0c0b; color: #e0c4ac; font: 13px/1.7 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
.qcw-result { padding-top: 24px; margin-top: 24px; border-top: 1px solid #443225; }
.qcw-section-nav a:nth-child(3n + 1) { border-left: 0; padding-left: 0; }
.qcw-section-nav a:nth-child(n + 4) { border-top: 1px solid var(--qdd-line); }
.qcw-section-nav a, .qcw-details summary { scroll-margin-top: 100px; }
.qcw-links a:focus-visible, .qcw-downloads a:focus-visible, .qcw-details summary:focus-visible {
  outline: 2px solid #ffc49e;
  outline-offset: 5px;
}
@media (max-width: 1000px) {
  .qcw-workflow, .qdd-section .qcw-workflow { grid-template-columns: 1fr; gap: 0; }
  .qcw-step, .qdd-section .qcw-step { padding: 0 0 28px 64px; }
  .qcw-step-number { position: absolute; left: 0; top: 0; margin: 0; }
  .qcw-step:not(:last-child)::after { top: 48px; left: 20px; right: auto; bottom: 8px; width: 1px; height: auto; background: #59402e; }
  .qcw-step:last-child, .qdd-section .qcw-step:last-child { padding-bottom: 0; }
  .qcw-step h3, .qdd-section .qcw-step h3 { margin-top: 6px; }
  .qcw-step p { max-width: 68ch; }
}
@media (max-width: 700px) {
  .qcw-container { width: calc(100% - 40px); }
  .qcw-lead, .qcw-two-column, .qcw-example .qcw-two-column, .qcw-service-boundary:has(> div) { grid-template-columns: 1fr; gap: 28px; }
  .qcw-overview { padding-block: 48px 60px; }
  .qcw-overview h2 { font-size: clamp(30px, 8vw, 42px); }
  .qcw-overview p { font-size: 16px; line-height: 1.65; }
  .qcw-service-boundary { margin-top: 20px; padding: 10px 0 10px 16px; }
  .qcw-workflow, .qdd-section .qcw-workflow { margin-top: 32px; }
  .qcw-step, .qdd-section .qcw-step { padding-left: 56px; }
  .qcw-example { margin-top: 36px; padding-top: 28px; }
  .qcw-contract-fields { grid-template-columns: 1fr; gap: 24px; padding: 18px; }
  .qcw-case-path > p:last-child { flex-direction: column; align-items: flex-start; gap: 4px; }
  .qcw-case-path > p > span { display: none; }
  .qcw-metrics { gap: 12px; }
  .qcw-table th, .qcw-table td { padding: 10px 12px; }
  .qcw-demo-title { font-size: 23px; }
  .qcw-demo-play { width: 40px; height: 40px; }
  .qcw-runa-demo { min-height: 230px; }
  .qcw-runa-demo .qcw-demo-title { font-size: 22px; max-width: 72%; }
  .qdd-section .qcw-runa-demo .qcw-demo-title { font-size: 24px; }
  .qdd-section .qcw-demo-poster { min-height: 260px; }
  .qdd-section .qcw-demo-play { margin-bottom: 18px; }
  .qcw-section-nav > .qdd-container { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .qcw-section-nav a, .qcw-section-nav a:nth-child(3n + 1) { padding: 14px 12px; min-height: 64px; border-left: 1px solid var(--qdd-line); }
  .qcw-section-nav a:nth-child(2n + 1) { border-left: 0; padding-left: 0; }
  .qcw-section-nav a:nth-child(n + 3) { border-top: 1px solid var(--qdd-line); }
  .qcw-code { padding: 14px; font-size: 12px; }
}