/* Responsive refinements reuse the existing AO gutters and process markup. */
/* The connector spans the shared container rather than its old 1365px canvas. */
body.work-page .work-process-divider { width:100%; max-width:100%; height:65px; }
@media (orientation:portrait) and (max-width:1199px),
       (max-width:700px),
       (orientation:landscape) and (max-height:500px) and (max-width:1100px) {
  body.work-page .work-hero { height:auto; min-height:0; }
  body.work-page .work-hero-inner { height:auto; padding-block:48px 56px; }
  body.work-page .work-hero :is(.work-eyebrow,h1,.work-hero-copy) { position:relative; inset:auto; }
  body.work-page .work-hero h1 { margin-top:20px; text-wrap:balance; }
  body.work-page .work-hero-copy { margin-top:24px; }
  body.work-page .work-process { padding-block:48px; }
  body.work-page .work-process-header { height:auto; padding-bottom:32px; }
  body.work-page .work-process-header h2 { height:auto; }
  body.work-page .work-process-divider, body.work-page .work-process-list::after { display:none; }
  body.work-page .work-process-step, body.work-page .work-process-step.is-expanded { height:auto; padding-bottom:24px; }
  body.work-page .work-process-toggle { height:auto; padding:24px 20px 24px 48px; }
  body.work-page .work-process-surface, body.work-page .work-process-step.is-expanded .work-process-surface {
    inset:0 0 0 28px; width:auto; height:auto; transform:none;
  }
  body.work-page .work-process-content, body.work-page .work-process-step.is-expanded .work-process-content {
    position:relative; inset:auto; width:100%; display:flex; flex-direction:column; gap:10px; transform:none;
  }
  body.work-page .work-process-content > span { position:relative; inset:auto; width:100%; max-width:100%; }
  body.work-page .work-process-step:not(.is-expanded) .work-process-details { display:none; }
  body.work-page .work-process-step.is-expanded .work-process-details { width:100%; opacity:1; transform:none; }
  body.work-page .work-process-spine { height:calc(100% + 24px); }
  body.work-page .work-process-step:last-child .work-process-spine { height:51px; }
  body.work-page .work-process-node { top:40px; }
  body.work-page .work-process-branch, body.work-page .work-process-step.is-expanded .work-process-branch { top:50px; width:17px; }
  body.work-page .work-process-title { font-size:22px; line-height:28px; }
  body.work-page .work-process-summary { font-size:15px; line-height:22px; }
  body.work-page .work-process-details { font-size:15px; line-height:24px; }
  body.work-page :is(.work-difference-grid,.work-accompaniment-grid) { margin-top:32px; }
}
@media (orientation:portrait) and (min-width:701px) and (max-width:1199px) {
  body.work-page .work-hero h1 { font-size:clamp(40px,5vw,52px); line-height:1.12; }
  body.work-page .work-difference-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
  body.work-page .work-difference-card { min-height:0; padding:32px 26px; }
  body.work-page .work-accompaniment-card { min-height:0; padding:24px 26px 32px; }
}
@media (max-width:700px), (orientation:landscape) and (max-height:500px) and (max-width:1100px) {
  body.work-page .work-difference-grid { grid-template-columns:minmax(0,1fr); gap:20px; }
  body.work-page .work-difference-card { min-height:0; padding:32px 26px; }
  body.work-page .work-hero .work-eyebrow { font-size:12px; line-height:18px; }
  body.work-page .work-hero-copy { font-size:16px; line-height:26px; }
  body.work-page :is(.work-difference h2,.work-accompaniment h2,.work-statement h2,.work-process-header h2) { font-size:30px; line-height:38px; }
}

/* Targeted portrait-tablet card and FAQ refinements. */
@media (orientation:portrait) and (min-width:701px) and (max-width:1199px) {
  body.work-page .work-accompaniment-grid { grid-template-columns:minmax(0,1fr); grid-auto-rows:1fr; gap:24px; }
  body.work-page .work-accompaniment-card,
  body.work-page .work-accompaniment-card:last-child:nth-child(odd) { grid-column:1; padding:28px 26px; }
  body.work-page .work-accompaniment-card .work-card-number { position:absolute; top:28px; right:26px; left:auto; width:auto; }
  body.work-page .work-accompaniment-card h3 { margin-top:0; padding-right:44px; }
  body.work-page .work-accompaniment-card .work-card-copy { margin-top:16px; }
  body.work-page .work-faq .leistungen-faq-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
  body.work-page .work-faq .leistungen-faq-toggle > span { width:100%; max-width:none; }
  body.work-page .work-faq .leistungen-faq-answer { max-width:none; }
}
@media (max-width:700px), (orientation:landscape) and (max-height:500px) and (max-width:1100px) {
  body.work-page .work-process-static { cursor:default; }
  /* Preserve each card's original surface colour after the phone-only reorder. */
  body.work-page .work-difference-card:nth-child(3)::before { background:#ebf2fa; }
  body.work-page .work-difference-card:nth-child(4)::before { background:#fff2e5; }
  body.work-page .work-process-step,
  body.work-page .work-process-step * { transition:none!important; animation:none!important; }
}
