/* DISC brand tokens: palette, type, green-strip heading. Only colours from the DISC guidelines plus one posture-warning hue. */

@font-face{font-family:"Avenir";src:url("../assets/fonts/avenir-light.woff2") format("woff2");font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:"Avenir";src:url("../assets/fonts/avenir-light-oblique.woff2") format("woff2");font-weight:300;font-style:italic;font-display:swap}
@font-face{font-family:"Avenir";src:url("../assets/fonts/avenir-book.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Avenir";src:url("../assets/fonts/avenir-medium.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Avenir";src:url("../assets/fonts/avenir-medium-oblique.woff2") format("woff2");font-weight:500;font-style:italic;font-display:swap}
@font-face{font-family:"Avenir";src:url("../assets/fonts/avenir-heavy.woff2") format("woff2");font-weight:800;font-style:normal;font-display:swap}
@font-face{font-family:"Avenir";src:url("../assets/fonts/avenir-black.woff2") format("woff2");font-weight:900;font-style:normal;font-display:swap}
@font-face{font-family:"Avenir";src:url("../assets/fonts/avenir-black-oblique.woff2") format("woff2");font-weight:900;font-style:italic;font-display:swap}
@font-face{font-family:"GE SS Two";src:url("../assets/fonts/gess-two-light.woff2") format("woff2");font-weight:300 400;font-display:swap}
@font-face{font-family:"GE SS Two";src:url("../assets/fonts/gess-two-medium.woff2") format("woff2");font-weight:500 600;font-display:swap}
@font-face{font-family:"GE SS Two";src:url("../assets/fonts/gess-two-bold.woff2") format("woff2");font-weight:700 900;font-display:swap}

:root{
  /* primary */
  --grey:#6D6E71;           /* DISC Grey · K70 */
  --green:#9ACA3C;          /* DISC Green */
  /* complementary */
  --grey-mid:#A7A9AC;       /* K40 */
  --grey-light:#DCDDDE;     /* K10 */
  --green-soft:#92CD8B;
  --aqua:#8BD0C0;
  /* neutral */
  --white:#FFFFFF;
  --black:#000000;
  /* quiet surfaces: tint of Light Grey */
  --surface:#F1F1F2;
  /* posture warning (game only): hue, soft fill, and a darker ink for text on the soft fill */
  --pain:#E2533A;
  --pain-soft:#FCE4DE;
  --pain-ink:#A8301B;

  --f-en:"Avenir","Avenir Next","Segoe UI",sans-serif;
  /* GE SS Two has no Latin letters, so Latin words inside Arabic fall through to Avenir */
  --f-ar:"GE SS Two","Avenir","Geeza Pro","Tahoma",sans-serif;
  --f:var(--f-en);
  color-scheme:light;
}
html[lang="ar"]{--f:var(--f-ar)}

/* Contrast: grey on white 5.1:1, white on grey 5.1:1, black on DISC Green 10.9:1, pain-ink on pain-soft 6.1:1.
   Grey on DISC Green is only 2.6:1, so text on green is always black. */

/* Brand signature: short green strip above a title. Its size follows the title's font size. */
.strip{position:relative;padding-top:.5em}
.strip::before{content:"";position:absolute;top:0;inset-inline-start:0;width:2.4em;height:.2em;min-height:4px;background:var(--green)}
.caps{text-transform:uppercase;letter-spacing:.08em}
html[lang="ar"] .caps{letter-spacing:0;text-transform:none}
h1,h2,h3{margin:0;font-weight:900;color:var(--grey);text-wrap:balance}
html[lang="ar"] h1,html[lang="ar"] h2,html[lang="ar"] h3{font-weight:700}

.logo{display:block;height:38px;width:auto}
