/*!
Theme Name: Studio@Newfire
Theme URI: https://studio.newfireglobal.com
Author: Jonathan Abbett (riffing on Jack Lenox's Susty theme)
Author URI: https://studio.newfireglobal.com
Description: A WordPress theme for Studio@Newfire.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: studio-at-newfire
Tags:

This theme, like WordPress, is licensed under the GPL.
Studio@Newfire is based on Jack Lenox's Susty theme.
Susty is based on Underscores https://underscores.me/, (C) 2012-2017 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.
Normalizing styles have been helped along thanks to the fine work of Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

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

html {
  -moz-text-size-adjust: none;
  -webkit-text-size-adjust: none;
  text-size-adjust: none;
}

body, h1, h2, h3, h4, p,
figure, blockquote, dl, dd {
  margin-block-end: 0;
}

ul[role='list'],
ol[role='list'] {
  list-style: none;
}

body {
  min-height: 100vh;
  line-height: 1.5;
  margin: 0;
  padding: 0;
}

h1, h2, h3, h4,
button, input, label {
  line-height: 1.1;
}

h1, h2,
h3, h4 {
  text-wrap: balance;
}

a:not([class]) {
  text-decoration-skip-ink: auto;
  color: currentColor;
}

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

input, button,
textarea, select {
  font-family: inherit;
  font-size: inherit;
}

textarea:not([rows]) {
  min-height: 10em;
}

:target {
  scroll-margin-block: 5ex;
}

/*--------------------------------------------------------------
# Typography
--------------------------------------------------------------*/
body,
button,
input,
select,
optgroup,
textarea {
	color: rgb(4, 4, 2);
	font-family: Manrope, sans-serif;
	font-size: calc( 15px + 4 * (100vw / 1500));
	line-height: 1.5;
}

h1, h2, h3, h4, h5, h6 {
	clear: both;
	line-height: 1.1;
	margin-bottom: 0.5em;
}

p {
	margin: 0 0 1em 0;
}

dfn, cite, em, i {
	font-style: italic;
}

blockquote {
	margin: 0 1.5em;
}

address {
	margin: 0 0 1.5em;
}

pre {
	background: #eee;
	font-family: "Courier 10 Pitch", Courier, monospace;
	font-size: 15px;
	font-size: 0.9375rem;
	line-height: 1.6;
	margin-bottom: 1.6em;
	max-width: 100%;
	overflow: auto;
	padding: 1.6em;
}

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

abbr, acronym {
	border-bottom: 1px dotted #666;
	cursor: help;
}

mark, ins {
	background: #fff9c0;
	text-decoration: none;
}

big {
	font-size: 125%;
}

/*--------------------------------------------------------------
# Elements
--------------------------------------------------------------*/

html {
	box-sizing: border-box;
}

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

body {
	background-color: #fffefc;
	border-top: 2rem solid #ff7117;
}

hr {
	background-color: #ccc;
	border: 0;
	height: 1px;
}

ul {
	list-style: disc;
}

ol {
	list-style: decimal;
}

li {
	margin-bottom: 1em;
}

li > ul,
li > ol {
	margin-bottom: 0;
}

dt {
	font-weight: bold;
}

dd {
	margin: 0 1.5em 1.5em;
}

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

figure {
	margin: 1em 0;
}

table {
	margin: 0 0 1.5em;
	width: 100%;
}

/*--------------------------------------------------------------
# Forms
--------------------------------------------------------------*/
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
	border: 1px solid;
	border-color: #ccc #ccc #bbb;
	border-radius: 3px;
	background: #e6e6e6;
	color: rgba(0, 0, 0, 0.8);
	font-size: 12px;
	font-size: 0.75rem;
	line-height: 1;
	padding: .6em 1em .4em;
}

button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
	border-color: #ccc #bbb #aaa;
}

button:active, button:focus,
input[type="button"]:active,
input[type="button"]:focus,
input[type="reset"]:active,
input[type="reset"]:focus,
input[type="submit"]:active,
input[type="submit"]:focus {
	border-color: #aaa #bbb #bbb;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea {
	color: #666;
	border: 1px solid #ccc;
	border-radius: 3px;
	padding: 3px;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="range"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="time"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="color"]:focus,
textarea:focus {
	color: #111;
}

select {
	border: 1px solid #ccc;
}

textarea {
	width: 100%;
}

/*--------------------------------------------------------------
# Links
--------------------------------------------------------------*/
a {
	color: rgb(4, 4, 2);
	text-decoration: none;
	border-bottom: 1px dotted black;
}

