/*
Theme Name: Manifest 2
Theme URI: https://www.forkinreview.com
Description: Revision of Manifest 1.1 for Fork In Review. The desktop look matches the original; responsive layout, accessibility and performance improvements are layered on top (see section 2 and the enhancement blocks at the end). Presentation only: it never changes site content.
Version: 2.0.0
Author: Jim Barraud (Manifest 1.1); Harrison Hume (Manifest 2 revision)
Author URI: http://jimbarraud.com
License: Creative Commons Attribution-NonCommercial-ShareAlike 3.0
License URI: https://creativecommons.org/licenses/by-nc-sa/3.0/
Tags: simple, clean, single column
Requires at least: 6.0
Requires PHP: 8.0
Update URI: false
Text Domain: manifest-2

Manifest 1.1 by Jim Barraud, http://jimbarraud.com/manifest/ . Manifest 2 is a derivative work.
The parity rules below are the Manifest 1.1 rules, ported with the colours moved to custom
properties and the heading tags replaced by classes (so heading order can be correct).
*/

/* 1. Design tokens: parity values (Manifest 1.1)
-------------------------------------------------------------------- */

:root{
  --fir-link: #9C8A6A;
  --fir-link-hover: #3E372B;
  --fir-muted: #999;            /* dates, tagline, post meta, sub nav */
  --fir-nav-text: #999;
  --fir-quote: #7D7D7D;
  --fir-btn-bg: #8EA7AA;
  --fir-btn-hover: #697D80;

  /* Layout and type (Manifest 1.1 values). Iteration 2 below overrides these. */
  --fir-column: 500px;
  --fir-font-body: palatino, "times new roman", serif;
  --fir-font-heading: constantia, palatino, "times new roman";
  --fir-font-meta: "helvetica neue", helvetica, arial;
  --fir-font-ui: helvetica, arial, sans-serif;
  --fir-text-size: 1.4em;
  --fir-text-line: 1.5em;
  --fir-small: 1.2em;
  --fir-meta-size: 1.3em;
  --fir-page-title: 2.4em;
  --fir-post-title: 2.3em;
  --fir-footer-size: 1em;
}

/* 2. Enhancement layer A4: contrast. Delete this block to restore strict parity.
-------------------------------------------------------------------- */

:root{
  --fir-link: #7A6A4C;
  --fir-nav-text: #737373;
  --fir-muted: #767676;
  --fir-quote: #6B6B6B;
  --fir-btn-bg: #5F7A7D;
  --fir-btn-hover: #4B6366;
}

/* 2b. Iteration 2: open typefaces, slightly larger text, slightly wider column.
   Fonts are self-hosted (fonts/), SIL Open Font License 1.1: Source Serif 4 and Source Sans 3.
   Delete this block (and the picture rules at the end of the file) to restore Manifest 1.1's
   Palatino 14px / 500px column.
-------------------------------------------------------------------- */

