/*
 * Base: normalisation and the collapse machinery, in place of all of Bootstrap.
 *
 * The marketing pages loaded bootstrap.min.css — 24.2 KB gzipped, 1,105 rules,
 * 1,548 class selectors — and used exactly one of those classes: `collapse`,
 * on the FAQ accordion. Measured, not guessed: every class Bootstrap defines
 * was compared against every class present in the rendered DOM.
 *
 * Diffing the computed styles of all 722 elements on the home page with
 * Bootstrap on and off showed its whole contribution was this: a box-sizing
 * reset, body line-height and margin, form controls inheriting the page font,
 * images sitting on the middle baseline, and `.collapse`. That is what is
 * here, reproduced from Bootstrap 4's Reboot so nothing shifts by a pixel.
 *
 * bootstrap.min.js still drives the accordion and still expects `.collapse`,
 * `.collapsing` and `.show` to behave exactly as below — so those are copied
 * verbatim rather than reimplemented.
 */

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

html {
    font-family: sans-serif;
    line-height: 1.15;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

article, aside, figcaption, figure, footer, header, hgroup, main, nav, section { display: block; }

body {
    margin: 0;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    text-align: left;
    background-color: #fff;
}

hr { box-sizing: content-box; height: 0; overflow: visible; }

/* Reboot only zeroes the margins; the line-height and weight come from
   Bootstrap's type layer, and leaving them out made every heading on the site
   inherit the body's 1.5 instead of 1.2 — a quarter taller, everywhere. Caught
   by diffing computed styles against the real Bootstrap in the same cascade
   position, which is the only comparison that means anything. */
h1, h2, h3, h4, h5, h6 {
    margin-top: 0;
    margin-bottom: 0.5rem;
    font-weight: 500;
    line-height: 1.2;
}
p { margin-top: 0; margin-bottom: 1rem; }

address { margin-bottom: 1rem; font-style: normal; line-height: inherit; }
dl, ol, ul { margin-top: 0; margin-bottom: 1rem; }
ol ol, ol ul, ul ol, ul ul { margin-bottom: 0; }
blockquote { margin: 0 0 1rem; }
b, strong { font-weight: bolder; }

a { color: #007bff; text-decoration: none; background-color: transparent; }
a:hover { color: #0056b3; text-decoration: underline; }
a:not([href]):not([class]),
a:not([href]):not([class]):hover { color: inherit; text-decoration: none; }

code, kbd, pre, samp { font-family: SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace; font-size: 1em; }
/* Likewise from the code layer: 87.5% and its own colour. */
pre { margin-top: 0; margin-bottom: 1rem; overflow: auto; font-size: 87.5%; color: #212529; }
code { font-size: 87.5%; color: #e83e8c; word-wrap: break-word; }
figure { margin: 0 0 1rem; }

img { vertical-align: middle; border-style: none; }
svg { overflow: hidden; vertical-align: middle; }
table { border-collapse: collapse; }
label { display: inline-block; margin-bottom: 0.5rem; }

button { border-radius: 0; }
button:focus:not(:focus-visible) { outline: 0; }
button, input, optgroup, select, textarea { margin: 0; font-family: inherit; font-size: inherit; line-height: inherit; }
button, input { overflow: visible; }
button, select { text-transform: none; }
select { word-wrap: normal; }

[type='button'], [type='reset'], [type='submit'], button { -webkit-appearance: button; appearance: button; }
[type='button']:not(:disabled), [type='reset']:not(:disabled), [type='submit']:not(:disabled), button:not(:disabled) { cursor: pointer; }
input[type='checkbox'], input[type='radio'] { box-sizing: border-box; padding: 0; }
textarea { overflow: auto; resize: vertical; }
fieldset { min-width: 0; padding: 0; margin: 0; border: 0; }
legend { display: block; width: 100%; max-width: 100%; padding: 0; margin-bottom: 0.5rem; font-size: 1.5rem; line-height: inherit; color: inherit; white-space: normal; }
progress { vertical-align: baseline; }
[type='number']::-webkit-inner-spin-button, [type='number']::-webkit-outer-spin-button { height: auto; }
[type='search'] { outline-offset: -2px; -webkit-appearance: none; appearance: none; }
[type='search']::-webkit-search-decoration { -webkit-appearance: none; }
[hidden] { display: none !important; }

/* .container is the other Bootstrap class still in the markup — /public uses
   it twice to hold its hero and body to a column width. Nothing else defines
   it, so without this those two sections would go full-bleed. Copied from
   Bootstrap 4 exactly, breakpoints and all. */
.container {
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
}

@media (min-width: 576px)  { .container { max-width: 540px; } }
@media (min-width: 768px)  { .container { max-width: 720px; } }
@media (min-width: 992px)  { .container { max-width: 960px; } }
@media (min-width: 1200px) { .container { max-width: 1140px; } }

/* The accordion. bootstrap.min.js toggles these three states and nothing else
   on this site uses them. */
.fade { transition: opacity 0.15s linear; }
.fade:not(.show) { opacity: 0; }

.collapse:not(.show) { display: none; }

.collapsing {
    position: relative;
    height: 0;
    overflow: hidden;
    transition: height 0.35s ease;
}

@media (prefers-reduced-motion: reduce) {
    .fade,
    .collapsing { transition: none; }
}

/* Inline icons (App\Support\Icons). Sized by the text they sit in, coloured
   by it, and never squashed as a flex item — the same contract Font Awesome's
   <i> had, so nothing around them needed changing. */
.ic {
    display: inline-block;
    width: 1em;
    height: 1em;
    vertical-align: -0.125em;
    fill: currentColor;
    flex: none;
}