a#susty-back-link {
	padding: .3em .6em;
}

a:visited {
	color: rgb(4, 4, 2);
}

a:hover, a:focus, a:active {
	/*color: midnightblue;*/
	border-bottom-style: solid;
	border-bottom-color: inherit;
}

a:focus {
	outline: thin dotted;
}

a:hover, a:active {
	outline: 0;
}

/*--------------------------------------------------------------
# Accessibility
--------------------------------------------------------------*/
/* Text meant only for screen readers. */
.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; /* Many screen reader and browser combinations announce broken words as they would appear visually. */
}

.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	clip-path: none;
	color: #21759b;
	display: block;
	font-size: 14px;
	font-size: 0.875rem;
	font-weight: bold;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000;
	/* Above WP toolbar. */
}

/* Do not show the outline on the skip link target. */
#content[tabindex="-1"]:focus {
	outline: 0;
}

/*--------------------------------------------------------------
# Alignments
--------------------------------------------------------------*/
.alignleft {
	display: inline;
	float: left;
	margin-right: 1.5em;
}

.alignright {
	display: inline;
	float: right;
	margin-left: 1.5em;
}

.aligncenter {
	clear: both;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

/*--------------------------------------------------------------
# Clearings
--------------------------------------------------------------*/
.clear:before,
.clear:after,
.entry-content:before,
.entry-content:after,
.comment-content:before,
.comment-content:after,
.site-header:before,
.site-header:after,
.site-content:before,
.site-content:after,
.site-footer:before,
.site-footer:after {
	content: "";
	display: table;
	table-layout: fixed;
}

.clear:after,
.entry-content:after,
.comment-content:after,
.site-header:after,
.site-content:after,
.site-footer:after {
	clear: both;
}

/*--------------------------------------------------------------
# Content
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Posts and pages
--------------------------------------------------------------*/
.sticky {
	display: block;
}

.hentry {
	margin: 0 0 1.5em;
}

.updated:not(.published) {
	display: none;
}

/*--------------------------------------------------------------
## Comments
--------------------------------------------------------------*/
.comment-content a {
	word-wrap: break-word;
}

.bypostauthor {
	display: block;
}

/*--------------------------------------------------------------
# Media
--------------------------------------------------------------*/
/* Make sure embeds and iframes fit their containers. */
embed,
iframe,
object {
	max-width: 100%;
}

/* Make sure logo link wraps around logo image. */
.custom-logo-link {
	display: inline-block;
}

/*--------------------------------------------------------------
## Captions
--------------------------------------------------------------*/
.wp-caption {
	margin-bottom: 1.5em;
	max-width: 100%;
}

.wp-caption img[class*="wp-image-"] {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.wp-caption .wp-caption-text {
	margin: 0.8075em 0;
}

.wp-caption-text {
	text-align: center;
}

/*--------------------------------------------------------------
## Galleries
--------------------------------------------------------------*/
.gallery {
	margin-bottom: 1.5em;
}

.gallery-item {
	display: inline-block;
	text-align: center;
	vertical-align: top;
	width: 100%;
}

.gallery-columns-2 .gallery-item {
	max-width: 50%;
}

.gallery-columns-3 .gallery-item {
	max-width: 33.33%;
}

.gallery-columns-4 .gallery-item {
	max-width: 25%;
}

.gallery-columns-5 .gallery-item {
	max-width: 20%;
}

.gallery-columns-6 .gallery-item {
	max-width: 16.66%;
}

.gallery-columns-7 .gallery-item {
	max-width: 14.28%;
}

.gallery-columns-8 .gallery-item {
	max-width: 12.5%;
}

.gallery-columns-9 .gallery-item {
	max-width: 11.11%;
}

.gallery-caption {
	display: block;
}

/*--------------------------------------------------------------
## Separator
--------------------------------------------------------------*/

.wp-block-separator {
	border-top: 1rem solid #ff7117;
}

/*--------------------------------------------------------------
# Site
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Header
--------------------------------------------------------------*/
header#masthead {
}

header#masthead, body > footer {
	max-width: 50em;
	margin: 3em auto 2em;
	padding: 0 2em;
}

body > footer {
	margin: 4em auto;
}

header#masthead .brand {
	margin: 2em 0;
	line-height: 1.1;
}

header#masthead .brand .brand-name {
	font-size: 3em;
	font-weight: bold;
	margin-bottom: 0;
	line-height: 0.9;
}

header#masthead .brand .brand-description {
	margin-top: 0.5em;
	font-size: 1.25em;
	max-width: 23em;
}