@font-face{
  font-family: "Source Serif 4 Variable";
  font-style: normal;
  font-weight: 200 900;
  font-display: swap;
  src: url(fonts/source-serif-4-latin-wght-normal.woff2) format("woff2");
  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+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family: "Source Serif 4 Variable";
  font-style: normal;
  font-weight: 200 900;
  font-display: swap;
  src: url(fonts/source-serif-4-latin-ext-wght-normal.woff2) format("woff2");
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face{
  font-family: "Source Serif 4 Variable";
  font-style: italic;
  font-weight: 200 900;
  font-display: swap;
  src: url(fonts/source-serif-4-latin-wght-italic.woff2) format("woff2");
  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+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family: "Source Serif 4 Variable";
  font-style: italic;
  font-weight: 200 900;
  font-display: swap;
  src: url(fonts/source-serif-4-latin-ext-wght-italic.woff2) format("woff2");
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face{
  font-family: "Source Sans 3 Variable";
  font-style: normal;
  font-weight: 200 900;
  font-display: swap;
  src: url(fonts/source-sans-3-latin-wght-normal.woff2) format("woff2");
  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+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family: "Source Sans 3 Variable";
  font-style: normal;
  font-weight: 200 900;
  font-display: swap;
  src: url(fonts/source-sans-3-latin-ext-wght-normal.woff2) format("woff2");
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

:root{
  --fir-column: 560px;            /* was 500px */
  --fir-font-body: "Source Serif 4 Variable", Palatino, "Palatino Linotype", Georgia, "Times New Roman", serif;
  --fir-font-heading: "Source Serif 4 Variable", Palatino, "Palatino Linotype", Georgia, "Times New Roman", serif;
  --fir-font-meta: "Source Sans 3 Variable", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --fir-font-ui: "Source Sans 3 Variable", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --fir-text-size: 1.6em;         /* body copy 14px -> 16px */
  --fir-text-line: 1.65em;        /* line height 21px -> 26.4px */
  --fir-small: 1.3em;             /* dates, tagline: 12px -> 13px */
  --fir-meta-size: 1.4em;         /* Published / Filed Under: 13px -> 14px */
  --fir-page-title: 2.6em;        /* 24px -> 26px */
  --fir-post-title: 2.6em;        /* 23px -> 26px */
  --fir-footer-size: 1.3em;       /* credit line was 10px */
}

/* 3. Reset (Manifest 1.1)
-------------------------------------------------------------------- */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, time, article, nav, header, footer, main,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
article, nav, header, footer, main { display: block; }
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
:focus {
	outline: 0;
}
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* Doctype compensation: Manifest 1.1 used XHTML 1.0 Transitional ("almost standards" mode),
   where images do not leave the baseline gap. Verify with the visual regression check. */
img{
  vertical-align: bottom;
}

/* Global Styles
-------------------------------------------------------------------*/

body{
  background: #fff;
  font: 62.5% var(--fir-font-body);
  color: #333;
}
strong{
  font-weight: bold;
}

/* Links */

a:link,
a:visited{
  color: var(--fir-link);
  text-decoration: none;
}
a:hover,
a:active{
  color: var(--fir-link-hover);
  text-decoration: underline;
}

/* Headers
   Manifest 1.1 styled the tag names (h1 site title, h2 page title, h3 post title, h5 date).
   Manifest 2 uses the correct heading levels, so the same looks hang off classes:
   .siteTitle (was h1), .pageTitle (was h2), .postTitle (was h3), .listDate (was h5). */

.siteTitle{
  margin: 10px 0 20px;
  font-size: 3.3em;
  font-weight: normal;
  text-transform: uppercase;
  letter-spacing: .05em;
  word-spacing: .2em;
}
.siteTitle a:link,
.siteTitle a:visited{
  color: #000;
}
.siteTitle a:hover,
.siteTitle a:active{
  color: #000;
  text-decoration: underline;
}
h2,
.pageTitle{
  margin-top: 30px;
  margin-bottom: 40px;
  font-size: var(--fir-page-title);
  font-weight: normal;
  color: #000;
  text-transform: uppercase;
}
h3,
.postTitle{
  margin-top: 0;
  margin-bottom: 5px;
  font-size: var(--fir-post-title);
  font-weight: normal;
  color: #333;
  text-transform: none;
}
.postTitle a:link,
.postTitle a:visited{
  color: #333;
}
.postTitle a:hover,
.postTitle a:active{
  text-decoration: underline;
}
h4{
  margin-bottom: 10px;
  font-size: 1.5em;
  font-weight: bold;
  color: #333;
}
h2.subHeading{
  margin-top: 0;
  margin-bottom: 10px;
  font-size: 1.5em;
  font-weight: bold;
  color: #333;
  text-transform: none;
}
.listDate{
  position: relative;
  top: -35px;
  margin-bottom: 50px;
  font-family: var(--fir-font-meta);
  font-size: var(--fir-small);
  color: var(--fir-muted);
  font-weight: normal;
  border-bottom: 1px solid #ddd;
  background: #fff;
}
.listDate time{
  display: inline-block;
  position: relative;
  margin: 0 auto;
  padding: 0 8px;
  background: #fff;
  top: 8px;
}

/* Form Elements */

input[type=search]{
  border: 1px solid #ddd;
  padding: 3px;
  font-family: var(--fir-font-ui);
  font-size: 12px;
  color: #666;
}
input:focus{
  border-color: #999;
  color: #333;
}
input[type=submit]{
  padding: 3px 10px;
  color: #fff;
  font-weight: bold;
  background-color: var(--fir-btn-bg);
  background-image: url(images/button.png);
  background-repeat: repeat-x;
  background-position: left top;
  border-width: 1px;
  border-style: solid;
  border-color: #999;
  border-radius: 10px;
  -webkit-transition: border-color .2s ease-in, background-color .2s ease-in;
  cursor: pointer;
}
input[type=submit]:hover,
input[type=submit]:focus{
  background-color: var(--fir-btn-hover);
  border-color: #666;
}

/* Structure */

#siteWrapper{
  margin: 0 auto;
  padding-top: 15px;
  width: 100%;
  max-width: var(--fir-column);
  box-sizing: border-box;
  text-align: center;
  position: relative;
}
#siteDescription{
  font-size: var(--fir-small);
  margin: 10px auto 60px;
  width: 400px;
  max-width: 100%;
  padding: 11px 0 13px;
  color: var(--fir-muted);
  font-style: italic;
}

/* Main Navigation
-------------------------------------------------------------------*/

#mainNav{
  margin-top: 10px;
  padding: 5px;
  background: #FBFBFB;
  border-top: 1px solid #EAEAEA;
  border-bottom: 1px solid #EAEAEA;
}
#mainNav ul{
  margin: 0 auto;
  width: 45em;
  max-width: 100%;
  text-align: center;
}
#mainNav li{
  display: inline;
  margin-right: 20px;
  font-size: 1.5em;
  text-transform: uppercase;
}
#mainNav li:last-child{
  margin-right: 0;
}
#mainNav a:link,
#mainNav a:visited{
  color: var(--fir-nav-text);
  white-space: nowrap;
}
#mainNav a:hover,
#mainNav a:active{
  text-decoration: underline;
  color: #2E301C;
}
#mainNav .current_page_parent a:link,
#mainNav .current_page_parent a:visited,
#mainNav .current_page_item a:link,
#mainNav .current_page_item a:visited{
  font-weight: bold;
  color: #2A2D1A;
}
#mainNav .current_page_parent a:hover,
#mainNav .current_page_parent a:active,
#mainNav .current_page_item a:hover,
#mainNav .current_page_item a:active{
  color: #2E301C;
}

