/* Editable use-case illustrations. Prior markup is archived in adjacent templates. */
.visual.uc-visual { min-width:0; min-height:400px; padding:30px; display:flex; flex-direction:column; justify-content:center; border:1px solid #e1e9f2; border-radius:18px; background:linear-gradient(145deg,#f0f6ff,#fff); box-shadow:0 16px 45px rgba(5,18,41,.055); color:#051229; font-family:"Hanken Grotesk",sans-serif; }
.uc-visual *, .uc-case-hero-graphic * { box-sizing:border-box; }
.uc-visual p { margin:0; }
.uc-visual strong { font-weight:600; }
.uc-icon { display:block; width:48px; height:48px; flex-shrink:0; color:#153048; }
.uc-accent { stroke:#009fb9; }
.uc-visual .uc-chart-title { margin:0 0 24px; font-size:18px; font-weight:600; letter-spacing:-.02em; }
.uc-insight { display:flex; align-items:center; gap:12px; margin-top:24px; padding:16px 18px; border-radius:9px; background:#dff7fb; color:#174c61; }
.uc-insight .uc-icon { width:27px; height:27px; color:#008da7; }
.uc-insight p { font-size:14px; line-height:1.5; }
.uc-network-cloud { display:grid; grid-template-columns:repeat(6,1fr); gap:10px; }
.uc-network-cloud > div { display:flex; align-items:center; flex-direction:column; color:#92a2b6; opacity:.48; font-size:12px; }
.uc-network-cloud .uc-icon { width:44px; height:44px; color:inherit; margin-bottom:8px; }
.uc-network-cloud .chosen { color:#007e96; opacity:1; }
.uc-cohort-filter { display:flex; align-items:center; justify-content:center; gap:17px; margin:25px 0; padding:22px 0; border-top:1px solid #d2e6ed; border-bottom:1px solid #d2e6ed; }
.uc-cohort-filter .uc-icon { color:#008fa8; width:38px; }
.uc-cohort-filter strong { display:block; font-size:19px; }
.uc-cohort-filter span { display:block; color:#4a6080; font-size:13px; margin-top:5px; }
.uc-selected { display:grid; grid-template-columns:repeat(5,1fr); gap:8px; }
.uc-selected > span { padding:14px 4px; border-radius:10px; background:#dff7fb; font-size:12px; display:flex; flex-direction:column; align-items:center; gap:10px; }
.uc-selected .uc-icon { color:#007e96; }
.uc-rank-list { display:grid; gap:22px; }
.uc-rank-row { display:grid; grid-template-columns:62px minmax(0,1fr) 65px; align-items:center; gap:12px; font-size:13px; }
.uc-rank-row b { font-size:11px; font-weight:500; color:#4a6080; }
.uc-track { height:18px; background:#e7edf5; border-radius:3px; overflow:hidden; }
.uc-track i { display:block; height:100%; border-radius:3px; background:#829ab8; }
.uc-rank-row:nth-child(-n+2) .uc-track i { background:#009fb9; }
.uc-rank-row:last-child .uc-track i { background:#263d5d; }
.uc-gap-row { display:grid; grid-template-columns:65px 1fr 39px; gap:12px; align-items:center; font-size:13px; height:49px; }
.uc-gap-row b { font-size:14px; font-weight:600; }
.uc-gap-track { position:relative; height:100%; border-bottom:1px solid #e4ebf2; }
.uc-gap-track::after { content:""; position:absolute; left:50%; height:100%; border-left:1px dashed #8596ad; }
.uc-gap-track i { position:absolute; top:16px; height:17px; border-radius:2px; }
.uc-gap-track .positive { background:#009fb9; }
.uc-gap-track .negative { background:#273d5c; }
.uc-axis { display:flex; justify-content:space-between; margin:15px 48px 0 77px; color:#4a6080; font-size:10px; }
.uc-plot { width:100%; height:auto; display:block; }
.uc-plot > path { fill:none; stroke-width:3; stroke-linecap:round; stroke-linejoin:round; }
.uc-svg-label { fill:#4a6080; font-family:"Hanken Grotesk",sans-serif; font-size:13px; }
.uc-legend { display:flex; flex-wrap:wrap; gap:20px; margin-top:18px; font-size:12px; }
.uc-legend span { display:flex; align-items:center; gap:7px; }
.uc-legend i { width:18px; height:3px; }
.uc-table-wrap { width:100%; overflow-x:auto; }
.uc-data-table { border-collapse:collapse; width:100%; table-layout:fixed; }
.uc-data-table th { font-size:11px; font-weight:500; color:#4a6080; text-align:center; padding:10px 3px; overflow-wrap:anywhere; }
.uc-data-table th:first-child { width:79px; text-align:left; }
.uc-data-table tbody th { font-size:12px; font-weight:600; color:#153048; }
.uc-data-table td { padding:10px 4px; text-align:center; border-top:1px solid #e2e9f2; }
.uc-level { display:flex; width:100%; min-height:30px; align-items:center; justify-content:center; border-radius:5px; font-size:13px; font-weight:700; }
.uc-level-0 { background:#edf1f6; color:#7a8ba2; }
.uc-level-1 { background:#dcebf4; color:#436681; }
.uc-level-2 { background:#a9e5ee; color:#006c80; }
.uc-level-3 { background:#006c80; color:white; }
.uc-symbol-legend { display:flex; flex-wrap:wrap; gap:10px 15px; margin-top:19px; font-size:11px; color:#4a6080; }
.uc-symbol-legend b { display:inline-block; min-width:20px; text-align:center; padding:2px; border-radius:3px; }
.uc-steps { display:grid; grid-template-columns:repeat(3,1fr); gap:36px 23px; }
.uc-steps > div { position:relative; display:flex; align-items:center; flex-direction:column; text-align:center; }
.uc-steps .uc-icon { margin-bottom:14px; width:55px; height:55px; }
.uc-steps strong { font-size:14px; }
.uc-steps small { font-size:11px; margin-top:5px; color:#4a6080; }
.uc-steps > div:not(:nth-child(3n))::after { content:'→'; position:absolute; right:-19px; top:22px; color:#7495a8; }
.uc-steps > div:nth-child(3)::after { content:'↓'; position:absolute; bottom:-28px; color:#7495a8; }
.uc-steps > div:nth-child(4) { grid-column:3; grid-row:2; }
.uc-steps > div:nth-child(5) { grid-column:2; grid-row:2; }
.uc-steps > div:nth-child(6) { grid-column:1; grid-row:2; }
.uc-steps > div:nth-child(4)::after,.uc-steps > div:nth-child(5)::after { content:'←'; right:auto; left:-19px; }
.uc-document { display:grid; }
.uc-document-row { display:flex; gap:19px; align-items:center; padding:20px 0; border-bottom:1px solid #dce6ef; }
.uc-document-row:first-child { padding-top:0; }
.uc-document-row:last-child { border-bottom:0; padding-bottom:0; }
.uc-document-row .uc-icon { color:#00879f; }
.uc-document-row strong { display:block; font-size:18px; margin-bottom:5px; }
.uc-document-row p { font-size:14px; line-height:1.5; color:#4a6080; }
.uc-handoff-row { display:grid; grid-template-columns:40px 90px 1fr; gap:12px; align-items:center; padding:10px 0; }
.uc-handoff-row .uc-icon { width:38px; height:38px; }
.uc-handoff-row strong { font-size:14px; }
.uc-handoff-row > span { color:#4a6080; font-size:12px; }
.uc-connector { margin-left:16px; color:#00879f; }
.uc-broken { display:flex; align-items:center; gap:10px; padding:12px; background:#fff2d6; border-radius:8px; margin:10px 0; color:#765521; }
.uc-broken .uc-icon { width:30px; height:30px; color:inherit; }
.uc-broken strong { font-size:13px; line-height:1.4; }
.uc-broken > span:last-child { margin-left:auto; }
.uc-timeline { display:grid; grid-template-columns:repeat(5,1fr); padding-top:15px; }
.uc-timeline > div { position:relative; padding-top:25px; border-top:2px solid #a3d9e3; }
.uc-timeline i { position:absolute; top:-6px; left:0; width:10px; height:10px; background:#008fa8; border-radius:50%; box-shadow:0 0 0 5px #e2f6fa; }
.uc-timeline strong { display:block; font-size:12px; margin-top:6px; }
.uc-timeline small { color:#4a6080; font-size:10px; }
.uc-followup-meta { display:grid; grid-template-columns:repeat(3,1fr); gap:17px; margin-top:45px; padding-top:25px; border-top:1px solid #dce6ef; }
.uc-followup-meta .uc-icon { width:34px; height:34px; margin-bottom:12px; }
.uc-followup-meta strong { display:block; font-size:13px; }
.uc-followup-meta small { display:block; color:#4a6080; margin-top:5px; font-size:12px; line-height:1.4; }
.uc-compare-head { display:grid; grid-template-columns:1fr 1fr; gap:38px; font-size:13px; color:#4a6080; padding:0 0 16px; }
.uc-compare-head > :last-child { color:#007d93; }
.uc-compare-row { display:grid; grid-template-columns:1fr 24px 1fr; gap:10px; align-items:center; padding:18px 0; border-top:1px solid #dce6ef; font-size:14px; }
.uc-compare-row > span { color:#4a6080; }
.uc-compare-row b { color:#009fb9; font-weight:400; }
.uc-team-center { display:flex; align-items:center; justify-content:center; gap:14px; margin-bottom:20px; padding-bottom:20px; border-bottom:1px solid #d3e4ee; font-size:17px; }
.uc-role-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.uc-role-grid > div { display:grid; grid-template-columns:38px 1fr; column-gap:13px; align-items:center; }
.uc-role-grid .uc-icon { grid-row:span 2; width:38px; height:38px; }
.uc-role-grid strong { font-size:14px; }
.uc-role-grid span { display:block; color:#4a6080; font-size:11px; margin-top:4px; line-height:1.4; }
.uc-help-map { position:relative; height:285px; }
.uc-help-map > svg { width:100%; height:100%; }
.uc-help-map > svg path { fill:none; stroke:#8ecbd9; stroke-width:1.5; }
.uc-help-n { position:absolute; width:110px; padding:12px 5px; border-radius:10px; text-align:center; font-size:12px; background:#fff; border:1px solid #dce6ef; transform:translate(-50%,-50%); }
.uc-help-a { left:15%;top:15%; }.uc-help-b {left:85%;top:15%;}.uc-help-c{left:50%;top:33%;background:#dff7fb;color:#006e82;border-color:#98d5e2;}.uc-help-d{left:50%;top:67%;background:#051229;color:white;border-color:#051229;}.uc-help-e{left:15%;top:85%;}.uc-help-f{left:85%;top:85%;}
.uc-dependency-row { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:17px 0; border-top:1px solid #dce6ef; }
.uc-dependency-row strong { display:block; font-size:14px; }
.uc-dependency-row span { display:block; font-size:12px; color:#4a6080; margin-top:5px; }
.uc-person-cluster { display:flex; gap:3px; }
.uc-person-cluster i { color:#c9d4e0; }
.uc-person-cluster .uc-icon { color:inherit; width:25px; height:25px; }
.uc-person-cluster .active { color:#007e96; }
.uc-caption { margin-top:17px!important; color:#4a6080; font-size:11px; line-height:1.45; }
.uc-depth-head,.uc-depth-row { display:grid; grid-template-columns:100px repeat(3,1fr); gap:8px; align-items:center; }
.uc-depth-head { font-size:11px; text-align:center; color:#4a6080; padding-bottom:15px; }
.uc-depth-row { padding:14px 0; border-top:1px solid #dce6ef; font-size:13px; }
.uc-depth-row > span { background:#e9eff6; text-align:center; padding:8px 0; border-radius:4px; color:#a6b4c6; }
.uc-depth-row > .on { background:#c7eff5; color:#007d93; }
.uc-feedback-primary { padding:23px; background:white; border:1px solid #e0e8f1; border-radius:12px; box-shadow:0 10px 24px rgba(5,18,41,.04); }
.uc-feedback-primary .uc-icon { width:32px; height:32px; color:#008fa8; margin-bottom:12px; }
.uc-feedback-primary > span { font-size:12px; color:#4a6080; }
.uc-feedback-primary p { margin-top:13px; font-size:19px; line-height:1.5; }
.uc-feedback-primary mark { background:#fff0ad; color:inherit; box-decoration-break:clone; -webkit-box-decoration-break:clone; }
.uc-feedback-notes { display:grid; grid-template-columns:repeat(3,1fr); gap:15px; margin-top:24px; }
.uc-feedback-notes strong { font-size:13px; }
.uc-feedback-notes p { margin-top:6px; color:#4a6080; font-size:12px; line-height:1.5; }
.uc-parallel-row { display:grid; grid-template-columns:1fr 20px 1fr; gap:15px; align-items:center; padding:17px 0; border-top:1px solid #dce6ef; }
.uc-parallel-row span { display:flex; align-items:center; gap:10px; font-size:13px; }
.uc-parallel-row .uc-icon { width:32px; height:32px; }
.uc-parallel-row b { color:#b58a42; }
.uc-decision-grid,.uc-case-friction-grid { display:grid; grid-template-columns:1fr 1fr; gap:30px; }
.uc-decision-grid .uc-icon,.uc-case-friction-grid .uc-icon { margin-bottom:15px; color:#00879f; }
.uc-decision-grid strong { display:block; font-size:19px; }
.uc-decision-grid p { margin-top:6px; font-size:14px; color:#4a6080; line-height:1.5; }
.uc-case-friction-grid span { display:block; font-size:12px; color:#4a6080; margin-bottom:6px; }
.uc-case-friction-grid strong { display:block; font-size:17px; line-height:1.3; }
.uc-project-outcome { display:flex; align-items:center; gap:13px; border-top:1px solid #dce6ef; margin-top:24px; padding-top:22px; color:#007e96; font-size:16px; }
.uc-project-outcome .uc-icon { width:30px; height:30px; }
.hero .uc-case-logo { margin:0 0 28px; }
.uc-case-logo img { display:block; width:min(100%,390px); height:auto; }
.uc-case-hero-graphic { padding:10px 0; color:#fff; }
.uc-hero-result { display:flex; gap:23px; align-items:center; padding:24px 0; border-bottom:1px solid #344b64; }
.uc-hero-result:first-child { padding-top:0; }
.uc-hero-result:last-child { border-bottom:0; padding-bottom:0; }
.uc-hero-result > .uc-icon { width:59px; height:59px; color:#83e8f7; }
.uc-hero-result span { color:#b8ccdf; font-size:14px; }
.uc-hero-result strong { display:block; margin:7px 0; color:white; font-family:"Hanken Grotesk",Inter,system-ui,sans-serif; font-size:32px; letter-spacing:-.025em; font-weight:600; line-height:1.1; }
.uc-hero-result small { display:block; color:#b8ccdf; font-size:13px; }
.uc-case-ba-head,.uc-case-ba-row { display:grid; grid-template-columns:1fr 1.3fr 30px 1.3fr; gap:24px; align-items:center; }
.uc-case-ba-head { padding:0 24px 18px; font-size:13px; color:#4a6080; }
.uc-case-ba-row { padding:23px 24px; border-top:1px solid #dce6ef; background:#f5f9fd; }
.uc-case-ba-row strong { display:flex; align-items:center; gap:13px; font-size:16px; }
.uc-case-ba-row .uc-icon { width:34px; height:34px; }
.uc-case-ba-row > span { color:#4a6080; font-size:16px; line-height:1.45; }
.uc-case-ba-row > span:last-child { color:#006d82; font-weight:600; }
.uc-case-ba-row > b { color:#009fb9; font-size:21px; font-weight:400; }
@media(max-width:980px) { .visual.uc-visual { max-width:760px; width:100%; } }
@media(max-width:650px) {
 .visual.uc-visual { padding:20px; min-height:350px; }
 .uc-network-cloud { gap:5px; }.uc-network-cloud .uc-icon{width:35px;height:35px;}
 .uc-selected .uc-icon{width:39px;height:39px;}
 .uc-selected > span{font-size:11px;}
 .uc-chart-title{font-size:16px!important;}
 .uc-rank-row{grid-template-columns:54px 1fr 54px;gap:8px;font-size:12px;}
 .uc-rank-row b{font-size:10px;}
 .uc-gap-row{grid-template-columns:57px 1fr 33px;gap:8px;font-size:12px;}
 .uc-axis{margin-left:65px;margin-right:40px;font-size:9px;}
 .uc-data-table th:first-child{width:64px;}.uc-data-table th{font-size:9px;}.uc-data-table tbody th{font-size:10px;}.uc-data-table td{padding:8px 2px;}
 .uc-symbol-legend{font-size:10px;gap:8px;}
 .uc-insight{padding:13px;gap:9px;}.uc-insight p{font-size:13px;}
 .uc-steps{gap:36px 16px;}.uc-steps strong{font-size:12px;}.uc-steps small{font-size:10px;}.uc-steps > div:not(:nth-child(3n))::after{right:-14px;}.uc-steps > div:nth-child(4)::after,.uc-steps > div:nth-child(5)::after{left:-14px;right:auto;}
 .uc-document-row{gap:13px;}.uc-document-row strong{font-size:16px;}.uc-document-row p{font-size:13px;}.uc-document-row .uc-icon{width:39px;height:39px;}
 .uc-handoff-row{grid-template-columns:30px 76px 1fr;gap:8px;}.uc-handoff-row strong{font-size:12px;}.uc-handoff-row > span{font-size:11px;}
 .uc-timeline strong{font-size:10px;}.uc-timeline small{font-size:9px;}.uc-followup-meta{gap:10px;}.uc-followup-meta small{font-size:11px;}
 .uc-compare-row{font-size:12px;gap:5px;}
 .uc-role-grid{gap:25px 14px;}.uc-role-grid > div{grid-template-columns:1fr;}.uc-role-grid .uc-icon{grid-row:auto;margin-bottom:10px;}
 .uc-help-n{width:88px;font-size:11px;}
 .uc-dependency-row{gap:8px;}.uc-dependency-row strong{font-size:12px;}.uc-person-cluster .uc-icon{width:21px;height:21px;}
 .uc-depth-head,.uc-depth-row{grid-template-columns:83px repeat(3,1fr);gap:5px;}.uc-depth-head{font-size:9px;}.uc-depth-row{font-size:11px;}
 .uc-feedback-primary{padding:18px;}.uc-feedback-primary p{font-size:17px;}.uc-feedback-notes{gap:12px;}.uc-feedback-notes p{font-size:11px;}
 .uc-parallel-row{gap:8px;}.uc-parallel-row span{font-size:11px;gap:6px;}.uc-parallel-row .uc-icon{width:25px;height:25px;}
 .uc-decision-grid,.uc-case-friction-grid{gap:25px 20px;}.uc-decision-grid strong{font-size:17px;}.uc-decision-grid p{font-size:13px;}
 .uc-hero-result{gap:18px;}.uc-hero-result strong{font-size:28px;}
 .uc-case-ba-head{display:none;}.uc-case-ba-row{grid-template-columns:1fr 18px 1fr;gap:12px;padding:21px 14px;}.uc-case-ba-row strong{grid-column:1/-1;font-size:15px;}.uc-case-ba-row > span{font-size:13px;}
}

@media(max-width:650px){ .uc-selected .uc-icon{width:30px;height:30px;} .uc-selected > span{font-size:9px;} }
