/* =============================================
   BASE LAYER: stands in for GeneratePress
   ---------------------------------------------
   all.css was written against the WordPress theme GeneratePress 3.6.1
   and WordPress core's own styles, and it relies on them. This file
   reproduces the parts the live pages actually receive, so all.css can
   ship unchanged (design Q15). It loads BEFORE all.css, as the theme's
   stylesheet did.

   Sources, all read from the live /blog/ page on 30 Sep 2026:
     GP   GeneratePress 3.6.1 assets/css/main.css
     DYN  GeneratePress's generated inline CSS (generate-style-inline-css),
          which carries the Customizer values
     WP   WordPress core inline styles (wp-block-library, global-styles)

   The live body carries the classes "one-container no-sidebar". Rules
   that GP scopes to those classes are written here without them, since
   every page on this site had them.

   Folding this layer into all.css and deleting the GeneratePress-era
   rules is its own change after the Hub (design Q15, "the GeneratePress
   CSS prune"). Until then, change nothing here without a screenshot diff.
   ============================================= */


/* -- Reset (GP) -- */
html, body, p, ol, ul, li, dl, dt, dd, blockquote, figure, fieldset, legend,
textarea, pre, iframe, hr, h1, h2, h3, h4, h5, h6 {
  margin: 0;
  padding: 0;
  border: 0;
}