header#masthead .brand .brand-description a,
ul#primary-menu li a {
	border-bottom: 1px dotted;
}

@media (max-width: 600px) {
	header#masthead .brand .brand-name { font-size: 2em; }
	header#masthead .brand .brand-description { font-size: 1em; }
}

header#masthead a {
	border-bottom: unset;
}

header#masthead > a {
	font-weight: bold;
}

header#masthead > a > svg {
	width: 1.8em;
	height: 1.8em;
}

/*--------------------------------------------------------------
## Primary Menu
--------------------------------------------------------------*/

ul#primary-menu {
	margin: 0;
	padding: 0;
}

ul#primary-menu li {
	margin: 0;
	display: inline-block;
	margin-right: 1em;
	list-style: none;
}

ul#primary-menu li a {
	background-color: #ff711729;
}

/*--------------------------------------------------------------
## Navigation
--------------------------------------------------------------*/
nav {
	margin-bottom: 1.5em;
}

/*--------------------------------------------------------------
## Blog Posts
--------------------------------------------------------------*/
.blog-posts {
	margin: 0;
	padding: 0;
}

.blog-posts li {
	margin: 1em 0 2em;
	list-style: none;
}

.blog-posts .blog-post-title {
	font-size: 1.25em;
	font-weight: 600;
	margin-bottom: 0.25em;
}

.blog-posts .excerpt {
	margin-top: 0.25em;
	font-size: 85%;
	line-height: 1.5;
}

/*--------------------------------------------------------------
## Content
--------------------------------------------------------------*/
#content {
	max-width: 50em;
	margin: 0 auto;
	padding: 0 2em;
}

#content h2 { font-size: 2em; }
#content h3 { font-size: 1.5em; }
#content h4 { font-size: 1.17em; }

/* Auto-generated page title */
#content article.page header h2 {
	font-size: 1.25em;
    font-weight: 600;
}

.blog-posts-heading, article.post header h3 {
	font-weight: 500;
}

article.post header h3 {
	margin-bottom: 0;
}

article.post header h2 {
	margin-top: 0.125em;
}

.wp-block-cover.cover-hero {
	margin: 0 -5em 1em;
	line-height: 1.1;
	padding: 1em 5em;
	border-bottom: 1rem solid #ff7117;
}

.wp-block-cover.cover-hero h2 {
	margin: 0;
}

.moment-heading {
	gap: 1em;
	margin-bottom: 0em;
}

.moment-heading img {
	width: 100%;
}

article a, nav a {
	background: rgb(252, 248, 243) none repeat scroll 0% 0%;
	border-bottom: 0.1em dotted;
/* 	line-height: 1.6em; */
}

article blockquote {
	border-left: 4px solid #ff7117;
    margin-left: 0;
    padding-left: 1em;
    font-size: 85%;
    line-height: 1.5;
}

.entry-meta {
	color: #777;
}

.entry-meta a {
	color: #777;
}

.cat-links {
	display: flex;
	align-items: center;
}

.cat-links a:first-of-type {
	margin-left: .5em;
}

.cat-links a, .comments-link a, .edit-link a {
	padding: 0 .5em;
	margin: 0 .5em 0 0;
}

.team-photo {
	filter: grayscale(70%);
}

.person-name {
	font-size: 75%;
}

.team-page-name {
	margin: 0;
}

.team-page-name + h3 {
	margin-top: 0.125em;
}

footer#colophon {
	max-width: 69em;
	margin: 3em auto;
	text-align: center;
	padding: 0 1em;
	font-size: .75em;
}

article > header {
	margin-bottom: 1em;
}

article > footer {
	margin: 3em 0;
}

@media (max-width: 1400px) {
  .wp-block-cover.cover-hero {
    margin: 0 -4.5em 1em;
    padding: 1em 4.5em;
  }
}

@media (max-width: 1200px) {
  .wp-block-cover.cover-hero {
    margin: 0 -3.5em 1em;
    padding: 1em 3.5em;
  }
}

@media (max-width: 1024px) {
  .wp-block-cover.cover-hero {
    margin: 0 -0.82em 1em;
    padding: 2rem;
  }
}

@media (max-width: 768px) {
  .wp-block-cover.cover-hero {
    margin: 0 -0.81em 1em;
  }
}

@media (max-width: 480px) {
  .wp-block-cover.cover-hero {
    margin: 0 -0.77em 1em;
  }
  .wp-block-cover.cover-hero h2 {
	font-size: 0.85em !important;
  }
}

@media (max-width: 360px) {
  .wp-block-cover.cover-hero {
    margin: 0 -0.8em 1em;
  }
}