/* Cloud Waypoint diagram system. Approved public tokens; one semantic teal extension. */
:root{--cw-outcome:#087e83}
.cw-diagram{--dg-ink:var(--wwt-navy);--dg-blue:var(--wwt-blue);--dg-teal:var(--cw-outcome);--dg-line:color-mix(in srgb,var(--wwt-blue) 24%,white);--dg-paper:white;--dg-fill:var(--soft);--dg-shadow:color-mix(in srgb,var(--wwt-navy) 9%,transparent);container-type:inline-size;color:var(--dg-ink);margin:32px 0;padding:28px 24px;background:linear-gradient(155deg,var(--dg-paper),var(--dg-fill));border:1px solid var(--dg-line);border-radius:24px;box-shadow:0 8px 28px var(--dg-shadow);font-family:inherit;line-height:1.45;text-align:left}
.cw-diagram *{box-sizing:border-box}.cw-diagram figcaption{font-size:20px;font-weight:600;color:var(--dg-ink);margin:0 0 28px;line-height:1.3}.cw-diagram__flow{display:flex;align-items:stretch;list-style:none;margin:0;padding:12px 0;gap:26px}.cw-diagram__flow>li{flex:1;min-width:0}.cw-diagram .cw-diagram__stage{position:relative;border:1px solid var(--dg-line);border-top:3px solid var(--dg-blue);border-radius:22px;background:linear-gradient(150deg,var(--dg-paper),color-mix(in srgb,var(--dg-blue) 6%,var(--dg-paper)));padding:24px 18px 18px;box-shadow:0 4px 12px var(--dg-shadow);list-style:none}
.cw-diagram__flow>li+li:before{content:'';position:absolute;left:-24px;top:48%;width:20px;height:20px;display:grid;place-content:center;background:var(--dg-paper);border:1px solid var(--dg-blue);border-radius:50%;color:var(--wwt-royal);font:22px/1 Arial;z-index:1}.cw-diagram__flow>li+li:after{content:'';position:absolute;left:-28px;top:calc(48% + 10px);width:27px;height:1px;background:var(--dg-blue)}
.cw-diagram__icon{width:25px;height:25px;flex:none;display:block}.cw-diagram__badge{width:58px;height:58px;display:grid;place-items:center;border-radius:50%;color:var(--dg-paper);background:linear-gradient(135deg,var(--wwt-navy),var(--wwt-royal));border:3px solid var(--dg-paper);box-shadow:0 0 0 1px var(--dg-line),0 4px 10px var(--dg-shadow);margin:-43px auto 18px}.cw-diagram__badge svg{width:28px;height:28px}
.cw-diagram h3{font-size:18px;line-height:1.3;margin:0 0 10px;color:var(--dg-ink);font-weight:600;overflow-wrap:normal}.cw-diagram p{font-size:14px;line-height:1.5;margin:8px 0;color:var(--dg-ink)}.cw-diagram__items{list-style:none;margin:18px 0 0;padding:0}.cw-diagram__items li{display:flex;gap:10px;align-items:center;padding:11px 0;border-top:1px solid var(--dg-line);font-size:14px}.cw-diagram__items svg{width:21px;height:21px;color:var(--wwt-royal)}
.cw-diagram .cw-diagram__hub{border-radius:50%;aspect-ratio:1;align-self:center;text-align:center;display:flex;flex-direction:column;justify-content:center;padding:25px 16px;border:5px solid var(--dg-line);outline:1px solid var(--dg-blue);outline-offset:4px}.cw-diagram__hub .cw-diagram__badge{margin:0 auto 14px;background:none;color:var(--dg-teal);border:0;box-shadow:none}.cw-diagram__hub .cw-diagram__badge svg{width:40px;height:40px}.cw-diagram .cw-diagram__outcome{border-color:color-mix(in srgb,var(--dg-teal) 32%,white);border-top-color:var(--dg-teal);outline-color:var(--dg-teal);background:linear-gradient(150deg,white,color-mix(in srgb,var(--dg-teal) 8%,white))}.cw-diagram__outcome .cw-diagram__badge{background:var(--dg-teal)}.cw-diagram__hub.cw-diagram__outcome .cw-diagram__badge{background:none}.cw-diagram__round{border-radius:36px!important}.cw-diagram__round .cw-diagram__badge{width:80px;height:80px;border:6px solid white;outline:1px solid var(--dg-line)}
.cw-diagram .cw-diagram__caption{font-size:13px;margin:20px 0 0;line-height:1.6}.cw-diagram__finish{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;border:1px solid var(--dg-teal);border-radius:40px;padding:13px 20px;margin:20px auto 0;width:fit-content;background:color-mix(in srgb,var(--dg-teal) 7%,white);color:var(--dg-ink);font-size:14px}.cw-diagram__finish svg{color:var(--dg-teal)}.cw-diagram__finish strong{font-size:17px}.cw-diagram__pill{display:block!important;width:fit-content;background:var(--dg-paper);border:1px solid var(--dg-line);border-radius:30px;padding:7px 14px;font-size:12px!important;margin:15px auto!important;text-align:center}
.cw-diagram__branches{display:grid;grid-template-columns:125px 1fr;align-items:center;gap:24px}.cw-diagram__origin{border:5px solid var(--dg-line);outline:1px solid var(--dg-blue);outline-offset:4px;border-radius:50%;aspect-ratio:1;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:15px 9px;background:white;position:relative}.cw-diagram__origin strong{font-size:15px;line-height:1.25;margin:8px 0}.cw-diagram__origin span{font-size:11px}.cw-diagram__origin:after{content:'';position:absolute;left:calc(100% + 5px);width:20px;height:1px;background:var(--dg-blue)}.cw-diagram__lanes{display:grid;gap:18px;padding:0;margin:0;border-left:1px solid var(--dg-blue);padding-left:14px}.cw-diagram__lanes .cw-diagram__stage{padding:15px;border-radius:28px;border-top-width:1px;border-left:3px solid var(--dg-blue)}.cw-diagram__lanes .cw-diagram__stage:before{content:'';position:absolute;width:8px;height:8px;border:1px solid var(--dg-blue);border-radius:50%;background:white;left:-20px;top:50%}.cw-diagram__lanes .cw-diagram__badge{float:left;width:36px;height:36px;margin:0 10px 5px 0}.cw-diagram__lanes .cw-diagram__badge svg{width:21px;height:21px}.cw-diagram__lanes h3{font-size:17px}.cw-diagram__lanes p{clear:both;font-size:13px}.cw-diagram__lanes .cw-diagram__items{display:grid;grid-template-columns:1fr 1fr;margin:4px 0 0;gap:0 10px}.cw-diagram__lanes .cw-diagram__items li{font-size:12px;padding:7px 0;gap:6px}.cw-diagram__lanes .cw-diagram__items svg{width:17px;height:17px}.cw-diagram__parallel{margin-top:18px;border-top:1px dashed var(--dg-line)}.cw-diagram__parallel>div{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:12px 15px;border:1px solid var(--dg-line);border-radius:30px;background:var(--dg-paper);font-size:13px}.cw-diagram__parallel strong{font-size:16px}.cw-diagram--paths{padding:22px 18px;margin:0}.home-hero .hero-pathways{min-width:0}
/* Apply the same visual grammar to the existing GSS/CSSP relationship without changing its meaning. */
.boundary-sketch{border-radius:24px!important;background:linear-gradient(150deg,white,var(--soft))!important;box-shadow:0 8px 28px color-mix(in srgb,var(--wwt-navy) 9%,transparent)}.sketch-cloud,.sketch-external>div{border-radius:18px!important}.sketch-label{background:var(--wwt-navy)!important}.sketch-return{border-radius:28px!important}.sketch-arrow{color:var(--wwt-royal)!important}
@container(max-width:750px){.cw-diagram__flow{flex-direction:column;gap:32px;padding:10px 0}.cw-diagram__flow>li+li:before{left:calc(50% - 10px);top:-27px;transform:rotate(90deg)}.cw-diagram__flow>li+li:after{left:50%;top:-33px;width:1px;height:32px}.cw-diagram .cw-diagram__hub{width:min(240px,90%);flex:none}.cw-diagram__stage .cw-diagram__badge{float:left;margin:0 16px 12px 0;width:45px;height:45px}.cw-diagram__stage .cw-diagram__items{clear:both;display:grid;grid-template-columns:1fr 1fr;gap:0 16px}.cw-diagram__hub .cw-diagram__badge{float:none;margin:0 auto 10px}.cw-diagram__round .cw-diagram__badge{outline:none;border-width:3px}.cw-diagram__branches{grid-template-columns:1fr;gap:20px}.cw-diagram__origin{width:135px;margin:0 auto}.cw-diagram__origin:after{left:50%;top:calc(100% + 5px);height:20px;width:1px}.cw-diagram__lanes{border-left:0;padding-left:0}.cw-diagram__lanes .cw-diagram__stage:before{display:none}}
@media(max-width:600px){.cw-diagram{padding:24px 16px;margin:24px 0;border-radius:20px}.cw-diagram figcaption{font-size:19px}.cw-diagram__finish{border-radius:20px;justify-content:flex-start}.cw-diagram--paths{margin:0}}
@container(max-width:350px){.cw-diagram__stage .cw-diagram__items{grid-template-columns:1fr}.cw-diagram__lanes .cw-diagram__items{grid-template-columns:1fr 1fr}.cw-diagram__lanes .cw-diagram__items li{display:block}.cw-diagram__lanes .cw-diagram__items svg{margin-bottom:5px}}
@media print{.cw-diagram{box-shadow:none;break-inside:avoid;padding:16px}.cw-diagram__flow{gap:16px}.cw-diagram h3{font-size:14px}.cw-diagram__items li{font-size:11px}.cw-diagram__badge{box-shadow:none}.cw-diagram__caption{font-size:11px!important}}
/* Operations uses true circular hubs with supporting trays, as in reference 02. */
.cw-diagram__orb-stage{position:relative;list-style:none;padding:5px}.cw-diagram__orb{aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;border-radius:50%;border:5px solid var(--dg-line);outline:1px solid var(--dg-blue);outline-offset:4px;padding:20px;background:linear-gradient(150deg,white,var(--dg-fill));box-shadow:0 4px 12px var(--dg-shadow)}.cw-diagram__orb .cw-diagram__badge{margin:0 auto 12px;background:none;color:var(--wwt-royal);box-shadow:none;border:0}.cw-diagram__orb .cw-diagram__badge svg{width:40px;height:40px}.cw-diagram__orb h3{max-width:170px}.cw-diagram__orb p{font-size:13px}.cw-diagram__orb-stage>.cw-diagram__items{margin-top:20px;border:1px solid var(--dg-line);border-radius:20px;padding:5px 15px;background:white}.cw-diagram__orb-stage>.cw-diagram__items li:first-child{border:0}
@container(min-width:440px) and (max-width:750px){.cw-diagram__branches{grid-template-columns:120px 1fr;gap:20px}.cw-diagram__origin{width:120px}.cw-diagram__origin:after{left:calc(100% + 5px);top:50%;width:15px;height:1px}.cw-diagram__lanes{border-left:1px solid var(--dg-blue);padding-left:12px}}
@container(max-width:750px){.cw-diagram__orb-stage .cw-diagram__orb{max-width:245px;margin:auto}.cw-diagram__orb-stage>.cw-diagram__items{display:grid;grid-template-columns:1fr 1fr;gap:0 15px}.cw-diagram__orb-stage>.cw-diagram__items li{font-size:14px}.cw-diagram__orb-stage>.cw-diagram__items li:first-child{border-top:1px solid var(--dg-line)}}
.cw-diagram__origin{width:145px;height:145px;aspect-ratio:1;padding:12px 8px}.cw-diagram__origin span{line-height:1.25}.cw-diagram__origin strong{font-size:14px}.cw-diagram__branches{grid-template-columns:145px 1fr}
@container(min-width:751px){.cw-diagram--operations .cw-diagram__hub{align-self:flex-start;margin-top:5px}.cw-diagram--operations .cw-diagram__flow>li+li:before{top:calc((100cqw - 78px)/8 - 10px)}.cw-diagram--operations .cw-diagram__flow>li+li:after{top:calc((100cqw - 78px)/8)}}
@container(max-width:439px){.cw-diagram__branches{grid-template-columns:1fr}}

/* Compact Home graphic: the remaining JWCC label carries its separate scope. */
.cw-diagram.cw-diagram--paths{padding-top:16px;padding-bottom:16px}.cw-diagram--paths .cw-diagram__parallel{margin-top:12px;padding-top:12px}