
/* shiftedAI governance capability pages: native brand palette and scoped motion */
.cap-hero{position:relative;overflow:hidden;padding:42px 0 84px;background:linear-gradient(155deg,#fff 20%,#f5f7ff 95%);border-bottom:1px solid #e2e8f0}
.cap-breadcrumb{display:flex;align-items:center;gap:13px;font-size:13px;color:#64748b;margin-bottom:52px}
.cap-breadcrumb a{color:#4338ca;font-weight:700}
.cap-breadcrumb a:hover{text-decoration:underline}
.cap-hero-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:55px;align-items:center}
.cap-overline{display:inline-flex;font:700 11px/1.5 "Space Mono",ui-monospace,monospace;letter-spacing:.085em;color:#4338ca;text-transform:uppercase}
.cap-hero h1{font-size:clamp(42px,5.4vw,76px);letter-spacing:-.06em;line-height:1.06;margin:17px 0 25px;max-width:780px}
.cap-dot{color:#4f46e5}
.cap-lead{font-size:clamp(17px,1.6vw,21px);line-height:1.75;color:#64748b;max-width:640px}
.cap-primary,.cap-secondary{display:inline-flex;align-items:center;justify-content:center;gap:18px;padding:14px 20px;border-radius:11px;font-weight:700;font-size:14px;transition:transform .25s,background .25s,box-shadow .25s}
.cap-primary{color:white;background:#3730a3;box-shadow:0 10px 24px rgba(55,48,163,.18);margin-top:12px}
.cap-primary:hover{background:#312e81;transform:translateY(-2px);box-shadow:0 14px 30px rgba(55,48,163,.23)}
.cap-secondary{color:#3730a3;border:1px solid #c7d2fe;background:white}
.cap-secondary:hover{background:#eef2ff}
.cap-hero-art{height:300px;position:relative;display:grid;place-items:center}
.cap-orbit{position:absolute;border:1px solid #c7d2fe;border-radius:50%;transform:rotate(-24deg)}
.cap-orbit-a{width:255px;height:255px}
.cap-orbit-b{width:340px;height:180px;transform:rotate(32deg);border-style:dashed}
.cap-hero-core{width:155px;height:155px;border-radius:36px;background:linear-gradient(145deg,#eef2ff,#dfe5ff);border:1px solid #c7d2fe;display:grid;place-items:center;box-shadow:0 24px 65px rgba(79,70,229,.15)}
.cap-hero-core svg{width:110px;height:110px;color:#4338ca}
.cap-orbit-dot{position:absolute;width:15px;height:15px;border-radius:50%;background:#4f46e5;box-shadow:0 0 0 7px #e0e7ff}
.cap-orbit-dot-a{top:18px;right:27%}
.cap-orbit-dot-b{bottom:42px;left:19%;width:10px;height:10px;background:#a5b4fc}
.cap-art-label{position:absolute;bottom:-4px;font:700 10px "Space Mono",monospace;letter-spacing:.1em;color:#64748b}
.cap-diagram-section{background:#fff!important;padding:90px 0}
.cap-section-heading{display:grid;grid-template-columns:1.05fr .95fr;gap:70px;align-items:end;margin-bottom:42px}
.cap-section-heading h2{margin:12px 0 0;font-size:clamp(32px,3.7vw,49px)}
.cap-section-heading p{line-height:1.85;margin:0}
.cap-diagram{position:relative;border:1px solid #dfe4f5;border-radius:24px;background:linear-gradient(160deg,#f9faff,#fff 60%);padding:38px 30px 25px;box-shadow:0 22px 60px rgba(29,36,91,.065)}
.cap-stages{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:13px;position:relative;z-index:2}
.cap-track{position:absolute;top:72px;left:calc(30px + (100% - 60px)/10);right:calc(30px + (100% - 60px)/10);height:3px;background:#e2e7f8;z-index:1;border-radius:10px}
.cap-track span{display:block;height:100%;width:100%;transform:scaleX(0);transform-origin:left center;background:linear-gradient(90deg,#a5b4fc,#4338ca);border-radius:inherit}
.cap-stage{appearance:none;border:0;background:transparent;text-align:center;padding:0 6px 15px;cursor:pointer;display:flex;flex-direction:column;align-items:center;min-width:0;color:#172b4d}
.cap-stage-bubble{width:67px;height:67px;border-radius:22px;display:grid;place-items:center;background:#fff;border:1px solid #cfd6f2;color:#4f46e5;box-shadow:0 0 0 7px #fafbff;font:700 15px "Space Mono",monospace;transition:transform .25s,background .25s,color .25s,box-shadow .25s}
.cap-stage.is-active .cap-stage-bubble,.cap-stage:hover .cap-stage-bubble{background:#4338ca;color:white;transform:translateY(-4px);box-shadow:0 0 0 7px #fafbff,0 13px 26px rgba(67,56,202,.2)}
.cap-stage:focus-visible{outline:3px solid #6366f1;outline-offset:5px;border-radius:12px}
.cap-stage-name{font-weight:800;font-size:15px;margin-top:25px;line-height:1.4}
.cap-stage-action{font-size:12px;line-height:1.65;color:#64748b;margin-top:9px;max-width:180px}
.cap-detail{display:grid;grid-template-columns:85px 1fr 1fr;gap:28px;align-items:center;background:#eef2ff;border:1px solid #dce3fa;border-radius:16px;padding:25px 30px;margin-top:18px;min-height:160px}
.cap-detail-index{display:flex;flex-direction:column;gap:5px;color:#4338ca}
.cap-detail-index span,.cap-detail-kicker{font:700 10px "Space Mono",monospace;letter-spacing:.075em;color:#4f46e5}
.cap-detail-index strong{font:700 38px/1.2 "Space Mono",monospace}
.cap-detail h3{font-size:23px;margin:8px 0 6px}
.cap-detail p{font-size:14px;line-height:1.7;margin:5px 0 0;color:#596683}
.cap-detail-evidence{border-left:1px solid #cdd6f5;padding-left:28px}
.cap-diagram-hint{text-align:center;margin:18px 0 0;font-size:12px;color:#78839a}
.cap-practical{background:#f8faff!important;padding:96px 0}
.cap-practical-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px}
.cap-practical h2{margin:15px 0 20px}
.cap-questions>p{max-width:460px;line-height:1.85}
.cap-questions ul{list-style:none;margin:28px 0 0;padding:0}
.cap-questions li{display:flex;align-items:flex-start;gap:13px;padding:17px 0;border-top:1px solid #dfe5f2;color:#23324b;font-weight:600;font-size:15px;line-height:1.6}
.cap-questions li span{color:#4f46e5;font-size:21px;line-height:1}
.cap-deliverables h2{margin:15px 0 27px}
.cap-deliverable{display:flex;align-items:flex-start;gap:16px;background:#fff;border:1px solid #e0e5f3;border-radius:14px;padding:20px;margin-bottom:12px;transition:transform .25s,box-shadow .25s}
.cap-deliverable:hover{transform:translateY(-3px);box-shadow:0 12px 30px rgba(37,45,103,.07)}
.cap-check{display:grid;place-items:center;width:32px;height:32px;flex:0 0 32px;background:#eef2ff;color:#4338ca;border-radius:9px;font-weight:800}
.cap-deliverable h3{font-size:16px;margin:0 0 7px}
.cap-deliverable p{font-size:13px;line-height:1.65;margin:0}
.cap-measures-section{background:#fff!important}
.cap-measures{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}
.cap-measures h2{margin:12px 0}
.cap-measures p{margin:0;max-width:470px}
.cap-metric-list{display:flex;flex-wrap:wrap;gap:10px}
.cap-metric-list span{padding:12px 15px;border:1px solid #d9e0f2;background:#f8faff;border-radius:10px;font-weight:700;font-size:13px;color:#344266}
.cap-next-section{background:#f8faff!important}
.cap-next{display:flex;justify-content:space-between;align-items:center;gap:35px;background:#eef2ff;border:1px solid #d9e2ff;border-radius:20px;padding:38px}
.cap-next h2{font-size:32px;margin:12px 0}
.cap-next p{margin:0;max-width:510px}
.cap-next-actions{display:flex;flex-direction:column;align-items:stretch;gap:10px;flex-shrink:0}
.cap-next-actions .cap-primary{margin:0}
.cap-related{padding:70px 0 0}
.cap-related h3{font-size:22px;margin-bottom:22px}
.cap-related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.cap-related-link{display:flex;flex-direction:column;gap:9px;padding:20px;background:#fff;border:1px solid #e0e5f3;border-radius:13px;transition:transform .25s,border-color .25s}
.cap-related-link:hover{transform:translateY(-3px);border-color:#a5b4fc}
.cap-related-link span:first-child{font:700 10px "Space Mono",monospace;color:#4338ca}
.cap-related-link strong{font-size:15px}
.cap-related-link span:last-child{color:#4338ca;align-self:end}
.cap-back{display:inline-block;margin-top:28px;color:#4338ca;font-size:14px;font-weight:700}
@media (prefers-reduced-motion:no-preference){
 .cap-hero-core{animation:cap-float 6s ease-in-out infinite}
 .cap-orbit-a{animation:cap-orbit 24s linear infinite}
 .cap-orbit-b{animation:cap-orbit-reverse 31s linear infinite}
 .cap-diagram.cap-in-view .cap-track span{animation:cap-track-draw 1.8s .15s ease-out forwards}
 .cap-diagram.cap-in-view .cap-stage{animation:cap-stage-in .65s both;animation-delay:calc(.1s + var(--i)*.18s)}
 .cap-detail.cap-switching{animation:cap-panel-in .3s ease-out}
 @keyframes cap-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
 @keyframes cap-orbit{to{transform:rotate(336deg)}}
 @keyframes cap-orbit-reverse{to{transform:rotate(-328deg)}}
 @keyframes cap-track-draw{to{transform:scaleX(1)}}
 @keyframes cap-stage-in{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
 @keyframes cap-panel-in{from{opacity:.6;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
}
@media (max-width:900px){
 .cap-hero-grid{grid-template-columns:1fr .6fr;gap:25px}
 .cap-hero-art{transform:scale(.8)}
 .cap-stages{gap:5px}
 .cap-stage-name{font-size:13px}
 .cap-stage-action{font-size:11px}
 .cap-detail{gap:17px}
 .cap-practical-grid{gap:40px}
}
@media (max-width:700px){
 .cap-hero{padding:32px 0 64px}
 .cap-breadcrumb{margin-bottom:35px}
 .cap-hero-grid{grid-template-columns:1fr}
 .cap-hero-art{height:160px;transform:scale(.55);margin:-30px 0}
 .cap-diagram-section,.cap-practical{padding:65px 0}
 .cap-section-heading,.cap-practical-grid,.cap-measures{grid-template-columns:1fr;gap:25px}
 .cap-diagram{padding:25px 18px}
 .cap-stages{display:flex;flex-direction:column;gap:10px}
 .cap-stage{display:grid;grid-template-columns:52px 1fr;column-gap:14px;text-align:left;align-items:center;padding:5px 0}
 .cap-stage-bubble{width:46px;height:46px;border-radius:14px;grid-row:span 2;font-size:12px;box-shadow:0 0 0 5px #fafbff}
 .cap-stage-name{margin:0;font-size:14px}
 .cap-stage-action{margin:0;font-size:12px;max-width:none}
 .cap-track{top:47px;bottom:110px;left:40px;right:auto;width:3px;height:auto}
 .cap-track span{width:100%;height:100%;transform:scaleY(0);transform-origin:center top}
 .cap-diagram.cap-in-view .cap-track span{animation-name:cap-track-vertical}
 @keyframes cap-track-vertical{to{transform:scaleY(1)}}
 .cap-detail{grid-template-columns:1fr;gap:14px;padding:20px}
 .cap-detail-index{flex-direction:row;align-items:center}
 .cap-detail-index strong{font-size:22px}
 .cap-detail-evidence{border-left:0;border-top:1px solid #cdd6f5;padding:16px 0 0}
 .cap-next{flex-direction:column;align-items:stretch;padding:25px}
 .cap-related-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:480px){.cap-related-grid{grid-template-columns:1fr}.cap-hero h1{font-size:43px}.cap-next h2{font-size:27px}}
@media (prefers-reduced-motion:reduce){.cap-primary,.cap-secondary,.cap-deliverable,.cap-related-link,.cap-stage-bubble{transition:none}.cap-track span{transform:none}}
