/* Small animated visuals for the Solutions pages. Each plays once when its row scrolls into view (.oc.in / .rows.in). */

.mv{width:min(430px,100%);display:grid;gap:20px;justify-items:center;color:var(--ink)}
.mv-note{font-size:15px;line-height:22px;color:var(--ink-muted);text-align:center;max-width:36ch}

/* count-up figures */
.mvc{display:grid;grid-template-columns:auto auto auto;gap:6px 22px;align-items:end;justify-content:center}
.mvc .n{font:600 clamp(44px,5.6vw,66px)/1 var(--sans);letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.mvc .n.hi{color:var(--signal)}
.mvc>:nth-child(1){grid-column:1;grid-row:1}
.mvc .to,.mvc>:nth-child(2){grid-column:2;grid-row:1}
.mvc .n.hi{grid-column:3;grid-row:1}
.mvc small{grid-row:2;font-size:14px;line-height:20px;color:var(--ink-muted)}
.mvc small:nth-of-type(1){grid-column:1 / span 2}
.mvc small:nth-of-type(2){grid-column:3}
.mvc .to{align-self:center;width:44px;height:2px;background:var(--ink);transform:scaleX(0);transform-origin:left;transition:transform .8s var(--ease) .5s}
.oc.in .mvc .to{transform:scaleX(1)}
.mvc .n.hi{opacity:0;transform:translateY(8px);transition:opacity .6s var(--ease) 1s,transform .6s var(--ease-enter) 1s}
.oc.in .mvc .n.hi{opacity:1;transform:none}

/* rings */
.rings{display:flex;gap:30px;justify-content:center;flex-wrap:wrap}
.ring{position:relative;width:140px;height:140px;display:grid;place-items:center;text-align:center}
.ring svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.ring .bg{fill:none;stroke:#DDE5F2;stroke-width:9}
.ring .fg{fill:none;stroke:var(--avus-blue);stroke-width:9;stroke-linecap:round;stroke-dasharray:289;stroke-dashoffset:289;transition:stroke-dashoffset 1.4s var(--ease) .3s}
.oc.in .ring .fg{stroke-dashoffset:calc(289 - 289 * var(--v))}
.ring b{font:600 34px/1 var(--sans);letter-spacing:-.03em;font-variant-numeric:tabular-nums;display:block}
.ring b span{font-size:20px;color:var(--ink-muted);margin-left:1px}
.ring small{display:block;font-size:13px;line-height:16px;color:var(--ink-muted);margin-top:4px}
.mvr{display:flex;gap:22px;align-items:center;flex-wrap:wrap;justify-content:center}
.mvr p{font:600 19px/1.25 var(--sans);letter-spacing:-.02em;max-width:18ch}
.mvr p small{display:block;font:400 14px/20px var(--sans);color:var(--ink-muted);letter-spacing:0;margin-top:6px}

/* bars */
.mvbars{display:grid;gap:16px;width:100%}
.mvb{display:grid;grid-template-columns:1fr auto;gap:6px 14px;font-size:15px;line-height:20px;align-items:baseline}
.mvb b{font:500 14px/1 var(--mono);color:var(--ink-2);font-variant-numeric:tabular-nums}
.mvb .t{grid-column:1/-1;height:8px;border-radius:4px;background:#DDE5F2;overflow:hidden}
.mvb .t i{display:block;height:100%;width:0;border-radius:4px;background:var(--c,var(--avus-blue));transition:width 1.1s var(--ease);transition-delay:calc(var(--k,0) * 110ms + 250ms)}
.oc.in .mvb .t i{width:var(--w)}
.mvb.warn{--c:#D98A1F}

/* stage bar */
.mvs2{width:100%;display:grid;gap:14px}
.mvs2 .bar{display:flex;gap:3px;height:12px;border-radius:6px;overflow:hidden}
.mvs2 .bar i{display:block;height:100%;width:0;transition:width 1s var(--ease);transition-delay:calc(var(--k,0) * 140ms + 250ms)}
.oc.in .mvs2 .bar i{width:var(--w)}
.mvs2 .lg2{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.mvs2 .lg2 div{display:grid;gap:2px}
.mvs2 .lg2 b{font:600 24px/1 var(--sans);letter-spacing:-.02em}
.mvs2 .lg2 small{font-size:13px;color:var(--ink-muted)}

/* tools merging into one */
.mvm{position:relative;width:min(430px,100%);height:230px}
.mvm .c{position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);padding:9px 14px;border-radius:999px;background:#fff;box-shadow:0 0 0 1px var(--line-strong);font:500 14px/1 var(--sans);color:var(--ink-2);white-space:nowrap;transition:left .9s var(--ease),top .9s var(--ease),transform .9s var(--ease),opacity .5s var(--ease);transition-delay:calc(var(--k,0) * 90ms + 300ms)}
.oc.in .mvm .c{left:50%;top:50%;transform:translate(-50%,-50%) scale(.5);opacity:0}
.mvm .h{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(.6);display:flex;align-items:center;gap:10px;padding:14px 20px;border-radius:16px;background:var(--abyss);color:#fff;font:600 17px/1 var(--sans);opacity:0;box-shadow:0 20px 40px -18px #01182F99;transition:opacity .5s var(--ease) 1.1s,transform .7s var(--ease-enter) 1.1s}
.mvm .h img{height:20px;width:auto}
.oc.in .mvm .h{opacity:1;transform:translate(-50%,-50%)}

/* health sweep */
.mvh{display:grid;gap:18px;justify-items:center;width:100%}
.mvh .ps{display:flex;flex-wrap:wrap;gap:9px;justify-content:center}
.mvh .p{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border-radius:999px;background:#fff;box-shadow:0 0 0 1px var(--line);font:500 14px/1 var(--sans);color:var(--ink-2)}
.mvh .p i{width:8px;height:8px;border-radius:50%;background:#B7C0CE;transition:background .4s var(--ease),box-shadow .4s var(--ease);transition-delay:calc(var(--k,0) * 140ms + 300ms)}
.oc.in .mvh .p i{background:#1E9E6A;box-shadow:0 0 0 4px #1E9E6A26}
.mvh .z{display:flex;gap:26px;opacity:0;transform:translateY(8px);transition:opacity .6s var(--ease) 1.9s,transform .6s var(--ease-enter) 1.9s}
.oc.in .mvh .z{opacity:1;transform:none}
.mvh .z div{display:grid;gap:2px;text-align:center}
.mvh .z b{font:600 30px/1 var(--sans);letter-spacing:-.03em}
.mvh .z small{font-size:13px;color:var(--ink-muted)}

/* agent and person */
.mvd{display:grid;gap:14px;justify-items:center;width:100%}
.mvd .row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:center}
.mvd .who{font:600 12px/1 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-muted)}
.mvd .ch{padding:11px 16px;border-radius:12px;font:600 15px/1.2 var(--sans);opacity:0;transform:translateY(8px);transition:opacity .6s var(--ease),transform .6s var(--ease-enter)}
.mvd .ch.a{background:#FCE8ED;color:#B4153A;transition-delay:.25s}
.mvd .ch.b{background:#E5F4ED;color:#177A55;transition-delay:1.1s}
.mvd .ar{width:56px;height:2px;background:var(--ink);transform:scaleX(0);transform-origin:left;transition:transform .7s var(--ease) .6s}
.oc.in .mvd .ch{opacity:1;transform:none}
.oc.in .mvd .ar{transform:scaleX(1)}

/* signed steps */
.mvp{display:flex;align-items:flex-start;width:100%}
.mvp .s{flex:1;display:grid;justify-items:center;gap:10px;text-align:center;font-size:13.5px;line-height:18px;color:var(--ink-2);position:relative;padding:0 4px}
.mvp .s i{position:relative;z-index:1;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#fff;box-shadow:inset 0 0 0 1.5px var(--line-strong);font:500 11px/1 var(--mono);font-style:normal;color:var(--ink-muted);transition:background .4s var(--ease),color .4s var(--ease),box-shadow .4s var(--ease);transition-delay:calc(var(--k,0) * 420ms + 300ms)}
.oc.in .mvp .s i{background:var(--ink);color:#fff;box-shadow:none}
.mvp .s::before{content:"";position:absolute;top:13px;right:50%;width:100%;height:2px;background:#DDE5F2}
.mvp .s::after{content:"";position:absolute;top:13px;right:50%;width:100%;height:2px;background:var(--ink);transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease);transition-delay:calc(var(--k,0) * 420ms)}
.mvp .s:first-child::before,.mvp .s:first-child::after{display:none}
.oc.in .mvp .s::after{transform:scaleX(1)}

/* fragments inside outcome rows: small entrance touches */
.oc.in .oc-v .fx .k-bar i{animation:barin 1.1s var(--ease) .4s both}
@keyframes barin{from{width:0}}
.oc.rv .oc-v .fx .k-row,.oc.rv .oc-v .fx .k-note,.oc.rv .oc-v .fx .k-lrow,.oc.rv .oc-v .fx .k-chk li,.oc.rv .oc-v .fx .k-act{opacity:0;transform:translateY(6px);transition:opacity .5s var(--ease-enter),transform .5s var(--ease-enter)}
.oc.in .oc-v .fx .k-row,.oc.in .oc-v .fx .k-note,.oc.in .oc-v .fx .k-lrow,.oc.in .oc-v .fx .k-chk li,.oc.in .oc-v .fx .k-act{opacity:1;transform:none}
.oc.in .oc-v .fx>:nth-child(2) .k-row,.oc.in .oc-v .fx>:nth-child(2){transition-delay:.15s}
.oc.in .oc-v .fx .k-row:nth-of-type(2),.oc.in .oc-v .fx .k-note:nth-of-type(2),.oc.in .oc-v .fx .k-lrow:nth-of-type(2),.oc.in .oc-v .fx .k-chk li:nth-child(2){transition-delay:.3s}
.oc.in .oc-v .fx .k-row:nth-of-type(3),.oc.in .oc-v .fx .k-note:nth-of-type(3),.oc.in .oc-v .fx .k-lrow:nth-of-type(3),.oc.in .oc-v .fx .k-chk li:nth-child(3){transition-delay:.45s}
.oc.in .oc-v .fx .k-lrow:nth-of-type(4),.oc.in .oc-v .fx .k-chk li:nth-child(4){transition-delay:.6s}
.oc.in .oc-v .fx .k-act:nth-of-type(2){transition-delay:.3s}

/* verify list */
.rows.rv .rowi{opacity:0;transform:translateY(10px);transition:opacity .6s var(--ease-enter),transform .6s var(--ease-enter);transition-delay:calc(var(--k,0) * 130ms)}
.rows.in .rowi{opacity:1;transform:none}
.rows.rv .rowi .ck{background:#fff;box-shadow:inset 0 0 0 1.5px var(--line-strong);transition:background .4s var(--ease),box-shadow .4s var(--ease);transition-delay:calc(var(--k,0) * 130ms + 350ms)}
.rows.rv .rowi .ck::before{opacity:0;transition:opacity .3s var(--ease);transition-delay:calc(var(--k,0) * 130ms + 450ms)}
.rows.in .rowi .ck{background:var(--signal-soft);box-shadow:none}
.rows.in .rowi .ck::before{opacity:1}

/* mobile sizes */
@media (max-width:760px){
  .mvc .n{font-size:52px}
  .ring{width:128px;height:128px}.ring b{font-size:30px}
  .mvb{font-size:17px}.mvb b{font-size:15px}
  .mv-note{font-size:16px}
  .mvm .c,.mvh .p{font-size:15px}
  .mvd .ch{font-size:16px}
  .mvs2 .lg2 small{font-size:14px}
  .mvs2 .lg2{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:14px}
}
@media (prefers-reduced-motion:reduce){
  .mvc .to,.mvc .n.hi,.ring .fg,.mvb .t i,.mvs2 .bar i,.mvm .c,.mvm .h,.mvh .p i,.mvh .z,.mvd .ch,.mvd .ar,.rows.rv .rowi,.rows.rv .rowi .ck,.rows.rv .rowi .ck::before{transition:none}
  .oc.rv .oc-v .fx .k-row,.oc.rv .oc-v .fx .k-note,.oc.rv .oc-v .fx .k-lrow,.oc.rv .oc-v .fx .k-chk li,.oc.rv .oc-v .fx .k-act{opacity:1;transform:none}
}