/* Sub Navigation
-------------------------------------------------------------------*/

#subNav{
  padding: 5px 3px 3px;
  border-bottom: 1px solid #F4F4F4;
}
#subNav ul{
  margin: 0 auto;
  width: 45em;
  max-width: 100%;
  text-align: center;
}
#subNav li{
  display: inline;
  margin-right: 20px;
  font-size: 1.2em;
  text-transform: uppercase;
}
#subNav li:last-child{
  margin-right: 0;
}
#subNav a:link,
#subNav a:visited{
  color: var(--fir-muted);
  white-space: nowrap;
}
#subNav a:hover,
#subNav a:active{
  text-decoration: underline;
  color: #2E301C;
}
#subNav .current_page_parent a:link,
#subNav .current_page_parent a:visited,
#subNav .current_page_item a:link,
#subNav .current_page_item a:visited{
  font-weight: bold;
  color: #2A2D1A;
}
#subNav .current_page_parent a:hover,
#subNav .current_page_parent a:active,
#subNav .current_page_item a:hover,
#subNav .current_page_item a:active{
  color: #2E301C;
}

/* Main Content Body
-------------------------------------------------------------------*/

#coreContent{
  float: left;
  width: var(--fir-column);
  max-width: 100%;
  margin-top: 8px;
}

/* Posts
-------------------------------------------------------------------*/

