/* self-hosted fonts */
@font-face{font-family:'Archivo';src:url(/fonts/archivo.woff2) format('woff2');font-weight:100 900;font-stretch:62% 125%;font-style:normal;font-display:swap}
@font-face{font-family:'IBM Plex Sans';src:url(/fonts/plex-sans-400.woff2) format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'IBM Plex Sans';src:url(/fonts/plex-sans-500.woff2) format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'IBM Plex Sans';src:url(/fonts/plex-sans-600.woff2) format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'IBM Plex Mono';src:url(/fonts/plex-mono-400.woff2) format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'IBM Plex Mono';src:url(/fonts/plex-mono-500.woff2) format('woff2');font-weight:500;font-style:normal;font-display:swap}

/* Systems Consulting Group: shared motion layer */
.scg a:hover{text-decoration:none}
.scg>header{position:sticky;top:0;z-index:50;box-shadow:0 1px 0 #2A3052}
.scg::before{content:"";position:fixed;left:0;top:0;height:3px;width:100%;background:#FF5A1F;transform:scaleX(var(--sp,0));transform-origin:left;z-index:60;pointer-events:none}

/* particle stage legend: the script dims the steps that are not showing */
.scg [data-step]{transition:opacity .5s}
.scg [data-step].dim{opacity:.35}

/* nav */
.scg nav a{position:relative}
.scg nav a:not(.btn)::after{content:"";position:absolute;left:0;right:0;bottom:6px;height:2px;background:#FF5A1F;transform:scaleX(0);transform-origin:left;transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.scg nav a:not(.btn):hover::after{transform:scaleX(1)}
.scg header a:hover svg path{stroke-dasharray:80;animation:scg-draw .8s cubic-bezier(.6,0,.2,1)}
.scg header a:hover svg circle{transform-box:fill-box;transform-origin:center;animation:scg-pop .45s .45s both}

/* live field sections */
.scg section.fx{position:relative;overflow:hidden}
.scg section.fx>div{position:relative;z-index:1}
.scg section.fx>canvas{display:none}
.scg section.fx::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(520px circle at var(--mx,72%) var(--my,34%),var(--glow,#2742FF66),transparent 70%)}

/* buttons */
.scg .btn{position:relative;isolation:isolate;overflow:hidden;display:inline-block;transition:color .3s,transform .2s}
.scg .btn::before{content:"";position:absolute;inset:0;z-index:-1;background:#F3F4F0;transform:scaleX(0);transform-origin:left;transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.scg .btn:hover{color:#0B1026!important}
.scg .btn:hover::before{transform:scaleX(1)}
.scg .btn:active{transform:scale(.97)}

/* service cards */
.scg .card{position:relative;isolation:isolate;overflow:hidden;transition:color .35s}
.scg .card::before{content:"";position:absolute;inset:0;z-index:-1;background:#2742FF;transform:translateY(101%);transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.scg .card:hover::before{transform:none}
.scg .card:hover,.scg .card:hover span{color:#F3F4F0!important}
.scg .card.alt::before{background:#FF5A1F}
.scg .card.alt:hover,.scg .card.alt:hover span{color:#0B1026!important}
.scg .card .go{margin-top:auto;transition:transform .4s cubic-bezier(.2,.8,.2,1)}
.scg .card:hover .go{transform:translateX(12px)}

/* scroll reveal: resting state is visible; the script adds rv-wait only while an element is off screen */
.scg .rv{transition:opacity .8s cubic-bezier(.2,.8,.2,1),transform .8s cubic-bezier(.2,.8,.2,1);transition-delay:var(--d,0s)}
.scg .rv.rv-wait{opacity:0;transform:translateY(36px);transition:none}
.scg .bar{display:block;height:4px;background:currentColor;transform-origin:left;transition:transform 1s cubic-bezier(.6,0,.2,1) calc(var(--d,0s) + .15s)}
.scg .rv-wait .bar{transform:scaleX(0);transition:none}
.scg .strike{background:linear-gradient(#FF5A1F,#FF5A1F) no-repeat 0 56%/100% .09em;transition:background-size .7s cubic-bezier(.6,0,.2,1) var(--sd,.4s)}
.scg .rv-wait .strike{background-size:0 .09em;transition:none}

/* hero headline */
.scg .m{display:inline-block;overflow:hidden;vertical-align:top;padding:.05em 0 .08em;margin:-.05em 0 -.08em}
.scg .w{display:inline-block;animation:scg-rise .9s cubic-bezier(.2,.8,.2,1) both}
.scg .pulse{flex:0 0 auto;width:9px;height:9px;background:#FF5A1F;animation:scg-pulse 1.4s steps(2,jump-none) infinite}

/* system diagram */
.scg .stage{animation:scg-stage 6s infinite both}
.scg .stage span:last-child{color:inherit!important;opacity:.7}
.scg .wire{position:relative;width:2px;height:20px;background:#F3F4F0;margin-left:26px}
.scg .wire::after{content:"";position:absolute;left:-3px;width:8px;height:8px;background:#FF5A1F;animation:scg-drop 1.5s linear infinite}

/* marquee */
.scg .mq{display:flex;width:max-content;animation:scg-mq 60s linear infinite}
.scg .mq:hover{animation-play-state:paused}
.scg .mq>div{display:flex;align-items:center;gap:40px;padding-right:40px;white-space:nowrap}
.scg .ol{color:transparent;-webkit-text-stroke:1.5px #F3F4F0}
.scg .mega{color:transparent;-webkit-text-stroke:2px #2742FF}

/* logo board */
svg.loop path{stroke-dasharray:80;animation:scg-loop 5s cubic-bezier(.6,0,.2,1) infinite}
svg.loop circle{transform-box:fill-box;transform-origin:center;animation:scg-loop-pop 5s infinite}

@keyframes scg-draw{from{stroke-dashoffset:80}to{stroke-dashoffset:0}}
@keyframes scg-pop{from{transform:scale(0)}60%{transform:scale(1.4)}to{transform:scale(1)}}
@keyframes scg-rise{from{transform:translateY(115%) rotate(4deg)}to{transform:none}}
@keyframes scg-pulse{0%{opacity:1}100%{opacity:.25}}
@keyframes scg-stage{0%,20%{background:#FF5A1F;color:#0B1026}26%,100%{background:#0B1026;color:#F3F4F0}}
@keyframes scg-drop{from{top:-8px;opacity:0}20%{opacity:1}80%{opacity:1}to{top:20px;opacity:0}}
@keyframes scg-mq{to{transform:translateX(-50%)}}
@keyframes scg-loop{0%{stroke-dashoffset:80}28%,100%{stroke-dashoffset:0}}
@keyframes scg-loop-pop{0%,22%{transform:scale(0)}32%{transform:scale(1.35)}38%,100%{transform:scale(1)}}

/* phones and touch */
@media (hover:none){.scg section.fx::before{display:none}}
@media (max-width:760px){
.scg>header{position:static}
.scg section.fx::before{display:none}
.scg .card{min-height:0!important}
.scg .rv.rv-wait{transform:translateY(20px)}
}
@media (max-width:560px){
.scg nav{width:100%;gap:0 20px!important;font-size:14px!important}
.scg nav .btn{display:none}
}

@media (prefers-reduced-motion:reduce){
.scg *,.scg *::before,.scg *::after,svg.loop *{animation:none!important;transition:none!important}
}