.project-numbers {
  --metrics-grid-width: min(1680px,calc(100% - 2 * var(--gutter)));
  --metrics-grid-gap: clamp(20px,2.083vw,40px);
  background: #000; color: #000;
}
.metrics-stage { position: relative; }
.metrics-slide { position: relative; height: 100vh; height: 100svh; min-height: 520px; overflow: hidden; background: #b9bdaf; }
.metrics-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.metrics-slide.is-unavailable { background: #b9bdaf; }
.metrics-panel,.metrics-static-panel { position: absolute; z-index: 5; right: 40px; bottom: 40px; width: calc((var(--metrics-grid-width) - 2 * var(--metrics-grid-gap))/3); padding: 40px; background: #f4f4ea; }
.metrics-panel { display: none; }
.metrics-value { display: block; color: #000; font-size: clamp(108px,7.5vw,144px); font-weight: 400; text-align: start; line-height: 1.05; letter-spacing: -.04em; font-variant-numeric: tabular-nums; }
.metrics-label { color: #000; font-size: 18px; font-weight: 300; line-height: 1.4; text-align: start; max-width: 100%; }
.metrics-static-panel { display: flex; flex-direction: column; min-height: 396px; }
.metrics-static-panel .metrics-label { margin-block-start: auto; padding-block-start: 24px; }
.metrics-copy-stack { position: relative; height: 260px; overflow: hidden; }
.metrics-fact { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: space-between; }
.metrics-fact:not(:first-child) { opacity: 0; visibility: hidden; }
.metrics-progress { display: flex; gap: 12px; margin-block-start: 12px; }
.metrics-step { position: relative; min-width: 0; flex: 1 1 0; height: 44px; padding: 0; border: 0; border-radius: 0; background: transparent; }
.metrics-step::before,.metrics-step-fill { position: absolute; top: 21px; left: 0; height: 2px; width: 100%; background: #b9bdaf; }
.metrics-step::before { content: ''; }
.metrics-step-fill { display: block; background: #753323; transform: scaleX(0); transform-origin: left center; }
.metrics-step:hover::before { background: #525348; }
.metrics-step:focus-visible { outline: 2px solid #753323; outline-offset: 2px; }
.metrics-static-progress { display: flex; gap: 12px; margin-block-start: 32px; }
.metrics-static-progress span { flex: 1; height: 2px; background: #b9bdaf; }
.metrics-static-progress span.is-current { background: #753323; }
.metrics-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.project-numbers.is-enhanced .metrics-stage { height: 100vh; height: 100svh; min-height: 520px; overflow: clip; isolation: isolate; }
.project-numbers.is-enhanced .metrics-slide { position: absolute; inset: 0; height: 100%; min-height: 0; }
.project-numbers.is-enhanced .metrics-slide.is-unavailable { visibility: hidden; }
.project-numbers.is-enhanced .metrics-static-panel { display: none; }
.project-numbers.is-enhanced .metrics-panel { display: block; }
html[dir='rtl'] .metrics-value { letter-spacing: 0; }
html[dir='rtl'] .metrics-label { line-height: 1.6; }
html[dir='rtl'] .metrics-step-fill { transform-origin: right center; }
@media(max-width:1199px) { .metrics-panel,.metrics-static-panel { width: 400px; right: 24px; bottom: 24px; padding: 36px; } .metrics-static-panel { min-height: 348px; } .metrics-value { font-size: 100px; } .metrics-copy-stack { height: 220px; } }
@media(max-width:599px) { .metrics-panel,.metrics-static-panel { width: calc(100% - 40px); right: 20px; bottom: 20px; padding: 28px; } .metrics-static-panel { min-height: 280px; } .metrics-value { font-size: clamp(72px,22.564vw,96px); } .metrics-label { color: #000; font-size: 16px; } .metrics-static-panel .metrics-label { padding-block-start: 16px; } .metrics-static-progress { margin-block-start: 24px; } }
@media(max-height:650px) and (min-width:600px) { .metrics-panel,.metrics-static-panel { padding: 28px; width: 380px; bottom: 20px; right: 20px; } .metrics-static-panel { min-height: 300px; } .metrics-value { font-size: 92px; } .metrics-copy-stack { height: 188px; } }
@media(prefers-reduced-motion:reduce) { .metrics-slide { height: 90svh; min-height: 520px; } }

/* The fixed smooth-scroll viewport must not acquire a second native scroll offset on focus. */
.project-detail-page:has(.project-numbers.is-enhanced) #smooth-wrapper { overflow: clip !important; }
