/* Self-hosted variable fonts (2026-10-05). Two same-origin files replace the Google Fonts stylesheet and its two extra hosts. The approach is the Group site's; the numbers below are measured for this site, not copied. The fallback faces are local fonts scaled to set this site's own copy at the same width as the web font, carrying the web font's ascent and descent, so nothing reflows when the web font arrives (CLS). One family per platform font, because each needs its own scale: Big Shoulders Fallback Impact macOS, Windows Big Shoulders Fallback Avenir Avenir Next Condensed Bold iOS, where there is no Impact Big Shoulders Fallback Roboto Roboto Android Archivo Fallback Arial, Arial Bold macOS, iOS, Windows Archivo Fallback Roboto Roboto Android How the numbers were made (headless Chrome, text from ten built pages): - size-adjust = width of the copy in the web font / width in the local font, per weight band (display 700 and 800; body 400, 500, 600, 700). - ascent-override and descent-override = the web font's hhea ascent and descent divided by size-adjust (Big Shoulders Display 1968 / 426 on 2000; Archivo 878 / 210 on 1000; neither has a line gap). - The body families are split in two. Archivo's word space is a quarter narrower than Arial's, and its "0" is wider, which matters because paragraphs here are capped in ch and the browser reads 1ch from the face that holds the space. So the space (U+0020) comes from its own face, scaled until its "0" is exactly as wide as Archivo's, and the letters from another. On Apple and Windows the space is borrowed from Georgia Bold: a space has no shape, and Georgia Bold's space and zero are in Archivo's proportion. - In the 700 band, Avenir and Roboto are split again by case: Big Shoulders' lower case is wider against its capitals than theirs, so one scale cannot fit both. Impact's proportions are close enough to need no split. - unicode-range stops at characters the web fonts cover, so arrows and symbols keep falling through to the system font exactly as they did before. - The two web faces keep the weight ranges Google Fonts served (Big Shoulders Display 500 to 800, Archivo 400 to 700), although the files go further: "bolder" text inside an already bold element must keep topping out where it did, or it renders heavier. If a font file, a weight or a font stack changes, measure again. */ @font-face { font-family: "Big Shoulders Display"; src: url("/assets/fonts/BigShouldersDisplay-var.woff2") format("woff2"); font-weight: 500 800; font-style: normal; font-display: swap; } @font-face { font-family: "Archivo"; src: url("/assets/fonts/Archivo-var.woff2") format("woff2"); font-weight: 400 700; font-style: normal; font-display: swap; } @font-face { font-family: "Big Shoulders Fallback"; src: local("Impact"); font-weight: 100 700; size-adjust: 83.7%; ascent-override: 117.56%; descent-override: 25.45%; line-gap-override: 0%; unicode-range: U+0020-007E, U+00A0-00FF, U+0131, U+0152-0153, U+2013-2014, U+2018-201A, U+201C-201E, U+2022, U+2026, U+20AC, U+2122; } @font-face { font-family: "Big Shoulders Fallback"; src: local("Impact"); font-weight: 701 900; size-adjust: 89.45%; ascent-override: 110.01%; descent-override: 23.81%; line-gap-override: 0%; unicode-range: U+0020-007E, U+00A0-00FF, U+0131, U+0152-0153, U+2013-2014, U+2018-201A, U+201C-201E, U+2022, U+2026, U+20AC, U+2122; } @font-face { font-family: "Big Shoulders Fallback Avenir"; src: local("Avenir Next Condensed Bold"), local("AvenirNextCondensed-Bold"); font-weight: 100 700; size-adjust: 80.14%; ascent-override: 122.79%; descent-override: 26.58%; line-gap-override: 0%; unicode-range: U+0020-0060, U+007B-007E, U+00A0-00DE, U+00F7, U+0152, U+2013-2014, U+2018-201A, U+201C-201E, U+2022, U+2026, U+20AC, U+2122; } @font-face { font-family: "Big Shoulders Fallback Avenir"; src: local("Avenir Next Condensed Bold"), local("AvenirNextCondensed-Bold"); font-weight: 100 700; size-adjust: 87.79%; ascent-override: 112.09%; descent-override: 24.26%; line-gap-override: 0%; unicode-range: U+0061-007A, U+00DF-00F6, U+00F8-00FF, U+0131, U+0153; } @font-face { font-family: "Big Shoulders Fallback Avenir"; src: local("Avenir Next Condensed Bold"), local("AvenirNextCondensed-Bold"); font-weight: 701 900; size-adjust: 85.44%; ascent-override: 115.17%; descent-override: 24.93%; line-gap-override: 0%; unicode-range: U+0020-007E, U+00A0-00FF, U+0131, U+0152-0153, U+2013-2014, U+2018-201A, U+201C-201E, U+2022, U+2026, U+20AC, U+2122; } @font-face { font-family: "Big Shoulders Fallback Roboto"; src: local("Roboto Bold"), local("Roboto-Bold"), local("Roboto"), local("Roboto-Regular"); font-weight: 100 700; size-adjust: 66.38%; ascent-override: 148.24%; descent-override: 32.09%; line-gap-override: 0%; unicode-range: U+0020-0060, U+007B-007E, U+00A0-00DE, U+00F7, U+0152, U+2013-2014, U+2018-201A, U+201C-201E, U+2022, U+2026, U+20AC, U+2122; } @font-face { font-family: "Big Shoulders Fallback Roboto"; src: local("Roboto Bold"), local("Roboto-Bold"), local("Roboto"), local("Roboto-Regular"); font-weight: 100 700; size-adjust: 79.71%; ascent-override: 123.45%; descent-override: 26.72%; line-gap-override: 0%; unicode-range: U+0061-007A, U+00DF-00F6, U+00F8-00FF, U+0131, U+0153; } @font-face { font-family: "Big Shoulders Fallback Roboto"; src: local("Roboto Bold"), local("Roboto-Bold"), local("Roboto"), local("Roboto-Regular"); font-weight: 701 900; size-adjust: 71%; ascent-override: 138.59%; descent-override: 30%; line-gap-override: 0%; unicode-range: U+0020-007E, U+00A0-00FF, U+0131, U+0152-0153, U+2013-2014, U+2018-201A, U+201C-201E, U+2022, U+2026, U+20AC, U+2122; } @font-face { font-family: "Archivo Fallback"; src: local("Georgia Bold"), local("Georgia-Bold"); font-weight: 100 450; size-adjust: 81.68%; ascent-override: 107.49%; descent-override: 25.71%; line-gap-override: 0%; unicode-range: U+0020; } @font-face { font-family: "Archivo Fallback"; src: local("Arial"), local("ArialMT"); font-weight: 100 450; size-adjust: 100.93%; ascent-override: 86.99%; descent-override: 20.81%; line-gap-override: 0%; unicode-range: U+0021-007E, U+00A0-00FF, U+0131, U+0152-0153, U+2013-2014, U+2018-201A, U+201C-201E, U+2022, U+2026, U+20AC, U+2122; } @font-face { font-family: "Archivo Fallback"; src: local("Georgia Bold"), local("Georgia-Bold"); font-weight: 451 500; size-adjust: 81.83%; ascent-override: 107.3%; descent-override: 25.66%; line-gap-override: 0%; unicode-range: U+0020; } @font-face { font-family: "Archivo Fallback"; src: local("Arial"), local("ArialMT"); font-weight: 451 500; size-adjust: 102.94%; ascent-override: 85.29%; descent-override: 20.4%; line-gap-override: 0%; unicode-range: U+0021-007E, U+00A0-00FF, U+0131, U+0152-0153, U+2013-2014, U+2018-201A, U+201C-201E, U+2022, U+2026, U+20AC, U+2122; } @font-face { font-family: "Archivo Fallback"; src: local("Georgia Bold"), local("Georgia-Bold"); font-weight: 501 650; size-adjust: 82.01%; ascent-override: 107.06%; descent-override: 25.61%; line-gap-override: 0%; unicode-range: U+0020; } @font-face { font-family: "Archivo Fallback"; src: local("Arial Bold"), local("Arial-BoldMT"); font-weight: 501 650; size-adjust: 97.9%; ascent-override: 89.68%; descent-override: 21.45%; line-gap-override: 0%; unicode-range: U+0021-007E, U+00A0-00FF, U+0131, U+0152-0153, U+2013-2014, U+2018-201A, U+201C-201E, U+2022, U+2026, U+20AC, U+2122; } @font-face { font-family: "Archivo Fallback"; src: local("Georgia Bold"), local("Georgia-Bold"); font-weight: 651 900; size-adjust: 84.86%; ascent-override: 103.46%; descent-override: 24.75%; line-gap-override: 0%; unicode-range: U+0020; } @font-face { font-family: "Archivo Fallback"; src: local("Arial Bold"), local("Arial-BoldMT"); font-weight: 651 900; size-adjust: 101.57%; ascent-override: 86.44%; descent-override: 20.68%; line-gap-override: 0%; unicode-range: U+0021-007E, U+00A0-00FF, U+0131, U+0152-0153, U+2013-2014, U+2018-201A, U+201C-201E, U+2022, U+2026, U+20AC, U+2122; } @font-face { font-family: "Archivo Fallback Roboto"; src: local("Roboto"), local("Roboto-Regular"); font-weight: 100 450; size-adjust: 101.99%; ascent-override: 86.09%; descent-override: 20.59%; line-gap-override: 0%; unicode-range: U+0020; } @font-face { font-family: "Archivo Fallback Roboto"; src: local("Roboto"), local("Roboto-Regular"); font-weight: 100 450; size-adjust: 98.87%; ascent-override: 88.8%; descent-override: 21.24%; line-gap-override: 0%; unicode-range: U+0021-007E, U+00A0-00FF, U+0131, U+0152-0153, U+2013-2014, U+2018-201A, U+201C-201E, U+2022, U+2026, U+20AC, U+2122; } @font-face { font-family: "Archivo Fallback Roboto"; src: local("Roboto"), local("Roboto-Regular"); font-weight: 451 500; size-adjust: 102.18%; ascent-override: 85.93%; descent-override: 20.55%; line-gap-override: 0%; unicode-range: U+0020; } @font-face { font-family: "Archivo Fallback Roboto"; src: local("Roboto"), local("Roboto-Regular"); font-weight: 451 500; size-adjust: 100.76%; ascent-override: 87.14%; descent-override: 20.84%; line-gap-override: 0%; unicode-range: U+0021-007E, U+00A0-00FF, U+0131, U+0152-0153, U+2013-2014, U+2018-201A, U+201C-201E, U+2022, U+2026, U+20AC, U+2122; } @font-face { font-family: "Archivo Fallback Roboto"; src: local("Roboto Medium"), local("Roboto-Medium"), local("Roboto"), local("Roboto-Regular"); font-weight: 501 650; size-adjust: 101.17%; ascent-override: 86.78%; descent-override: 20.76%; line-gap-override: 0%; unicode-range: U+0020; } @font-face { font-family: "Archivo Fallback Roboto"; src: local("Roboto Medium"), local("Roboto-Medium"), local("Roboto"), local("Roboto-Regular"); font-weight: 501 650; size-adjust: 103.42%; ascent-override: 84.9%; descent-override: 20.31%; line-gap-override: 0%; unicode-range: U+0021-007E, U+00A0-00FF, U+0131, U+0152-0153, U+2013-2014, U+2018-201A, U+201C-201E, U+2022, U+2026, U+20AC, U+2122; } @font-face { font-family: "Archivo Fallback Roboto"; src: local("Roboto Bold"), local("Roboto-Bold"), local("Roboto"), local("Roboto-Regular"); font-weight: 651 900; size-adjust: 103.71%; ascent-override: 84.66%; descent-override: 20.25%; line-gap-override: 0%; unicode-range: U+0020; } @font-face { font-family: "Archivo Fallback Roboto"; src: local("Roboto Bold"), local("Roboto-Bold"), local("Roboto"), local("Roboto-Regular"); font-weight: 651 900; size-adjust: 107.89%; ascent-override: 81.38%; descent-override: 19.46%; line-gap-override: 0%; unicode-range: U+0021-007E, U+00A0-00FF, U+0131, U+0152-0153, U+2013-2014, U+2018-201A, U+201C-201E, U+2022, U+2026, U+20AC, U+2122; }