/* v2.9 motif: the homepage node-and-route language, shared by secondary pages. */
/* Binary texture: still digits with a dithered edge fade, drawn by binary-field.js. Hover sends blue rain through them. */
.binary-field{position:absolute;z-index:0;inset:0 0 0 auto;width:min(55vw,720px);overflow:hidden;opacity:.85;pointer-events:none}
.binary-field canvas{display:block}
.hero .home-hero-binary{inset:0 auto 0 0;width:min(43vw,570px);opacity:1}
.careers-page .careers-hero-grid,.services-page .credibility-layout{position:relative;z-index:1}
.services-page .credibility{position:relative;isolation:isolate;overflow:hidden}
.services-page .credibility .binary-field{width:min(46vw,600px);opacity:.75}
@media(max-width:760px){.binary-field{display:none}}
.secondary-page .secondary-hero :is(.intro-grid,.secondary-hero-inner){position:relative;z-index:1}
@media(forced-colors:active){.binary-field{display:none}}
.ct-glyph{display:block;width:72px;height:72px;flex:none;overflow:visible}
.ct-frame{fill:#f3f7fc;stroke:#d8e5f5;stroke-width:1.5;transition:fill .25s ease,stroke .25s ease}
.ct-line{stroke:#9db6d5;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;fill:none;transition:stroke .25s ease}
.ct-line--accent{stroke:#175ddc}
.ct-node{fill:#fff;stroke:#93a9c3;stroke-width:2;transition:stroke .25s ease}
.ct-node--accent{fill:#175ddc;stroke:#175ddc}
.ct-mark{fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ct-lens{fill:none;stroke:#175ddc;stroke-width:2.4;stroke-linecap:round}
.ct-ring{fill:none;stroke:#c7d8ed;stroke-width:1.5}
.ct-pop{transform-box:fill-box;transform-origin:center}
.ct-draw{stroke-dasharray:1;stroke-dashoffset:0}

/* Steps on one route: glyphs joined by a line that draws once; vertical on narrow screens. */
ol.ct-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(18px,2.4vw,30px);margin:0;padding:0;list-style:none}
.ct-steps>li{position:relative;display:block;min-width:0;padding:0;border:0}
.ct-steps>li::after{content:"";position:absolute;z-index:0;left:84px;right:calc(-1 * clamp(18px,2.4vw,30px));top:35px;height:2px;border-radius:2px;background:#c7d8ed;transform-origin:left;transition:background-color .25s ease,transform .7s cubic-bezier(.22,1,.36,1) calc(var(--i,0) * 110ms + 200ms)}
.ct-steps>li:last-child::after{display:none}
.ct-motion .ct-steps:not(.is-drawn)>li::after{transform:scaleX(0)}
.ct-steps .ct-glyph{position:relative;z-index:1;margin-bottom:18px}
.ct-steps-index{display:block;margin-bottom:6px;color:#174f9f;font-size:.75rem;font-weight:700}
.ct-steps>li:is(:hover,:focus-within) .ct-frame{fill:#fbfdff;stroke:#aac8ed}
.ct-steps>li:is(:hover,:focus-within)::after{background:#175ddc}
.ct-steps>li:is(:hover,:focus-within) .ct-line:not(.ct-line--accent),.ct-steps>li:is(:hover,:focus-within) .ct-node:not(.ct-node--accent){stroke:#175ddc}
.handover-node{transition:transform .45s cubic-bezier(.22,1,.36,1)}
.ct-steps>li:is(:hover,:focus-within) .handover-node{transform:translateX(5px)}
/* Quiet variant: small nodes instead of glyph tiles. */
.ct-step-dot{position:relative;z-index:1;display:block;width:14px;height:14px;margin:0 0 18px;border:2px solid #93a9c3;border-radius:50%;background:#fff;transition:border-color .25s ease}
.ct-steps--dots>li:last-child .ct-step-dot{border-color:#175ddc;background:#175ddc}
.ct-steps--dots>li::after{left:22px;top:6px}
.ct-steps--dots>li:is(:hover,:focus-within) .ct-step-dot{border-color:#175ddc}
@media(max-width:900px){
  ol.ct-steps{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:34px}
  .ct-steps>li:nth-child(2)::after{display:none}
}
@media(max-width:560px){
  ol.ct-steps{grid-template-columns:1fr;gap:0}
  .ct-steps>li{display:grid;grid-template-columns:72px minmax(0,1fr);gap:0 18px;padding-bottom:26px}
  .ct-steps>li:last-child{padding-bottom:0}
  .ct-steps .ct-glyph{grid-row:1/span 2;margin:0}
  .ct-steps>li::after,.ct-steps>li:nth-child(2)::after{display:block;left:35px;right:auto;top:76px;bottom:4px;width:2px;height:auto;transform-origin:top}
  .ct-steps>li:last-child::after{display:none}
  .ct-motion .ct-steps:not(.is-drawn)>li::after{transform:scaleY(0)}
  .ct-steps--dots>li{grid-template-columns:14px minmax(0,1fr)}
  .ct-steps--dots .ct-step-dot{grid-row:1/span 2;margin:4px 0 0}
  .ct-steps--dots>li::after,.ct-steps--dots>li:nth-child(2)::after{left:6px;top:24px}
}

/* Shared card hover: a faint grid fades in from the top-left corner. */
:is(.practice-card,.engagement-options article,.industry-slide,.role,.work-model,.industry-preview){isolation:isolate}
:is(.practice-card,.engagement-options article,.role,.work-model,.industry-preview){position:relative}
:is(.practice-card,.engagement-options article,.industry-slide,.role,.work-model,.industry-preview)::before{content:"";position:absolute;z-index:-1;inset:0;border-radius:inherit;pointer-events:none;background-image:linear-gradient(rgb(23 93 220 / 7%) 1px,transparent 1px),linear-gradient(90deg,rgb(23 93 220 / 7%) 1px,transparent 1px);background-size:16px 16px;-webkit-mask-image:linear-gradient(135deg,#000,transparent 62%);mask-image:linear-gradient(135deg,#000,transparent 62%);opacity:0;transition:opacity .3s ease}
:is(.practice-card,.engagement-options article,.industry-slide,.role,.work-model,.industry-preview):is(:hover,:focus-within)::before{opacity:1}
@media(forced-colors:active){:is(.practice-card,.engagement-options article,.industry-slide,.role,.work-model,.industry-preview)::before{display:none}}

/* One-shot draw-in. Without JavaScript or with reduced motion, every diagram is already complete. */
.ct-motion [data-ct-draw] .ct-draw{transition:stroke-dashoffset .7s cubic-bezier(.22,1,.36,1) calc(var(--i,0) * 110ms + 120ms),stroke .25s ease}
.ct-motion [data-ct-draw] .ct-pop{transition:opacity .45s ease calc(var(--i,0) * 110ms),transform .55s cubic-bezier(.22,1,.36,1) calc(var(--i,0) * 110ms)}
.ct-motion [data-ct-draw]:not(.is-drawn) .ct-draw{stroke-dashoffset:1}
.ct-motion [data-ct-draw]:not(.is-drawn) .ct-pop{opacity:0;transform:scale(.6)}

@media(prefers-reduced-motion:reduce){
  .ct-draw{stroke-dashoffset:0!important}
  .ct-pop{opacity:1!important;transform:none!important}
  .ct-steps>li::after{transform:none!important}
}
@media(forced-colors:active){
  .ct-frame,.ct-node{fill:Canvas;stroke:CanvasText}
  .ct-line,.ct-ring{stroke:CanvasText}
  .ct-node--accent{fill:Highlight;stroke:Highlight}
  .ct-line--accent,.ct-lens{stroke:Highlight}
  .ct-mark{stroke:HighlightText}
  .ct-steps>li::after{background:CanvasText}
  .ct-step-dot{border-color:CanvasText;background:Canvas}
  .ct-steps--dots>li:last-child .ct-step-dot{background:Highlight;border-color:Highlight}
}