.postContent{
  position: relative;
}
.listDate ~ .postContent{
  margin-top: -30px;
}
#coreContent p,
#coreContent li,
#coreContent dd{
  margin-bottom: 1.7em;
  font-size: var(--fir-text-size);
  line-height: var(--fir-text-line);
  color: #333;
  text-align: justify;
}
#coreContent p{
  text-align: justify;
}
#coreContent li{
  list-style: square;
  margin-left: 17px;
}
#coreContent dt{
  font-size: 1.3em;
  color: #333;
}
.entry-content{
  margin-top: 24px;
  text-align: left;
}
.entry-content a:link,
.entry-content a:visited{
  text-decoration: underline;
}
.hentry{
  position: relative;
  padding-bottom: 37px;
  border-bottom: 1px dotted #ddd;
  margin-bottom: 30px;
}
#coreContent .postMeta{
  margin: 40px auto 0;
  font-size: var(--fir-meta-size);
  color: var(--fir-muted);
}
#coreContent .postMeta div{
  margin-bottom: 5px;
}
#coreContent .postMeta a:link,
#coreContent .postMeta a:visited{
  color: #666;
}
#coreContent .postMeta a:hover,
#coreContent .postMeta a:active{
  color: #666;
}
#coreContent .postMeta span{
  text-transform: uppercase;
}
.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6{
  color: #333;
  border: none;
  padding: 0;
  font-family: var(--fir-font-heading);
  font-weight: bold;
  margin: 0 0 5px;
  font-style: normal;
  position: static;
  text-transform: none;
}
.entry-content h1{
  font-size: 2em;
  letter-spacing: 0;
}
.entry-content h2{
  font-size: 1.8em;
}
.entry-content h3{
  font-size: 1.6em;
}
.entry-content h4,
.entry-content h5,
.entry-content h6{
  font-size: 1.4em;
}
.entry-content strong{
  color: #000;
}
.entry-content pre{
  color: #666;
  font-size: 1.5em;
  line-height: 18px;
  margin-bottom: 15px;
}
.entry-content ul,
.entry-content ol{
  margin: 0 0 20px 15px;
}
.entry-content ol li{
  list-style-type: decimal !important;
}
.entry-content li{
  margin-bottom: 5px !important;
}
.entry-content blockquote{
  font-size: 1.4em;
  font-style: italic;
  line-height: 1.5em;
  color: var(--fir-quote);
  margin: 0 20px 20px;
  padding-left: 10px;
  border-left: 3px solid #ccc;
}
#coreContent .entry-content blockquote p{
  font-size: 1.1em;
  line-height: 1.3em;
  color: var(--fir-quote);
}
.entry-content .alignleft{
  float: left;
  margin: 4px 10px 10px 0;
}
.entry-content .alignright{
  float: right;
  margin: 4px 0 10px 10px;
}
.entry-content .wp-caption.alignnone{
  margin-bottom: 15px;
}
#coreContent .entry-content p.wp-caption-text{
  font-size: 1.1em;
  font-style: italic;
  color: #666;
  margin-bottom: 0;
}
.hentry img{
  margin: 0 auto;
  border: 1px solid #ccc;
  max-width: 100%;
  height: auto;
}

/* Single Post Page
-------------------------------------------------------------------*/

.single .postTitle,
.single h3{
  margin-top: 30px;
  margin-bottom: 5px;
}
.single.hentry{
  border-top: 1px solid #efefef;
  margin-top: -50px;
  border-bottom: none;
  padding-bottom: 0;
}
#coreContent .single .postMeta{
  margin: 20px 0 0;
  padding-top: 0;
  padding-bottom: 17px;
  text-align: left;
}

/* Links Page
-------------------------------------------------------------------- */

#coreContent .entry-content #linkList{
  margin-left: 0;
}
#coreContent .entry-content #linkList li{
  list-style-type: none;
  margin-left: 0;
}
#coreContent .entry-content #linkList li li{
  font-size: .9em;
  list-style-type: square;
  margin-bottom: 20px !important;
  margin-left: 15px;
}
#coreContent .entry-content #linkList ul{
  margin: 10px 0 40px;
}

/* Image Gallery
-------------------------------------------------------------------- */

