/* focusEDU whimsy -- "campus" lane (prefix wk-). Pairs with campus.js; nothing here changes
   the resting look of any existing element. */

/* ================================================================ stats band */
.wk-stat { position: relative; }                 /* no offsets: anchors the overlays, moves nothing */
.wk-stat.wk-armed { color: transparent; }        /* real text stays in the DOM for screen readers */
.wk-stat__fx {
  position: absolute; top: 0; right: 0; bottom: 0; left: 0;
  display: none; white-space: nowrap; pointer-events: none;
  -webkit-user-select: none; user-select: none;
}
.wk-armed .wk-stat__fx { display: block; }
.wk-stat__n { font-variant-numeric: tabular-nums; }
.wk-landed .wk-stat__n { font-variant-numeric: normal; }
.wk-stat__s { display: inline-block; opacity: 0; }
.wk-landed .wk-stat__s { opacity: 1; animation: wk-plus 380ms cubic-bezier(.34, 1.56, .64, 1) both; }
@keyframes wk-plus { 0% { opacity: 0; transform: scale(.3); } 60% { opacity: 1; } 100% { opacity: 1; transform: none; } }

.wk-stat__chalk {
  position: absolute; left: 50%; top: 100%;
  height: .24em; margin-top: -.11em;
  transform: translateX(-50%);
  overflow: visible; opacity: 0; pointer-events: none;
}
.wk-stat__chalk path { fill: #fff; fill-opacity: .66; stroke: none; }
.wk-chalked .wk-stat__chalk { opacity: 1; animation: wk-chalk 720ms cubic-bezier(.3, .7, .2, 1) backwards; }
@keyframes wk-chalk {
  0%   { clip-path: inset(-80% 104% -80% -4%); }
  100% { clip-path: inset(-80% -4% -80% -4%); }
}
.wk-defs { position: absolute; width: 0; height: 0; overflow: hidden; }

@media print {
  .wk-stat.wk-armed { color: inherit; }
  .wk-stat__fx { display: none !important; }
}

/* ================================================================ service-tile icons
   One timing family: 900 ms, same in-out ease, keyframe segments eased in/out for spins. */
.wk-ic { --wk-d: 900ms; --wk-e: cubic-bezier(.45, .05, .25, 1); --wk-hop: -2.6px; }
.wk-ic path { transform-box: view-box; }
.wk-ic.wk-go > path { display: none; }     /* original art steps aside only while playing */
.wk-ic.wk-go > .wk-parts { display: inline; }
.wk-ic .wk-x { opacity: 0; }
.wk-ic.wk-go path {
  animation-duration: var(--wk-d);
  animation-timing-function: var(--wk-e);
  animation-fill-mode: both;
}

/* shared */
@keyframes wk-draw { 0% { stroke-dasharray: 1 2; stroke-dashoffset: 1.001; } 100% { stroke-dasharray: 1 2; stroke-dashoffset: 0; } }
@keyframes wk-hop {
  0% { transform: none; } 28% { transform: translateY(var(--wk-hop)); }
  56% { transform: translateY(.4px) scaleY(.95); } 78% { transform: translateY(-.3px); } 100% { transform: none; }
}

/* Admissions -- a page turns */
.wk-ic--book .wk-b-leaf { transform-origin: 12px 12px; }
.wk-ic--book.wk-go .wk-b-leaf { animation-name: wk-leaf; }
@keyframes wk-leaf {   /* sine in / sine out = an even turn, so the half-turned page is actually seen */
  0%   { opacity: 0; transform: none; animation-timing-function: cubic-bezier(.12, 0, .39, 0); }
  6%   { opacity: 1; }
  50%  { transform: translateY(-1.3px) scaleX(0); animation-timing-function: cubic-bezier(.61, 1, .88, 1); }
  94%  { opacity: 1; }
  100% { opacity: 0; transform: translateY(0) scaleX(-1); }   /* same function list as 50%: no matrix fallback */
}

/* Enrollment Management -- bars grow, left to right */
.wk-ic--chart .wk-c1 { transform-origin: 6px 21px; }
.wk-ic--chart .wk-c2 { transform-origin: 12px 21px; }
.wk-ic--chart .wk-c3 { transform-origin: 18px 21px; }
.wk-ic--chart.wk-go path { animation-name: wk-bar; animation-duration: 700ms; }
.wk-ic--chart.wk-go .wk-c2 { animation-delay: 100ms; }
.wk-ic--chart.wk-go .wk-c3 { animation-delay: 200ms; }
@keyframes wk-bar { 0% { transform: scaleY(.5); } 55% { transform: scaleY(1.08); } 78% { transform: scaleY(.98); } 100% { transform: none; } }

/* Financial Aid -- the coin turns over (blank back, $ face returns) */
.wk-ic--coin .wk-d { transform-origin: 12px 12px; }
.wk-ic--coin.wk-go .wk-d { animation-name: wk-coin; }
.wk-ic--coin.wk-go .wk-d-sign { animation-name: wk-coin, wk-coin-face; }
@keyframes wk-coin {
  0%   { transform: none; animation-timing-function: cubic-bezier(.5, 0, .75, 0); }
  25%  { transform: translateY(-1.3px) scaleX(0); animation-timing-function: cubic-bezier(.25, 1, .5, 1); }
  50%  { transform: translateY(-1.7px) scaleX(-1); animation-timing-function: cubic-bezier(.5, 0, .75, 0); }
  75%  { transform: translateY(-1.3px) scaleX(0); animation-timing-function: cubic-bezier(.25, 1, .5, 1); }
  100% { transform: none; }
}
@keyframes wk-coin-face { 0%, 24.9% { opacity: 1; } 25%, 74.9% { opacity: 0; } 75%, 100% { opacity: 1; } }

/* Student Financial Services -- keys tapped in turn, then the display prints the result */
.wk-ic--calc .wk-k { transform-box: fill-box; transform-origin: center; }
.wk-ic--calc.wk-go .wk-k { animation-name: wk-key; animation-duration: 260ms; animation-delay: calc(var(--i, 0) * 60ms); }
.wk-ic--calc.wk-go .wk-k-disp { animation-name: wk-draw; animation-duration: 360ms; animation-delay: 540ms; }
@keyframes wk-key { 0% { transform: none; } 40% { transform: scale(.3); } 100% { transform: none; } }

/* Registrar -- the record settles and its lines are written */
.wk-ic--doc .wk-r { transform-origin: 12px 21px; }
.wk-ic--doc.wk-go .wk-r-doc { animation-name: wk-doc; animation-duration: 600ms; }
.wk-ic--doc.wk-go .wk-r-l1 { animation-name: wk-doc, wk-draw; animation-duration: 600ms, 330ms; animation-delay: 0ms, 190ms; }
.wk-ic--doc.wk-go .wk-r-l2 { animation-name: wk-doc, wk-draw; animation-duration: 600ms, 330ms; animation-delay: 0ms, 470ms; }
@keyframes wk-doc { 0% { transform: none; } 35% { transform: translateY(-1.1px); } 70% { transform: translateY(.25px) scaleY(.985); } 100% { transform: none; } }

/* View All Services -- the arrow goes and comes back round */
.wk-ic--arrow.wk-go .wk-a { animation-name: wk-arrow; animation-duration: 720ms; }
@keyframes wk-arrow {
  0%    { transform: none; opacity: 1; animation-timing-function: cubic-bezier(.5, 0, .75, 0); }
  40%   { transform: translateX(10px); opacity: 0; }
  40.1% { transform: translateX(-10px); opacity: 0; animation-timing-function: cubic-bezier(.22, 1, .36, 1); }
  100%  { transform: none; opacity: 1; }
}

/* Assessments (home) -- shield firms up, check draws itself */
.wk-ic--shield .wk-s { transform-origin: 12px 12px; }
.wk-ic--shield.wk-go .wk-s-sh { animation-name: wk-pulse; animation-duration: 700ms; }
.wk-ic--shield.wk-go .wk-s-ck { animation-name: wk-pulse, wk-draw; animation-duration: 700ms, 480ms; animation-delay: 0ms, 320ms; }
@keyframes wk-pulse { 0% { transform: none; } 30% { transform: scale(.9); } 65% { transform: scale(1.04); } 100% { transform: none; } }

/* Assessments (services) -- clip presses, check draws itself */
.wk-ic--clip.wk-go .wk-cb-c { animation-name: wk-press; animation-duration: 520ms; }
.wk-ic--clip.wk-go .wk-cb-k { animation-name: wk-draw; animation-duration: 480ms; animation-delay: 320ms; }
@keyframes wk-press { 0% { transform: none; } 30% { transform: translateY(.9px); } 65% { transform: translateY(-.3px); } 100% { transform: none; } }

/* National Searches -- the glass sweeps, catching a glint */
.wk-ic--search .wk-q { transform-origin: 21px 21px; }
.wk-ic--search.wk-go .wk-q { animation-name: wk-sweep; }
.wk-ic--search.wk-go .wk-q-gl { animation-name: wk-sweep, wk-glint; }
@keyframes wk-sweep { 0% { transform: none; } 30% { transform: rotate(-10deg); } 68% { transform: rotate(7deg); } 100% { transform: none; } }
@keyframes wk-glint { 0%, 22% { opacity: 0; } 46% { opacity: .9; } 78%, 100% { opacity: 0; } }

/* Interim Placements (home) -- the team makes room and a leader steps into place */
.wk-ic--place .wk-g-cb, .wk-ic--place .wk-g-ch { transform-origin: 12px 20px; }
.wk-ic--place.wk-go .wk-g-cb, .wk-ic--place.wk-go .wk-g-ch { animation-name: wk-hop; }
.wk-ic--place.wk-go .wk-g-l { animation-name: wk-room-l; }
.wk-ic--place.wk-go .wk-g-r { animation-name: wk-room-r; }
@keyframes wk-room-l { 0% { transform: none; } 28% { transform: translateX(-1.1px); } 60% { transform: translateX(.35px); } 100% { transform: none; } }
@keyframes wk-room-r { 0% { transform: none; } 28% { transform: translateX(1.1px); } 60% { transform: translateX(-.35px); } 100% { transform: none; } }

/* Mentoring & Coaching (services) -- two figures lean in, the centre nods */
.wk-ic--meet .wk-g-l { transform-origin: 5px 20px; }
.wk-ic--meet .wk-g-r { transform-origin: 19px 20px; }
.wk-ic--meet.wk-go .wk-g-l { animation-name: wk-lean-l; }
.wk-ic--meet.wk-go .wk-g-r { animation-name: wk-lean-r; }
.wk-ic--meet.wk-go .wk-g-ch { animation-name: wk-nod; }
@keyframes wk-lean-l { 0% { transform: none; } 35% { transform: translateX(.6px) rotate(5deg); } 70% { transform: translateX(.5px) rotate(4deg); } 100% { transform: none; } }
@keyframes wk-lean-r { 0% { transform: none; } 35% { transform: translateX(-.6px) rotate(-5deg); } 70% { transform: translateX(-.5px) rotate(-4deg); } 100% { transform: none; } }
@keyframes wk-nod { 0%, 30% { transform: none; } 45% { transform: translateY(.9px); } 60% { transform: none; } 72% { transform: translateY(.7px); } 86%, 100% { transform: none; } }

/* Interim Placements (services) -- steps into place */
.wk-ic--hop { --wk-hop: -1.8px; }
.wk-ic--hop .wk-u { transform-origin: 12px 21px; }
.wk-ic--hop.wk-go .wk-u { animation-name: wk-hop; }
.wk-ic--hop.wk-go .wk-u-h { animation-delay: 45ms; }

/* Coaching & Mentoring (home) / Strategic Consulting (services) -- a spark */
.wk-ic--bolt .wk-z-s { transform-origin: 16.4px 6.6px; }
.wk-ic--bolt.wk-go .wk-z { animation-name: wk-draw; animation-duration: 460ms; }
.wk-ic--bolt.wk-go .wk-z-g { animation-name: wk-ghost; animation-duration: 460ms; }
.wk-ic--bolt.wk-go .wk-z-s { animation-name: wk-spark; animation-duration: 480ms; animation-delay: 380ms; }
@keyframes wk-ghost { 0%, 92% { opacity: .22; } 100% { opacity: 0; } }
@keyframes wk-spark { 0% { opacity: 0; transform: scale(.5); } 30% { opacity: 1; } 100% { opacity: 0; transform: scale(1.3); } }

/* Process and Functional Analysis (services) -- one turn of the cycle */
.wk-ic--cycle .wk-rf { transform-origin: 12px 12px; }
.wk-ic--cycle.wk-go .wk-rf { animation-name: wk-turn; }
@keyframes wk-turn { 0% { transform: none; } 78% { transform: rotate(192deg); } 100% { transform: rotate(180deg); } }

/* ================================================================ client logos: pennant lift */
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .wk-car img { transform-origin: 50% 0; }
  .wk-car img:hover { translate: 0 -4px; animation: wk-pennant 1100ms cubic-bezier(.3, .6, .3, 1) both; }
}
@keyframes wk-pennant { 0% { rotate: 0deg; } 22% { rotate: -2.4deg; } 48% { rotate: 1.5deg; } 72% { rotate: -.6deg; } 100% { rotate: 0deg; } }

/* ================================================================ reduced motion: composed, still */
@media (prefers-reduced-motion: reduce) {
  .wk-ic.wk-go path, .wk-landed .wk-stat__s, .wk-chalked .wk-stat__chalk { animation: none !important; }
  .wk-stat__s { opacity: 1; }
}