/* CSATYPE — the two typefaces the site is set in.

   Until now everything fell back to whatever the phone happened to have:
   Georgia on some, Noto on others, a different serif on every Android
   version. Two families are now shipped with the site, so a page looks the
   same on a Tecno, a Samsung and an iPhone.

     Inter     — the reading and interface face. Neutral, open, made for
                 small sizes on screens, with real tabular figures so a
                 column of kwacha lines up.
     Fraunces  — the display face for headings and figures. A serif with
                 warmth and a little character, which is what a farm record
                 book wants; it settles down at small sizes on its own.

   Both are variable fonts, latin subset, served from this site — no request
   to a font CDN, so they work with no signal and cannot be blocked. */

@font-face {
  font-family: 'Inter var';
  src: url('fonts/inter.woff2') format('woff2');
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6,
                 U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F,
                 U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215,
                 U+FEFF, U+FFFD;
}

/* The wordmark. A high-contrast old-style face, drawn for a name rather than
   for a paragraph: it holds its elegance at forty pixels and at twelve. */
@font-face {
  font-family: 'Cormorant Garamond';
  src: url('fonts/cormorant-normal-600.woff2') format('woff2');
  font-weight: 600 700; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Cormorant Garamond';
  src: url('fonts/cormorant-italic-600.woff2') format('woff2');
  font-weight: 600 700; font-style: italic; font-display: swap;
}

@font-face {
  font-family: 'Fraunces var';
  src: url('fonts/fraunces.woff2') format('woff2');
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6,
                 U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F,
                 U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215,
                 U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Fraunces var';
  src: url('fonts/fraunces-italic.woff2') format('woff2');
  font-weight: 400 700;
  font-style: italic;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6,
                 U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F,
                 U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215,
                 U+FEFF, U+FFFD;
}

:root{
  --sans: 'Inter var', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
          'Helvetica Neue', Arial, sans-serif;
  --serif: 'Fraunces var', 'Iowan Old Style', 'Palatino Linotype', Palatino,
           Georgia, serif;
  /* optical sizing lets Fraunces draw softer at caption size and sharper at
     display size, the way a metal face was cut for each size */
  --display: 'Fraunces var', Georgia, serif;
  --wordmark: 'Cormorant Garamond', 'Iowan Old Style', Palatino, Georgia, serif;
}

html,body,button,input,select,textarea{
  font-family: var(--sans);
  font-optical-sizing: auto;
}

h1,h2,h3,h4,.card__head h2,.pane__head b,.brand b,.masthead b{
  font-family: var(--serif);
  font-optical-sizing: auto;
}

/* The figure that leads a card: display weight, tight, tabular. */
#positionTotal,.kpi b,.ar-result__big,.brand b{
  font-family: var(--display);
  font-feature-settings: 'tnum' 1;
  letter-spacing: -.02em;
}

/* Inter's figures are proportional by default; the book needs columns. */
input[type="number"],#positionTotal,.pos b,.kpi b,.vox__line,
time,.msg-b__time,.msg-b__meta,.m time{
  font-variant-numeric: tabular-nums;
}

/* A word of the brand keeps its italic cut rather than a slanted roman. */
.brand em,.masthead em{font-family: var(--display);font-style: italic;font-weight:600}

/* ---------- type refinements: hierarchy, measure, colour ---------- */

html{-webkit-text-size-adjust:100%}

body{
  font-family:var(--sans);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
  letter-spacing:.002em;
}

/* Display sizes are set by hand rather than by a generic h1 rule, so the
   serif never has to be squeezed into a size that was chosen for Inter. */
.ln-hero h1{
  font-family:var(--serif);font-weight:600;letter-spacing:-.022em;line-height:1.06;
  font-size:clamp(1.75rem,7.2vw,2.15rem);text-wrap:balance
}
.ln-hero p{font-size:.95rem;line-height:1.6;text-wrap:pretty}
.ln-head h1{
  font-family:var(--serif);font-weight:600;letter-spacing:-.018em;line-height:1.14;
  font-size:clamp(1.45rem,5.6vw,1.7rem);text-wrap:balance
}
.ln-head p{font-size:.92rem;line-height:1.6;text-wrap:pretty;max-width:56ch}
.ln-shelf h2{
  font-family:var(--serif);font-weight:600;letter-spacing:-.012em;font-size:1.1rem;line-height:1.24
}
.ln-shelf p{font-size:.85rem;line-height:1.52}
.ln-part__h{
  font-size:.68rem;letter-spacing:.15em;font-weight:600;text-transform:uppercase;color:#7C8A80
}

.ln-art{max-width:66ch}
.ln-art h1{
  font-family:var(--serif);font-weight:600;font-size:clamp(1.4rem,5.4vw,1.62rem);
  line-height:1.16;letter-spacing:-.018em;text-wrap:balance
}
.ln-art__dek{font-size:.97rem;line-height:1.58;text-wrap:pretty}
.ln-art h2{
  font-family:var(--serif);font-weight:600;font-size:1.14rem;line-height:1.3;
  letter-spacing:-.008em;margin:26px 0 9px;text-wrap:balance
}
.ln-art h3{font-size:.95rem;letter-spacing:.01em;margin:18px 0 6px}
.ln-art p{font-size:1rem;line-height:1.68;text-wrap:pretty}
.ln-art li{font-size:1rem;line-height:1.62}
.ln-art figcaption{font-size:.78rem;line-height:1.5}

/* Numbers line up: kwacha in a table, minutes in a list. */
.ln-tbl table,.tabnum,.ln-item__mins,.ln-shelf__n{font-variant-numeric:tabular-nums}