/* =====================================================================
   NORTHERN EDGE — base
   Minimal reset plus element defaults. No framework reset is loaded, so
   the few normalisations we rely on are declared explicitly here.
   ===================================================================== */

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;
  /* Native smooth scroll only. No smooth-scroll library is loaded: with two
     ScrollTrigger pins, a fixed header, a fixed rail and a fixed badge on
     this page, a hijacked scroll is a bigger risk than the polish is worth. */
  scroll-behavior: smooth;
}

/* Set by menu.js while the mobile menu is open, and by loader.js until the
   entrance overlay has left. */
html.is-locked,
html.is-loading {
  overflow: hidden;
}

body {
  margin: 0;
  background-color: var(--ne-ink);
  color: var(--ne-fg);
  font-family: var(--ne-font-body);
  font-size: var(--ne-fs-body);
  line-height: var(--ne-lh-body);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  /* Nothing on this page may cause a sideways scrollbar. Several sections
     bleed past the container on purpose. */
  overflow-x: hidden;
}

h1,
h2,
h3,
h4 {
  font-family: var(--ne-font-display);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--ne-ls-heading);
  line-height: var(--ne-lh-heading);
  margin: 0;
}

p {
  margin: 0;
}

ul,
ol {
  margin: 0;
}

a {
  color: inherit;
}

img,
svg,
video {
  display: block;
  max-width: 100%;
}

button {
  font: inherit;
  color: inherit;
}

input,
select,
textarea {
  font: inherit;
}

/* Figures are used for the bleeding media blocks; they must not carry the
   browser's default margin or the bleed maths goes wrong. */
figure {
  margin: 0;
}

:focus-visible {
  outline: 2px solid var(--ne-amber);
  outline-offset: 3px;
}

/* Tabular figures everywhere a number is doing work — spec rows, counters,
   the slide counter. Stops digits jittering as they animate. */
.ne-tnum {
  font-variant-numeric: tabular-nums;
}

::selection {
  background-color: var(--ne-amber);
  color: var(--ne-ink);
}