#galleryNav{
  background: url(images/galleryNav_bg.png) no-repeat;
  width: 258px;
  height: 90px;
  margin: 20px auto 0;
}
#galleryNav_controls{
  width: 140px;
  margin: 0 auto;
  padding: 12px 0;
  position: relative;
}
#galleryNav_prev,
#galleryNav_next{
  position: absolute;
  width: 60px;
  height: 60px;
  -moz-box-shadow: 0 0 5px #999;
  -webkit-box-shadow: 0 0 5px #999;
}
#galleryNav_prev{
  left: 0;
  margin-right: 10px;
}
#galleryNav_next{
  right: 0;
}
.galleryNav_prevArrow,
.galleryNav_nextArrow{
  position: absolute;
  top: 0;
  left: 0;
  width: 60px;
  height: 60px;
  cursor: pointer;
}
.galleryNav_prevArrow{
  background: url(images/galleryNav_prev.png) no-repeat 50% 50%;
}
.galleryNav_nextArrow{
  background: url(images/galleryNav_next.png) no-repeat 50% 50%;
}
.galleryNav_return{
  display: inline-block;
  margin-top: 5px;
  font-size: 1.3em;
}
.galleryImage{
  text-align: center;
}

/* Paging Navigation
-------------------------------------------------------------------- */

.pageNav{
  margin-top: 40px;
}
.pageNav a:link,
.pageNav a:visited {
  font-size: 1.5em;
}
.pageNav .prev,
.pageNav .next{
  display: block;
}
.pageNav .prev{
  float: left;
}
.pageNav .next{
  float: right;
}

/* Archives
-------------------------------------------------------------------- */

#archives{
  margin-top: -50px;
}
.archiveTitle{
  margin: -30px 0 70px;
  color: #666;
}
.archiveTitle strong{
  color: #000;
}
#archives h2,
#coreContent li h2{
  font-family: var(--fir-font-heading);
  font-size: 1.6em;
  text-align: left;
  color: #333;
  font-weight: normal;
  text-transform: uppercase;
  margin: 0 0 5px;
  border-bottom: 1px solid #ccc;
}
#coreContent li h2{
  font-size: 1.2em;
}
#archives label{
  font-family: var(--fir-font-heading);
  font-size: 1.4em;
  color: #333;
  font-weight: normal;
  text-transform: uppercase;
}
#archives #date{
  float: left;
  width: 235px;
}
#archives #cattags{
  float: left;
  width: 235px;
  margin-left: 30px;
}
#archives ul{
  margin: 5px 0 60px;
  text-align: left;
}
#archives ul li{
  display: inline-block;
  margin: 0 5px 5px 0;
  color: var(--fir-muted);
  font-size: 1.3em;
  line-height: 1.5em;
  white-space: nowrap;
}
#archives li a{
  margin-right: 5px;
}
#archives #date ul li{
  display: block;
  list-style-type: none;
  border-bottom: 1px solid #efefef;
  margin: 0;
}
#archives #date ul li a{
  display: inline-block;
  min-width: 210px;
}
.tagArchives li{
  float: left;
  margin-right: 10px;
}
.categories li{
  margin-bottom: 5px;
  font-size: 2.3em;
}

/* Recent Posts (Archive page and 404)
-------------------------------------------------------------------- */

ul#recentPosts li{
  list-style: none;
  margin: 0;
  padding: 5px 0;
  border-bottom: 1px solid #efefef;
  display: block;
}
#recentPosts a{
  float: left;
  font-size: 1.1em;
}
#recentPosts .postDate{
  float: right;
}

/* Search Results
-------------------------------------------------------------------- */

#coreContent.searchresults{
  margin-top: -35px;
}
.searchresults .postMeta{
  text-align: left;
}
.searchpanel{
  border-top: 1px solid #efefef;
  border-bottom: 1px solid #efefef;
  margin: 0 0 40px;
  padding: 10px 0;
}
.searchpanel input[type=search]{
  width: 250px;
  max-width: 100%;
  font-size: 1.7em;
}
.searchpanel input[type=submit]{
  font-weight: normal;
  border-radius: 12px;
  background-position: left 5px;
  font-size: 1.4em;
}

/* Footer
-------------------------------------------------------------------- */

