/* Mojaya typography. Three brand faces, one role each (brand guidelines pages 25–29):
   Lovelace = titres, Bell Gothic Std = sous-titres, Sweet Sans Pro = corps de texte.
   Sizes below are transcribed verbatim from the packaging, social and deck artwork — they are
   not on a rounded scale, and should not be snapped to one. */
:root{
  --font-title:"Lovelace",Georgia,"Times New Roman",serif;
  --font-subtitle:"Bell Gothic Std","Helvetica Neue",Arial,sans-serif;
  --font-body:"Sweet Sans Pro","Helvetica Neue",Arial,sans-serif;

  --weight-title:300;
  --weight-subtitle:300;
  --weight-body:400;
  --weight-body-medium:500;

  /* Display — Lovelace, packaging & social headlines */
  --type-display-lg-size:88.321px;   --type-display-lg-lh:100.923px;  --type-display-lg-ls:-0.04em;
  --type-display-md-size:82.35px;    --type-display-md-lh:80.355px;   --type-display-md-ls:0em;
  --type-display-sm-size:50.437px;   --type-display-sm-lh:57.5px;     --type-display-sm-ls:-0.04em;
  --type-title-size:26.502px;        --type-title-lh:27.788px;        --type-title-ls:0em;
  --type-lead-size:27.802px;         --type-lead-lh:36.012px;         --type-lead-ls:0.02em;

  /* Sous-titres / labels — Bell Gothic Std, always uppercase */
  --type-label-lg-size:22.996px;     --type-label-lg-lh:63.717px;     --type-label-lg-ls:0em;
  --type-label-md-size:18.988px;     --type-label-md-lh:28.773px;     --type-label-md-ls:0em;
  --type-label-pill-size:16.28px;    --type-label-pill-lh:100%;       --type-label-pill-ls:0.05em;
  --type-label-sm-size:15.542px;     --type-label-sm-lh:19.831px;     --type-label-sm-ls:0em;

  /* Corps de texte — Sweet Sans Pro */
  --type-body-size:22.821px;         --type-body-lh:1.55;
  --type-body-sm-size:16.572px;      --type-body-sm-lh:100%;
  --type-caption-size:10.378px;      --type-caption-lh:1.4;
}
/* Ready-made role classes. Uppercase is baked in where the brand always sets it that way. */
.mj-display{font-family:var(--font-title);font-weight:var(--weight-title);font-size:var(--type-display-lg-size);line-height:var(--type-display-lg-lh);letter-spacing:var(--type-display-lg-ls)}
.mj-display-md{font-family:var(--font-title);font-weight:var(--weight-title);font-size:var(--type-display-md-size);line-height:var(--type-display-md-lh)}
.mj-title{font-family:var(--font-title);font-weight:var(--weight-title);font-size:var(--type-title-size);line-height:var(--type-title-lh)}
.mj-lead{font-family:var(--font-title);font-weight:var(--weight-title);font-size:var(--type-lead-size);line-height:var(--type-lead-lh);letter-spacing:var(--type-lead-ls)}
.mj-label{font-family:var(--font-subtitle);font-weight:var(--weight-subtitle);font-size:var(--type-label-md-size);line-height:var(--type-label-md-lh);text-transform:uppercase}
.mj-label-pill{font-family:var(--font-subtitle);font-weight:var(--weight-subtitle);font-size:var(--type-label-pill-size);line-height:var(--type-label-pill-lh);letter-spacing:var(--type-label-pill-ls);text-transform:uppercase}
.mj-label-sm{font-family:var(--font-subtitle);font-weight:var(--weight-subtitle);font-size:var(--type-label-sm-size);line-height:var(--type-label-sm-lh);text-transform:uppercase}
.mj-body{font-family:var(--font-body);font-weight:var(--weight-body);font-size:var(--type-body-size);line-height:var(--type-body-lh)}
.mj-body-sm{font-family:var(--font-body);font-weight:var(--weight-body);font-size:var(--type-body-sm-size);line-height:var(--type-body-sm-lh)}
