/*
 * Base: fonts, colour tokens, reset, typography and page width.
 *
 * Breakpoints used across the theme: mobile up to 767px, tablet 768px to
 * 1024px, desktop from 1025px.
 */

/* Oxygen, self-hosted. The Regular file is declared at weight 500, as it was
   on the previous build, so normal text (400) resolves to it. */
@font-face {
	font-family: "Oxygen";
	font-style: normal;
	font-weight: 700;
	font-display: auto;
	src: url("../fonts/Oxygen-Bold.ttf") format("truetype");
}

@font-face {
	font-family: "Oxygen";
	font-style: normal;
	font-weight: 300;
	font-display: auto;
	src: url("../fonts/Oxygen-Light.ttf") format("truetype");
}

@font-face {
	font-family: "Oxygen";
	font-style: normal;
	font-weight: 500;
	font-display: auto;
	src: url("../fonts/Oxygen-Regular.ttf") format("truetype");
}

:root {
	--c-primary: #a1c44b;
	--c-secondary: #000001;
	--c-text: #000000;
	--c-panel: #d3d9da;
	--c-white: #ffffff;
	--c-grey: #b3b5aa;
	--c-dark: #262732;
}

/* Reset */
html { line-height: 1.15; -webkit-text-size-adjust: 100%; }
*, :after, :before { box-sizing: border-box; }
body { background-color: #fff; color: #333; 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; margin: 0; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
h1, h2, h3, h4, h5, h6 { color: inherit; font-family: inherit; font-weight: 500; line-height: 1.2; margin-bottom: 1rem; margin-top: .5rem; }
h1 { font-size: 2.5rem; }
h2 { font-size: 2rem; }
h3 { font-size: 1.75rem; }
h4 { font-size: 1.5rem; }
h5 { font-size: 1.25rem; }
h6 { font-size: 1rem; }
p { margin-bottom: .9rem; margin-top: 0; }
hr { box-sizing: content-box; height: 0; overflow: visible; }
pre { font-family: monospace, monospace; font-size: 1em; white-space: pre-wrap; }
a { background-color: transparent; color: #c36; text-decoration: none; }
a:not([href]):not([tabindex]), a:not([href]):not([tabindex]):focus, a:not([href]):not([tabindex]):hover { color: inherit; text-decoration: none; }
a:not([href]):not([tabindex]):focus { outline: 0; }
abbr[title] { border-bottom: none; text-decoration: underline dotted; }
b, strong { font-weight: bolder; }
code, kbd, samp { font-family: monospace, monospace; font-size: 1em; }
small { font-size: 80%; }
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sub { bottom: -.25em; }
sup { top: -.5em; }
img { border-style: none; height: auto; max-width: 100%; }
details { display: block; }
summary { display: list-item; }
figcaption { color: #333; font-size: 16px; font-style: italic; font-weight: 400; line-height: 1.4; }
[hidden], template { display: none; }
label { display: inline-block; line-height: 1; vertical-align: middle; }
button, input, optgroup, select, textarea { font-family: inherit; font-size: 1rem; line-height: 1.5; margin: 0; }
input[type=date], input[type=email], input[type=number], input[type=password], input[type=search], input[type=tel], input[type=text], input[type=url], select, textarea { border: 1px solid #666; border-radius: 3px; padding: .5rem 1rem; transition: all .3s; width: 100%; }
input[type=date]:focus, input[type=email]:focus, input[type=number]:focus, input[type=password]:focus, input[type=search]:focus, input[type=tel]:focus, input[type=text]:focus, input[type=url]:focus, select:focus, textarea:focus { border-color: #333; }
button, input { overflow: visible; }
button, select { text-transform: none; }
[type=button], [type=reset], [type=submit], button { -webkit-appearance: button; width: auto; }
[type=button], [type=submit], button { background-color: transparent; border: 1px solid #c36; border-radius: 3px; color: #c36; display: inline-block; font-size: 1rem; font-weight: 400; padding: .5rem 1rem; text-align: center; transition: all .3s; user-select: none; white-space: nowrap; }
[type=button]:focus:not(:focus-visible), [type=submit]:focus:not(:focus-visible), button:focus:not(:focus-visible) { outline: none; }
[type=button]:focus, [type=button]:hover, [type=submit]:focus, [type=submit]:hover, button:focus, button:hover { background-color: #c36; color: #fff; text-decoration: none; }
[type=button]:not(:disabled), [type=submit]:not(:disabled), button:not(:disabled) { cursor: pointer; }
fieldset { padding: .35em .75em .625em; }
legend { box-sizing: border-box; color: inherit; display: table; max-width: 100%; padding: 0; white-space: normal; }
progress { vertical-align: baseline; }
textarea { overflow: auto; resize: vertical; }
[type=checkbox], [type=radio] { box-sizing: border-box; padding: 0; }
[type=number]::-webkit-inner-spin-button, [type=number]::-webkit-outer-spin-button { height: auto; }
[type=search] { -webkit-appearance: textfield; outline-offset: -2px; }
[type=search]::-webkit-search-decoration { -webkit-appearance: none; }
::-webkit-file-upload-button { -webkit-appearance: button; font: inherit; }
select { display: block; }
table { background-color: transparent; border-collapse: collapse; border-spacing: 0; font-size: .9em; margin-bottom: 15px; width: 100%; }
table td, table th { border: 1px solid hsla(0, 0%, 50%, .502); line-height: 1.5; padding: 15px; vertical-align: top; }
table th { font-weight: 700; }
dd, dl, dt, li, ol, ul { background: transparent; border: 0; font-size: 100%; margin-bottom: 0; margin-top: 0; outline: 0; vertical-align: baseline; }

/* Typography. Scoped to the body class so these rules carry the same weight
   against plugin stylesheets (Gravity Forms) as the old site-wide settings. */
.lemonade { font-family: "Oxygen", Sans-serif; }
.lemonade a { color: var(--c-primary); font-family: "Oxygen", Sans-serif; }
.lemonade h1, .lemonade h2 { font-family: "Oxygen", Sans-serif; font-weight: 700; }
.lemonade h3 { font-family: "Oxygen", Sans-serif; font-weight: 400; }
.lemonade h4, .lemonade h5, .lemonade h6 { font-family: "Oxygen", Sans-serif; }

/* WordPress content helpers */
.page-content a { text-decoration: underline; }
.alignright { float: right; margin-left: 1rem; }
.alignleft { float: left; margin-right: 1rem; }
.aligncenter { clear: both; display: block; margin-left: auto; margin-right: auto; }
.wp-caption { margin-bottom: 1.25rem; max-width: 100%; }
.wp-caption img { display: block; margin-left: auto; margin-right: auto; }
.wp-caption-text { margin: 0; }
.gallery-caption { display: block; font-size: .8125rem; line-height: 1.5; margin: 0; padding: .75rem; }
.pagination { display: flex; justify-content: space-between; margin: 20px auto; }
.sticky { display: block; position: relative; }
.bypostauthor { font-size: inherit; }
.hide { display: none !important; }
.post-password-form { margin: 50px auto; max-width: 500px; }
.post-password-form p { align-items: flex-end; display: flex; width: 100%; }
.post-password-form [type=submit] { margin-left: 3px; }
.post .entry-title a { text-decoration: none; }
.post .wp-post-image { max-height: 500px; object-fit: cover; width: 100%; }

@media (max-width: 991px) {
	.post .wp-post-image { max-height: 400px; }
}

@media (max-width: 575px) {
	.post .wp-post-image { max-height: 300px; }
}

.screen-reader-text { clip: rect(1px, 1px, 1px, 1px); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute !important; top: -10000em; width: 1px; border: 0; word-wrap: normal !important; }
.screen-reader-text:focus { background-color: #eee; clip: auto !important; clip-path: none; color: #333; display: block; font-size: 1rem; height: auto; left: 5px; line-height: normal; padding: 12px 24px; text-decoration: none; top: 5px; width: auto; z-index: 100000; }

/* Width of plain views (404, search, archives, unbuilt posts). */
.site-main,
.page-header .entry-title { margin-left: auto; margin-right: auto; width: 100%; }

@media (max-width: 575px) {
	.site-main,
	.page-header .entry-title { padding-left: 10px; padding-right: 10px; }
}

@media (min-width: 576px) {
	.site-main,
	.page-header .entry-title { max-width: 500px; }
}

@media (min-width: 768px) {
	.site-main,
	.page-header .entry-title { max-width: 600px; }
}

@media (min-width: 992px) {
	.site-main,
	.page-header .entry-title { max-width: 800px; }
}

@media (min-width: 1200px) {
	.site-main,
	.page-header .entry-title { max-width: 1140px; }
}

/* Designed pages run edge to edge, with links and media reset inside them. */
.site-main.site-main--full { max-width: none; margin: 0; padding: 0; }
.site-main--full a { box-shadow: none; text-decoration: none; }
.site-main--full hr { background-color: transparent; margin: 0; }
.site-main--full img { border: none; border-radius: 0; box-shadow: none; height: auto; max-width: 100%; }
.site-main--full embed, .site-main--full iframe, .site-main--full object, .site-main--full video { border: none; line-height: 1; margin: 0; max-width: 100%; width: 100%; }

/* Buttons: the hero buttons (solid, outline) and the illustrator quote button (flat). */
a.btn {
	display: inline-block;
	font-family: "Oxygen", Sans-serif;
	line-height: 1;
	text-align: center;
	transition: all .3s;
}

.btn__inner { display: flex; flex-direction: row; justify-content: center; gap: 5px; }
.btn__icon { display: flex; align-items: center; }
.btn__icon svg { width: 1em; height: auto; }
.btn__text { display: inline-block; }
.btn span { text-decoration: inherit; }

a.btn--solid,
a.btn--solid:visited { padding: 12px 24px; border-radius: 30px; background-color: var(--c-primary); font-size: 23px; font-weight: 700; color: var(--c-white); fill: var(--c-white); }
a.btn--solid:hover,
a.btn--solid:focus { background-color: var(--c-panel); color: var(--c-secondary); fill: var(--c-secondary); }

a.btn--outline,
a.btn--outline:visited { padding: 12px 16px 12px 36px; border: 2px solid; border-radius: 26px; background-color: transparent; font-size: 19px; font-weight: 500; letter-spacing: -0.1px; color: var(--c-white); fill: var(--c-white); }
a.btn--outline:hover,
a.btn--outline:focus { background-color: var(--c-primary); color: var(--c-text); fill: var(--c-text); }
.btn--outline .btn__inner { flex-direction: row-reverse; gap: 26px; }

a.btn--flat,
a.btn--flat:visited { padding: 12px 25px; border-radius: 0; background-color: var(--c-grey); font-size: 15px; font-weight: 700; color: var(--c-white); fill: var(--c-white); }
a.btn--flat:hover,
a.btn--flat:focus { background-color: var(--c-primary); color: var(--c-secondary); fill: var(--c-secondary); }

/* Dark pages */
body.is-dark { background-color: var(--c-dark); color: var(--c-white); }