#footer{
  width: var(--fir-column);
  max-width: 100%;
  margin: 40px auto 0;
  padding: 20px 0 35px 0;
  border-top: 4px double #ccc;
  color: #666;
  text-align: center;
  clear: both;
}
.footerContent{
  width: var(--fir-column);
  max-width: 100%;
  margin: 20px auto 0;
  clear: left;
}
#footer p{
  font-size: var(--fir-footer-size);
  line-height: 1.4em;
}
#footer #search{
  margin: 15px 0 30px;
}
#footer .footerHeading{
  position: relative;
  top: 0;
  margin: 0 0 8px;
  font-family: var(--fir-font-heading);
  font-size: 1.3em;
  color: #666;
  font-weight: normal;
  text-transform: uppercase;
  border-bottom: none;
}
#footer .elsewhere{
  margin-bottom: 30px;
}
#footer .elsewhere li{
  display: inline;
  padding: 0 8px 0 0;
  margin: 0 5px 0 0;
  border-right: 1px dotted #ccc;
  font-size: var(--fir-small);
}
#footer .elsewhere li:last-child{
  padding: 0;
  margin: 0;
  border-right: none;
}
#footer #search input[type=search]{
  font-size: 1.4em;
  border-color: #ccc;
}
#footer #search input[type=search]:focus{
  border-color: #999;
}

/* Admin Edits
-------------------------------------------------------------------- */

a.post-edit-link:link,
a.post-edit-link:visited{
  color: #f00;
  font-weight: bold;
  text-decoration: underline;
}

/* Self Clearing Floats
-------------------------------------------------------------------- */

#siteWrapper:after,
.post:after,
#footer .elsewhere:after,
#mainNav:after,
#mainNav ul:after,
#subNav ul:after,
#archives ul:after,
#coreContent .postMeta:after,
#recentPosts li:after,
#galleryNav:after,
#galleryNav_controls:after{
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}

/* =====================================================================
   ENHANCEMENT LAYER (each block is independent; delete a block to revert it)
   ===================================================================== */

/* A3: links inside the footer credit line must not rely on colour alone */
#footer p a:link,
#footer p a:visited{
  text-decoration: underline;
}

/* A3: keyboard focus, skip link, screen-reader text */
:focus-visible{
  outline: 2px solid #3E372B;
  outline-offset: 2px;
}
.screen-reader-text{
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}
.skip-link{
  position: absolute;
  left: -9999px;
  top: 0;
}
.skip-link:focus{
  left: 8px;
  top: 8px;
  z-index: 10;
  padding: 8px 12px;
  background: #fff;
}

/* A1: keep long unbroken URLs and long archive titles inside the 500px column. Manifest 1.1
   let them spill out of the column and forced horizontal scrolling at every width. */
.entry-content,
.entry-content a{
  overflow-wrap: anywhere;
}
#archives #recentPosts li a,
#recentPosts li a{
  white-space: normal;
  max-width: 75%;
}

/* A1/A2: responsive. The column keeps its full width above 600px and is fluid below. */
@media (max-width: 599px){
  #siteWrapper{
    padding-left: 16px;
    padding-right: 16px;
  }
  #coreContent{
    float: none;
    width: auto;
  }
  #coreContent p,
  #coreContent li,
  #coreContent dd{
    font-size: 1.6em;
  }
  #mainNav li,
  #subNav li{
    margin-right: 10px;
  }
  #mainNav a,
  #subNav a,
  .pageNav a,
  #archives li a{
    display: inline-block;
    min-height: 44px;
    line-height: 44px;
  }
  input[type=submit]{
    min-height: 44px;
  }
  #archives #date,
  #archives #cattags{
    float: none;
    width: auto;
    margin-left: 0;
  }
}
@media (max-width: 479px){
  .entry-content .alignleft,
  .entry-content .alignright{
    float: none;
    display: block;
    margin: 4px auto 10px;
  }
  #coreContent p{
    text-align: left;
  }
}

/* A14: print */
@media print{
  #mainNav,
  #subNav,
  #footer .elsewhere,
  #footer #search,
  .pageNav,
  .skip-link{
    display: none;
  }
  .entry-content a[href]:after{
    content: " (" attr(href) ")";
  }
}

