/* JOY'S BOX V26 — redesigned at-a-glance metrics */
:root{
  --v26-paper:#f1ede4;
  --v26-card:#faf7f0;
  --v26-ink:#15130f;
  --v26-muted:#655e56;
  --v26-line:rgba(21,19,15,.12);
  --v26-gold:#a9852b;
  --v26-ease:cubic-bezier(.16,1,.3,1);
}

.intro-v26__ledger{
  margin-top:clamp(46px,5.2vw,80px);
  border-top:1px solid var(--v26-line);
  border-bottom:1px solid var(--v26-line);
  background:linear-gradient(180deg,rgba(255,255,255,.34),rgba(255,255,255,.18));
}
.intro-metric-v26{
  position:relative;
  display:grid;
  grid-template-columns:52px minmax(110px,.55fr) minmax(0,1fr);
  gap:clamp(18px,2vw,34px);
  align-items:end;
  padding:clamp(22px,2vw,28px) 0;
  border-bottom:1px solid var(--v26-line);
  transition:background .35s ease, transform .35s var(--v26-ease);
}
.intro-metric-v26:last-child{border-bottom:0}
.intro-metric-v26::before{
  content:"";position:absolute;left:0;right:0;top:0;bottom:0;
  background:linear-gradient(90deg,rgba(169,133,43,.06),rgba(169,133,43,0));
  transform:scaleX(0);transform-origin:left center;transition:transform .45s var(--v26-ease);
}
.intro-metric-v26>*{position:relative;z-index:1}
.intro-metric-v26 small{
  align-self:start;
  color:#9e8a59;
  font:700 8px/1 var(--sans);
  letter-spacing:.16em;
  margin-top:10px;
}
.intro-metric-v26 strong{
  color:var(--v26-ink);
  font:600 clamp(58px,6vw,108px)/.82 var(--cond);
  letter-spacing:-.055em;
  margin:0;
  font-variant-numeric:tabular-nums lining-nums;
  transition:transform .42s var(--v26-ease), color .3s ease;
}
.intro-metric-v26 div{
  display:grid;
  gap:10px;
  padding-bottom:8px;
}
.intro-metric-v26 span{
  color:var(--v26-ink);
  font:700 clamp(11px,.9vw,13px)/1.1 var(--sans);
  letter-spacing:.18em;
}
.intro-metric-v26 p{
  max-width:62ch;
  margin:0;
  color:var(--v26-muted);
  font:500 13px/1.65 var(--sans);
}
.intro-metric-v26:hover{transform:translateX(6px)}
.intro-metric-v26:hover::before{transform:scaleX(1)}
.intro-metric-v26:hover strong{transform:translateY(-2px);color:#8c6a1e}

@media (max-width:980px){
  .intro-metric-v26{grid-template-columns:40px minmax(88px,.45fr) minmax(0,1fr);gap:18px}
  .intro-metric-v26 p{max-width:48ch}
}
@media (max-width:720px){
  .intro-v26__ledger{margin-top:36px}
  .intro-metric-v26{
    grid-template-columns:1fr;
    gap:8px;
    padding:18px 0 20px;
  }
  .intro-metric-v26 small{margin-top:0}
  .intro-metric-v26 strong{font-size:48px}
  .intro-metric-v26 div{padding-bottom:0}
  .intro-metric-v26 p{font-size:12px;max-width:none}
}
@media (prefers-reduced-motion:reduce){
  .intro-metric-v26,.intro-metric-v26::before,.intro-metric-v26 strong{transition:none!important}
}