/* Visual collaboration, six-stage route and management cycle. */
.approach {background:linear-gradient(180deg,#fff,#f5f9fc 84%,#fff)}
.collaboration-board {background:linear-gradient(122deg,#082846 8%,#0b4960 90%);padding:38px 36px 35px;color:#fff;border-radius:14px;box-shadow:0 24px 60px #163e5918}
.diagram-heading {display:flex;justify-content:space-between;align-items:center;gap:30px;margin-bottom:34px}
.diagram-heading h3 {font:400 29px/1.4 Georgia,serif;margin:0}
.diagram-heading>span {color:#8fcbd8;font-size:12px;letter-spacing:1.4px}
.collaboration-canvas,.journey-board,.cycle-layout {position:relative;isolation:isolate}
.diagram-svg {position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:-1;overflow:visible}
.orbital-nodes {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;position:relative}
.orbital-node {text-align:center;min-width:0}
.orbital-label {display:block;color:#94c8d7;font-size:12px;letter-spacing:1.1px;line-height:1.6}
.orbital-media {height:290px;display:grid;place-items:center;margin:17px 0 19px}
.diagram-orb {position:relative;display:block;border-radius:50%;background:#d4e8f3;box-shadow:0 10px 30px #03264120}
.diagram-orb>img {width:100%;height:100%;object-fit:cover;border-radius:50%}
.client-orb,.management-orb {width:220px;height:220px;border:4px solid #78c5d094;outline:1px solid #8ecbd04a;outline-offset:8px}
.shared-orb {width:280px;height:280px;border:5px solid #f0cb7b;outline:1px solid #e8c77a61;outline-offset:10px}
.shared-orb>img {object-fit:contain;padding:7%;background:#c4dfef}
.orbital-node h4 {font-size:20px;line-height:1.4;font-weight:600;margin:0 0 11px}
.orbital-node p {font-size:16px;line-height:1.7;color:#b7d4e3;margin:0}
.collaboration-results {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:90px}
.collaboration-results>div {display:flex;flex-direction:column;align-items:center;text-align:center;gap:14px}
.result-orb {display:grid;place-items:center;width:47px;height:47px;border-radius:50%;border:1px solid #e8c477b0;color:#f1cc80;background:#0b3b55;font-size:14px}
.collaboration-results strong {font-size:14px;font-weight:500;line-height:1.5}
.approach .roadmap-header {margin:70px 0 30px;gap:40px}
.approach .roadmap-header h3 {font-size:34px}
.approach .roadmap-header>p {max-width:330px;font-size:16px;line-height:1.7}
.journey-board.phase-tabs {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(2,350px);gap:42px 15px;padding:35px 30px 30px;margin:0 0 32px;background:linear-gradient(145deg,#edf5fa,#f9fcfe);border:1px solid #d4e3ed;border-radius:14px}
.journey-board.phase-tabs::before {content:"";inset:0;width:auto;height:auto;background-color:transparent;background-image:linear-gradient(#1d709008 1px,transparent 1px),linear-gradient(90deg,#1d709008 1px,transparent 1px);background-size:35px 35px;z-index:-2;border-radius:14px}
.journey-board.phase-tabs .journey-node {position:relative;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:25px;min-width:0;border:0;background:transparent;padding:15px 10px;color:var(--ink);font-size:16px;font-weight:400;line-height:1.6;border-radius:12px}
.journey-node[data-phase="0"] {grid-column:1;grid-row:1}
.journey-node[data-phase="1"] {grid-column:2;grid-row:1}
.journey-node[data-phase="2"] {grid-column:3;grid-row:1}
.journey-node[data-phase="3"] {grid-column:3;grid-row:2}
.journey-node[data-phase="4"] {grid-column:2;grid-row:2}
.journey-node[data-phase="5"] {grid-column:1;grid-row:2}
.journey-picture {flex-shrink:0;width:220px;height:220px;border:4px solid #c5dce8;outline:1px solid #cbdfe9;outline-offset:7px;transition:border-color .2s,box-shadow .2s,transform .2s}
.journey-picture>img {object-fit:contain;padding:6%;background:#c8e1ef}
.journey-number {position:absolute;right:0;bottom:5px;display:grid;place-items:center;width:45px;height:45px;border-radius:50%;background:#0a3b5b;border:3px solid #f4f9fc;color:#f3d08a;font-size:15px;font-weight:600;box-shadow:0 4px 10px #153e591c}
.journey-caption {display:flex;flex-direction:column;gap:6px;max-width:270px;min-width:0;text-align:center}
.journey-caption strong {font-size:21px;font-weight:600;color:#17415d;line-height:1.4}
.journey-caption>span {color:#536f84;font-size:15px;line-height:1.6}
.journey-board.phase-tabs .journey-node[aria-selected=true] {font-weight:400;color:var(--ink)}
.journey-node[aria-selected=true] .journey-picture {border-color:#d7b363;outline-color:#d7b363;box-shadow:0 0 0 12px #d5b46412,0 12px 32px #13476518}
.journey-node[aria-selected=true] .journey-number {background:#d1ad59;color:#163c55}
.journey-node[aria-selected=true] .journey-caption strong {color:#0b718c}
.journey-node:focus-visible {outline-offset:2px}
.visual-phase-panel {display:grid;grid-template-columns:1fr 1fr;gap:32px;padding:30px;border:1px solid #d9e6ee;border-radius:14px;background:#fff;box-shadow:0 15px 50px #103f5710}
.phase-visual {position:relative;aspect-ratio:1;min-width:0;border-radius:10px;overflow:hidden;background:#c4e0ef}
.phase-visual>img {width:100%;height:100%;object-fit:contain}
#phase-visual-index {position:absolute;bottom:22px;right:22px;display:grid;place-items:center;width:77px;height:77px;border-radius:50%;background:#082e50ef;color:#f2ce80;border:1px solid #c5a75b;font:400 31px/1 Georgia,serif;box-shadow:0 8px 24px #123d6a27}
.visual-phase-panel .phase-summary {align-self:center;padding:12px 10px 12px 12px;min-width:0}
.visual-phase-panel .phase-summary h3 {font:400 35px/1.26 Georgia,serif;color:#173d57;margin:0 0 21px}
.visual-phase-panel .phase-summary>p:not(.eyebrow) {font-size:17px;line-height:1.85;margin-bottom:28px}
.visual-phase-panel .phase-deliverable {padding:14px 0 14px 20px;border-left:3px solid #cba752}
.visual-phase-panel .phase-deliverable strong {font-size:17px;line-height:1.7}
.visual-phase-panel .phase-roles {grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:0;padding:0}
.visual-phase-panel .phase-roles>div {padding:24px 26px;border:1px solid #dce8ef;border-radius:8px;background:#eff6fa}
.visual-phase-panel .phase-roles>div+div {background:#f1f7f8;border:1px solid #d9e7ec}
.visual-phase-panel .phase-roles h4 {font-size:17px;line-height:1.5;margin-bottom:13px}
.visual-phase-panel .phase-roles p,.visual-phase-panel .phase-roles ul {font-size:16px;line-height:1.8}
.visual-phase-panel .phase-next {padding:25px 4px 2px;margin:0}
.visual-phase-panel .phase-next p {font-size:16px;line-height:1.7}
.phase-actions {display:flex;align-items:center;gap:24px;flex-shrink:0}
.phase-back {font-size:15px;color:#1d6a85;text-decoration:underline;text-underline-offset:5px}
.management-loop {margin-top:44px;border:1px solid #d7e5ed;border-radius:14px;background:linear-gradient(140deg,#f5f9fc,#eaf3f9);padding:38px 40px 32px;overflow:hidden}
.loop-heading {display:flex;align-items:flex-end;justify-content:space-between;gap:40px}
.loop-heading h3 {font:400 33px/1.3 Georgia,serif;color:#153d58;margin:0}
.loop-heading>p {max-width:380px;font-size:16px;color:#557186;line-height:1.8;margin:0}
.cycle-layout {--cycle-orb:200px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr));width:min(840px,100%);aspect-ratio:1;margin:52px auto 0}
.cycle-node {position:relative;justify-self:center;align-self:start;width:var(--cycle-orb);height:var(--cycle-orb)}
.cycle-node .diagram-orb {width:100%;height:100%;border:4px solid #d3e2eb;outline:1px solid #b2d2e0;outline-offset:7px;overflow:hidden}
.cycle-node .diagram-orb>img {object-fit:contain;padding:4%;background:#c4dfee}
.cycle-node .diagram-orb>span {position:absolute;left:9px;right:9px;bottom:12px;min-height:36px;display:grid;place-items:center;text-align:center;border-radius:20px;padding:7px;background:#0b3e5ceb;color:#fff;font-size:16px;line-height:1.4}
.cycle-node>i {position:absolute;right:-3px;top:4px;display:grid;place-items:center;width:35px;height:35px;border-radius:50%;border:3px solid #eff6fb;background:#d3b168;color:#163c53;font-style:normal;font-size:13px;font-weight:600}
.cycle-top {grid-row:1;grid-column:2}
.cycle-right {grid-row:2;grid-column:3}
.cycle-bottom {grid-row:3;grid-column:2}
.cycle-left {grid-row:2;grid-column:1}
.cycle-centre {position:relative;grid-row:2;grid-column:2;justify-self:center;align-self:start;width:var(--cycle-orb);height:var(--cycle-orb);border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:linear-gradient(145deg,#0a3557,#07637c);color:#fff;box-shadow:0 14px 45px #16496523;padding:15px}
.cycle-centre strong {font:400 27px/1.25 Georgia,serif}
.cycle-centre p {font-size:14px;line-height:1.6;color:#b4d4e3;margin:13px 0 0}
.cycle-centre-ring {position:absolute;inset:-10px;border:1px dashed #94b9c9;border-radius:50%;pointer-events:none}
.diagram-note {font-size:13px;line-height:1.8;color:#526f83;margin:7px 0 0;max-width:880px}
@media(hover:hover) {
  .journey-node:hover .journey-picture {border-color:#1992a6;box-shadow:0 14px 33px #173f6420}
  .journey-node[aria-selected=true]:hover .journey-picture {border-color:#d7b363}
}
@media(max-width:1150px) {
  .collaboration-board {padding:32px 28px}
  .diagram-heading h3 {font-size:27px}
  .client-orb,.management-orb {width:190px;height:190px}
  .shared-orb {width:230px;height:230px}
  .orbital-media {height:250px}
  .orbital-node h4 {font-size:18px}
  .journey-board.phase-tabs {grid-template-rows:repeat(2,320px);gap:35px 12px;padding:32px 24px}
  .journey-picture {width:190px;height:190px}
  .journey-caption strong {font-size:20px}
  .journey-caption>span {font-size:15px}
  .visual-phase-panel {padding:26px;gap:28px}
  .visual-phase-panel .phase-summary h3 {font-size:30px}
  .visual-phase-panel .phase-summary>p:not(.eyebrow) {font-size:16px}
  .cycle-layout {--cycle-orb:180px}
  .cycle-centre strong {font-size:25px}
  .cycle-centre p {font-size:13px}
}
@media(max-width:1000px) {
  .diagram-heading>span {display:none}
  .orbital-nodes {gap:12px}
  .client-orb,.management-orb {width:165px;height:165px}
  .shared-orb {width:205px;height:205px}
  .orbital-media {height:225px}
  .orbital-label {letter-spacing:.6px}
  .orbital-node p {font-size:15px}
  .journey-board.phase-tabs {grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(3,315px);gap:30px 18px}
  .journey-node[data-phase="0"] {grid-column:1;grid-row:1}
  .journey-node[data-phase="1"] {grid-column:2;grid-row:1}
  .journey-node[data-phase="2"] {grid-column:2;grid-row:2}
  .journey-node[data-phase="3"] {grid-column:1;grid-row:2}
  .journey-node[data-phase="4"] {grid-column:1;grid-row:3}
  .journey-node[data-phase="5"] {grid-column:2;grid-row:3}
  .journey-picture {width:200px;height:200px}
  .journey-caption strong {font-size:21px}
  .visual-phase-panel {grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:25px}
  .visual-phase-panel .phase-summary {padding:8px 0}
  .visual-phase-panel .phase-summary h3 {font-size:27px}
  .visual-phase-panel .phase-deliverable strong {font-size:16px}
  .loop-heading {display:block}
  .loop-heading>p {margin-top:22px;max-width:600px}
}
@media(max-width:800px) {
  .collaboration-board {padding:30px 24px}
  .orbital-nodes {gap:10px}
  .client-orb,.management-orb {width:145px;height:145px}
  .shared-orb {width:185px;height:185px}
  .orbital-media {height:205px}
  .orbital-node h4 {font-size:17px}
  .orbital-node p {font-size:14px}
  .collaboration-results {margin-top:80px;gap:13px}
  .collaboration-results strong {font-size:14px}
  .journey-board.phase-tabs {padding:30px 22px;grid-template-rows:repeat(3,310px)}
  .journey-picture {width:190px;height:190px}
  .visual-phase-panel {grid-template-columns:minmax(0,1fr);padding:25px}
  .phase-visual {aspect-ratio:5/4;max-height:500px}
  .visual-phase-panel .phase-summary {padding:4px 3px}
  .visual-phase-panel .phase-summary h3 {font-size:32px}
  .visual-phase-panel .phase-roles {gap:17px}
  .visual-phase-panel .phase-roles>div {padding:23px}
  .management-loop {padding:30px 25px}
  .cycle-layout {--cycle-orb:160px;margin-top:40px}
  .cycle-node .diagram-orb>span {font-size:14px;left:6px;right:6px;bottom:7px;padding:6px;min-height:32px}
  .cycle-centre strong {font-size:23px}
  .cycle-centre p {font-size:12px}
}
@media(max-width:650px) {
  .collaboration-board {padding:27px 22px}
  .diagram-heading {margin-bottom:29px}
  .diagram-heading h3 {font-size:25px}
  .orbital-nodes {grid-template-columns:minmax(0,1fr);gap:55px}
  .orbital-media {height:225px;margin:14px 0 17px}
  .client-orb,.management-orb {width:200px;height:200px}
  .shared-orb {width:220px;height:220px}
  .orbital-node h4 {font-size:21px}
  .orbital-node p {font-size:16px}
  .collaboration-results {margin-top:37px;padding-top:25px;border-top:1px solid #94c9d22b;grid-template-columns:minmax(0,1fr);gap:20px}
  .collaboration-results>div {flex-direction:row;text-align:left;gap:18px}
  .result-orb {width:41px;height:41px;flex-shrink:0}
  .collaboration-results strong {font-size:15px}
  .approach .roadmap-header {margin-top:50px}
  .approach .roadmap-header h3 {font-size:29px}
  .approach .roadmap-header>p {max-width:none;font-size:16px}
  .journey-board.phase-tabs {grid-template-columns:minmax(0,1fr);grid-template-rows:none;grid-auto-rows:215px;gap:27px;padding:26px 19px}
  .journey-board.phase-tabs .journey-node {grid-column:1;grid-row:auto;display:grid;grid-template-columns:150px minmax(0,1fr);align-items:center;justify-items:center;gap:24px;padding:0}
  .journey-picture {width:150px;height:150px;border-width:3px;outline-offset:5px}
  .journey-number {width:36px;height:36px;right:-2px;bottom:3px;font-size:14px}
  .journey-caption {text-align:left;justify-self:start;gap:8px}
  .journey-caption strong {font-size:21px}
  .journey-caption>span {font-size:15px}
  .visual-phase-panel {padding:22px;gap:24px}
  .phase-visual {aspect-ratio:1;max-height:none}
  #phase-visual-index {width:61px;height:61px;font-size:27px;right:17px;bottom:17px}
  .visual-phase-panel .phase-summary h3 {font-size:29px}
  .visual-phase-panel .phase-roles {grid-template-columns:minmax(0,1fr);gap:18px}
  .visual-phase-panel .phase-next {flex-direction:column;align-items:stretch;gap:20px}
  .visual-phase-panel .phase-next .button {align-self:flex-start}
  .phase-actions {gap:20px;flex-wrap:wrap}
  .management-loop {padding:28px 22px}
  .loop-heading h3 {font-size:29px}
  .cycle-layout {--cycle-orb:190px;display:flex;flex-direction:column;align-items:center;gap:62px;width:100%;aspect-ratio:auto;margin:35px auto 30px}
  .cycle-centre {order:-1;width:200px;height:200px;flex-shrink:0;margin-bottom:8px}
  .cycle-centre strong {font-size:27px}
  .cycle-centre p {font-size:14px}
  .cycle-node {flex-shrink:0}
  .cycle-node,.cycle-centre {align-self:center}
  .cycle-node .diagram-orb>span {font-size:16px;min-height:36px;bottom:10px;padding:7px}
  .cycle-node>i {width:35px;height:35px;font-size:13px}
  .diagram-note {margin-top:0}
}
@media(max-width:430px) {
  .journey-board.phase-tabs {grid-auto-rows:200px;padding:24px 14px;gap:24px}
  .journey-board.phase-tabs .journey-node {grid-template-columns:126px minmax(0,1fr);gap:19px}
  .journey-picture {width:126px;height:126px;outline-offset:4px}
  .journey-number {width:33px;height:33px;font-size:13px;bottom:0}
  .journey-caption strong {font-size:18px}
  .journey-caption>span {font-size:14px}
  .visual-phase-panel {padding:19px}
  .visual-phase-panel .phase-summary h3 {font-size:27px}
  .visual-phase-panel .phase-roles>div {padding:21px 19px}
  .management-loop {padding:25px 18px}
  .cycle-layout {--cycle-orb:176px}
  .cycle-centre {width:190px;height:190px}
}
@media(max-width:360px) {
  .journey-board.phase-tabs .journey-node {grid-template-columns:104px minmax(0,1fr);gap:12px}
  .journey-picture {width:104px;height:104px}
  .journey-caption {max-width:100%;overflow-wrap:anywhere}
  .journey-caption strong {font-size:17px}
  .journey-number {width:30px;height:30px;font-size:12px}
}
@media(prefers-reduced-motion:reduce) {
  .journey-picture {transition:none}
}