/* Iteration 2: pictures in articles.
   Classes are added at render time by functions.php (fir-cover, fir-photo, fir-block, fir-icon);
   widths are set inline there and never exceed the largest file held for the picture.
   Delete this block to go back to Manifest 1.1's bordered floats. */
.entry-content img.fir-cover,
.entry-content img.fir-photo,
.entry-content img.fir-block{
  height: auto;
  max-width: 100%;
  border: 0;
  border-radius: 2px;
  background: #f4f2ee;
  box-shadow: 0 1px 2px rgba(0,0,0,.2), 0 6px 18px rgba(0,0,0,.12);
}
.entry-content img.fir-cover,
.entry-content img.fir-photo{
  float: right;
  margin: .35em 0 1.1em 1.75em;
}
.entry-content img.fir-block{
  display: block;
  float: none;
  margin: 1.4em auto 1.6em;
}
.entry-content img.fir-icon{
  display: inline;
  float: none;
  margin: 0 .25em;
  border: 0;
  vertical-align: -.1em;
}
.entry-content a img.fir-cover:hover,
.entry-content a img.fir-photo:hover,
.entry-content a img.fir-block:hover{
  box-shadow: 0 1px 2px rgba(0,0,0,.25), 0 8px 22px rgba(0,0,0,.18);
}
@media (max-width: 479px){
  .entry-content img.fir-cover,
  .entry-content img.fir-photo{
    float: none;
    display: block;
    margin: 1.2em auto 1.4em;
  }
}
@media print{
  .entry-content img.fir-cover,
  .entry-content img.fir-photo,
  .entry-content img.fir-block{
    box-shadow: none;
    border: 1px solid #ccc;
  }
}

/* Iteration 2: justified text beside a floated picture is narrow; let it hyphenate. */
#coreContent .entry-content p{
  -webkit-hyphens: auto;
  hyphens: auto;
}

/* Iteration 4: uniform spacing, fluid layout, modern CSS.
   One spacing scale (8px steps) replaces the mix of 5/10/15/20/30/37/40/50/60px values and the
   negative-margin and position:relative tricks Manifest 1.1 used. Delete this block to go back to
   the Manifest 1.1 spacing. */
:root{
  --s-1: 8px;
  --s-2: 16px;
  --s-3: 24px;
  --s-4: 32px;
  --s-5: 48px;
  color-scheme: light;
}

/* Frame: fluid column with a 16px side gutter, no breakpoint needed. */
#siteWrapper{
  width: min(var(--fir-column), 100% - 2 * var(--s-2));
  max-width: none;
  padding: var(--s-3) 0 0;
}
#footer{
  width: min(var(--fir-column), 100% - 2 * var(--s-2));
  max-width: none;
  margin: var(--s-5) auto 0;
  padding: var(--s-4) 0 var(--s-5);
}
.footerContent{
  width: auto;
  max-width: none;
  margin: var(--s-3) 0 0;
}

/* Header stack: title, nav, tagline, content, each one step apart. */
.siteTitle{
  margin: 0 0 var(--s-2);
  font-size: clamp(2.4em, 7vw, 3.3em);
  text-wrap: balance;
}
#mainNav{
  margin: 0;
  padding: var(--s-1) var(--s-2);
}
#mainNav ul,
#subNav ul{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0 var(--s-3);
  width: auto;
  max-width: none;
}
#mainNav li,
#subNav li{
  margin: 0;
}
#subNav{
  padding: var(--s-1) var(--s-2);
}
#siteDescription{
  width: auto;
  max-width: 30em;
  margin: var(--s-2) auto var(--s-3);
  padding: 0;
  text-wrap: balance;
}

/* Content area: a hairline, then a 32px gap, then the page. No negative margins. */
main{
  border-top: 1px solid #efefef;
  padding-top: var(--s-4);
}
#coreContent{
  float: none;
  width: 100%;
  max-width: none;
  margin-top: 0;
}
#coreContent.searchresults,
#archives{
  margin-top: 0;
}
.single.hentry{
  border-top: 0;
  margin-top: 0;
  margin-bottom: var(--s-4);
  padding-bottom: 0;
}
.hentry{
  padding-bottom: var(--s-4);
  margin-bottom: var(--s-4);
}

