/* Education360 · higher-education.html page styles */
.vis-card,.path-card,.msg-card,.dash{background:#fff;color:var(--navy);border-radius:18px;padding:24px;display:grid;gap:14px;box-shadow:0 40px 70px -44px rgba(1,33,71,.6),0 0 0 1px var(--line-l)}
.vis-head{display:flex;justify-content:space-between;align-items:center;gap:10px}
.vis-card .fp-top img{width:52px;height:52px}
.vis-card .fp-top b{font-size:19px}
.roles,.langs,.dash-tabs{display:flex;gap:4px;padding:4px;background:var(--paper);border-radius:10px}
.roles button,.langs button,.dash-tabs button{flex:1;min-height:38px;border-radius:8px;font-size:13.5px;font-weight:600;color:var(--ink-2);transition:background .2s,color .2s}
.roles button[aria-selected="true"],.langs button[aria-selected="true"],.dash-tabs button[aria-selected="true"]{background:var(--navy);color:#fff}
.roles button:hover:not([aria-selected="true"]),.langs button:hover:not([aria-selected="true"]),.dash-tabs button:hover:not([aria-selected="true"]){color:var(--navy)}
.view{display:grid;gap:12px;animation:fadeUp .35s var(--ease)}
.vrow{display:grid;gap:8px;padding-top:12px;border-top:1px solid var(--line-l)}
.pchips{display:flex;flex-wrap:wrap;gap:6px}
.pchip{font-size:13px;padding:5px 11px;border-radius:999px;background:var(--paper);font-weight:500}
.pchip i{font-style:normal;color:var(--ink-3);margin-right:4px}
.vbars{display:grid;grid-template-columns:repeat(12,1fr);gap:4px;align-items:end;height:56px}
.vbars span{display:block;border-radius:3px 3px 1px 1px;background:rgba(0,116,255,.22);height:var(--h);transform-origin:bottom;animation:grow .8s var(--ease) both;animation-delay:calc(var(--i)*40ms)}
.vbars span:last-child{background:var(--blue)}
.alert{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border-radius:10px;background:#FFF6D6;border-left:4px solid var(--yellow)}
.alert b{display:block;font-size:14px}
.alert span{font-size:13px;color:var(--ink-2)}
.alert .dot,.sig-alert .dot{width:8px;height:8px;border-radius:50%;background:#D99A00;margin-top:6px;flex:none;animation:blink 2.4s ease-in-out infinite}
.list-mini li{display:flex;justify-content:space-between;gap:10px;padding:9px 0;border-bottom:1px solid var(--line-l);font-size:14px}
.list-mini li:last-child{border-bottom:0}
.list-mini em{font-style:normal;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:2px 8px;border-radius:5px;background:var(--paper);color:var(--ink-2)}
.list-mini em.w{background:#FFF1BF;color:#7A5A00}
.steps-mini{display:grid;gap:8px;font-size:14px}
.steps-mini li{display:flex;gap:10px;align-items:center}
.steps-mini li::before{content:"";width:16px;height:16px;border-radius:50%;border:2px solid var(--blue);flex:none}
.steps-mini li.done::before{background:var(--blue);box-shadow:inset 0 0 0 3px #fff}
.signals{background:rgba(255,255,255,.08);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--line-d);border-radius:18px;padding:24px;display:grid;gap:0}
.sig-src{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.sig-src span{text-align:center;padding:12px 6px;border-radius:10px;background:var(--fill-d);border:1px solid var(--line-d);font-size:13px;font-weight:700;letter-spacing:.04em;opacity:.35;transform:translateY(8px);transition:opacity .5s,transform .5s var(--ease),border-color .3s}
.signals.in .sig-src span{opacity:1;transform:none;border-color:rgba(255,195,1,.5)}
.signals.in .sig-src span:nth-child(2){transition-delay:.15s}.signals.in .sig-src span:nth-child(3){transition-delay:.3s}
.sig-lines{width:100%;height:90px;display:block}
.sig-lines path{fill:none;stroke:var(--yellow);stroke-width:2;vector-effect:non-scaling-stroke;stroke-dasharray:160;stroke-dashoffset:160;transition:stroke-dashoffset 1s var(--ease) .5s}
.signals.in .sig-lines path{stroke-dashoffset:0}
.sig-alert{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border-radius:12px;background:#fff;color:var(--navy);border-left:5px solid var(--yellow);opacity:.2;transform:scale(.96);transition:opacity .5s 1.3s,transform .5s var(--ease) 1.3s}
.signals.in .sig-alert{opacity:1;transform:none}
.sig-alert b{display:block;font-size:15px}
.sig-alert span{font-size:13.5px;color:var(--ink-2)}
.signals .steps-mini{color:#fff;margin:18px 0 12px;padding:0 4px}
.signals .steps-mini li::before{border-color:var(--yellow)}
.signals .steps-mini li.done::before{background:var(--yellow);box-shadow:inset 0 0 0 3px var(--navy)}
.signals .illus{color:var(--on-3);border-color:var(--line-d)}
.path{display:grid;gap:0;position:relative}
.path::before{content:"";position:absolute;left:11px;top:14px;bottom:14px;width:2px;background:var(--line-l)}
.path li{display:grid;grid-template-columns:24px 1fr;gap:14px;padding:12px 0;position:relative}
.path .pt{width:24px;height:24px;border-radius:50%;border:2px solid var(--line-l);background:#fff;position:relative;z-index:1;margin-top:2px;transition:background .4s,border-color .4s}
.path li.done .pt{background:var(--blue);border-color:var(--blue)}
.path li.now .pt{border-color:var(--yellow);box-shadow:0 0 0 6px rgba(255,195,1,.25);animation:pulseY 2s infinite}
@keyframes pulseY{50%{box-shadow:0 0 0 10px rgba(255,195,1,.1)}}
.path b{font-family:var(--serif);font-size:18px;display:block}
.path small{font-size:13px;color:var(--ink-3)}
.path li.now{background:linear-gradient(90deg,rgba(255,195,1,.12),transparent);border-radius:10px;margin-left:-8px;padding-left:8px}
.bubble-msg{background:var(--blue);color:#fff;border-radius:16px 16px 16px 4px;padding:16px 18px;font-size:16px;line-height:1.5;animation:fadeUp .35s var(--ease)}
.bubble-msg small{display:block;font-size:12px;opacity:.8;margin-bottom:4px;font-weight:600;letter-spacing:.04em}
.survey{display:grid;gap:8px;padding-top:12px;border-top:1px solid var(--line-l)}
.survey p{font-weight:600}
.opts{display:flex;flex-wrap:wrap;gap:6px}
.opts button{padding:7px 14px;border-radius:999px;border:1.5px solid var(--line-l);font-size:13.5px;font-weight:600;color:var(--navy);transition:background .2s,border-color .2s,color .2s}
.opts button:hover{border-color:var(--blue)}
.opts button[aria-pressed="true"]{background:var(--navy);border-color:var(--navy);color:#fff}
.dash-chart{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;align-items:end;height:170px;padding:10px 4px 0;border-bottom:1px solid var(--line-l);background:repeating-linear-gradient(0deg,transparent 0,transparent 41px,rgba(1,33,71,.06) 41px,rgba(1,33,71,.06) 42px)}
.dash-chart span{display:block;border-radius:6px 6px 2px 2px;background:var(--blue);height:var(--h);transition:height .6s var(--ease)}
.dash-chart span.lo{background:var(--yellow)}
.dash-legend{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;font-size:11.5px;color:var(--ink-3);text-align:center}
.dash-foot{display:flex;gap:12px;align-items:center;padding:12px;border-radius:12px;background:var(--paper)}
.doc-ic{width:40px;height:46px;border-radius:5px 12px 5px 5px;background:var(--navy);color:var(--yellow);font-size:11px;font-weight:800;display:grid;place-items:center;letter-spacing:.06em}
.dash-foot b{display:block;font-size:14.5px}
.dash-foot span{font-size:13px;color:var(--ink-2)}
/* ===== K-12 v2 ===== */
.nav-trigger.current{box-shadow:inset 0 -3px 0 var(--yellow)}
.crumbs{display:flex;flex-wrap:wrap;gap:8px;font-size:14px;color:var(--on-2);padding-top:28px}
.crumbs a{color:#fff;font-weight:600;border-bottom:1px solid rgba(255,255,255,.35)}
.crumbs a:hover{border-color:var(--yellow)}
.crumbs [aria-current]{color:var(--yellow);font-weight:600}
.h2 em{font-style:normal;color:var(--blue)}
.kx-sub{font-size:18px;line-height:1.6;color:var(--ink-2);max-width:44ch}
/* Hero */
.kx-hero{background:var(--navy);color:#fff;position:relative;overflow:hidden;border-bottom:12px solid var(--yellow)}
.kx-hero::before{content:"";position:absolute;left:-10%;bottom:-40%;width:60%;aspect-ratio:1;border-radius:50%;background:radial-gradient(closest-side,rgba(0,116,255,.35),transparent 70%);pointer-events:none}
.kx-hero-grid{display:grid;grid-template-columns:1fr 1.05fr;gap:48px;align-items:center;padding-block:40px 88px}
.kx-copy{display:grid;gap:24px;justify-items:start;position:relative}
.kx-copy h1{font-size:clamp(38px,4.6vw,62px);line-height:1.1;text-transform:uppercase;letter-spacing:.02em}
.kx-copy h1 .ln{display:block;overflow:hidden}
.kx-copy h1 .ln>span{display:block;animation:lineUp .9s var(--ease) both}
.kx-copy h1 .ln:nth-child(2)>span{animation-delay:.1s;color:var(--yellow)}
.kx-copy .lede{font-size:18px;color:var(--on-2);max-width:44ch;animation:fadeUp .8s var(--ease) .3s both}
.kx-art{position:relative;padding:28px 0 28px 28px}
.kx-photo{border-radius:28px 28px 28px 120px;overflow:hidden;aspect-ratio:4/3.2;background:var(--blue);animation:photoIn 1.1s var(--ease) .15s both;box-shadow:0 50px 90px -50px rgba(0,0,0,.7)}
.kx-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 30%;transform:scale(1.04)}
.kx-chip{position:absolute;display:flex;align-items:center;gap:8px;padding:9px 14px;border-radius:999px;background:#fff;color:var(--navy);font-size:13.5px;font-weight:700;box-shadow:0 18px 36px -20px rgba(0,0,0,.6);animation:floatIn .7s var(--ease) both,bob 6s ease-in-out infinite}
.kx-chip .dot{width:9px;height:9px;border-radius:50%;background:var(--blue)}
.kx-chip.c1{left:0;top:16%;animation-delay:.6s,1.3s}
.kx-chip.c2{left:-4%;top:40%;animation-delay:.75s,2s}.kx-chip.c2 .dot{background:var(--yellow)}
.kx-chip.c3{left:3%;top:64%;animation-delay:.9s,2.6s}.kx-chip.c3 .dot{background:#2BB673}
.kx-roles{position:absolute;right:-12px;bottom:0;background:var(--yellow);color:var(--navy);border-radius:16px;padding:14px 16px;display:grid;gap:8px;box-shadow:0 24px 46px -24px rgba(0,0,0,.6);animation:floatIn .7s var(--ease) 1.05s both}
.kx-roles .mh{color:var(--navy);opacity:.75}
.kx-roles div{display:flex;gap:6px}
.kx-roles em{font-style:normal;font-size:12.5px;font-weight:700;padding:6px 10px;border-radius:8px;background:rgba(1,33,71,.08)}
.kx-roles em.on{background:var(--navy);color:#fff}
.kx-art .illus{position:absolute;right:16px;top:44px;color:#fff;border-color:rgba(255,255,255,.5);background:rgba(1,33,71,.35)}
@media (max-width:960px){.kx-hero-grid{grid-template-columns:1fr;padding-bottom:64px}.kx-art{padding:20px 0 28px 18px}}
@media (max-width:560px){.kx-chip{font-size:12px;padding:7px 11px}.kx-roles{right:0}.kx-roles em{padding:5px 8px}}
/* Flow diagram */
.kx-flow-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:64px;align-items:center}
.kx-flow-grid .h2{margin:14px 0 18px}
.kx-diagram{position:relative;display:grid;grid-template-columns:136px 1fr 150px;align-items:center;min-height:340px}
.kd-src{display:grid;gap:10px;position:relative;z-index:1}
.kd-src li{font-size:12.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:9px 12px;border-radius:10px;background:var(--paper);color:var(--navy);text-align:center;opacity:.4;transition:opacity .5s,background .5s,color .5s}
.kd-lines{position:absolute;left:136px;top:0;height:100%;width:calc(100% - 286px)}
.kd-lines path{fill:none;stroke:var(--blue);stroke-width:1.6;stroke-dasharray:420;stroke-dashoffset:420;transition:stroke-dashoffset 1.2s var(--ease);vector-effect:non-scaling-stroke}
.kd-lines path.out{stroke:var(--yellow);stroke-width:2.4;transition-delay:.9s}
.kd-core{grid-column:2;justify-self:center;position:relative;z-index:1;width:116px;aspect-ratio:1;border-radius:50%;background:var(--navy);color:#fff;display:grid;place-items:center;align-content:center;gap:4px;box-shadow:0 0 0 10px rgba(0,116,255,.12),0 0 0 22px rgba(0,116,255,.06);transform:scale(.8);opacity:0;transition:transform .7s var(--ease) .5s,opacity .7s .5s}
.kd-core svg{width:40px;height:40px}
.kd-core b{font-size:11px;letter-spacing:.06em;text-transform:uppercase}
.kd-out{grid-column:3;display:grid;gap:44px;position:relative;z-index:1}
.kd-out li{display:grid;padding:10px 14px;border-radius:12px;background:#fff;box-shadow:0 0 0 1px var(--line-l),0 18px 30px -22px rgba(1,33,71,.5);opacity:0;transform:translateX(12px);transition:opacity .5s,transform .5s var(--ease)}
.kd-out b{font-family:var(--serif);font-size:16px;color:var(--navy)}
.kd-out span{font-size:12.5px;color:var(--ink-3)}
.kx-diagram.in .kd-src li{opacity:1;background:var(--navy);color:#fff}
.kx-diagram.in .kd-src li:nth-child(2){transition-delay:.08s}.kx-diagram.in .kd-src li:nth-child(3){transition-delay:.16s}.kx-diagram.in .kd-src li:nth-child(4){transition-delay:.24s}.kx-diagram.in .kd-src li:nth-child(5){transition-delay:.32s}.kx-diagram.in .kd-src li:nth-child(6){transition-delay:.4s}
.kx-diagram.in .kd-lines path{stroke-dashoffset:0}
.kx-diagram.in .kd-core{transform:none;opacity:1}
.kx-diagram.in .kd-out li{opacity:1;transform:none;transition-delay:1.4s}
.kx-diagram.in .kd-out li:nth-child(2){transition-delay:1.55s}.kx-diagram.in .kd-out li:nth-child(3){transition-delay:1.7s}
@media (max-width:960px){.kx-flow-grid{grid-template-columns:1fr;gap:40px}}
@media (max-width:560px){.kx-diagram{grid-template-columns:86px 1fr 104px;min-height:300px}.kd-lines{left:86px;width:calc(100% - 190px)}.kd-src li{font-size:10.5px;padding:7px 6px}.kd-core{width:80px}.kd-core svg{width:28px;height:28px}.kd-core b{font-size:8.5px}.kd-out{gap:30px}.kd-out li{padding:8px 10px}.kd-out b{font-size:13.5px}.kd-out span{font-size:11px}}
/* Needs explorer */
.kx-needs{background:var(--paper);padding-block:120px 80px}
.kx-ex{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:72px;align-items:start}
.kx-step{min-height:78vh;display:grid;gap:14px;align-content:center;padding-block:40px;opacity:.35;transition:opacity .5s}
.kx-step.on{opacity:1}
.kx-n{display:flex;align-items:center;gap:10px;font-family:var(--serif);font-size:20px;color:var(--blue)}
.kx-step h3{font-family:var(--sans);font-size:14px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.kx-line{font-family:var(--serif);font-weight:700;font-size:clamp(28px,3vw,40px);line-height:1.18;color:var(--navy);text-wrap:balance}
.kx-step>p:not(.kx-line):not(.kx-uses){font-size:17px;color:var(--ink-2);max-width:44ch}
.kx-pts{display:grid;gap:8px;margin-top:4px}
.kx-pts li{display:flex;gap:10px;align-items:flex-start;font-size:15.5px;color:var(--navy);font-weight:500}
.kx-pts li::before{content:"";flex:none;width:18px;height:18px;margin-top:2px;border-radius:50%;background:var(--yellow) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m4 8.3 2.6 2.6L12 5.5' fill='none' stroke='%23012147' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px no-repeat}
.kx-uses{font-size:13.5px;color:var(--ink-3)}
.kx-uses b{color:var(--ink-2);font-weight:600}
.kx-step .lk{margin-top:6px}
.kx-stage{position:sticky;top:110px;height:calc(100vh - 150px);max-height:680px;min-height:520px;border-radius:28px;background:#fff;display:grid;grid-template-rows:1fr auto;overflow:hidden;transition:background .6s var(--ease);box-shadow:0 0 0 1px var(--line-l)}
.kx-stage[data-theme="paper"]{background:#DCE6EC}
.kx-stage[data-theme="navy"]{background:var(--navy)}
.kx-stage[data-theme="white"]{background:#fff}
.kx-stage[data-theme="sky"]{background:#CFE4FF}
.kx-stage[data-theme="blue"]{background:var(--blue)}
.kx-stage[data-theme="navy"]{background:var(--navy) url(../assets/images/stream.webp) center/cover}
.kx-stage-in{position:relative;padding:40px}
.kx-stage-in .kx-vis{position:absolute;inset:40px;display:grid;place-items:center;opacity:0;transform:translateY(24px) scale(.97);transition:opacity .5s var(--ease),transform .6s var(--ease);pointer-events:none}
.kx-stage-in .kx-vis.on{opacity:1;transform:none;pointer-events:auto}
.kx-stage-in .kx-vis>*{width:100%;max-width:440px}
.kx-rail{display:flex;gap:6px;padding:14px;border-top:1px solid rgba(1,33,71,.08);background:rgba(255,255,255,.55);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.kx-stage[data-theme="navy"] .kx-rail,.kx-stage[data-theme="blue"] .kx-rail{background:rgba(1,33,71,.35);border-color:rgba(255,255,255,.12)}
.kx-rail a{flex:1;display:grid;gap:2px;padding:8px 10px;border-radius:10px;font-size:12px;font-weight:600;color:var(--ink-2);transition:background .2s,color .2s;position:relative;overflow:hidden}
.kx-rail a i{font-style:normal;font-family:var(--serif);font-size:15px;color:var(--navy)}
.kx-rail a span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kx-stage[data-theme="navy"] .kx-rail a,.kx-stage[data-theme="blue"] .kx-rail a{color:var(--on-3)}
.kx-stage[data-theme="navy"] .kx-rail a i,.kx-stage[data-theme="blue"] .kx-rail a i{color:#fff}
.kx-rail a.on{background:var(--navy);color:#fff}.kx-rail a.on i{color:var(--yellow)}
.kx-stage[data-theme="navy"] .kx-rail a.on,.kx-stage[data-theme="blue"] .kx-rail a.on{background:var(--yellow);color:var(--navy)}
.kx-stage[data-theme="navy"] .kx-rail a.on i,.kx-stage[data-theme="blue"] .kx-rail a.on i{color:var(--navy)}
.kx-rail a::after{content:"";position:absolute;left:0;bottom:0;height:3px;width:var(--p,0%);background:var(--yellow)}
.kx-rail a.on::after{background:var(--blue)}
.kx-stage[data-theme="navy"] .kx-rail a.on::after,.kx-stage[data-theme="blue"] .kx-rail a.on::after{background:var(--navy)}
@media (max-width:1100px){.kx-rail a span{display:none}.kx-rail a{text-align:center}}
/* Mobile: visuals inline */
.kx-steps .kx-vis{display:none}
@media (max-width:960px){
.kx-needs{padding-block:80px 40px}
.kx-ex{grid-template-columns:minmax(0,1fr);gap:0}
.kx-step{min-width:0}.kx-steps .kx-vis>*{min-width:0;max-width:100%}
.kx-stage{display:none}
.kx-step{min-height:0;opacity:1;padding-block:28px 40px;border-top:1px solid var(--line-l)}
.kx-steps .kx-vis{display:grid;place-items:center;margin-top:18px;padding:22px 16px;border-radius:20px}
.kx-steps .kx-vis[data-theme="paper"]{background:#DCE6EC}
.kx-steps .kx-vis[data-theme="navy"]{background:var(--navy) url(../assets/images/stream.webp) center/cover}
.kx-steps .kx-vis[data-theme="white"]{background:#fff}
.kx-steps .kx-vis[data-theme="sky"]{background:#CFE4FF}
.kx-steps .kx-vis[data-theme="blue"]{background:var(--blue)}
.kx-steps .kx-vis>*{width:100%}
}
/* Trust break */
.kx-trust{position:relative;overflow:hidden;background:var(--blue);color:#fff;text-align:center}
.kx-trust .bg{position:absolute;inset:-12% 0;background:url(../assets/images/wave.webp) center/cover no-repeat;will-change:transform}
.kx-trust::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,60,160,.35),rgba(1,33,71,.55))}
.kx-trust .wrap{position:relative;z-index:1;display:grid;gap:22px;justify-items:center;padding-block:120px}
.kx-trust h2{font-size:clamp(28px,3.8vw,54px);line-height:1.15;text-transform:uppercase;letter-spacing:.02em;text-shadow:0 4px 30px rgba(1,33,71,.35)}
.kx-trust h2>*{display:block}
.kx-trust h2 em{font-style:normal;color:var(--yellow)}
.kx-trust p{font-size:18px;color:rgba(255,255,255,.9);max-width:40ch}
/* Foundation stack */
.kx-found-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:64px;align-items:center}
.kx-found-grid .h2{margin:14px 0 18px}
.kx-found-grid>div:first-child{display:grid;justify-items:start}
.kx-stack{display:grid;gap:14px;perspective:900px}
.ks-caps{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.ks-caps span{display:grid;place-items:center;text-align:center;min-height:96px;padding:14px 10px;border-radius:16px;background:var(--blue);color:#fff;font-family:var(--serif);font-weight:700;font-size:16px;line-height:1.2;opacity:0;transform:translateY(-30px);transition:opacity .5s,transform .7s cubic-bezier(.3,1.4,.5,1);transition-delay:calc(.25s + var(--i)*.12s)}
.ks-caps span:nth-child(2){background:var(--navy)}.ks-caps span:nth-child(3){background:var(--yellow);color:var(--navy)}.ks-caps span:nth-child(4){background:#CFE4FF;color:var(--navy)}
.ks-base{border-radius:20px;background:var(--navy);color:#fff;padding:22px 24px;display:grid;gap:14px;border-bottom:6px solid var(--yellow)}
.ks-base b{display:flex;align-items:center;gap:10px;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--yellow)}
.ks-base b svg{width:26px;height:26px}
.ks-base ul{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.ks-base li{font-size:14.5px;padding:10px 12px;border-radius:10px;background:var(--fill-d);border:1px solid var(--line-d)}
.kx-stack.in .ks-caps span{opacity:1;transform:none}
.ks-more{font-size:13.5px;color:var(--ink-3);text-align:center}
@media (max-width:960px){.kx-found-grid{grid-template-columns:1fr;gap:40px}}
@media (max-width:560px){.ks-caps{grid-template-columns:1fr 1fr}.ks-caps span{min-height:72px;font-size:15px}.ks-base ul{grid-template-columns:1fr}}
/* Team */
.kx-team-list{display:grid;border-top:2px solid var(--navy)}
.kt{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr) auto;gap:16px 32px;align-items:center;padding:26px 0;border-bottom:1px solid var(--line-l)}
.kt-who{font-family:var(--serif);font-weight:700;font-size:24px;color:var(--navy)}
.kt p{color:var(--ink-2);font-size:16px}
.kt-links{display:flex;flex-wrap:wrap;gap:6px;justify-content:flex-end}
.kt-links a{font-size:12.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:8px 12px;border-radius:8px;border:1px solid var(--line-l);color:var(--blue);background:#fff;transition:background .2s,color .2s,border-color .2s}
.kt-links a:hover{background:var(--blue);color:#fff;border-color:var(--blue)}
@media (max-width:860px){.kt{grid-template-columns:1fr;gap:8px}.kt-links{justify-content:flex-start;margin-top:6px}}
/* NJSBA */
.kx-nj-head{display:grid;gap:14px;margin-bottom:40px}
.kx-nj-row{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.kn2{display:grid;gap:14px;align-content:start;padding:26px;border-radius:var(--r-lg);background:var(--navy);color:#fff;transition:transform .3s var(--ease),box-shadow .3s}
.kn2:hover{transform:translateY(-4px);box-shadow:0 26px 46px -28px rgba(1,33,71,.8)}
.kn2 .d{font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--on-3)}
.kn2 .d b{display:block;font-family:var(--serif);font-size:28px;letter-spacing:0;text-transform:none;color:var(--yellow)}
.kn2 .t{font-family:var(--serif);font-size:20px;line-height:1.3}
.kn2 .m{font-size:13px;color:var(--on-2)}
.kn2.hl{background:var(--yellow);color:var(--navy)}
.kn2.hl .d{color:rgba(1,33,71,.65)}.kn2.hl .d b{color:var(--navy)}.kn2.hl .m{color:var(--navy);font-weight:700}
@media (max-width:860px){.kx-nj-row{grid-template-columns:1fr}}
/* CTA */
.also-for{font-size:15px;color:var(--on-2)}
.also-for a{color:#fff;font-weight:600;border-bottom:1.5px solid rgba(255,255,255,.35)}
.also-for a:hover{border-color:var(--yellow)}
@media (prefers-reduced-motion:reduce){.kx-diagram .kd-lines path{stroke-dashoffset:0}.kx-diagram *{opacity:1!important;transform:none!important}.ks-caps span{opacity:1;transform:none}}
.kx-vis .signals{color:#fff}.kx-vis .sig-src span{color:#fff}
@media (max-width:560px){.kx-steps .signals{padding:16px}.kx-steps .sig-src{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.kx-steps .sig-src span{font-size:11px;letter-spacing:0;padding:10px 4px;overflow-wrap:anywhere}}
/* v3: content aligned to home copy */
.kx-needs .sec-head{max-width:820px}
.kx-step h3.kx-line{font-family:var(--serif);font-size:clamp(30px,3.2vw,44px);letter-spacing:.01em;text-transform:none;color:var(--navy);line-height:1.15}
.kx-step>p:not(.kx-line){font-size:18px!important;line-height:1.6}
.kx-step{gap:18px}
.sig-view{align-items:center}
.sig-view img{width:44px;height:44px;border-radius:50%;object-fit:cover;flex:none}
.sys-card{gap:16px}
.sys-list{display:grid;gap:8px}
.sys-list li{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;border-radius:10px;background:var(--paper);font-size:15px;color:var(--navy)}
.sys-list .st{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);opacity:.35;transition:opacity .4s,color .4s;transition-delay:calc(var(--i)*.18s)}
.sys-list .st::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--ink-3);transition:background .4s;transition-delay:calc(var(--i)*.18s)}
.sys-card.in .st{opacity:1;color:#1E8E5A}.sys-card.in .st::before{background:#2BB673;box-shadow:0 0 0 4px rgba(43,182,115,.18)}
.sys-foot{font-family:var(--serif);font-weight:700;font-size:17px;color:var(--navy);text-align:center;padding-top:4px}
.kx-keep{font-size:15.5px;color:var(--ink-2);padding:14px 16px;border-left:4px solid var(--yellow);background:var(--paper);border-radius:0 10px 10px 0;margin:4px 0 8px;max-width:46ch}
.kx-keep b{color:var(--navy);display:block}
.kx-stack>.mh{margin-bottom:-4px}
.kt{grid-template-columns:minmax(0,1fr) minmax(0,1.4fr) auto;transition:background .2s;padding-inline:8px}
a.kt:hover{background:#fff}
.kt-go{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:#fff;color:var(--blue);box-shadow:0 0 0 1px var(--line-l);transition:background .2s,color .2s,transform .25s var(--ease)}
.kt-go svg{width:16px;height:16px}
a.kt:hover .kt-go{background:var(--blue);color:#fff;transform:translateX(3px)}
@media (max-width:860px){.kt-go{display:none}}
.kx-nj-head p{color:rgba(255,255,255,.9);font-size:18px;max-width:52ch}
.kn2 .t{font-size:22px}
.vview{display:grid;gap:12px}
/* Diagram motion */
.kd-dots{opacity:0;transition:opacity .6s 1.6s}
.kx-diagram.in .kd-dots{opacity:1}
.kd-dots .dot-in{fill:var(--blue)}
.kd-dots .dot-out{fill:var(--yellow);stroke:var(--navy);stroke-width:1.2}
.kd-lines path{transition:stroke-dashoffset 1.2s var(--ease),stroke-width .25s,opacity .25s}
.kx-diagram.hl .kd-lines path:not(.on){opacity:.18}
.kd-lines path.on{stroke-width:3}
.kd-core{overflow:visible}
.kd-core .halo{position:absolute;inset:0;border-radius:50%;border:2px solid var(--blue);opacity:0;pointer-events:none}
.kx-diagram.in .kd-core .halo{animation:halo 2.4s ease-out 1.6s infinite}
.kx-diagram.in .kd-core .halo.h2{animation-delay:2.8s}
.kx-diagram.in .kd-core svg{animation:corebeat 2.4s ease-in-out 1.6s infinite}
@keyframes corebeat{0%,100%{transform:scale(1)}50%{transform:scale(1.08)}}
.kd-src li{cursor:default;position:relative}
.kx-diagram.in .kd-src li{animation:srcping 4.8s ease-in-out infinite;animation-delay:calc(2s + var(--k)*.4s)}
@keyframes srcping{0%,12%,100%{background:var(--navy);box-shadow:none}6%{background:var(--blue);box-shadow:0 0 0 4px rgba(0,116,255,.18)}}
.kd-src li.on{background:var(--blue)!important;box-shadow:0 0 0 4px rgba(0,116,255,.2)}
.kd-out li{cursor:default;transition:opacity .5s,transform .5s var(--ease),box-shadow .3s}
.kx-diagram.in .kd-out li{animation:outglow 2.4s ease-in-out infinite;animation-delay:calc(2.6s + var(--k)*.8s)}
@keyframes outglow{0%,100%{box-shadow:0 0 0 1px var(--line-l),0 18px 30px -22px rgba(1,33,71,.5)}40%{box-shadow:0 0 0 2px var(--yellow),0 18px 30px -18px rgba(255,195,1,.55)}}
.kd-out li.on{box-shadow:0 0 0 2px var(--yellow),0 18px 30px -18px rgba(255,195,1,.55)!important;transform:translateX(-4px)}
.kd-out span{display:block;transition:opacity .3s,transform .3s}
.kd-out span.sw{opacity:0;transform:translateY(4px)}
.kx-flow .h2 em{background:linear-gradient(var(--yellow),var(--yellow)) 0 92%/0% 6px no-repeat;transition:background-size 1.1s var(--ease) .5s}
.kx-flow .rv:not(.pre) .h2 em{background-size:100% 6px}
@media (prefers-reduced-motion:reduce){.kd-dots{display:none}.kx-diagram.in .kd-src li,.kx-diagram.in .kd-out li,.kx-diagram.in .kd-core .halo,.kx-diagram.in .kd-core svg{animation:none}}
/* ===== Higher Education page ===== */
.kx-hero-grid{align-items:end;padding-bottom:0}
.kx-copy{padding-bottom:88px;align-self:center}
.hx-art{position:relative;min-height:540px;display:grid;align-items:end}
.hx-disc{position:absolute;left:8%;right:0;bottom:-30%;aspect-ratio:1;border-radius:50%;background:var(--blue);box-shadow:0 0 0 18px rgba(0,116,255,.12),0 0 0 40px rgba(0,116,255,.06);animation:fadeUp 1s var(--ease) .1s both}
.hx-disc .ring{position:absolute;inset:-12%;border-radius:50%;border:1.5px dashed rgba(255,255,255,.2);animation:spin 70s linear infinite}
.hx-disc .ring.r2{inset:-22%;border-style:solid;border-color:rgba(255,195,1,.16);animation-duration:100s;animation-direction:reverse}
.hx-cut{position:relative;width:116%;max-width:none;margin-left:-8%;margin-bottom:-4%;animation:photoIn 1.1s var(--ease) .2s both;filter:drop-shadow(0 30px 40px rgba(0,0,0,.35));will-change:transform}
.hx-art .kx-chip{text-decoration:none;z-index:2}
.hx-art .kx-chip:hover{background:var(--yellow)}
.hx-art .kx-chip.c1{left:-2%;top:6%}.hx-art .kx-chip.c2{left:auto;right:2%;top:2%}.hx-art .kx-chip.c3{left:auto;right:-2%;top:30%}
.hx-alert{position:absolute;left:-10%;top:24%;z-index:2;width:250px;display:grid;gap:6px;padding:14px 16px;border-radius:14px;background:#fff;color:var(--navy);border-left:4px solid var(--yellow);box-shadow:0 24px 46px -24px rgba(0,0,0,.6);animation:floatIn .7s var(--ease) 1s both}
.hx-alert b{font-size:14px}.hx-alert>span{font-size:13px;color:var(--ink-2)}
.roles-mini{display:flex;gap:4px}.roles-mini em{font-style:normal;font-size:11.5px;font-weight:700;padding:4px 8px;border-radius:6px;background:var(--paper);color:var(--ink-2)}.roles-mini em.on{background:var(--navy);color:#fff}
.hx-art .illus{position:absolute;right:8px;bottom:18px;color:#fff;border-color:rgba(255,255,255,.5);background:rgba(1,33,71,.35);z-index:2}
@media (max-width:960px){.hx-art{min-height:0;padding-top:90px}.kx-copy{padding-bottom:0}.hx-alert{left:0;top:auto;bottom:62%;width:220px}}
@media (max-width:560px){.hx-alert{display:none}.hx-art .kx-chip.c3{display:none}.hx-art .kx-chip.c1{left:0;top:24px}.hx-art .kx-chip.c2{right:0;top:24px}}
/* 5-source diagram */
.kd-src{gap:22px}
/* journey */
.hj .sec-head{max-width:760px}
.hj .h2 em{font-style:normal;color:var(--blue)}
.hj-track{position:relative;margin-top:8px}
.hj-line{position:absolute;left:10%;right:10%;top:27px;height:4px;border-radius:4px;background:rgba(1,33,71,.1);overflow:hidden}
.hj-line span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--blue),var(--yellow));transition:width .7s var(--ease)}
.hj-stops{position:relative;display:grid;grid-template-columns:repeat(5,1fr);gap:8px}
.hj-stops button{display:grid;justify-items:center;gap:12px;text-align:center;padding:0 6px 8px;cursor:pointer}
.hj-stops i{font-style:normal;width:58px;height:58px;border-radius:50%;display:grid;place-items:center;font-family:var(--serif);font-weight:700;font-size:18px;background:#fff;color:var(--navy);box-shadow:0 0 0 1px var(--line-l);transition:background .3s,color .3s,transform .4s var(--ease),box-shadow .3s}
.hj-stops b{font-size:15px;color:var(--ink-2);transition:color .3s}
.hj-stops button.done i{background:var(--navy);color:#fff}
.hj-stops button[aria-selected="true"] i{background:var(--yellow);color:var(--navy);transform:scale(1.12);box-shadow:0 0 0 8px rgba(255,195,1,.22)}
.hj-stops button[aria-selected="true"] b{color:var(--navy)}
.hj-stops button:hover i{box-shadow:0 0 0 1px var(--blue)}
.hj-panel{margin-top:36px;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:24px 48px;align-items:center;padding:36px 40px;border-radius:24px;background:#fff;box-shadow:0 0 0 1px var(--line-l),0 30px 60px -44px rgba(1,33,71,.5);min-height:220px}
.hj-panel .t{font-family:var(--serif);font-weight:700;font-size:clamp(24px,2.4vw,32px);line-height:1.2;color:var(--navy)}
.hj-panel p{font-size:17px;line-height:1.6;color:var(--ink-2);margin-top:10px}
.hj-panel .who{display:grid;gap:10px}
.hj-panel .who .mh{margin-bottom:2px}
.hj-panel .chips{display:flex;flex-wrap:wrap;gap:8px}
.hj-panel .chips span{font-size:13px;font-weight:700;padding:8px 12px;border-radius:999px;background:var(--paper);color:var(--navy)}
.hj-panel .sig{display:flex;flex-wrap:wrap;gap:8px}
.hj-panel .sig span{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:7px 10px;border-radius:8px;background:var(--navy);color:#fff}
.hj-panel>*{animation:hjIn .5s var(--ease) both}.hj-panel>*:nth-child(2){animation-delay:.08s}
@keyframes hjIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@media (max-width:860px){.hj-stops b{font-size:12px}.hj-stops i{width:44px;height:44px;font-size:15px}.hj-line{top:20px}.hj-panel{grid-template-columns:1fr;padding:26px 22px}}
@media (max-width:520px){.hj-stops b{display:none}.hj-stops{gap:2px}}
/* FAQ */
.hq-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:48px 72px;align-items:start}
.hq-grid>div:first-child{display:grid;gap:16px;justify-items:start;position:sticky;top:120px}
.hq-list{display:grid;border-top:2px solid var(--navy)}
.hq-item{border-bottom:1px solid var(--line-l)}
.hq-item summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:24px 4px;font-family:var(--serif);font-weight:700;font-size:21px;color:var(--navy)}
.hq-item summary::-webkit-details-marker{display:none}
.hq-item summary i{flex:none;width:36px;height:36px;border-radius:50%;background:var(--paper);position:relative;transition:background .25s,transform .35s var(--ease)}
.hq-item summary i::before,.hq-item summary i::after{content:"";position:absolute;left:50%;top:50%;width:14px;height:2px;background:var(--navy);transform:translate(-50%,-50%)}
.hq-item summary i::after{transform:translate(-50%,-50%) rotate(90deg);transition:transform .35s var(--ease)}
.hq-item[open] summary i{background:var(--yellow)}
.hq-item[open] summary i::after{transform:translate(-50%,-50%) rotate(0)}
.hq-item summary:hover{color:var(--blue)}
.hq-item p{padding:0 4px 24px;font-size:16.5px;line-height:1.65;color:var(--ink-2);max-width:62ch;animation:hjIn .4s var(--ease) both}
@media (max-width:900px){.hq-grid{grid-template-columns:1fr}.hq-grid>div:first-child{position:static}.hq-item summary{font-size:18px}}
.kx-diagram{grid-template-columns:150px 1fr 150px}
.kd-lines{left:150px;width:calc(100% - 300px)}
.kd-src li{white-space:nowrap}
.kd-src{gap:0;height:100%;grid-template-rows:repeat(5,1fr);align-items:center;align-self:stretch;padding-block:calc(340px*0.0)}
@media (max-width:560px){.kx-diagram{grid-template-columns:96px 1fr 104px}.kd-lines{left:96px;width:calc(100% - 200px)}.kd-src li{font-size:9.5px;padding:7px 4px}}
/* ===== Higher Education v2 ===== */
.ico{width:46px;height:46px;flex:none;border-radius:12px;display:grid;place-items:center;background:var(--paper);color:var(--blue)}
.ico svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.he-head{display:grid;gap:16px;max-width:780px;margin-bottom:52px}
.he-head.center{justify-items:center;text-align:center;margin-inline:auto}
.he-head .eyebrow{display:inline-flex;align-items:center;gap:10px}
.he-head .eyebrow i{font-style:normal;font-family:var(--serif);font-size:13px;letter-spacing:0;padding:3px 8px;border-radius:6px;background:currentColor}
.he-head .eyebrow i{color:inherit;background:rgba(0,116,255,.12)}
.navy .he-head .eyebrow i,.blue .he-head .eyebrow i{background:rgba(255,195,1,.18)}
.he-head p{font-size:18px;line-height:1.6;color:var(--ink-2);max-width:62ch}
.navy .he-head p,.blue .he-head p{color:var(--on-2)}
.he-head .h2 em{font-style:normal;color:var(--blue)}
.navy .he-head .h2 em{color:var(--yellow)}
/* hero cards */
.hx-card{position:absolute;z-index:2;display:grid;gap:4px;padding:12px 14px;border-radius:14px;background:#fff;color:var(--navy);box-shadow:0 24px 46px -24px rgba(0,0,0,.6);max-width:230px;animation:floatIn .7s var(--ease) both,bob 6s ease-in-out infinite}
.hx-card b{font-size:14px;line-height:1.35}
.hx-card .mh{color:var(--blue)}
.hx-card.c-stu{left:-6%;top:10%;animation-delay:.7s,1.4s;border-left:4px solid var(--blue)}
.hx-card.c-fac{right:-2%;top:2%;animation-delay:.85s,2s;border-left:4px solid var(--yellow)}
.hx-card.c-lead{right:-6%;top:34%;animation-delay:1s,2.6s;border-left:4px solid #2BB673}
@media (max-width:960px){.hx-card.c-stu{left:0;top:30px}.hx-card.c-fac{right:0;top:10px}.hx-card.c-lead{display:none}}
@media (max-width:560px){.hx-card{max-width:170px;padding:9px 11px}.hx-card b{font-size:12px}.hx-card.c-fac{display:none}}
/* answers strip */
.he-answers{background:#fff;border-bottom:1px solid var(--line-l)}
.he-answers-grid{display:grid;grid-template-columns:repeat(3,1fr)}
.ans{display:grid;gap:8px;padding:34px 32px 34px 0}
.ans+.ans{padding-left:32px;border-left:1px solid var(--line-l)}
.ans .q{font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--blue)}
.ans b{font-family:var(--serif);font-size:21px;line-height:1.35;color:var(--navy)}
@media (max-width:860px){.he-answers-grid{grid-template-columns:1fr}.ans,.ans+.ans{padding:22px 0;border-left:0;border-top:1px solid var(--line-l)}.ans:first-child{border-top:0}}
/* section nav */
.he-nav{position:sticky;top:78px;z-index:40;background:rgba(255,255,255,.94);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line-l)}
.he-nav-in{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;padding-block:10px}
.he-nav-in::-webkit-scrollbar{display:none}
.he-nav a{flex:none;display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border-radius:999px;font-size:14px;font-weight:600;color:var(--ink-2);transition:background .2s,color .2s}
.he-nav a i{font-style:normal;font-family:var(--serif);font-size:12px;color:var(--blue)}
.he-nav a:hover{color:var(--navy);background:var(--paper)}
.he-nav a.on{background:var(--navy);color:#fff}.he-nav a.on i{color:var(--yellow)}
.he-nav-prog{height:3px;background:transparent}.he-nav-prog span{display:block;height:100%;width:0;background:var(--yellow);transition:width .15s linear}
/* challenges */
.he-chal-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:center}
.he-mess{position:relative;aspect-ratio:4/3;border-radius:24px;background:rgba(255,255,255,.04);border:1px dashed rgba(255,255,255,.18);overflow:hidden}
.he-mess .m{position:absolute;padding:10px 14px;border-radius:10px;background:#fff;color:var(--navy);font-size:13.5px;font-weight:700;box-shadow:0 18px 30px -18px rgba(0,0,0,.6);animation:jit 5s ease-in-out infinite}
.he-mess .m1{left:6%;top:10%;--r:-6deg;animation-delay:0s}.he-mess .m2{right:8%;top:8%;--r:5deg;animation-delay:.6s}
.he-mess .m3{left:30%;top:30%;--r:3deg;animation-delay:1.2s;background:var(--yellow)}.he-mess .m4{right:12%;top:36%;--r:-4deg;animation-delay:1.8s}
.he-mess .m5{left:8%;top:56%;--r:7deg;animation-delay:2.4s}.he-mess .m6{right:6%;top:64%;--r:-7deg;animation-delay:3s;background:#CFE4FF}
.he-mess .m7{left:24%;bottom:8%;--r:-3deg;animation-delay:3.6s}.he-mess .m8{right:30%;bottom:12%;--r:4deg;animation-delay:4.2s}
@keyframes jit{0%,100%{transform:rotate(var(--r)) translate(0,0)}50%{transform:rotate(calc(var(--r)*-.6)) translate(4px,-6px)}}
.mess-lines{position:absolute;inset:0;width:100%;height:100%}
.mess-lines path{fill:none;stroke:rgba(255,255,255,.25);stroke-width:1.5;stroke-dasharray:4 6}
.mess-q{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:64px;height:64px;border-radius:50%;display:grid;place-items:center;font-family:var(--serif);font-size:32px;font-weight:700;color:var(--navy);background:var(--yellow);box-shadow:0 0 0 12px rgba(255,195,1,.15);animation:pulse 2.4s infinite}
.he-chal-list{display:grid;gap:12px}
.cc{display:flex;gap:16px;align-items:flex-start;padding:20px 22px;border-radius:16px;background:rgba(255,255,255,.06);border:1px solid var(--line-d)}
.cc .ico{background:rgba(255,195,1,.14);color:var(--yellow)}
.cc b{display:block;font-family:var(--serif);font-size:20px;color:#fff;margin-bottom:4px}
.cc p{color:var(--on-2);font-size:15.5px;line-height:1.55}
@media (max-width:960px){.he-chal-grid{grid-template-columns:1fr;gap:32px}}
@media (max-width:560px){.he-mess .m{font-size:11px;padding:7px 9px}}
/* provides */
.he-prov-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:56px;align-items:center}
.he-four{display:grid;gap:12px}
.he-four li{display:flex;gap:14px;align-items:center;padding:16px 18px;border-radius:16px;background:var(--paper);transition:transform .3s var(--ease),background .3s}
.he-four li:hover{transform:translateX(-4px);background:#E3EBF0}
.he-four .ico{background:#fff}
.he-four b{display:block;font-family:var(--serif);font-size:19px;color:var(--navy)}
.he-four span:not(.ico){font-size:14.5px;color:var(--ink-2)}
.he-note{margin-top:44px;text-align:center;font-size:17px;color:var(--ink-2)}.he-note b{color:var(--navy)}
@media (max-width:1100px){.he-prov-grid{grid-template-columns:1fr}}
/* how */
.he-steps{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:20px;counter-reset:s}
.he-steps::before{content:"";position:absolute;left:8%;right:8%;top:34px;height:3px;background:rgba(1,33,71,.1)}
.he-steps::after{content:"";position:absolute;left:8%;top:34px;height:3px;width:0;background:linear-gradient(90deg,var(--blue),var(--yellow));transition:width 1.6s var(--ease) .3s}
.he-steps.in::after{width:84%}
.hstep{position:relative;display:grid;gap:12px;align-content:start;padding:26px 26px 28px;border-radius:20px;background:#fff;box-shadow:0 0 0 1px var(--line-l)}
.hstep-n{position:absolute;top:-14px;left:26px;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-family:var(--serif);font-weight:700;background:var(--navy);color:var(--yellow);box-shadow:0 0 0 6px var(--paper)}
.hstep .ico{margin-top:10px}
.hstep b{font-family:var(--serif);font-size:26px;color:var(--navy)}
.hstep p{color:var(--ink-2);font-size:15.5px;line-height:1.6}
.hstep-chips{display:flex;flex-wrap:wrap;gap:6px}
.hstep-chips em{font-style:normal;font-size:12px;font-weight:700;padding:6px 10px;border-radius:8px;background:var(--paper);color:var(--navy)}
@media (max-width:900px){.he-steps{grid-template-columns:1fr;gap:28px}.he-steps::before,.he-steps::after{display:none}}
/* who */
.he-tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:6px;border-radius:18px;background:var(--paper);margin-bottom:20px}
.he-tabs button{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;text-align:left;font-weight:700;font-size:15px;color:var(--ink-2);transition:background .25s,color .25s,box-shadow .25s}
.he-tabs button .ico{width:38px;height:38px;background:#fff}.he-tabs button .ico svg{width:20px;height:20px}
.he-tabs button[aria-selected="true"]{background:#fff;color:var(--navy);box-shadow:0 10px 24px -16px rgba(1,33,71,.5)}
.he-tabs button[aria-selected="true"] .ico{background:var(--navy);color:var(--yellow)}
.he-who-panel{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:28px;align-items:stretch}
.wp-col{display:grid;gap:16px;align-content:start}
.wp-box{padding:22px 24px;border-radius:18px}
.wp-box.today{background:var(--paper)}
.wp-box.with{background:var(--navy);color:#fff}
.wp-box .mh{display:block;margin-bottom:12px}
.wp-box.with .mh{color:var(--yellow)}
.wp-box ul{display:grid;gap:10px}
.wp-box li{display:flex;gap:10px;font-size:16px;line-height:1.5}
.wp-box.today li{color:var(--ink-2)}
.wp-box.today li::before{content:"";flex:none;width:16px;height:2px;margin-top:11px;background:var(--ink-3)}
.wp-box.with li::before{content:"";flex:none;width:18px;height:18px;margin-top:2px;border-radius:50%;background:var(--yellow) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m4 8.3 2.6 2.6L12 5.5' fill='none' stroke='%23012147' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px no-repeat}
.wp-who{font-size:14px;color:var(--ink-3)}
.wp-prev{border-radius:22px;background:linear-gradient(160deg,#CFE4FF,#EAF2FF);padding:28px;display:grid;place-items:center}
.wp-card{width:100%;max-width:380px;background:#fff;border-radius:16px;padding:20px;display:grid;gap:12px;box-shadow:0 30px 50px -32px rgba(1,33,71,.55)}
.wp-card .vh{display:flex;justify-content:space-between;align-items:center}
.wp-card .r{display:flex;justify-content:space-between;gap:10px;font-size:14px;padding:10px 12px;border-radius:10px;background:var(--paper);color:var(--navy)}
.wp-card .r em{font-style:normal;font-size:11.5px;font-weight:700;color:var(--blue);text-transform:uppercase;letter-spacing:.06em}
.wp-card .r.w em{color:#9A6B00}
.wp-card .bars{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;align-items:end;height:90px}
.wp-card .bars span{border-radius:5px 5px 2px 2px;background:var(--blue);height:var(--h);animation:grow .7s var(--ease) both}
.wp-card .ring{display:flex;align-items:center;gap:14px}
.wp-card .ring svg{width:64px;height:64px}.wp-card .ring circle{fill:none;stroke-width:7}
.wp-card .ring b{font-family:var(--serif);font-size:18px;color:var(--navy)}
.he-who-panel>*{animation:hjIn .45s var(--ease) both}.he-who-panel>*:nth-child(2){animation-delay:.08s}
@media (max-width:960px){.he-tabs{grid-template-columns:1fr 1fr}.he-who-panel{grid-template-columns:1fr}}
@media (max-width:480px){.he-tabs button{font-size:13px;padding:10px}.he-tabs button .ico{display:none}}
/* capabilities bento */
.he-bento{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.bc{position:relative;display:grid;gap:12px;align-content:start;padding:28px;border-radius:22px;background:#fff;box-shadow:0 0 0 1px var(--line-l);overflow:hidden;transition:transform .3s var(--ease),box-shadow .3s}
.bc:hover{transform:translateY(-4px);box-shadow:0 0 0 1px var(--line-l),0 30px 50px -34px rgba(1,33,71,.5)}
.bc.b-wide{grid-column:span 2}
.bc.b-full{grid-column:1/-1;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;column-gap:40px}
.bc.b-full>.bc-viz{grid-column:2;grid-row:1/span 4}
.bc h3{font-size:24px;color:var(--navy)}
.bc p{color:var(--ink-2);font-size:15.5px;line-height:1.6;max-width:46ch}
.bc .tag{position:absolute;top:28px;right:28px;background:var(--paper);color:var(--navy)}
.bc.navy{background:var(--navy)}.bc.navy h3{color:#fff}.bc.navy p{color:var(--on-2)}.bc.navy .ico{background:rgba(255,195,1,.14);color:var(--yellow)}.bc.navy .tag{background:var(--yellow)}
.bc.blue{background:var(--blue)}.bc.blue h3{color:#fff}.bc.blue p{color:rgba(255,255,255,.88)}.bc.blue .ico{background:rgba(255,255,255,.16);color:#fff}.bc.blue .tag{background:#fff}
.bc.sky{background:#CFE4FF}.bc.sky .ico{background:#fff}.bc.sky .tag{background:#fff}
.bc-viz{margin-top:8px}
.alertviz{display:grid;gap:8px;max-width:440px}
.av-row{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;background:rgba(255,255,255,.07);border:1px solid var(--line-d);color:#fff;font-size:14px}
.av-row b{flex:1;font-weight:600}.av-row em{font-style:normal;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--yellow)}
.av-row .dot{width:9px;height:9px;border-radius:50%;background:var(--yellow);animation:blink 1.6s infinite}.av-row.ok .dot{background:#2BB673;animation:none}
.pathviz{display:flex;align-items:center;gap:0}
.pathviz span{flex:1;height:4px;background:var(--line-l);position:relative}
.pathviz span::after{content:"";position:absolute;right:-8px;top:50%;width:16px;height:16px;border-radius:50%;transform:translateY(-50%);background:#fff;box-shadow:0 0 0 2px var(--line-l)}
.pathviz span.on{background:var(--blue)}.pathviz span.on::after{background:var(--blue);box-shadow:none}
.pathviz span.now::after{background:var(--yellow);box-shadow:0 0 0 6px rgba(255,195,1,.25);animation:pulseY 2s infinite}
.roleviz{display:flex;gap:6px;padding:4px;border-radius:10px;background:var(--paper);width:max-content}
.roleviz em{font-style:normal;font-size:13px;font-weight:700;padding:8px 12px;border-radius:8px;color:var(--ink-2);animation:roleCycle 6s infinite}
.roleviz em:nth-child(2){animation-delay:2s}.roleviz em:nth-child(3){animation-delay:4s}
.roleviz em.on{animation:roleCycle 6s infinite}
@keyframes roleCycle{0%,30%{background:var(--navy);color:#fff}33.4%,100%{background:transparent;color:var(--ink-2)}}
.msgviz span{display:inline-block;padding:12px 14px;border-radius:14px 14px 14px 4px;background:var(--blue);color:#fff;font-size:14px;font-weight:600}
.campviz{display:flex;flex-wrap:wrap;gap:6px}
.campviz em{font-style:normal;display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:700;padding:7px 11px;border-radius:999px;background:var(--paper);color:var(--navy)}
.campviz em::before{content:"";width:8px;height:8px;border-radius:50%;background:#2BB673}
.barviz{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;align-items:end;height:110px;max-width:460px}
.barviz span{height:var(--h);border-radius:6px 6px 2px 2px;background:rgba(255,255,255,.85)}
.barviz span:nth-child(3){background:var(--yellow)}
.he-cap .rv:not(.pre) .barviz span{animation:grow .9s var(--ease) both}
@media (max-width:960px){.he-bento{grid-template-columns:1fr 1fr}.bc.b-wide{grid-column:span 2}}
@media (max-width:640px){.he-bento{grid-template-columns:1fr}.bc.b-wide{grid-column:auto}.bc .tag{position:static;justify-self:start}}
/* outcomes */
.he-out .h2{color:#fff}
.he-out-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.oc{display:grid;gap:10px;align-content:start;padding:24px 22px;border-radius:20px;background:var(--navy);color:#fff;transition:transform .3s var(--ease)}
.oc:hover{transform:translateY(-6px)}
.oc .ico{background:rgba(255,195,1,.16);color:var(--yellow)}
.oc b{font-family:var(--serif);font-size:21px;line-height:1.25}
.oc p{font-size:14.5px;line-height:1.55;color:var(--on-2)}
.oc .ba{margin-top:6px;font-size:13px;font-weight:700;color:var(--yellow)}
.oc .ba s{color:var(--on-3);font-weight:600}
.oc:nth-child(3){background:var(--yellow);color:var(--navy)}.oc:nth-child(3) p{color:var(--ink-2)}.oc:nth-child(3) .ico{background:rgba(1,33,71,.1);color:var(--navy)}.oc:nth-child(3) .ba{color:var(--navy)}.oc:nth-child(3) .ba s{color:var(--ink-3)}
.he-out-note{margin-top:28px;font-size:15px;color:rgba(255,255,255,.85)}
@media (max-width:1100px){.he-out-grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:700px){.he-out-grid{grid-template-columns:1fr 1fr}}
@media (max-width:440px){.he-out-grid{grid-template-columns:1fr}}
.cta-box{border-bottom:1px solid var(--line-d);padding-bottom:48px}
@media (prefers-reduced-motion:reduce){.he-mess .m,.hx-card,.roleviz em{animation:none!important}}
@media (max-width:960px){.bc.b-full{grid-template-columns:1fr}.bc.b-full>.bc-viz{grid-column:auto;grid-row:auto}}
/* capabilities explorer (K-12 style) */
.he-capx{padding-block:120px 80px}
.he-capx .he-head{margin-bottom:24px}
.kx-cap{display:inline-flex;align-items:center;font-family:var(--sans);font-size:10.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:4px 9px;border-radius:6px;background:#fff;color:var(--navy);box-shadow:0 0 0 1px var(--line-l);margin-left:6px;vertical-align:middle}
.kx-stage[data-theme="sun"]{background:#FFE9A8}
@media (max-width:960px){.kx-steps .kx-vis[data-theme="sun"]{background:#FFE9A8}}
.kx-rail a span{font-size:11.5px}
.he-capx .kx-stage{top:160px;height:calc(100vh - 190px)}
/* ===== v15 polish ===== */
/* answer strip */
.ans{grid-template-columns:auto 1fr;column-gap:16px;align-items:start}
.ans-ic{grid-row:1/3;width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:var(--navy);color:var(--yellow);transition:transform .4s var(--ease)}
.ans:hover .ans-ic{transform:rotate(-8deg) scale(1.06)}
.ans-ic svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
/* switch */
.he-switch{position:relative;display:inline-grid;grid-auto-flow:column;grid-auto-columns:1fr;padding:4px;border-radius:999px;background:rgba(255,255,255,.08);border:1px solid var(--line-d);margin-bottom:16px}
.he-switch button{position:relative;z-index:1;padding:10px 18px;border-radius:999px;font-weight:700;font-size:14px;color:var(--on-2);transition:color .3s;white-space:nowrap}
.he-switch button[aria-selected="true"]{color:var(--navy)}
.he-switch .sw-pill{position:absolute;top:4px;bottom:4px;left:4px;width:calc(50% - 4px);border-radius:999px;background:var(--yellow);transition:transform .45s var(--ease)}
.he-switch.r .sw-pill{transform:translateX(100%)}
.he-switch.light{background:rgba(1,33,71,.25);border-color:rgba(255,255,255,.2)}
/* challenge before/after */
.he-mess-wrap{display:grid;justify-items:start}
.he-mess{width:100%;transition:background .6s,border-color .6s}
.he-mess .m{left:var(--x);top:var(--y);transform:translate(-50%,-50%) rotate(var(--r));transition:left .9s var(--ease),top .9s var(--ease),transform .9s var(--ease),background .5s,box-shadow .5s;animation:none;white-space:nowrap}
.he-mess .m1{--x:22%;--y:16%;--r:-6deg}.he-mess .m2{--x:76%;--y:14%;--r:5deg}.he-mess .m3{--x:44%;--y:34%;--r:3deg}.he-mess .m4{--x:84%;--y:42%;--r:-4deg}
.he-mess .m5{--x:20%;--y:62%;--r:7deg}.he-mess .m6{--x:78%;--y:70%;--r:-7deg}.he-mess .m7{--x:34%;--y:86%;--r:-3deg}.he-mess .m8{--x:64%;--y:84%;--r:4deg}
.he-mess:not(.on) .m{animation:jit2 5s ease-in-out infinite}
.he-mess .m2{animation-delay:.6s!important}.he-mess .m3{animation-delay:1.2s!important}.he-mess .m4{animation-delay:1.8s!important}.he-mess .m5{animation-delay:2.4s!important}.he-mess .m6{animation-delay:3s!important}.he-mess .m7{animation-delay:3.6s!important}.he-mess .m8{animation-delay:4.2s!important}
@keyframes jit2{0%,100%{translate:0 0}50%{translate:4px -6px}}
.he-mess.on{background:rgba(0,116,255,.12);border-color:rgba(255,195,1,.35);border-style:solid}
.he-mess.on .m{--r:0deg}
.he-mess.on .m1{--x:50%;--y:14%}.he-mess.on .m2{--x:74%;--y:24.5%}.he-mess.on .m3{--x:84%;--y:50%}.he-mess.on .m4{--x:74%;--y:75.5%}.he-mess.on .m5{--x:50%;--y:86%}.he-mess.on .m6{--x:26%;--y:75.5%}.he-mess.on .m7{--x:16%;--y:50%}.he-mess.on .m8{--x:26%;--y:24.5%}
.he-mess.on .m{background:#fff;box-shadow:0 0 0 2px var(--yellow),0 18px 30px -18px rgba(0,0,0,.6)}
.mess-lines g{transition:opacity .5s}
.mess-lines .onl{opacity:0}.mess-lines .onl path{fill:none;stroke:var(--yellow);stroke-width:1.6;stroke-dasharray:200;stroke-dashoffset:200;transition:stroke-dashoffset 1s var(--ease) .5s;vector-effect:non-scaling-stroke}
.he-mess.on .mess-lines .off{opacity:0}.he-mess.on .mess-lines .onl{opacity:1}.he-mess.on .mess-lines .onl path{stroke-dashoffset:0}
.mess-lines .off path{vector-effect:non-scaling-stroke}
.mess-q{transition:opacity .4s,transform .5s var(--ease)}
.he-mess.on .mess-q{opacity:0;transform:translate(-50%,-50%) scale(.4)}
.mess-hub{position:absolute;left:50%;top:50%;width:84px;height:84px;margin:-42px 0 0 -42px;border-radius:50%;display:grid;place-items:center;background:var(--navy);color:#fff;box-shadow:0 0 0 10px rgba(0,116,255,.25),0 0 0 22px rgba(0,116,255,.1);opacity:0;transform:scale(.5);transition:opacity .5s .4s,transform .7s var(--ease) .4s}
.mess-hub svg{width:36px;height:42px}
.he-mess.on .mess-hub{opacity:1;transform:none}
.mess-cap{margin-top:16px;font-size:16px;color:var(--on-2)}.mess-cap b{color:var(--yellow)}
@media (max-width:560px){.he-mess .m{font-size:10.5px;padding:6px 8px}.mess-hub{width:60px;height:60px;margin:-30px 0 0 -30px}.mess-hub svg{width:26px;height:30px}.he-switch button{padding:9px 12px;font-size:13px}}
/* how it works visuals */
.mv{height:86px;border-radius:14px;background:var(--paper);position:relative;overflow:hidden;margin-top:6px}
.mv-connect em{position:absolute;top:50%;font-style:normal;font-size:11px;font-weight:700;padding:5px 9px;border-radius:7px;background:var(--navy);color:#fff;transform:translateY(-50%);animation:mvc 3.6s var(--ease) infinite}
.mv-connect em:nth-child(1){top:24%;animation-delay:0s}.mv-connect em:nth-child(2){top:50%;animation-delay:.4s}.mv-connect em:nth-child(3){top:76%;animation-delay:.8s}
@keyframes mvc{0%{left:6%;opacity:0}15%{opacity:1}60%,100%{left:58%;opacity:0}}
.mv-hub{position:absolute;right:12%;top:50%;width:46px;height:46px;margin-top:-23px;border-radius:50%;display:grid;place-items:center;background:var(--blue);color:#fff;box-shadow:0 0 0 6px rgba(0,116,255,.15);animation:pulseB 2.4s infinite}
.mv-hub svg{width:20px;height:24px}
@keyframes pulseB{0%{box-shadow:0 0 0 0 rgba(0,116,255,.4)}70%{box-shadow:0 0 0 14px rgba(0,116,255,0)}100%{box-shadow:0 0 0 0 rgba(0,116,255,0)}}
.mv-org span{position:absolute;left:18%;right:30%;height:16px;border-radius:6px;background:var(--blue);opacity:.25;animation:mvo 3.6s var(--ease) infinite}
.mv-org span:nth-child(1){top:18%}.mv-org span:nth-child(2){top:42%;animation-delay:.3s;background:var(--navy)}.mv-org span:nth-child(3){top:66%;animation-delay:.6s;background:var(--yellow)}
@keyframes mvo{0%{transform:translateX(-30px);opacity:0}25%,80%{transform:none;opacity:1}100%{opacity:1}}
.mv-lock{position:absolute;right:12%;top:50%;width:40px;height:40px;margin-top:-20px;border-radius:12px;display:grid;place-items:center;background:#fff;color:var(--navy);box-shadow:0 8px 18px -10px rgba(1,33,71,.5)}
.mv-lock svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round}
.mv-del{display:flex;align-items:center;justify-content:center;gap:8px}
.mv-del em{font-style:normal;font-size:12px;font-weight:700;padding:9px 12px;border-radius:10px;background:#fff;color:var(--navy);box-shadow:0 10px 18px -12px rgba(1,33,71,.5);animation:mvd 3.6s var(--ease) infinite}
.mv-del em:nth-child(2){animation-delay:.3s;background:var(--navy);color:#fff}.mv-del em:nth-child(3){animation-delay:.6s;background:var(--yellow)}
@keyframes mvd{0%{transform:translateY(18px) scale(.8);opacity:0}25%,85%{transform:none;opacity:1}100%{opacity:1}}
.hstep{cursor:pointer;transition:transform .35s var(--ease),box-shadow .35s}
.hstep.act{transform:translateY(-6px);box-shadow:0 0 0 2px var(--navy),0 30px 50px -32px rgba(1,33,71,.55)}
.hstep.act .hstep-n{background:var(--yellow);color:var(--navy)}
/* who tabs progress */
.he-tabs button{position:relative;overflow:hidden}
.he-tabs button::after{content:"";position:absolute;left:12px;right:12px;bottom:4px;height:3px;border-radius:3px;background:var(--yellow);transform:scaleX(0);transform-origin:left}
.he-tabs.auto button[aria-selected="true"]::after{animation:tabp 5s linear forwards}
@keyframes tabp{to{transform:scaleX(1)}}
.wp-prev{position:relative;overflow:hidden}
.wp-prev::before{content:"";position:absolute;width:260px;height:260px;right:-80px;top:-80px;border-radius:50%;background:rgba(0,116,255,.12)}
.wp-card{position:relative}
.wp-card .r{animation:hjIn .45s var(--ease) both}.wp-card .r:nth-of-type(2){animation-delay:.08s}.wp-card .r:nth-of-type(3){animation-delay:.16s}
/* outcomes */
.he-out{position:relative;overflow:hidden}
.he-out .glass{position:absolute;right:-10%;top:-10%;width:52%;max-width:680px;aspect-ratio:1;background:url(../assets/images/glass.webp) center/cover;border-radius:50%;opacity:.3;-webkit-mask:radial-gradient(closest-side,#000 55%,transparent);mask:radial-gradient(closest-side,#000 55%,transparent);pointer-events:none}
.he-out .wrap{position:relative;z-index:1}
.he-out-head{display:flex;justify-content:space-between;align-items:end;flex-wrap:wrap;gap:20px;margin-bottom:44px}
.oc .ba{position:relative;display:block;height:22px;overflow:hidden;margin-top:8px}
.oc .ba span{position:absolute;left:0;top:0;transition:transform .5s var(--ease),opacity .5s}
.oc .ba .b4{text-decoration:line-through;color:var(--on-3);transform:translateY(100%);opacity:0}
#outGrid[data-state="before"] .oc .ba .b4{transform:none;opacity:1}
#outGrid[data-state="before"] .oc .ba .af{transform:translateY(-100%);opacity:0}
#outGrid[data-state="before"] .oc{filter:saturate(.4);opacity:.85}
.oc{transition:transform .3s var(--ease),filter .5s,opacity .5s}
.oc:nth-child(3) .ba .b4{color:var(--ink-3)}
.oc .ico{transition:transform .5s var(--ease)}
.oc:hover .ico{transform:rotate(-10deg) scale(1.1)}
@media (prefers-reduced-motion:reduce){.mv *,.he-mess .m{animation:none!important}}
#flowDia.pulse .kd-core{box-shadow:0 0 0 14px rgba(255,195,1,.25),0 0 0 30px rgba(255,195,1,.1)}
#flowDia.pulse .kd-out li{box-shadow:0 0 0 2px var(--yellow),0 18px 30px -18px rgba(255,195,1,.55)}
.he-mess .m{position:absolute}
.he-mess .m1,.he-mess .m2,.he-mess .m3,.he-mess .m4,.he-mess .m5,.he-mess .m6,.he-mess .m7,.he-mess .m8{right:auto;bottom:auto}
.he-steps::before,.he-steps::after{top:2px;z-index:0}.hstep{z-index:1}.hstep-n{z-index:2}
[hidden]{display:none!important}
/* ===== Higher Education · Figma sync (frame 2131:3526) ===== */
.site-header{background:var(--navy);padding-top:24px}
.site-header.scrolled{background:transparent}
#main{--n5:rgba(1,33,71,.05);--n10:rgba(1,33,71,.1);--n60:rgba(1,33,71,.6);--n80:rgba(1,33,71,.8)}
.q-sec{position:relative;padding-block:clamp(72px,8.4vw,120px)}
.q-navy{background:var(--navy);color:#fff}
.q-white{background:#fff;color:var(--navy)}
.q-mist{background:#F2F4F6;color:var(--navy)}
.q-eb{display:block;font-family:var(--sans);font-weight:600;font-size:clamp(13px,1.1vw,16px);line-height:1.2;letter-spacing:.12em;text-transform:uppercase;color:var(--blue);white-space:pre}
.q-navy .q-eb{color:var(--yellow)}
.q-h2{font-family:var(--serif);font-weight:700;font-size:clamp(32px,3.45vw,48px);line-height:1.2;letter-spacing:.01em;text-wrap:wrap}
#main h3{text-wrap:wrap}
.q-lede{font-size:18px;line-height:1.6;color:var(--n80)}
.q-navy .q-lede{color:rgba(255,255,255,.8)}
.q-head{display:flex;justify-content:space-between;align-items:flex-end;gap:48px 80px}
.q-title{display:grid;gap:16px;max-width:648px}
.q-head>.q-lede{width:535px;max-width:100%;flex:none}
.q-ic svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
/* fit-to-width scaler for fixed-size Figma visuals */
.q-fit{position:relative;width:100%;height:calc(var(--fh)*var(--k,1)*1px)}
.q-fit-in{position:absolute;left:0;right:0;margin-inline:auto;top:0;width:calc(var(--fw)*1px);height:calc(var(--fh)*1px);zoom:var(--k,1)}
@media (prefers-reduced-motion:reduce){#main *,#main *::before,#main *::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
/* ---------- Hero ---------- */
.q-hero{background:var(--navy);color:#fff;overflow:hidden;position:relative}
.q-hero-grid{display:grid;grid-template-columns:minmax(0,648fr) minmax(0,648fr);gap:32px;align-items:center;padding-block:32px 40px}
.q-hero-copy{display:grid;gap:32px;align-content:center}
.q-crumbs{display:flex;flex-wrap:wrap;gap:8px;font-size:14px;line-height:1.5;color:rgba(255,255,255,.8)}
.q-crumbs a{color:#fff;font-weight:600}.q-crumbs a:hover{color:var(--yellow)}
.q-crumbs .sl{color:rgba(255,255,255,.6)}
.q-crumbs [aria-current]{color:var(--blue);font-weight:600}
.q-hero-text{display:grid;gap:24px;padding-right:60px;justify-items:start}
.q-hero-text .eyebrow{font-size:clamp(13px,1.1vw,16px);letter-spacing:.12em}
.q-hero h1{font-family:var(--serif);font-weight:700;font-size:clamp(38px,4.45vw,62px);line-height:1.2;letter-spacing:.02em;color:#fff;text-wrap:wrap}
.q-hero h1 em{font-style:normal;color:var(--yellow)}
.q-hero .lede{color:#fff;opacity:.93}
.q-hero .hero-ctas{gap:12px}
.q-hero .btn-line,.cta .btn-line{border:1px solid #fff}
.q-hero-art .q-fit-in{overflow:visible}
.ha-clip{position:absolute;left:-47px;top:142px;width:734px;height:498px;overflow:hidden}
.ha-disc{position:absolute;left:162px;top:97px;width:475px;height:475px;border-radius:50%;background:var(--blue);animation:haPulse 7s ease-in-out infinite}
.ha-ring{position:absolute;border-radius:50%;pointer-events:none}
.ha-ring.dash{left:114px;top:49px;width:571px;height:571px;border:1.2px dashed rgba(255,255,255,.95);opacity:.22;animation:haSpin 60s linear infinite}
.ha-ring.gold{left:65px;top:0;width:669px;height:669px;border:1.2px solid var(--yellow);opacity:.9;animation:haBreath 8s ease-in-out infinite}
.ha-chip{position:absolute;display:flex;align-items:center;gap:6.5px;padding:7.3px 11.4px;border-radius:999px;background:#fff;color:var(--navy);font-size:11.4px;font-weight:600;line-height:1.5;white-space:nowrap;box-shadow:0 14.7px 29.4px -16.3px rgba(0,0,0,.35);animation:haFloat 6s ease-in-out infinite}
.ha-chip i{width:7.3px;height:7.3px;border-radius:50%;background:var(--blue)}
.ha-chip.y i{background:var(--yellow)}
.ha-card{position:absolute;left:180px;top:119px;display:grid;gap:12px;padding:14px 13px;background:#fff;border-left:5px solid var(--yellow);border-radius:13px;color:var(--navy);animation:haFloat 7s ease-in-out -2s infinite}
.ha-card .lb{font-size:9px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;opacity:.75;line-height:1.4}
.ha-roles{display:flex;gap:4.9px}
.ha-roles span{padding:4.9px 8.2px;border-radius:6.5px;background:var(--n10);font-size:11.4px;font-weight:600;line-height:1.5;transition:background .4s,color .4s}
.ha-roles span.on{background:var(--navy);color:#fff}
.ha-photo{position:absolute;left:-57px;top:372px;width:800px;height:auto;max-width:none;animation:haRise 1.1s var(--ease) .2s both}
@keyframes haSpin{to{rotate:360deg}}
@keyframes haBreath{50%{scale:.97;opacity:.6}}
@keyframes haPulse{50%{scale:1.025}}
@keyframes haFloat{50%{translate:0 -8px}}
@keyframes haRise{from{opacity:0;translate:0 40px}}
.q-hero-copy>*{animation:fadeUp .8s var(--ease) both}
.q-hero-text>*:nth-child(2){animation-delay:.08s}.q-hero-text>*:nth-child(3){animation-delay:.16s}
/* ---------- Marquee ---------- */
.q-marq .marquee-group{padding-block:18px}
.q-marq .marquee-group span{line-height:1.2}
/* ---------- Answer strip ---------- */
.q-ans{background:#fff;border-bottom:1px solid var(--n10)}
.q-ans-grid{display:grid;grid-template-columns:minmax(0,421fr) minmax(0,453fr) minmax(0,453fr)}
.q-ans-grid>div{display:grid;gap:8px;align-content:start;padding:60px 32px}
.q-ans-grid>div:first-child{padding-left:0}
.q-ans-grid>div+div{border-left:1px solid var(--n10)}
.q-ans small{font-size:12px;line-height:1.4;color:var(--blue);text-transform:uppercase}
.q-ans b{font-family:var(--serif);font-weight:700;font-size:22px;line-height:1.2;color:var(--navy)}
/* ---------- 01 Challenges ---------- */
.q-chal .wrap{display:grid;grid-template-columns:minmax(0,1fr);gap:52px}
.q-chal .q-title{max-width:780px}
.q-chal .q-head>.q-lede{width:468px}
.q-chal-main{display:grid;gap:24px}
.q-sw{position:relative;display:inline-flex;align-items:center;height:48px;padding:3px;border-radius:999px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);width:max-content}
.q-sw button{position:relative;z-index:1;height:40px;padding:0 20px;border-radius:999px;font-size:14px;font-weight:600;line-height:1.5;color:rgba(255,255,255,.8);transition:color .35s}
.q-sw button:first-of-type{width:112px}.q-sw button:last-of-type{width:220px;margin-left:4px}
.q-sw button[aria-selected="true"]{color:var(--navy)}
.q-sw .knob{position:absolute;top:3px;left:3px;height:40px;width:112px;border-radius:999px;background:#fff;transition:left .5s var(--ease),width .5s var(--ease)}
.q-sw.r .knob{left:119px;width:220px}
.q-chal-body{display:grid;grid-template-columns:640px minmax(0,1fr);gap:48px;align-items:start}
.q-sysv{display:grid;gap:20px}
.q-sys{position:relative;width:640px;height:480px;border-radius:16px;background:rgba(255,255,255,.05);overflow:hidden}
.q-sys svg.ln{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.q-sys .on path{stroke:var(--yellow);stroke-width:2;fill:none;stroke-dasharray:240;stroke-dashoffset:240;transition:stroke-dashoffset .9s var(--ease)}
.q-sys .off path{stroke:rgba(255,255,255,.4);stroke-width:1.5;stroke-dasharray:4 6;fill:none;transition:opacity .5s}
.q-sys.c .on path{stroke-dashoffset:0}
.q-sys.c .on path:nth-child(2){transition-delay:.05s}.q-sys.c .on path:nth-child(3){transition-delay:.1s}.q-sys.c .on path:nth-child(4){transition-delay:.15s}.q-sys.c .on path:nth-child(5){transition-delay:.2s}.q-sys.c .on path:nth-child(6){transition-delay:.25s}.q-sys.c .on path:nth-child(7){transition-delay:.3s}.q-sys.c .on path:nth-child(8){transition-delay:.35s}
.q-sys.c .off{opacity:0}
.q-sys .ring{position:absolute;left:232px;top:144px;width:176px;height:176px;border-radius:50%;background:rgba(255,255,255,.05);transition:opacity .5s,scale .6s var(--ease);opacity:0;scale:.6}
.q-sys .hub{position:absolute;left:256px;top:168px;width:128px;height:128px;border-radius:50%;background:#fff;color:var(--navy);display:grid;place-items:center;align-content:center;gap:6px;transition:opacity .5s,scale .6s var(--ease);opacity:0;scale:.6}
.q-sys .hub svg{width:38.5px;height:46px}
.q-sys .hub b{font-size:11px;font-weight:700;letter-spacing:.08em;line-height:1.4}
.q-sys.c .ring,.q-sys.c .hub{opacity:1;scale:1}
.q-sys.c .ring{animation:qHalo 3.2s ease-in-out .8s infinite}
@keyframes qHalo{50%{scale:1.08}}
.q-sys .q{position:absolute;left:306px;top:203px;font-family:var(--serif);font-weight:700;font-size:48px;line-height:1.2;color:var(--yellow);transition:opacity .4s;animation:haFloat 2.6s ease-in-out infinite}
.q-sys.c .q{opacity:0}
.q-sys .sc{position:absolute;display:flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;background:var(--navy);border:1px solid rgba(255,255,255,.4);font-size:14px;font-weight:600;line-height:1.5;white-space:nowrap;transition:translate .8s var(--ease),rotate .8s var(--ease),opacity .5s}
.q-sys .sc i{width:8px;height:8px;border-radius:50%;background:var(--yellow)}
.q-sys:not(.c) .sc{translate:var(--dx) var(--dy);rotate:var(--rt);opacity:.75}
.q-sys:not(.c) .sc i{background:rgba(255,255,255,.4)}
.q-capt{position:relative;min-height:29px}
.q-capt p{position:absolute;left:0;top:0;transition:opacity .4s}
.q-capt .t{font-size:14px;line-height:1.5;color:rgba(255,255,255,.8)}
.q-capt .w{font-size:18px;line-height:1.6;color:var(--yellow);opacity:0}
.q-sysv.c .q-capt .t{opacity:0}.q-sysv.c .q-capt .w{opacity:1}
.q-chal-list{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.q-cc{display:flex;flex-direction:column;gap:16px;padding:32px 28px;border-radius:16px;background:rgba(255,255,255,.05);transition:background .3s,translate .4s var(--ease)}
.q-cc:hover{background:rgba(255,255,255,.08);translate:0 -4px}
.q-cc .top{display:flex;justify-content:space-between;align-items:center}
.q-cc .tile{display:grid;place-items:center;width:52px;height:52px;border-radius:12px;background:rgba(255,255,255,.05);color:var(--yellow)}
.q-cc .tile svg{width:24px;height:24px}
.q-cc .n{font-size:14px;font-weight:600;letter-spacing:.08em;color:rgba(255,255,255,.6);line-height:1}
.q-cc h3{font-size:22px;line-height:1.2;letter-spacing:0;color:#fff}
.q-cc p{font-size:16px;line-height:1.5;color:rgba(255,255,255,.8)}
.q-note{grid-column:1/-1;padding:18px 24px;border-radius:16px;background:var(--yellow);color:var(--navy);font-size:18px;line-height:1.6}
/* ---------- 02 Provides ---------- */
.q-prov .wrap{display:grid;grid-template-columns:648px minmax(0,648px);gap:32px;align-items:center}
.q-prov-copy{display:grid;gap:16px;padding-right:80px}
.q-pgrid{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding-top:24px}
.q-pv{display:flex;gap:16px;align-items:flex-start;padding:20px;border-radius:16px;background:#fff;transition:box-shadow .3s,translate .3s var(--ease)}
.q-pv:hover{box-shadow:0 14px 30px -18px rgba(1,33,71,.35);translate:0 -3px}
.q-pv .tile{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--n5);color:var(--blue)}
.q-pv .tile svg{width:22px;height:22px}
.q-pv b{display:block;font-size:16px;font-weight:600;line-height:1.55;margin-bottom:4px}
.q-pv span{display:block;font-size:14px;line-height:1.5;color:var(--n60)}
.q-dia{position:relative}
.q-dia svg.ln{position:absolute;left:0;top:0;width:648px;height:360px;overflow:visible}
.q-dia .in{fill:none;stroke:var(--blue);stroke-width:1.6;transition:stroke-width .25s,opacity .25s}
.q-dia .out{fill:none;stroke:var(--yellow);stroke-width:2.4;transition:stroke-width .25s,opacity .25s}
.q-dia.hl .in,.q-dia.hl .out{opacity:.3}.q-dia.hl .on{opacity:1;stroke-width:3}
.q-dia .src{position:absolute;left:9px;width:140px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:10px;background:var(--navy);color:#fff;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;line-height:1.2;cursor:default;transition:background .25s}
.q-dia .src:hover,.q-dia .src.on{background:var(--blue)}
.q-dia .src i{position:absolute;left:94px;top:16px;width:8px;height:8px;border-radius:50%;background:var(--blue)}
.q-dia .core{position:absolute;left:251px;top:118px;width:124px;height:124px;border-radius:50%;background:var(--navy);color:#fff;display:grid;place-items:center;align-content:center;gap:4px;box-shadow:0 0 0 26px rgba(0,116,255,.06),0 0 0 12px rgba(0,116,255,.12)}
.q-dia .core svg{width:38.5px;height:46px}
.q-dia .core b{font-size:11px;font-weight:700;letter-spacing:.08em;line-height:1.4}
.q-dia .halo{position:absolute;left:251px;top:118px;width:124px;height:124px;border-radius:50%;border:2px solid var(--blue);animation:qHaloOut 2.8s ease-out infinite}
@keyframes qHaloOut{from{scale:1;opacity:.8}to{scale:1.55;opacity:0}}
.q-dia .role{position:absolute;left:479px;width:160px;display:grid;gap:2px;padding:10px 14px;border-radius:12px;background:#fff;border:1px solid var(--n10);box-shadow:0 18px 30px -22px rgba(1,33,71,.25);white-space:nowrap;cursor:default;transition:border-color .25s,translate .3s var(--ease)}
.q-dia .role:hover,.q-dia .role.on{border-color:var(--yellow);translate:4px 0}
.q-dia .role b{font-family:var(--serif);font-size:18px;line-height:1.25}
.q-dia .role span{font-size:14px;line-height:1.5;color:var(--n60)}
.q-dia .dot-in{fill:var(--blue)}.q-dia .dot-out{fill:var(--yellow)}
/* ---------- 03 How it works ---------- */
.q-how .wrap{display:grid;grid-template-columns:minmax(0,1fr);gap:52px}
.q-prog{height:4px;border-radius:4px;background:var(--n10);overflow:hidden}
.q-prog span{display:block;height:100%;width:100%;border-radius:4px;background:var(--yellow);transform-origin:left;transition:transform .9s var(--ease)}
.q-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;list-style:none;margin:0;padding:0}
.q-step{position:relative;display:flex;flex-direction:column;gap:20px;padding:24px 24px 32px;border-radius:24px;background:var(--n5);cursor:default}
.q-step::after{content:"";position:absolute;inset:0;border:3px solid var(--yellow);border-radius:24px;opacity:0;transition:opacity .35s;pointer-events:none}
.q-step.act::after{opacity:1}
.q-step .vis{border-radius:16px;background:#fff;overflow:hidden}
.q-step .vis.dk{background:var(--navy)}
.q-step .vis .q-fit-in{position:absolute}
.q-step .num{display:flex;align-items:center;gap:12px}
.q-step .badge{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--n10);font-size:14px;font-weight:700;letter-spacing:.12em;line-height:1.2;transition:background .35s,color .35s}
.q-step.act .badge{background:var(--yellow)}
.q-step .num small{font-size:14px;font-weight:600;letter-spacing:.08em;line-height:1;color:var(--n60)}
.q-step h3{font-size:22px;line-height:1.2;letter-spacing:0}
.q-step p{font-size:18px;line-height:1.6;color:var(--n80)}
.q-chips{display:flex;flex-wrap:wrap;gap:8px}
.q-chips span{padding:6px 12px;border-radius:999px;background:#fff;border:1px solid var(--n10);font-size:12px;line-height:1.4}
.v-con .c{position:absolute;left:20px;display:flex;align-items:center;gap:6px;padding:6px 12px;border-radius:999px;background:var(--n5);font-size:12px;line-height:1.4}
.v-con .c i{width:6px;height:6px;border-radius:50%;background:var(--blue)}
.v-con svg{position:absolute;inset:0;overflow:visible}
.v-con svg path{fill:none;stroke:var(--blue);stroke-width:1.5}
.v-con svg circle{fill:var(--yellow)}
.v-con .hub{position:absolute;left:264.67px;top:63px;width:84px;height:84px;border-radius:20px;background:var(--navy);color:#fff;display:grid;place-items:center}
.v-con .hub svg{position:static;width:34.7px;height:41.4px}
.q-step.act .v-con .hub{animation:qPop .7s var(--ease)}
@keyframes qPop{40%{scale:1.1}}
.v-org .ly{position:absolute;left:34.33px;width:240px;height:44px;border-radius:12px;background:var(--blue);color:#fff;display:grid;place-items:center;font-size:14px;font-weight:600;line-height:1.5;transition:translate .6s var(--ease)}
.q-step.act .v-org .ly:nth-child(1){translate:0 -6px}.q-step.act .v-org .ly:nth-child(3){translate:0 6px}
.v-org .lock{position:absolute;left:304.67px;top:81px;width:48px;height:48px;border-radius:50%;background:var(--yellow);color:var(--navy);display:grid;place-items:center}
.v-org .lock svg{width:22px;height:22px}
.q-step.act .v-org .lock{animation:qPop .7s var(--ease) .2s}
.v-del .vw{position:absolute;top:30px;width:104px;height:150px;display:flex;flex-direction:column;gap:8px;padding:12px;border-radius:12px;background:#fff;border:1px solid var(--n10);box-shadow:0 8px 20px rgba(1,33,71,.1);transition:translate .5s var(--ease)}
.v-del .vw .tb{height:8px;width:80px;border-radius:4px;background:var(--navy)}
.v-del .vw b{font-size:14px;font-weight:600;line-height:1.5}
.v-del .vw .ln{height:6px;border-radius:3px;background:var(--n10)}
.v-del .vw .bars{display:flex;gap:4px;align-items:flex-end}
.v-del .vw .bars span{width:12px;border-radius:2px;background:var(--navy);transform-origin:bottom;transition:transform .6s var(--ease)}
.v-del .vw.bl .tb,.v-del .vw.bl .bars span{background:var(--blue)}
.q-step.act .v-del .vw:nth-child(2){translate:0 -6px}
.q-step.act .v-del .bars span{animation:qBar 1s var(--ease)}
@keyframes qBar{from{transform:scaleY(.2)}}
/* ---------- 04 Who benefits ---------- */
.q-who .wrap{display:grid;grid-template-columns:minmax(0,1fr);gap:48px}
.q-tabs{position:relative;display:inline-flex;gap:0;padding:5px;border-radius:999px;background:var(--n5);border:1px solid var(--n10);width:max-content;max-width:100%;overflow-x:auto;scrollbar-width:none}
.q-tabs::-webkit-scrollbar{display:none}
.q-tabs button{position:relative;z-index:1;height:40px;padding:0 20px;border-radius:999px;font-size:14px;font-weight:600;line-height:1.5;white-space:nowrap;color:var(--n60);transition:color .35s}
.q-tabs button[aria-selected="true"]{color:#fff}
.q-tabs .pill{position:absolute;top:5px;left:5px;height:40px;border-radius:999px;background:var(--navy);transition:left .5s var(--ease),width .5s var(--ease)}
.q-panel{display:flex;gap:32px;align-items:stretch;min-height:322px}
.q-panel.sw{animation:qIn .5s var(--ease)}
@keyframes qIn{from{opacity:0;translate:0 12px}}
.q-lists{flex:1;min-width:0;display:flex;flex-direction:column;gap:24px}
.q-lists h3{font-size:22px;line-height:1.2;letter-spacing:0}
.q-boxes{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.q-box{display:flex;flex-direction:column;gap:14px;padding:28px;border-radius:20px;background:var(--n5)}
.q-box.w{background:var(--navy);color:#fff}
.q-box small{font-size:11px;font-weight:700;letter-spacing:.08em;line-height:1.4;text-transform:uppercase;color:var(--n80)}
.q-box.w small{color:var(--yellow)}
.q-box ul{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.q-box li{display:flex;gap:12px;align-items:flex-start;font-size:14px;line-height:1.5;color:var(--n80)}
.q-box.w li{color:#fff}
.q-box li i{flex:none;display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#fff;color:var(--navy)}
.q-box.w li i{background:var(--yellow)}
.q-box li i svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.q-prev{flex:none;width:440px;display:flex;flex-direction:column;gap:18px;padding:28px;border-radius:24px;background:#fff;border:1px solid var(--n10);box-shadow:0 16px 40px rgba(1,33,71,.1)}
.q-prev .hd{font-size:14px;font-weight:600;line-height:1.5}
.q-prev .bars{display:flex;gap:14px;align-items:flex-end;height:150px}
.q-prev .bars span{flex:1;border-radius:6px;background:var(--blue);height:var(--v);transform-origin:bottom;animation:qBar .9s var(--ease) both;animation-delay:calc(var(--i)*.06s)}
.q-prev .bars span.y{background:var(--yellow)}
.q-prev .row{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:12px;background:var(--n5);animation:qIn .5s var(--ease) both;animation-delay:calc(var(--i)*.08s)}
.q-prev .row i{flex:none;width:10px;height:10px;border-radius:50%;background:var(--blue)}
.q-prev .row i.y{background:var(--yellow)}.q-prev .row i.g{background:var(--n60)}
.q-prev .row b{flex:1;font-size:14px;font-weight:600;line-height:1.5}
.q-prev .row em{font-style:normal;font-size:12px;line-height:1.4;color:var(--n60)}
.q-prev .row .rdy{padding:4px 10px;border-radius:999px;background:var(--yellow);color:var(--navy)}
/* ---------- 05 Capabilities ---------- */
.q-cap .wrap{display:grid;grid-template-columns:minmax(0,1fr);gap:52px}
.q-cap .q-title{max-width:646px}
.q-row{display:flex;justify-content:space-between;align-items:center;gap:32px}
.q-row-copy{width:535px;flex:none;display:grid;gap:20px;justify-items:start}
.q-row-copy .k{font-size:16px;font-weight:600;line-height:1.2;letter-spacing:.12em;text-transform:uppercase;color:var(--blue)}
.q-row-copy h3{font-size:28px;line-height:1.2;letter-spacing:.01em}
.q-row-copy p{font-size:18px;line-height:1.6;color:var(--n80);max-width:520px}
.q-link{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:700;line-height:1.2;letter-spacing:.12em;text-transform:uppercase;color:var(--blue)}
.q-link svg{width:18px;height:18px;transition:translate .25s}
.q-link:hover svg{translate:4px 0}
.q-stage{width:648px;max-width:100%;height:500px;flex:none;display:grid;grid-template-columns:minmax(0,1fr);place-items:center;border-radius:28px;background:var(--n5);overflow:hidden;padding:24px}
.q-card{width:440px;max-width:100%;display:flex;flex-direction:column;gap:14px;padding:24px;border-radius:18px;background:#fff;box-shadow:0 40px 70px -44px rgba(1,33,71,.45);color:var(--navy)}
.q-card .lab{font-size:11px;font-weight:700;letter-spacing:.12em;line-height:1.4;text-transform:uppercase;color:var(--n60)}
.q-card .lab2{font-size:11px;font-weight:700;letter-spacing:.08em;line-height:1.4;text-transform:uppercase;color:var(--n60)}
.q-card .dv{height:1px;background:var(--n10)}
.q-seg{display:flex;gap:4px;padding:4px;border-radius:10px;background:var(--n5)}
.q-seg button{flex:1;min-width:0;padding:10px 8px;border-radius:8px;font-size:14px;font-weight:600;line-height:1.5;color:var(--n60);transition:background .3s,color .3s}
.q-seg button[aria-selected="true"]{background:var(--navy);color:#fff}
.q-seg button:not([aria-selected="true"]):hover{color:var(--navy)}
.q-swap{animation:qIn .45s var(--ease)}
/* v1 signals */
.q-sig{width:440px;max-width:100%;padding:24px;border-radius:18px;background:var(--navy);color:#fff}
.q-sig .srcs{display:flex;gap:8px}
.q-sig .srcs span{flex:1;min-width:0;display:flex;justify-content:center;padding:12px 6px;border-radius:10px;background:rgba(255,255,255,.1);border:1px solid var(--yellow);font-size:14px;font-weight:700;letter-spacing:.12em;line-height:1.2;text-transform:uppercase;white-space:nowrap;overflow:hidden}
.q-sig svg{display:block;width:100%;height:90px}
.q-sig svg path{fill:none;stroke:var(--yellow);stroke-width:2}
.q-sig .alert{display:flex;gap:14px;align-items:center;padding:16px 18px;border-radius:12px;background:#fff;border-left:4px solid var(--yellow);color:var(--navy)}
.q-sig .alert img{width:44px;height:44px;border-radius:50%;object-fit:cover;background:var(--n10)}
.q-sig .alert b{display:block;font-size:16px;font-weight:600;line-height:1.55}
.q-sig .alert span{display:block;font-size:14px;line-height:1.5;color:var(--n60)}
/* v2 degree path */
.q-path{width:400px;max-width:100%;display:flex;flex-direction:column;gap:4px;padding:20px 24px;border-radius:16px;background:#fff;border:1px solid var(--n10);box-shadow:0 20px 40px rgba(1,33,71,.12)}
.q-path .hd{display:flex;justify-content:space-between;align-items:center;padding-bottom:12px}
.q-pill{padding:4px 10px;border-radius:999px;background:var(--n5);font-size:11px;font-weight:700;letter-spacing:.08em;line-height:1.4;text-transform:uppercase;color:var(--n60)}
.q-path .goal{display:flex;gap:8px;align-items:center;padding:10px 14px;border-radius:12px;background:var(--navy);white-space:nowrap}
.q-path .goal small{font-size:12px;line-height:1.4;color:var(--yellow)}
.q-path .goal b{font-size:14px;font-weight:600;line-height:1.5;color:#fff}
.q-path ol{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.q-path li{display:flex;gap:14px;align-items:center;padding:9px 14px;border-radius:12px;border:1.5px solid transparent;cursor:pointer;transition:border-color .3s,background .3s}
.q-path li:hover{background:var(--n5)}
.q-path li.now{border-color:var(--yellow)}
.q-path li .mk{flex:none;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#fff;border:2px solid var(--n10)}
.q-path li.done .mk{background:var(--navy);border-color:var(--navy);color:#fff}
.q-path li.done .mk svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.q-path li.now .mk{background:var(--yellow);border-color:var(--yellow)}
.q-path li.now .mk::after{content:"";width:10px;height:10px;border-radius:50%;background:var(--navy)}
.q-path li b{display:block;font-size:14px;font-weight:600;line-height:1.5;white-space:nowrap}
.q-path li small{display:block;font-size:12px;line-height:1.4;color:var(--n60);white-space:nowrap}
.q-path li.now small{color:var(--navy)}
.q-path .pr{display:grid;gap:8px;padding-top:12px}
.q-path .pr div{display:flex;justify-content:space-between;align-items:center}
.q-path .pr small{font-size:12px;line-height:1.4;color:var(--n60)}
.q-path .pr b{font-size:14px;font-weight:600;line-height:1.5}
.q-path .tr{height:8px;border-radius:8px;background:var(--n5);overflow:hidden}
.q-path .tr span{display:block;height:100%;border-radius:8px;background:var(--blue);width:var(--p,62%);transition:width .5s var(--ease)}
/* 05 timeline (Figma keyframes, driven by he2.js) */
/* 05 entrance (SCROLL_SPEC): one Web Animations timeline per row, driven by he2.js.
Pre-paint hidden state = the first keyframe of each animation; only set when html.cap-anim (motion OK + WAAPI). */
.q-path .tr span{transform-origin:0 50%}
.cap-anim #capabilities :is(.q-head .q-eb,.q-head .q-h2,.q-head .q-lede,.q-row-copy>*){opacity:0;translate:0 20px}
.cap-anim #capabilities .q-stage>:not(.q-path){opacity:0;translate:0 32px;scale:.97}
.cap-anim #capabilities :is(#communication-and-engagement .q-card,#reporting-and-insights .q-card,.q-camp){translate:0 25.6px}
.cap-anim #capabilities .q-sig .srcs span{opacity:.35;translate:0 8px}
.cap-anim #capabilities .q-sig svg path{stroke-dasharray:1 1;stroke-dashoffset:1}
.cap-anim #capabilities .q-sig .alert{opacity:0;translate:0 10px}
.cap-anim #capabilities .q-path li{opacity:0;translate:24px 0}
.cap-anim #capabilities .q-path li .mk{scale:.4}
.cap-anim #capabilities .q-path .tr span{scale:.037 1}
.cap-anim #capabilities .q-camp li span{opacity:.3}
/* v3 role views */
.q-prof{display:flex;gap:12px;align-items:center}
.q-prof img{width:48px;height:48px;border-radius:50%;object-fit:cover;background:var(--n10)}
.q-prof b{display:block;font-family:var(--serif);font-size:22px;line-height:1.2}
.q-prof span{display:block;font-size:14px;line-height:1.5;color:var(--n60)}
.q-tagrow{display:flex;flex-wrap:wrap;gap:8px}
.q-tagrow span{display:flex;gap:4px;padding:7px 12px;border-radius:999px;background:var(--n5);font-size:14px;line-height:1.5;white-space:nowrap}
.q-tagrow span i{font-style:normal;color:var(--n60)}
.q-up{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:8px 0;font-size:14px;line-height:1.5}
.q-up em{font-style:normal;padding:3px 8px;border-radius:6px;background:var(--n5);font-size:11px;font-weight:700;letter-spacing:.08em;line-height:1.4;text-transform:uppercase;color:var(--n60);white-space:nowrap}
/* v4 message */
.q-bub{display:flex;flex-direction:column;gap:6px;padding:16px 18px;border-radius:16px 16px 16px 4px;background:var(--blue);color:#fff}
.q-bub small{font-size:14px;font-weight:700;letter-spacing:.12em;line-height:1.2;text-transform:uppercase}
.q-bub p{font-size:16px;line-height:1.5}
.q-qq{font-size:16px;font-weight:600;line-height:1.55}
.q-opts{display:flex;flex-wrap:wrap;gap:8px}
.q-opts button{padding:9px 16px;border-radius:999px;border:1px solid var(--n10);font-size:14px;font-weight:600;line-height:1.5;color:var(--navy);transition:background .25s,border-color .25s,color .25s}
.q-opts button:hover{border-color:var(--navy)}
.q-opts button[aria-pressed="true"]{background:var(--navy);border-color:var(--navy);color:#fff}
/* v5 campuses (Figma card is 80% scale of 440) */
.q-camp{width:352px;max-width:100%;display:flex;flex-direction:column;gap:12.8px;padding:19.2px;border-radius:14.4px;background:#fff;box-shadow:0 32px 56px -35px rgba(1,33,71,.45)}
.q-camp .hd{display:flex;justify-content:space-between;align-items:center}
.q-camp .hd small{font-size:8.8px;font-weight:700;letter-spacing:.12em;line-height:1.4;text-transform:uppercase;color:var(--n60)}
.q-camp .hd em{font-style:normal;padding:2.4px 6.4px;border:.8px dashed var(--n10);border-radius:4.8px;font-size:8.8px;font-weight:700;letter-spacing:.08em;line-height:1.4;text-transform:uppercase;color:var(--n60)}
.q-camp ul{list-style:none;margin:0;padding:0;display:grid;gap:6.4px}
.q-camp li{display:flex;justify-content:space-between;align-items:center;padding:9.6px 11.2px;border-radius:8px;background:var(--n5)}
.q-camp li b{font-size:12.8px;font-weight:600;line-height:1.55}
.q-camp li span{display:flex;gap:6.4px;align-items:center;font-size:8.8px;font-weight:700;letter-spacing:.08em;line-height:1.4;text-transform:uppercase;color:var(--blue);transition:color .3s}
.q-camp li span::before{content:"";width:6.4px;height:6.4px;border-radius:50%;background:var(--blue);box-shadow:0 0 0 3px rgba(0,116,255,.18);transition:background .3s}
.q-camp li.wait span{color:var(--n60)}.q-camp li.wait span::before{background:var(--n10);box-shadow:none}
.q-camp .ct{font-size:11.2px;line-height:1.5;color:var(--n60);text-align:center}
.q-camp .ft{font-family:var(--serif);font-weight:700;font-size:14.4px;line-height:1.25;text-align:center}
/* v6 reporting */
.q-chart{display:flex;gap:12px;align-items:flex-end;height:170px;padding-top:10px;border-bottom:1px solid var(--n10)}
.q-chart span{flex:1;min-width:0;height:var(--v);border-radius:6px 6px 2px 2px;background:var(--blue);transition:height .7s var(--ease),opacity .4s,background .3s}
.q-chart span.y{background:var(--yellow)}
.q-leg{display:flex;gap:12px;font-size:12px;line-height:1.4;color:var(--n60);text-align:center}
.q-leg span{flex:1;min-width:0}
.q-doc{display:flex;gap:12px;align-items:center;padding:12px;border-radius:12px;background:var(--n5)}
.q-doc i{flex:none;display:grid;place-items:center;width:40px;height:46px;border-radius:8px;background:var(--navy);color:#fff;font-style:normal;font-size:11px;font-weight:700;letter-spacing:.08em}
.q-doc b{display:block;font-size:16px;font-weight:600;line-height:1.55}
.q-doc span{display:block;font-size:14px;line-height:1.5;color:var(--n60)}
/* ---------- Statement ---------- */
.q-stmt .wrap{justify-items:center}
.q-stmt .st-copy .eyebrow{font-size:clamp(13px,1.1vw,16px)}
.q-stmt .btn{min-height:42px;padding:0 18px;font-size:13px}
/* ---------- 06 Outcomes ---------- */
.q-out{overflow:hidden}
.q-out .wrap{position:relative;display:grid;gap:52px}
.q-out .orb{position:absolute;left:calc(50% + 400px);top:-260px;width:900px;height:900px;border-radius:50%;border:1px solid var(--n10);pointer-events:none;animation:qOrb 8s ease-in-out infinite}
.q-out .rng{position:absolute;left:calc(50% + 540px);top:-120px;width:620px;height:620px;border-radius:50%;border:2px solid var(--n5);pointer-events:none;animation:qRng 8s ease-in-out infinite}
@keyframes qOrb{0%,100%{translate:0 0;scale:.92}50%{translate:0 30px;scale:1.05}}
@keyframes qRng{0%,100%{opacity:.6;scale:1}50%{opacity:1;scale:.9}}
.q-ogrid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}
.q-oc{display:flex;flex-direction:column;gap:16px;min-height:290px;padding:24px;border-radius:20px;background:#fff;border:1px solid #fff;box-shadow:0 12px 30px rgba(1,33,71,.06);transition:translate .35s var(--ease),box-shadow .35s}
.q-oc:hover{translate:0 -4px;box-shadow:0 18px 36px rgba(1,33,71,.1)}
.q-oc .tile{display:grid;place-items:center;width:48px;height:48px;border-radius:12px;background:var(--n5);color:var(--blue)}
.q-oc .tile svg{width:24px;height:24px}
.q-oc h3{font-size:18px;line-height:1.25;letter-spacing:0}
.q-oc p{flex:1;font-size:14px;line-height:1.5;color:var(--n60)}
.q-oc .ba{position:relative;height:48px;border-radius:12px;background:var(--n5);overflow:hidden}
.q-oc .ba>*{position:absolute;left:16px;top:14px;font-size:14px;font-weight:600;line-height:1.5;white-space:nowrap;transition:opacity .45s var(--ease),translate .55s var(--ease);transition-delay:calc(var(--i)*.15s)}
.q-oc .b4{color:var(--n60);text-decoration:line-through}
.q-oc .af{display:flex;align-items:center;gap:8px;opacity:0;translate:0 14px}
.q-oc .af::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--blue)}
.q-ogrid.after .b4{opacity:0;translate:0 -14px}
.q-ogrid.after .af{opacity:1;translate:0 0;transition-delay:calc(var(--i)*.15s + .2s)}
.q-ogrid.after .tile{animation:qPop .6s var(--ease) both;animation-delay:calc(var(--i)*.15s + .2s)}
.q-oc.dk{background:var(--navy);border-color:var(--navy);color:#fff;box-shadow:none}
.q-oc.dk .tile{background:rgba(255,255,255,.4);color:#fff}
.q-oc.dk p{color:#fff}
.q-oc.dk .ba{background:rgba(255,255,255,.1)}
.q-oc.dk .b4{color:rgba(255,255,255,.6)}
.q-oc.dk .af::before{background:#fff}
.q-onote{font-size:18px;line-height:1.6;color:var(--n80);opacity:.85}
/* ---------- Final CTA ---------- */
.q-cta .cta-box{align-items:end}
.q-cta .cta-box h2{max-width:648px}
/* ---------- Responsive ---------- */
@media (max-width:1240px){
.q-chal-body{grid-template-columns:1fr}
.q-sysv{justify-items:center}.q-sys{width:100%;max-width:640px}.q-capt{width:100%;max-width:640px}
.q-prov .wrap{grid-template-columns:1fr}
.q-prov-copy{padding-right:0;max-width:760px}
.q-ogrid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:1100px){
.q-head{flex-direction:column;align-items:flex-start;gap:20px}
.q-head>.q-lede,.q-chal .q-head>.q-lede{width:auto;max-width:640px}
.q-panel{flex-direction:column}
.q-prev{width:100%;max-width:520px}
.q-row{flex-direction:column;align-items:stretch;gap:28px}
.q-row-copy{width:auto}
.q-stage{width:100%;height:auto;min-height:440px;padding:40px 24px}
}
@media (max-width:900px){
.q-hero-grid{grid-template-columns:1fr;gap:24px;padding-bottom:0}
.q-hero-text{padding-right:0}
.q-steps{grid-template-columns:1fr;max-width:560px}
}
@media (max-width:760px){
.q-ans-grid{grid-template-columns:1fr}
.q-ans-grid>div{padding:28px 0}
.q-ans-grid>div+div{border-left:0;border-top:1px solid var(--n10)}
.q-chal-list,.q-pgrid,.q-boxes{grid-template-columns:1fr}
.q-cc{padding:24px}
.q-note{font-size:16px}
.q-ogrid{grid-template-columns:1fr 1fr}
.q-oc{min-height:0}
.q-sw button:first-of-type,.q-sw .knob{width:92px}.q-sw button:last-of-type{width:184px}
.q-sw.r .knob{left:99px;width:184px}
.q-cap .q-fit{width:100%}
}
@media (max-width:520px){
.q-ogrid{grid-template-columns:1fr}
.q-stage{padding:28px 14px;min-height:0;border-radius:20px}
.q-card,.q-sig{padding:18px}
.q-sig .srcs span{font-size:11px;letter-spacing:.06em}
.q-prev{padding:20px}
.q-box{padding:22px}
.q-row-copy h3{font-size:24px}
.q-out .orb,.q-out .rng{display:none}
}
/* B2 pass 2 */
.q-yband{display:block;height:60px;background:#ffc301;position:relative;z-index:3}
.ha-photo{left:-76px;top:299px;width:800px;height:373px;object-fit:cover}
.ha-ring.gold{opacity:.18;animation-name:haBreath2}
.ha-ring.dash{background:none;box-shadow:none}
.q-cta .cta-box{padding-bottom:60px}
.q-cta .cta-right p{max-width:535px}
@media (min-width:1101px){.q-ans{height:198px}.q-prov{min-height:830px}.q-how{min-height:996px}.q-who{min-height:861px}.q-cap{min-height:3703px}.q-stmt{min-height:565px}.q-cta{min-height:595px}}
@keyframes haBreath2{50%{scale:.97}}
/* ===== Mobile / tablet pass (<=1199px only; desktop untouched) ===== */
.ln-m{display:none}
@media (max-width:1199px){
#main .q-hero h1,#main .q-h2,#main .q-row-copy h3{text-wrap:balance}
/* hero art: keep chips/card legible when the composition is scaled down */
.q-hero-art .ha-chip{font-size:max(11.4px,calc(12px / var(--k,1)));padding:max(7.3px,calc(6px / var(--k,1))) max(11.4px,calc(10px / var(--k,1)));gap:max(6.5px,calc(6px / var(--k,1)))}
.q-hero-art .ha-chip i{width:max(7.3px,calc(7px / var(--k,1)));height:max(7.3px,calc(7px / var(--k,1)))}
.q-hero-art .ha-card{gap:max(12px,calc(8px / var(--k,1)));padding:max(14px,calc(10px / var(--k,1))) max(13px,calc(10px / var(--k,1)));border-radius:max(13px,calc(10px / var(--k,1)))}
.q-hero-art .ha-card .lb{font-size:max(9px,calc(11px / var(--k,1)))}
.q-hero-art .ha-roles{gap:max(4.9px,calc(4px / var(--k,1)))}
.q-hero-art .ha-roles span{font-size:max(11.4px,calc(12px / var(--k,1)));padding:max(4.9px,calc(4px / var(--k,1))) max(8.2px,calc(8px / var(--k,1)));border-radius:max(6.5px,calc(6px / var(--k,1)))}
/* 01 systems visual: box height follows the scaled composition */
.q-sys.q-fit{height:calc(var(--fh)*var(--k,1)*1px)}
.q-sys .sc{font-size:max(14px,calc(12px / var(--k,1)))}
.q-sys .hub b,.q-dia .core b{font-size:max(11px,calc(11px / var(--k,1)))}
.q-dia .src{font-size:max(12px,calc(11px / var(--k,1)))}
.q-dia .role b{font-size:max(18px,calc(13.5px / var(--k,1)))}
.q-dia .role span{font-size:max(14px,calc(11.5px / var(--k,1)))}
/* 03 step visuals: labels stay >= ~11px when scaled */
.v-con .c{font-size:max(12px,calc(11.5px / var(--k,1)))}
.v-org .ly,.v-del .vw b{font-size:max(14px,calc(12px / var(--k,1)))}
.q-how+.q-who{padding-top:0}
.q-ans{height:auto}
.q-prov,.q-how,.q-who,.q-cap,.q-stmt,.q-cta{min-height:0}
.q-link{min-height:40px}
/* 05 campuses card at full (non-80%) scale */
.q-camp{width:440px;gap:16px;padding:24px;border-radius:18px}
.q-camp .hd small,.q-camp .hd em,.q-camp li span{font-size:11px}
.q-camp ul{gap:8px}
.q-camp li{padding:12px 14px;border-radius:10px;gap:12px}
.q-camp li b{font-size:16px}
.q-camp li span{gap:8px}
.q-camp li span::before{width:8px;height:8px}
.q-camp .ct{font-size:14px}
.q-camp .ft{font-size:18px}
.q-stage{min-height:0;padding:48px 24px}
}
@media (min-width:901px) and (max-width:1199px){
.q-hero-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.ha-clip .ha-chip:nth-of-type(4){left:300px!important;top:6px!important}
.ha-clip .ha-chip:nth-of-type(5){left:470px!important;top:68px!important}
.ha-clip .ha-chip:nth-of-type(6){left:530px!important;top:178px!important}
/* 04: lists + preview side by side */
.q-panel{flex-direction:row}
.q-prev{width:360px;max-width:none}
/* 05: copy beside its visual */
.q-row{flex-direction:row;align-items:center;gap:40px}
.q-row-copy{width:auto;flex:1 1 0;min-width:0}
.q-stage{flex:0 0 520px;width:520px;min-height:500px;padding:32px}
/* 06: 3 + 2 */
.q-ogrid{grid-template-columns:repeat(6,minmax(0,1fr))}
.q-oc{grid-column:span 2}
.q-oc:nth-child(n+4){grid-column:span 3}
}
@media (min-width:600px) and (max-width:1199px){
.q-sec{padding-block:88px}
}
@media (min-width:600px) and (max-width:900px){
.q-hero-art{margin-top:calc(-100px * var(--k,1))}
.q-ans b{font-size:20px}
/* 03: each step as a row, visual beside its text */
.q-steps{max-width:none}
.q-step{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:28px;row-gap:16px;align-content:start}
.q-step .vis{grid-row:1 / span 5;align-self:center}
.q-step .num{align-self:end}
.q-prev{max-width:none}
.q-stage{padding:48px 32px}
.q-ogrid{grid-template-columns:1fr 1fr}
.q-oc:last-child{grid-column:1 / -1}
}
@media (max-width:599px){
.q-crumbs a{display:inline-block;padding-block:10px;margin-block:-10px}
/* UI labels >= 12px on phones */
.q-box small,.q-card .lab,#main .q-card .lab2,#main .q-path .lab2,.q-pill,.q-up em,.q-camp .hd small,.q-camp li span,.q-doc i,.q-leg{font-size:12px!important}
.q-sig{padding:16px 14px}.q-sig .srcs{gap:6px}
.q-sig .srcs span{font-size:11px;letter-spacing:.03em;padding-inline:3px}
/* hero art: pull the composition up (its top band is empty) and re-place chips/card for the narrow crop */
.q-hero-grid{gap:24px}
.q-hero-art{margin-top:calc(-120px * var(--k,1))}
.ha-clip .ha-chip:nth-of-type(4){left:300px!important;top:2px!important}
.ha-clip .ha-chip:nth-of-type(5){left:384px!important;top:78px!important}
.ha-clip .ha-chip:nth-of-type(6){left:52px!important;top:2px!important}
.ha-clip .ha-card{left:52px;top:150px}
.q-oc:last-child{grid-column:1 / -1}
.q-step{padding:16px 16px 24px}
.q-stage{padding:28px 14px}
/* 02 flow diagram: compact phone composition (320x350) */
.q-dia{--fw:320!important;--fh:350!important}
.q-dia svg.ln{display:none}
.q-dia svg.ln-m{display:block;width:320px;height:350px}
.q-dia .src{width:92px;top:calc(var(--my)*1px)!important;left:0;font-size:11px;letter-spacing:.06em;line-height:1.15;text-align:center;padding:0 8px}
.q-dia .src i{left:auto;right:8px;top:16px;width:7px;height:7px}
.q-dia .core,.q-dia .halo{left:102px;top:135px;width:80px;height:80px}
.q-dia .core{box-shadow:0 0 0 14px rgba(0,116,255,.06),0 0 0 7px rgba(0,116,255,.12)}
.q-dia .core b{display:none}
.q-dia .core svg{width:34px;height:40px}
.q-dia .role{left:194px;width:126px;top:calc(var(--my)*1px)!important;transform:translateY(-50%);white-space:normal;padding:8px 9px;border-radius:10px}
.q-dia .role b{font-size:14px}
.q-dia .role span{font-size:11px;line-height:1.35}
.q-dia .role:hover,.q-dia .role.on{translate:0 0}
}
@media (max-width:560px){
/* 01 systems visual: compact phone composition (320x400) */
.q-sys{--fw:320!important;--fh:400!important;border-radius:16px}
.q-sys svg.ln{display:none}
.q-sys svg.ln-m{display:block}
.q-sys .on path{stroke-dasharray:200;stroke-dashoffset:200}
.q-sys .sc{left:calc(var(--mx)*1px)!important;top:calc(var(--my)*1px)!important;transform:translate(-50%,-50%);padding:8px 12px;gap:6px;font-size:12px}
.q-sys:not(.c) .sc{translate:calc(var(--dx)*.4) calc(var(--dy)*.4)}
.q-sys .ring{left:94px;top:134px;width:132px;height:132px}
.q-sys .hub{left:110px;top:150px;width:100px;height:100px;gap:4px}
.q-sys .hub svg{width:30px;height:36px}
.q-sys .hub b{font-size:11px;letter-spacing:.02em}
.q-sys .q{left:146px;top:168px;font-size:44px}
.q-capt{min-height:58px}
}
@media (max-width:480px){
.q-stage{padding:24px 10px}
.q-path{padding:18px 16px}
.q-path li{padding:9px 10px;gap:12px}
.q-path li b,.q-path li small{white-space:normal}
.q-seg button{padding-inline:4px}
/* 05 reporting legend: alternate labels drop a line so long names never collide */
.q-chart{gap:8px}
.q-leg{gap:8px;align-items:flex-start;height:36px;font-size:11px}
.q-leg span{white-space:nowrap;display:flex;justify-content:center}
.q-leg span:nth-child(even){padding-top:17px}
}