:root {
    --base: 1.5rem;
    --lh-copy: 1.5;
    --lh-title: 1.2;
    --measure: 30rem;
}

* {
   margin: 0;
   font-family: inherit;
   box-sizing: border-box;
}

* + * {
   margin-top: 0.75rem;
}

html {
   padding: var(--base);
   line-height: var(--lh-copy);
   font-family: system-ui, -apple-system, BlinkMacSystemFont, ubuntu, roboto, noto, sans-serif;
   font-size: 125%;
   overflow-wrap: break-word;
   word-break: break-word;
}

body {
   max-width: 30rem;
}

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

:is(h1,h2,h3,h4,h5,h6) {
   line-height: var(--lh-title);
   text-wrap: balance;
}

blockquote {
   padding-left: var(--base);
   font-size: 0.875rem;
}

*:focus-visible {
   outline: none;
   box-shadow: 0 0 0 0.2em #fff, 0 0 0 0.4em activeText;
}

.hide {
   position: absolute !important;
   width: 1px !important;
   height: 1px !important;
   padding: 0 !important;
   margin: -1px !important;
   overflow: hidden !important;
   clip: rect(0,0,0,0) !important;
   white-space: nowrap !important;
   border: 0 !important;
}

.hide:focus {
   width: unset !important;
   height: unset !important;
   padding: unset !important;
   margin: unset !important;
   overflow: unset !important;
   clip: unset !important;
   white-space: unset !important;
   border: unset !important;
}

@media (forced-colors: active) {

   *:focus-visible {
      outline: 0.2em solid activeText; 
   }

}

@supports (max-inline-size: 38rem) {


   * + * {
      margin-top: unset;
      margin-block-start: calc(var(--base) / 2);
   }

   li + li {
      margin-block-start: 0;
   }

   html {
      padding-block: 0;
   }

   body {
      max-width: unset;
      max-inline-size: var(--measure);
      margin-inline: auto;
      margin-block-start: 0;
   }

   body > header {
      margin-block-start: 0;
      font-size: 0.875rem;
      border-block-end: 1px dotted grayText;
   }

   body > header * + * {
      margin-block-start: 0;
   }

   nav ul {
      list-style-type: none;
      display: flex;
      flex-wrap: wrap;
      column-gap: 1em;
      padding-left: 0;
      padding-inline-start: 0;
   }

   nav a {
      display: inline-block;
      padding-block: calc(var(--base) / 4);
      text-decoration: none;
      color: canvasText;
   }

   body > footer {
      margin-block-start: calc(var(--base) * 1.5);
      font-size: 0.875rem;
   }

   main header {
      margin-block-end: var(--base);
   }

   main header p {
      font-size: 0.875rem;
   }

   main footer {
      margin-block-start: var(--base);
      font-size: 0.875rem;
   }

   img {
      max-width: unset !important;
      height: unset !important;
      max-inline-size: 100% !important;
      block-size: auto !important;
   }

   main img {
      display: block;
      margin-inline: auto;
   }

   :is(h2,h3,h4,h5,h6) {
      margin-block-start: calc(var(--base) * 1.5);
   }

   h1 {
      font-size: 1.5rem;
   }

   h2 {
      font-size: 1.125rem;
   }

   figcaption {
      font-size: 0.875rem;
      margin-block-start: calc(var(--base) / 4);
   }

   blockquote {
      padding-left: unset;
      padding-inline-start: var(--base);
   }

   figure,
   blockquote,
   main img {
      margin-block: var(--base);
   }

   figure img {
      margin-block: 0;
   }

   .skip-link {
      font-size: 0.875rem;
      background-color: canvasText;
      color: canvas;
   }

   .list {
      list-style-type: none;
      padding-inline-start: 0;
   }

   .list li {
      margin-block: 0.5lh;
   }

   .list a {
      display: block;
   }

   .list time {
      margin-block-start: 0.125lh;
      font-size: 0.75rem;
   }

}


.vid,
.constrain,
.element-video,
.vid iframe,
.vid object,
.vid embed,
.constrain iframe,
.constrain object,
.constrain embed,
.element-video iframe,
.element-video object,
.element-video embed,
gu-atom > div,
gu-atom > div iframe,
gu-atom > div object,
gu-atom > div embed,
.element-atom,
.email-sub__iframe,
.email-sub__iframe + figcaption {
    display: none;
}