html {
  font-family: sans-serif;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

main { display: block; }

progress { vertical-align: baseline; }

/* Without these two, every padded box measures about 18px taller than
   live: the 60px pill nav renders at 78px. */
html { box-sizing: border-box; }
*, *::before, *::after { box-sizing: inherit; }

button, input, optgroup, select, textarea {
  font-family: inherit;
  font-size: 100%;
  margin: 0;
}

[type="search"] { -webkit-appearance: textfield; outline-offset: -2px; }
[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }
::-moz-focus-inner { border-style: none; padding: 0; }
:-moz-focusring { outline: 1px dotted ButtonText; }

/* WP: the body margin, then the block library's figure margin. GP's
   figure rule below is more specific, so the net figure margin is zero,
   as it is live. Both are kept so the cascade matches. */
:where(body) { margin: 0; }
body { padding: 0; }
:where(figure) { margin: 0 0 1em; }


/* -- Elements (GP) -- */
body, button, input, select, textarea {
  font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  font-weight: normal;
  text-transform: none;
  font-size: 17px;
  line-height: 1.5;
}

p { margin-bottom: 1.5em; }

h1, h2, h3, h4, h5, h6 {
  font-family: inherit;
  font-size: 100%;
  font-style: inherit;
  font-weight: inherit;
}

pre {
  background: rgba(0, 0, 0, 0.05);
  font-family: inherit;
  font-size: inherit;
  line-height: normal;
  margin-bottom: 1.5em;
  padding: 20px;
  overflow: auto;
  max-width: 100%;
}

blockquote {
  border-left: 5px solid rgba(0, 0, 0, 0.05);
  padding: 20px;
  font-size: 1.2em;
  font-style: italic;
  margin: 0 0 1.5em;
  position: relative;
}

blockquote p:last-child { margin: 0; }

table, th, td { border: 1px solid rgba(0, 0, 0, 0.1); }

table {
  border-collapse: separate;
  border-spacing: 0;
  border-width: 1px 0 0 1px;
  margin: 0 0 1.5em;
  width: 100%;
}

th, td { padding: 8px; }
th { border-width: 0 1px 1px 0; font-weight: bold; }
td { border-width: 0 1px 1px 0; }

hr {
  background-color: rgba(0, 0, 0, 0.1);
  border: 0;
  height: 1px;
  margin-bottom: 40px;
  margin-top: 40px;
}

fieldset { padding: 0; border: 0; min-width: inherit; }
fieldset legend { padding: 0; margin-bottom: 1.5em; }

h1 { font-size: 42px; margin-bottom: 20px; line-height: 1.2em; font-weight: normal; text-transform: none; }
h2 { font-size: 35px; margin-bottom: 20px; line-height: 1.2em; font-weight: normal; text-transform: none; }
h3 { font-size: 29px; margin-bottom: 20px; line-height: 1.2em; font-weight: normal; text-transform: none; }
h4 { font-size: 24px; }
h5 { font-size: 20px; }
h4, h5, h6 { margin-bottom: 20px; }

ul, ol { margin: 0 0 1.5em 3em; }
ul { list-style: disc; }
ol { list-style: decimal; }
li > ul, li > ol { margin-bottom: 0; margin-left: 1.5em; }

dt { font-weight: bold; }
dd { margin: 0 1.5em 1.5em; }
b, strong { font-weight: bold; }
dfn, cite, em, i { font-style: italic; }
address { margin: 0 0 1.5em; }

code, kbd, tt, var {
  font: 15px Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
}

abbr, acronym { border-bottom: 1px dotted #666; cursor: help; }
mark, ins { text-decoration: none; }

sup, sub {
  font-size: 75%;
  height: 0;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
sup { bottom: 1ex; }
sub { top: .5ex; }
small { font-size: 75%; }
big { font-size: 125%; }

figure { margin: 0; }

img { height: auto; max-width: 100%; }


/* -- Forms (GP, colours from DYN) -- */
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
  background: #55555e;
  color: #fff;
  border: 1px solid transparent;
  cursor: pointer;
  -webkit-appearance: button;
  padding: 10px 20px;
}

button:hover, button:focus,
input[type="button"]:hover, input[type="button"]:focus,
input[type="reset"]:hover, input[type="reset"]:focus,
input[type="submit"]:hover, input[type="submit"]:focus {
  color: #fff;
  background-color: #3f4047;
}

input[type="text"], input[type="email"], input[type="url"], input[type="password"],
input[type="search"], input[type="tel"], input[type="number"], textarea, select {
  border: 1px solid;
  border-radius: 0;
  padding: 10px 15px;
  max-width: 100%;
  color: #ffffff;
  background-color: #f7f8f9;
  border-color: #f0f0f0;
}

textarea { width: 100%; }


/* -- Links (GP, colours from DYN) --
   The live Customizer sets the "contrast" colour to white, so an
   unstyled link turns white on hover. all.css overrides every link on
   the current pages; this is here so a new one behaves as it did. */
a, button, input {
  transition: color 0.1s ease-in-out, background-color 0.1s ease-in-out;
}

a { color: #1e73be; text-decoration: underline; }
a:hover, a:focus, a:active { color: #ffffff; }


/* -- Accessibility (GP, then WP) -- */
.screen-reader-text {
  border: 0;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute !important;
  width: 1px;
  word-wrap: normal !important;
  word-break: normal !important;
}


/* -- Page colours (DYN) --
   all.css sets the body colours itself; these only show where it does
   not. The white page background is the .site wrapper's: on the live
   pages it covers the body, including the gradient all.css gives
   body.page-blog. */
body { background-color: #f7f8f9; color: #ffffff; }


/* -- Content layout (GP, widths and padding from DYN) --
   The wrapper chain the layout prints, as GeneratePress printed it:
     .site.grid-container.container
       .site-content
         .content-area
           main.site-main
             article
               .inside-article
                 .entry-content   (nav, page body, footer)
   all.css frees most of these per page scope. What it does not touch is
   the .site-content padding: 40px, or 30px at 768px and below. Section 7
   of all.css cancels that gutter with -30px on the phone nav, so it has
   to stay. */
.grid-container {
  margin-left: auto;
  margin-right: auto;
  max-width: 1920px;
}

.container.grid-container { width: auto; }

.site { background-color: #ffffff; }

.site-content {
  display: flex;
  padding: 40px;
  word-wrap: break-word;
}

.site-content .content-area { width: 100%; }

.site-main > * { margin-bottom: 20px; }
.site-main > *:last-child { margin-bottom: 0; }

/* GP prints a page title header before the content and all.css hides
   it, but the hidden header still makes .entry-content not the first
   child, so GP's 2em top margin applied on every live page. */
.entry-content { margin-top: 2em; }

.entry-content > p:last-child { margin-bottom: 0; }

@media (max-width: 768px) {
  a, body, button, input, select, textarea { transition: all 0s ease-in-out; }

  .site-content {
    flex-direction: column;
    padding: 30px;
  }

  .container .site-content .content-area { width: auto; }
}