/* Loopi / numbers that tell a story */
.numbers-experience{background:#141414;color:#f5f5f4;padding:clamp(55px,6vw,92px) 5% 34px}
.numbers-experience .performance-top{display:flex;align-items:end;justify-content:space-between;border-bottom:1px solid #666;padding-bottom:27px}
.numbers-experience .performance-top h2{font:900 clamp(50px,7vw,112px)/.9 Arial,sans-serif;letter-spacing:-.09em;margin:0}
.numbers-experience .performance-top h2 span{color:#888}
.numbers-experience .numbers-hint{font:400 clamp(14px,1.2vw,18px)/1.45 Arial,sans-serif;color:#aaa;margin:24px 0 36px}
.numbers-experience .performance-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid #555;border-bottom:1px solid #555}
.numbers-experience .metric{position:relative;display:flex;flex-direction:column;align-items:stretch;text-align:left;min-width:0;min-height:350px;background:transparent;color:#fff;border:0;border-right:1px solid #555;cursor:pointer;padding:24px 18px 29px;overflow:hidden;transition:background .3s ease}
.numbers-experience .metric:first-child{padding-left:0}.numbers-experience .metric:last-child{border-right:0}
.numbers-experience .metric:hover,.numbers-experience .metric:focus-visible{background:#242424}
.numbers-experience .metric-number{font:900 10px Arial,sans-serif;letter-spacing:.12em;color:#9f9f9f}
.numbers-experience .metric-canvas-wrap{position:relative;display:block;width:100%;height:235px;margin:17px 0 14px}
.numbers-experience .metric-canvas{display:block;width:100%;height:100%}
.numbers-experience .metric-fallback{position:absolute;inset:0;display:grid;place-items:center;opacity:0;pointer-events:none;font:900 clamp(35px,5vw,77px)/1 Arial,sans-serif;letter-spacing:-.08em}
.numbers-experience .metric-bottom{display:flex;justify-content:space-between;gap:15px;align-items:end;margin-top:auto}
.numbers-experience .metric-label{font:900 11px/1.5 Arial,sans-serif;letter-spacing:.08em}
.numbers-experience .metric-label small{display:block;color:#aaa;font:700 9px/1.8 Arial,sans-serif;letter-spacing:.07em}
.numbers-experience .metric-icon{font:400 30px Arial,sans-serif;position:static}
.numbers-experience .numbers-foot{display:flex;justify-content:space-between;gap:20px;padding-top:22px;font:900 10px/1.4 Arial,sans-serif;letter-spacing:.09em;color:#a4a4a4}
@media(max-width:800px){.numbers-experience .performance-grid{grid-template-columns:1fr}.numbers-experience .metric,.numbers-experience .metric:first-child{min-height:275px;padding:20px 0;border-right:0;border-bottom:1px solid #555}.numbers-experience .metric:last-child{border-bottom:0}.numbers-experience .metric-canvas-wrap{height:190px;max-width:620px}.numbers-experience .metric:hover,.numbers-experience .metric:focus-visible{background:transparent}.numbers-experience .numbers-foot{display:block}.numbers-experience .numbers-foot span{display:block;margin:8px 0}}
@media(prefers-reduced-motion:reduce){.numbers-experience .metric{transition:none}}

/* Heroic two-plus-one composition to accommodate the original billion-scale total. */
.numbers-experience .performance-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.numbers-experience .metric:nth-child(2){border-right:0}
.numbers-experience .metric[data-metric="impressions"]{grid-column:1/-1;border-top:1px solid #555;border-right:0;min-height:340px}
.numbers-experience .metric[data-metric="impressions"] .metric-canvas-wrap{height:220px}
.numbers-experience .metric[data-metric="impressions"] .metric-bottom{justify-content:flex-start;gap:45px}
.numbers-experience .metric-fallback{font-size:clamp(30px,5vw,90px);word-break:normal}
@media(max-width:800px){.numbers-experience .performance-grid{grid-template-columns:1fr}.numbers-experience .metric[data-metric="impressions"]{grid-column:auto;min-height:265px}.numbers-experience .metric[data-metric="impressions"] .metric-canvas-wrap{height:170px}}

/* Assemble into bold solid lettering rather than small illustration fragments */
.numbers-experience .metric-canvas-wrap{isolation:isolate}
.numbers-experience .metric-canvas{position:absolute;inset:0}
.numbers-experience .metric-fallback{opacity:0;display:flex;align-items:center;justify-content:center;white-space:nowrap;letter-spacing:-.065em;font-family:Arial,Helvetica,sans-serif;font-weight:900;line-height:1;will-change:opacity}
.numbers-experience .metric{touch-action:manipulation}
.numbers-experience .numbers-foot{justify-content:flex-start}