/* Titles and meta. */
h2,
.pageTitle{
  margin: 0 0 var(--s-4);
  font-size: clamp(2.2em, 5vw, var(--fir-page-title));
  text-wrap: balance;
}
h3,
.postTitle{
  margin: 0 0 var(--s-1);
  text-wrap: balance;
}
.single .postTitle,
.single h3{
  margin: 0 0 var(--s-1);
}
h2.subHeading{
  margin: 0 0 var(--s-2);
}
.archiveTitle{
  margin: 0 0 var(--s-4);
}
.entry-content{
  margin-top: var(--s-3);
}
#coreContent p,
#coreContent li,
#coreContent dd{
  margin-bottom: var(--s-3);
  text-wrap: pretty;
}
.entry-content ul,
.entry-content ol{
  margin: 0 0 var(--s-3) 1.25em;
}
#coreContent .postMeta{
  margin: var(--s-3) 0 0;
}
#coreContent .single .postMeta{
  margin: var(--s-3) 0 0;
  padding-bottom: 0;
}

/* Date on a rule, in lists: flexbox instead of position:relative and negative margins. */
.listDate{
  position: static;
  top: auto;
  display: flex;
  align-items: center;
  gap: var(--s-2);
  margin: 0 0 var(--s-3);
  border: 0;
  background: none;
}
.listDate::before,
.listDate::after{
  content: "";
  flex: 1;
  border-top: 1px solid #ddd;
}
.listDate time{
  position: static;
  top: auto;
  padding: 0;
  background: none;
}
.listDate ~ .postContent{
  margin-top: 0;
}

/* Previous / next. */
.pageNav{
  display: flex;
  justify-content: space-between;
  gap: var(--s-2);
  margin-top: var(--s-4);
}
.pageNav .prev,
.pageNav .next{
  float: none;
}

/* Archive page: two columns for months and categories, one on small screens. */
#archives{
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: var(--s-4);
}
#archives > h1,
#archives > h2,
#archives > #recentPosts{
  grid-column: 1 / -1;
}
#archives #date,
#archives #cattags{
  float: none;
  width: auto;
  margin-left: 0;
}
#archives h2,
#coreContent li h2{
  margin: var(--s-4) 0 var(--s-1);
}
#archives > h1 + h2{
  margin-top: 0;
}
#archives ul{
  margin: 0 0 var(--s-3);
}
@media (max-width: 599px){
  #archives{
    display: block;
  }
}

/* Search. */
.searchpanel{
  margin: 0 0 var(--s-4);
  padding: var(--s-2) 0;
}

/* Footer. */
#footer p{
  margin: 0;
}
#footer #search{
  margin: 0 0 var(--s-3);
}
#footer .footerHeading{
  margin: 0 0 var(--s-1);
}
#footer .elsewhere{
  margin-bottom: var(--s-3);
}

/* Form controls: consistent look for the search box on every browser. */
input[type=search]{
  -webkit-appearance: none;
  appearance: none;
  border-radius: 0;
}
input[type=search]::-webkit-search-cancel-button{
  -webkit-appearance: none;
}

@media (prefers-reduced-motion: reduce){
  *{
    transition: none !important;
    scroll-behavior: auto !important;
  }
}

/* Archive page: lists are ragged-right (justified single lines of titles looked uneven),
   and the optional Tags block spans both columns. */
#archives li,
#recentPosts li a{
  text-align: left;
}
#archives > #tags{
  grid-column: 1 / -1;
}
#archives #cattags ul.categories li{
  font-size: 1.3em;
}
#archives #cattags ul li{
  display: block;
  list-style-type: none;
  margin: 0;
  border-bottom: 1px solid #efefef;
}
#archives #cattags ul li a{
  display: inline-block;
  min-width: 210px;
}

/* Keyboard focus on a linked picture: a floated picture takes its link's box to 0x0, so the
   link's own focus ring would be drawn around nothing. Ring the picture instead. */
.entry-content a:focus-visible > img{
  outline: 2px solid #3E372B;
  outline-offset: 3px;
}