/**
 * Garage Apex Auction Portal – animated auction price card
 *   [ga_sold_value]  .gaap-val
 *
 * Reveals once when it scrolls into view, then keeps gently moving (ticker, sheen, glow, dots).
 * transform + opacity only. Paused while off screen (.is-live is toggled by the script).
 * Layout follows the card's own width (container queries). Reduced motion: the finished card.
 * Loaded only on sold car pages and pages that use the shortcode.
 */
.gaap-val{
  --v-bg:#121315;--v-line:#26282c;--v-text:#fff;--v-dim:#a7abb2;--v-faint:#8e939a;
  --v-blue:#4aa3ff;--v-blue-2:#2a7fe0;--v-ok:#34c26a;--v-down:#ff8a8a;--v-up:#6fd18a;
  --v-low:.18;--v-est:.5;--v-high:.82;
  container-type:inline-size;position:relative;box-sizing:border-box;width:100%;max-width:560px;margin-inline:auto;
  font-family:inherit;color:var(--v-text);line-height:1.4;-webkit-font-smoothing:antialiased;
}
.gaap-val *,.gaap-val *::before,.gaap-val *::after{box-sizing:border-box}
.gaap-val__card{position:relative;overflow:hidden;padding:22px 24px 20px;border-radius:20px;background:linear-gradient(180deg,#17181b 0%,var(--v-bg) 100%);border:1px solid #2a2c31;box-shadow:0 26px 50px -30px rgba(0,0,0,.75)}
.gaap-val__card::before{content:"";position:absolute;right:-30%;top:-60%;width:80%;height:160%;background:radial-gradient(closest-side,rgba(74,163,255,.14),rgba(74,163,255,0));pointer-events:none}

.gaap-val__head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 6px}
.gaap-val__title{display:flex;align-items:center;gap:9px;margin:0!important;font-size:12.5px!important;font-weight:600!important;letter-spacing:.07em!important;text-transform:uppercase;color:var(--v-dim)!important;line-height:1.3!important}
.gaap-val__title svg{flex:none;width:20px;height:20px;color:var(--v-blue)}
.gaap-val__model{font-size:12.5px;color:var(--v-faint);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.gaap-val__price{display:block;margin:6px 0 2px;font-size:clamp(30px,8.5cqi,42px);font-weight:800;letter-spacing:-.02em;line-height:1.05;font-variant-numeric:tabular-nums;color:#fff}
.gaap-val__range{display:block;margin:0 0 20px;font-size:15px;color:var(--v-dim);font-variant-numeric:tabular-nums}

.gaap-val__bar{position:relative;height:14px;margin:0 0 12px}
.gaap-val__track{position:absolute;inset:3px 0;border-radius:8px;background:#26282d}
.gaap-val__fill{position:absolute;top:3px;bottom:3px;left:calc(var(--v-low) * 100%);width:calc((var(--v-high) - var(--v-low)) * 100%);border-radius:8px;background:linear-gradient(90deg,var(--v-blue-2),var(--v-blue) 55%,#7cc0ff);transform-origin:left center}
.gaap-val__mark{position:absolute;top:-4px;bottom:-4px;left:0;width:100%;pointer-events:none}
.gaap-val__mark i{position:absolute;top:0;bottom:0;left:calc(var(--v-est) * 100%);width:4px;margin-left:-2px;border-radius:3px;background:#9fd0ff;box-shadow:0 0 0 3px rgba(74,163,255,.25)}
.gaap-val__mark i::after{content:"";position:absolute;inset:-4px -6px;border-radius:6px;border:2px solid rgba(124,192,255,.7);opacity:0}

.gaap-val__scale{display:grid;grid-template-columns:1fr auto 1fr;gap:10px;align-items:baseline;margin:0 0 18px;font-size:13px;color:var(--v-dim);font-variant-numeric:tabular-nums}
.gaap-val__scale span:nth-child(2){color:var(--v-blue);font-weight:600;text-align:center}
.gaap-val__scale span:nth-child(3){text-align:right}

.gaap-val__chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px;padding:0;list-style:none}
.gaap-val__chips li{display:inline-flex;align-items:center;gap:7px;margin:0;padding:7px 12px;border-radius:999px;background:#1f2125;border:1px solid #2b2e33;font-size:13.5px;color:#e6e6e6;line-height:1.2}
.gaap-val__chips .dn{color:var(--v-down)}
.gaap-val__chips .up{color:var(--v-up)}
.gaap-val__dot{position:relative;width:8px;height:8px;border-radius:50%;background:var(--v-ok)}
.gaap-val__dot::after{content:"";position:absolute;inset:0;border-radius:50%;background:var(--v-ok);opacity:0}
.gaap-val__foot{margin:0!important;font-size:13px!important;color:var(--v-faint)!important;line-height:1.5!important}

/* Recent lots ticker */
.gaap-val__feed{display:flex;align-items:center;gap:12px;margin:16px -24px -20px;padding:12px 24px;border-top:1px solid #222429;background:rgba(255,255,255,.02)}
.gaap-val__live{display:inline-flex;align-items:center;gap:7px;flex:none;font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#ff8a8a}
.gaap-val__live i{position:relative;width:7px;height:7px;border-radius:50%;background:#ff5c5c}
.gaap-val__live i::after{content:"";position:absolute;inset:0;border-radius:50%;background:#ff5c5c;opacity:0}
.gaap-val__win{position:relative;flex:1;min-width:0;height:22px;overflow:hidden;-webkit-mask-image:linear-gradient(180deg,transparent,#000 22%,#000 78%,transparent);mask-image:linear-gradient(180deg,transparent,#000 22%,#000 78%,transparent)}
.gaap-val__rows{margin:0!important;padding:0!important;list-style:none!important}
.gaap-val__rows li{display:flex;gap:10px;height:22px;margin:0!important;align-items:center;font-size:13px;line-height:22px;color:#d6d9de;white-space:nowrap;font-variant-numeric:tabular-nums}
.gaap-val__rows li span{overflow:hidden;text-overflow:ellipsis}
.gaap-val__rows li b{font-weight:600;color:#fff}
.gaap-val__rows li i{font-style:normal}
.gaap-val__rows li em{font-style:normal;color:var(--v-faint);margin-left:auto;flex:none}

/* Fill sheen */
.gaap-val__fill{overflow:hidden}
.gaap-val__fill::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,rgba(255,255,255,0) 30%,rgba(255,255,255,.45) 50%,rgba(255,255,255,0) 70%);transform:translate3d(-110%,0,0)}
.gaap-val__foot b{color:#cfd3d9;font-weight:600;font-variant-numeric:tabular-nums}

/* Teaser mode: figures hidden behind a blur, with a way to see them */
.gaap-val__blur{filter:blur(7px);user-select:none}
.gaap-val__cta{position:absolute;inset:0;z-index:2;margin:auto;width:max-content;height:fit-content;max-width:100%;display:inline-flex;align-items:center;gap:8px;padding:11px 18px;border-radius:10px;background:#fff;color:#9b2c2c!important;font-size:14px;font-weight:700;text-decoration:none!important;white-space:nowrap;box-shadow:0 12px 26px -10px rgba(0,0,0,.7)}
.gaap-val__cta:hover{background:#fff4f4}
.gaap-val__cta:focus-visible{outline:3px solid #f0b400;outline-offset:3px}
.gaap-val__teaser{position:relative}
.gaap-val__sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ---- The one-off reveal (runs when .is-on is added) ---- */
.gaap-val [data-v]{opacity:0}
.gaap-val .gaap-val__fill{transform:scaleX(0)}
.gaap-val .gaap-val__mark i{transform:translate3d(calc(-1 * var(--v-est) * 100cqi),0,0);opacity:0}
.gaap-val.is-on [data-v]{animation:gaap-val-in .5s cubic-bezier(.2,.8,.2,1) both}
.gaap-val.is-on [data-v="1"]{animation-delay:0s}
.gaap-val.is-on [data-v="2"]{animation-delay:.12s}
.gaap-val.is-on [data-v="3"]{animation-delay:.22s}
.gaap-val.is-on [data-v="4"]{animation-delay:.95s}
.gaap-val.is-on [data-v="5"]{animation-delay:1.15s}
.gaap-val.is-on [data-v="6"]{animation-delay:1.3s}
.gaap-val.is-on [data-v="7"]{animation-delay:1.45s}
.gaap-val.is-on .gaap-val__fill{animation:gaap-val-fill .9s cubic-bezier(.4,0,.2,1) .35s both}
.gaap-val.is-on .gaap-val__mark i{animation:gaap-val-mark 1s cubic-bezier(.3,.7,.2,1) .55s both}
/* Always-on, gentle motion (starts after the reveal; paused while off screen) */
.gaap-val.is-on .gaap-val__mark i::after{animation:gaap-val-pulse 2.4s ease-out 1.55s infinite both}
.gaap-val.is-on .gaap-val__dot::after,.gaap-val.is-on .gaap-val__live i::after{animation:gaap-val-ping 2.2s cubic-bezier(0,0,.2,1) 1.6s infinite}
.gaap-val.is-on .gaap-val__fill::after{animation:gaap-val-sheen 4.2s ease-in-out 2.2s infinite}
.gaap-val.is-on .gaap-val__card::before{animation:gaap-val-drift 14s ease-in-out infinite alternate}
.gaap-val:not(.is-live) .gaap-val__mark i::after,.gaap-val:not(.is-live) .gaap-val__dot::after,.gaap-val:not(.is-live) .gaap-val__live i::after,
.gaap-val:not(.is-live) .gaap-val__fill::after,.gaap-val:not(.is-live) .gaap-val__card::before,.gaap-val:not(.is-live) .gaap-val__rows{animation-play-state:paused}
@keyframes gaap-val-in{from{opacity:0;transform:translate3d(0,8px,0)}to{opacity:1;transform:none}}
@keyframes gaap-val-fill{to{transform:scaleX(1)}}
@keyframes gaap-val-mark{from{opacity:0;transform:translate3d(calc(-1 * var(--v-est) * 100cqi),0,0)}20%{opacity:1}to{opacity:1;transform:none}}
@keyframes gaap-val-pulse{0%{opacity:.9;transform:scale(1)}100%{opacity:0;transform:scale(1.9)}}
@keyframes gaap-val-ping{0%{opacity:.6;transform:scale(1)}75%,100%{opacity:0;transform:scale(2.6)}}
@keyframes gaap-val-sheen{0%{transform:translate3d(-110%,0,0)}55%,100%{transform:translate3d(110%,0,0)}}
@keyframes gaap-val-drift{from{transform:translate3d(0,0,0)}to{transform:translate3d(-18%,22%,0)}}

/* Narrow column or phone */
@container (max-width:420px){
  .gaap-val__card{padding:18px 16px 16px;border-radius:18px}
  .gaap-val__model{display:none}
  .gaap-val__range{font-size:14px;margin-bottom:16px}
  .gaap-val__scale{grid-template-columns:1fr 1fr;row-gap:2px;font-size:12px}
  .gaap-val__scale span:nth-child(2){grid-column:1/-1;grid-row:1;text-align:left}
  .gaap-val__chips li{font-size:12.5px;padding:6px 10px}
  .gaap-val__feed{margin:14px -16px -16px;padding:11px 16px;gap:10px}
  .gaap-val__live{font-size:0;gap:0}
  .gaap-val__rows li{font-size:12.5px;gap:8px}
  .gaap-val__g{display:none}
}

@container (max-width:330px){
  .gaap-val__rows li em{display:none}
}

@media (prefers-reduced-motion:reduce){
  .gaap-val [data-v],.gaap-val .gaap-val__fill,.gaap-val .gaap-val__mark i{opacity:1!important;transform:none!important;animation:none!important}
  .gaap-val .gaap-val__mark i::after,.gaap-val .gaap-val__dot::after,.gaap-val .gaap-val__live i::after,.gaap-val .gaap-val__fill::after,.gaap-val .gaap-val__card::before,.gaap-val .gaap-val__rows{animation:none!important}
}
/* Ticker: hold each lot ~3s, slide up, loop seamlessly (generated for 2, 3 and 4 lots) */
@keyframes gaap-val-feed2{0.00%,42.50%{transform:translate3d(0,0px,0)}50.00%,92.50%{transform:translate3d(0,-22px,0)}100%{transform:translate3d(0,-44px,0)}}
.gaap-val.is-on .gaap-val__rows[data-n="2"]{animation:gaap-val-feed2 7.5s cubic-bezier(.6,0,.2,1) 1.8s infinite}
@keyframes gaap-val-feed3{0.00%,28.33%{transform:translate3d(0,0px,0)}33.33%,61.67%{transform:translate3d(0,-22px,0)}66.67%,95.00%{transform:translate3d(0,-44px,0)}100%{transform:translate3d(0,-66px,0)}}
.gaap-val.is-on .gaap-val__rows[data-n="3"]{animation:gaap-val-feed3 11.25s cubic-bezier(.6,0,.2,1) 1.8s infinite}
@keyframes gaap-val-feed4{0.00%,21.25%{transform:translate3d(0,0px,0)}25.00%,46.25%{transform:translate3d(0,-22px,0)}50.00%,71.25%{transform:translate3d(0,-44px,0)}75.00%,96.25%{transform:translate3d(0,-66px,0)}100%{transform:translate3d(0,-88px,0)}}
.gaap-val.is-on .gaap-val__rows[data-n="4"]{animation:gaap-val-feed4 15s cubic-bezier(.6,0,.2,1) 1.8s infinite}

.gaap-val.is-on:not(.is-live) .gaap-val__rows[data-n]{animation-play-state:paused}

/* Editors only: shows when the card is using demo figures */
.gaap-val__demo{position:relative;z-index:1;margin:0 0 10px!important;padding:5px 10px;border-radius:6px;background:#3a2f0a;color:#ffd666!important;font-size:12px!important;line-height:1.4!important}

/* Theme safety: headings, lists and links inside the card keep their own look */
.gaap-val ul,.gaap-val ol{list-style:none!important;margin:0!important;padding:0!important}
.gaap-val li{margin:0!important}
.gaap-val p{margin:0}
.gaap-val a.gaap-val__cta{color:#9b2c2c!important;text-decoration:none!important}
.gaap-val ul.gaap-val__chips{margin:0 0 14px!important}
.gaap-val .gaap-val__chips li{margin:0!important}

/* Sold price mode: sold price with an illustrative range, plus a link to live prices */
.gaap-val__chips b{font-weight:600;color:inherit;font-variant-numeric:tabular-nums}
.gaap-val .gaap-val__more{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px;color:#d6d9de!important;text-decoration:none!important}
.gaap-val .gaap-val__more b{color:#fff;font-weight:600}
.gaap-val .gaap-val__more:hover b{text-decoration:underline}
.gaap-val .gaap-val__more:focus-visible{outline:3px solid #f0b400;outline-offset:3px}
@container (max-width:420px){
  .gaap-val .gaap-val__more{font-size:12.5px}
}