/* How we work: page composition, using the approved shared design system. */
.cs-page-work .work-hero { padding-block:56px; }
.cs-page-work .work-hero-grid { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); gap:64px; align-items:center; }
.cs-page-work .work-hero h1 { text-wrap:balance; }
.cs-page-work .work-hero h1 span { display:block; text-wrap:balance; }
.cs-page-work .work-hero .cs-eyebrow { color:var(--cs-text); }
.cs-page-work .work-hero .cs-lead { max-width:58ch; margin-top:32px; }
.cs-page-work .work-starting-points { --diagram-line:#7d8594; padding:32px; background:var(--cs-navy); border:1px solid var(--cs-line); border-radius:10px; }
.cs-page-work .work-starting-points ul { margin:0; padding:0 0 24px; list-style:none; border-bottom:1px solid var(--cs-line); }
.cs-page-work .work-starting-points li { margin:0; }
.cs-page-work .work-starting-points li+li { margin-top:20px; padding-top:20px; border-top:1px solid var(--cs-line); }
.cs-page-work .work-choice { display:grid; grid-template-columns:52px minmax(0,1fr); gap:8px 20px; text-decoration:none; }
.cs-page-work .work-choice .work-choice-art { grid-column:1; grid-row:1 / span 2; width:52px; height:52px; fill:#ffffff04; }
.cs-page-work .work-choice .work-choice-accent { fill:var(--cs-red); stroke:var(--cs-red); }
.cs-page-work .work-choice .work-choice-on-accent { fill:none; stroke:#fff; }
.cs-page-work .work-choice h2 { grid-column:2; margin:0; font-size:20px; font-weight:500; line-height:1.4; letter-spacing:-.015em; text-wrap:initial; text-decoration:underline; text-decoration-color:#7d8594; text-decoration-thickness:1px; text-underline-offset:5px; }
.cs-page-work .work-choice p { grid-column:2; margin:0; font-size:15px; line-height:1.5; }
.cs-page-work .work-choice:hover h2 { text-decoration-color:var(--cs-text); }
.cs-page-work .work-starting-points .work-starting-note { margin:24px 0 0; font-size:16px; line-height:1.6; }
/* The ordered list is the visual journey; its reading order never changes. */
.cs-page-work .work-journey { --work-marker-size:48px; --work-row-inset:8px; list-style:none; margin:0; padding:0; }
.cs-page-work .work-journey li { position:relative; display:grid; grid-template-columns:var(--work-marker-size) minmax(0,.85fr) minmax(0,1.5fr); gap:32px; align-items:start; margin:0; padding-block:24px; padding-left:var(--work-row-inset); }
.cs-page-work .work-journey li:not(:last-child)::before { content:''; position:absolute; left:calc(var(--work-row-inset) + var(--work-marker-size) / 2); top:calc(24px + var(--work-marker-size)); bottom:-24px; width:1.5px; transform:translateX(-50%); background:#a1a6af; }
.cs-page-work .work-step-number { display:grid; place-items:center; width:var(--work-marker-size); height:var(--work-marker-size); border:1.5px solid #737b87; border-radius:50%; font-size:16px; font-weight:500; line-height:1; color:var(--cs-red); background:var(--cs-paper); }
.cs-page-work .work-journey h3 { font-size:26px; font-weight:500; line-height:1.3; margin:4px 0 0; text-wrap:balance; }
.cs-page-work .work-journey p { margin:0; }
.cs-page-work .work-care { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:32px 48px; align-items:center; margin-top:40px; padding:32px; border:1px solid var(--cs-line); border-radius:10px; background:var(--cs-navy); }
.cs-page-work .work-care .cs-eyebrow { color:var(--cs-muted); margin:0 0 12px; }
.cs-page-work .work-care h3 { color:var(--cs-text); font-size:26px; font-weight:500; margin-bottom:16px; }
.cs-page-work .work-care p { color:var(--cs-muted); }
.cs-page-work .work-care .cs-link { color:var(--cs-text); justify-self:start; }
.cs-page-work .work-care .cs-link-label { text-decoration-color:#8b929e; }
.cs-page-work .work-care a:focus-visible { outline-color:var(--cs-text); }
.cs-page-work .work-collaboration { border-bottom:1px solid var(--cs-line); }
.cs-page-work .work-collaboration-grid { display:grid; grid-template-columns:1fr 1fr; gap:48px; }
.cs-page-work .work-collaboration-grid>div+div { padding-left:48px; border-left:1px solid var(--cs-line); }
.cs-page-work .work-collaboration-grid h3 { font-size:26px; font-weight:500; line-height:1.3; margin-bottom:16px; text-wrap:balance; }
@media (min-width:1001px) and (max-width:1200px) {
  .cs-page-work .work-hero-grid { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:40px; }
  .cs-page-work .work-hero h1 { font-size:48px; }
  .cs-page-work .work-starting-points { padding:28px; }
  .cs-page-work .work-choice { grid-template-columns:48px minmax(0,1fr); column-gap:16px; }
  .cs-page-work .work-choice .work-choice-art { width:48px; height:48px; }
}
@media (max-width:1000px) {
  .cs-page-work .work-hero-grid { grid-template-columns:1fr; gap:32px; }
  .cs-page-work .work-care { grid-template-columns:1fr; gap:20px; }
}
@media (max-width:900px) {
  .cs-page-work .work-journey { --work-marker-size:40px; }
  .cs-page-work .work-journey li { grid-template-columns:var(--work-marker-size) minmax(0,1fr); gap:12px 24px; }
  .cs-page-work .work-step-number { grid-column:1; grid-row:1 / span 2; }
  .cs-page-work .work-journey h3, .cs-page-work .work-journey p { grid-column:2; }
  .cs-page-work .work-journey h3 { text-wrap:initial; margin-top:2px; }
  .cs-page-work .work-collaboration-grid { grid-template-columns:1fr; gap:32px; }
  .cs-page-work .work-collaboration-grid>div+div { padding:32px 0 0; border-left:0; border-top:1px solid var(--cs-line); }
  .cs-page-work .work-collaboration-grid h3 { text-wrap:initial; }
}
@media (max-width:600px) {
  .cs-page-work .work-hero { padding-block:48px; }
  .cs-page-work .work-hero .cs-lead { margin-top:24px; }
  .cs-page-work .work-starting-points { padding:24px; }
  .cs-page-work .work-choice { grid-template-columns:40px minmax(0,1fr); gap:12px 16px; }
  .cs-page-work .work-choice .work-choice-art { width:40px; height:40px; grid-row:1; }
  .cs-page-work .work-choice p { grid-column:1 / -1; }
  .cs-page-work .work-journey { --work-marker-size:32px; }
  .cs-page-work .work-journey li { column-gap:16px; }
  .cs-page-work .work-step-number { font-size:14px; }
  .cs-page-work .work-journey h3, .cs-page-work .work-care h3, .cs-page-work .work-collaboration-grid h3 { font-size:24px; }
  .cs-page-work .work-journey h3 { margin-top:0; }
  .cs-page-work .work-care { padding:24px; margin-top:32px; }
}
@media (max-width:360px) {
  .cs-page-work .work-starting-points, .cs-page-work .work-care { padding:20px; }
}