/*!
Theme Name: launchpad
Theme URI: http://underscores.me/
Author: WebMO
Author URI: http://underscores.me/
Description: Description
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: launchpad
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

launchpad is based on Underscores https://underscores.me/, (C) 2012-2020 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/
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	- Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Generic
--------------------------------------------------------------*/

/* Normalize
--------------------------------------------- */

/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/* Document
	 ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */
html {
	line-height: 1.15;
	-webkit-text-size-adjust: 100%;
}

/* Sections
	 ========================================================================== */

/**
 * Remove the margin in all browsers.
 */
body {
	margin: 0;
}

/**
 * Render the `main` element consistently in IE.
 */
main {
	display: block;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
h1 {
	font-size: 2em;
	margin: 0.67em 0;
}

/* Grouping content
	 ========================================================================== */

/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
	box-sizing: content-box;
	height: 0;
	overflow: visible;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
	font-family: monospace, monospace;
	font-size: 1em;
}

/* Text-level semantics
	 ========================================================================== */

/**
 * Remove the gray background on active links in IE 10.
 */
a {
	background-color: transparent;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
	border-bottom: none;
	text-decoration: underline;
	text-decoration: underline dotted;
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
	font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
samp {
	font-family: monospace, monospace;
	font-size: 1em;
}

/**
 * Add the correct font size in all browsers.
 */
small {
	font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sub {
	bottom: -0.25em;
}

sup {
	top: -0.5em;
}

/* Embedded content
	 ========================================================================== */

/**
 * Remove the border on images inside links in IE 10.
 */
img {
	border-style: none;
}

/* Forms
	 ========================================================================== */

/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */
button,
input,
optgroup,
select,
textarea {
	font-family: inherit;
	font-size: 100%;
	line-height: 1.15;
	margin: 0;
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
button,
input {
	overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button,
select {
	text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */
button,
[type="button"],
[type="reset"],
[type="submit"] {
	-webkit-appearance: button;
}

/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
	border-style: none;
	padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
	outline: 1px dotted ButtonText;
}

/**
 * Correct the padding in Firefox.
 */
fieldset {
	padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *		`fieldset` elements in all browsers.
 */
legend {
	box-sizing: border-box;
	color: inherit;
	display: table;
	max-width: 100%;
	padding: 0;
	white-space: normal;
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
	vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */
textarea {
	overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */
[type="checkbox"],
[type="radio"] {
	box-sizing: border-box;
	padding: 0;
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
	height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
[type="search"] {
	-webkit-appearance: textfield;
	outline-offset: -2px;
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */
[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
::-webkit-file-upload-button {
	-webkit-appearance: button;
	font: inherit;
}

/* Interactive
	 ========================================================================== */

/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */
details {
	display: block;
}

/*
 * Add the correct display in all browsers.
 */
summary {
	display: list-item;
}

/* Misc
	 ========================================================================== */

/**
 * Add the correct display in IE 10+.
 */
template {
	display: none;
}

/**
 * Add the correct display in IE 10.
 */
[hidden] {
	display: none;
}

/* Box sizing
--------------------------------------------- */

/* Inherit box-sizing to more easily change it's value on a component level.
@link http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
*,
*::before,
*::after {
	box-sizing: inherit;
}

html {
	box-sizing: border-box;
}

/*--------------------------------------------------------------
# Base
--------------------------------------------------------------*/

/* Typography
--------------------------------------------- */
body,
button,
input,
select,
optgroup,
textarea {
	color: #404040;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	font-size: 1rem;
	line-height: 1.5;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	clear: both;
}

p {
	margin-bottom: 1.5em;
}

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;
	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;
}

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

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

big {
	font-size: 125%;
}

/* Elements
--------------------------------------------- */
body {
	background: #fff;
}

hr {
	background-color: #ccc;
	border: 0;
	height: 1px;
	margin-bottom: 1.5em;
}

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: 700;
}

dd {
	margin: 0 1.5em 1.5em;
}

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

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

figure {
	margin: 1em 0;
}

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

/* Links
--------------------------------------------- */
a {
	color: var(--accent-link);
}

/* No :visited rule on purpose: visited links keep whatever colour their
own rules give them. An author colour on `a` outranks the browser's
visited purple. */

a:hover,
a:focus,
a:active {
	color: var(--accent-strong);
}

a:focus {
	outline: thin dotted;
}

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

/* 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);
	line-height: 1;
	padding: 0.6em 1em 0.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%;
}

/*--------------------------------------------------------------
# Layouts
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Components
--------------------------------------------------------------*/

.site-main .comment-navigation,
.site-main .posts-navigation,
.site-main .post-navigation {
	margin: 0 0 1.5em;
}

.comment-navigation .nav-links,
.posts-navigation .nav-links,
.post-navigation .nav-links {
	display: flex;
}

.comment-navigation .nav-previous,
.posts-navigation .nav-previous,
.post-navigation .nav-previous {
	flex: 1 0 50%;
}

.comment-navigation .nav-next,
.posts-navigation .nav-next,
.post-navigation .nav-next {
	text-align: end;
	flex: 1 0 50%;
}

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

.post,
.page {
	margin: 0;
}

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

.page-content,
.entry-content,
.entry-summary {
	margin: 1.5em 0 0;
}

.page-links {
	clear: both;
	margin: 0 0 1.5em;
}

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

.bypostauthor {
	display: block;
}

/* Widgets
--------------------------------------------- */
.widget {
	margin: 0 0 1.5em;
}

.widget select {
	max-width: 100%;
}

/* Media
--------------------------------------------- */
.page-content .wp-smiley,
.entry-content .wp-smiley,
.comment-content .wp-smiley {
	border: none;
	margin-bottom: 0;
	margin-top: 0;
	padding: 0;
}

/* 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;
	display: grid;
	grid-gap: 1.5em;
}

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

.gallery-columns-2 {
	grid-template-columns: repeat(2, 1fr);
}

.gallery-columns-3 {
	grid-template-columns: repeat(3, 1fr);
}

.gallery-columns-4 {
	grid-template-columns: repeat(4, 1fr);
}

.gallery-columns-5 {
	grid-template-columns: repeat(5, 1fr);
}

.gallery-columns-6 {
	grid-template-columns: repeat(6, 1fr);
}

.gallery-columns-7 {
	grid-template-columns: repeat(7, 1fr);
}

.gallery-columns-8 {
	grid-template-columns: repeat(8, 1fr);
}

.gallery-columns-9 {
	grid-template-columns: repeat(9, 1fr);
}

.gallery-caption {
	display: block;
}

/*--------------------------------------------------------------
# Plugins
--------------------------------------------------------------*/

/* Jetpack infinite scroll
--------------------------------------------- */

/* Hide the Posts Navigation and the Footer when Infinite Scroll is in use. */
.infinite-scroll .posts-navigation,
.infinite-scroll.neverending .site-footer {
	display: none;
}

/* Re-display the Theme Footer when Infinite Scroll has reached its end. */
.infinity-end.neverending .site-footer {
	display: block;
}

/*--------------------------------------------------------------
# Utilities
--------------------------------------------------------------*/

/* 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;
}

.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: 0.875rem;
	font-weight: 700;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000;
}

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

/* Alignments
--------------------------------------------- */
.alignleft {

	/*rtl:ignore*/
	float: left;

	/*rtl:ignore*/
	margin-right: 1.5em;
	margin-bottom: 1.5em;
}

.alignright {

	/*rtl:ignore*/
	float: right;

	/*rtl:ignore*/
	margin-left: 1.5em;
	margin-bottom: 1.5em;
}

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

/*--------------------------------------------------------------
# Begin Launchpad Styles
--------------------------------------------------------------*/
/* Controls block width in the block editor */
html :where(.wp-block) {
	max-width: var(--content-max-width);
}

/* Constrains non-custom-block content in the block editor */
.entry-content > *:not(.lp-block){
	max-width: var(--content-max-width);
	margin-inline: auto;
}

/* Consecutive blocks without a background: the second drops its top
padding, so the gap between them is one block's bottom padding instead of
two paddings stacked. Front end only, the editor wraps each block so the
sibling never matches there. */
.lp-block--no-bg + .lp-block--no-bg {
	padding-block-start: 0;
}

/* CSS Tokens
--------------------------------------------- */
:root {

	/* 1. PRIMITIVES
	   The only colours that exist. Four step ramps, 100 lightest to 400
	   darkest, plus white. Per site values come from the designer's Figma
	   export via tools/tokens-to-css.py and land in the child theme's
	   brand-identity.css. The defaults below express the current Launchpad
	   look; ramp steps with no historical value are derived and are
	   placeholder quality until a real export overrides them. */
	--white: #FFFFFF;

	--neutral-100: color-mix(in srgb, #b6bfcc 30%, white);
	--neutral-200: #b6bfcc;
	--neutral-300: #6B717E;
	--neutral-400: #242527;

	--primary-100: color-mix(in srgb, #2F5387 20%, white);
	--primary-200: color-mix(in srgb, #2F5387 55%, white);
	--primary-300: #2F5387;
	--primary-400: color-mix(in srgb, #2F5387 80%, black);

	/* No second grey exists in the default palette, so secondary mirrors
	   neutral until an export provides its own ramp. */
	--secondary-100: var(--neutral-100);
	--secondary-200: var(--neutral-200);
	--secondary-300: var(--neutral-300);
	--secondary-400: var(--neutral-400);

	--accent-100: color-mix(in srgb, #615FF8 30%, white);
	--accent-200: color-mix(in srgb, #615FF8 58%, white);
	--accent-300: #615FF8;
	--accent-400: color-mix(in srgb, #615FF8 80%, black);

	/* 2. SEMANTICS, LIGHT
	   The only tokens components consume. Light mode lives here, dark mode
	   is the .is-dark re-declaration after this rule; a block carrying
	   .is-dark resolves every semantic to its dark value for everything
	   inside it. Pointers are per site data, a Figma export overrides them
	   wholesale. */

	/* Surface */
	--surface-page: var(--white);
	--surface-card: var(--white);
	--surface-subtle: var(--neutral-100);
	--surface-overlay: var(--neutral-100);

	/* Text */
	--text-primary: var(--neutral-400);
	--text-secondary: var(--neutral-300);
	--text-disabled: var(--neutral-200);
	--text-on-brand: var(--white);
	--text-accent: var(--accent-300);

	/* Brand */
	--brand-tint: var(--primary-100);
	--brand-subtle: var(--primary-200);
	--brand-default: var(--primary-300);
	--brand-strong: var(--primary-400);

	/* CTA. Deliberately identical in both modes for now, buttons do not
	   restyle on dark sections in the current design. */
	--cta-tint: var(--accent-100);
	--cta-default: var(--accent-300);
	--cta-hover: color-mix(in srgb, var(--accent-300) 80%, white);
	--cta-text: var(--text-on-brand);

	/* Accent */
	--accent-tint: var(--accent-100);
	--accent-default: var(--accent-300);
	--accent-strong: var(--accent-400);
	--accent-link: var(--accent-300);
	--accent-badge-bg: var(--accent-100);
	--accent-badge-text: var(--accent-400);

	/* Border */
	--border-default: var(--neutral-200);
	--border-strong: var(--neutral-300);
	--border-brand: var(--primary-300);
	--border-focus: var(--accent-300);

	/* 3. COMPONENT TOKENS */
	--color-heading: var(--primary-300); /* deliberate extension of the
	   taxonomy, see CLAUDE.md Potential additions */

	/* Font Family */
	--font-family-heading: "Roboto", "Helvetica", sans-serif;
	--font-family-body: "Lato", "Helvetica", sans-serif;
	--font-family-button: "Roboto", "Helvetica", sans-serif;

	/* Font Size
	   Fluid. Each maximum equals the previous fixed value, so desktop is
	   unchanged and only narrower viewports differ. */
	--font-size-h1: clamp(36px, 5vw, 60px);
	--font-size-h2: clamp(30px, 4vw, 48px);
	--font-size-h3: clamp(25px, 3.17vw, 38px);
	--font-size-h4: clamp(22px, 2.5vw, 30px);
	--font-size-h5: clamp(20px, 2.17vw, 26px);
	--font-size-h6: var(--font-size-h5);

	--font-size-body: 18px;
	--font-size-small: 16px;

	/* Line Height
	   Always unitless so it scales with a clamped font size. */
	--line-height-heading: normal;
	--line-height-body: 1.5;

	/* Bleed media stops growing at this half-viewport width, the section
	   background fills beyond it. 960px = flush to the edge up to a 1920px
	   viewport, capped past it. */
	--bleed-media-max-width: 960px;

	/* Tint overlay. Composed with relative colour syntax so one hex and one
	   number reproduce the historical gradient exactly, 0.9 alpha fading to
	   0.7. Per block author values arrive as inline custom properties on the
	   tint div, emitted only when the fields are set. --tint-blend stays CSS
	   only for now, set it to multiply per site for the richer look. */
	--tint-color: #040C24;
	--tint-opacity: 0.9;
	--tint-blend: normal;

	/* Gallery marquee speed, pixels per second. */
	--marquee-speed: 60;

	/* Divider strip heights. Clamped so dividers thin out on phones;
	   custom per block heights arrive as an inline --divider-height. */
	--divider-height-s: clamp(24px, 4vw, 48px);
	--divider-height-m: clamp(40px, 6vw, 80px);
	--divider-height-l: clamp(64px, 9vw, 120px);

	/* Buttons, aliases onto the CTA semantics */
	--btn-radius: 8px;
	--btn-padding-y: 10px;
	--btn-padding-x: 14px;
	--btn-bg: var(--cta-default);
	--btn-text: var(--cta-text);
	--btn-bg-hover: var(--cta-hover);
	--btn-text-hover: var(--cta-text);


	/* Sizing */
	--content-max-width: 1200px;
	--content-width-narrow: 640px;
	--content-width-normal: 1100px;
	--content-width-wide: 1140px;

	--side-margin: 20px;

	--max-width-narrow: calc((2 * var(--side-margin)) + var(--content-width-narrow));
	--max-width-normal: calc((2 * var(--side-margin)) + var(--content-width-normal));
	--max-width-wide: calc((2 * var(--side-margin)) + var(--content-width-wide));

	--margin-vertical-normal: 50px;
	--margin-vertical-wide: 70px;
	--margin-vertical-wider: 90px;

}

/* Tint overlay, shared by every block that offers a tint. Values come from
the tokens above, overridable per block via inline custom properties. */
.lp-tint {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
	mix-blend-mode: var(--tint-blend);
	background: linear-gradient(
		180deg,
		rgb(from var(--tint-color) r g b / var(--tint-opacity)) 0%,
		rgb(from var(--tint-color) r g b / calc(var(--tint-opacity) - 0.2)) 100%
	);
}

/* Dark context. A block whose template computes a dark background adds
.is-dark alongside its --has-bg modifier, and every semantic inside it
resolves to the values below. Custom properties inherit, so one class on the
section covers all descendants. */
.is-dark {

	/* Surface */
	--surface-page: var(--neutral-400);
	--surface-card: #3F4658; /* off system placeholder, see CLAUDE.md Known noise */
	--surface-subtle: var(--neutral-300);
	--surface-overlay: var(--neutral-300);

	/* Text */
	--text-primary: var(--white);
	--text-secondary: var(--neutral-200);
	--text-disabled: var(--neutral-300);
	--text-on-brand: var(--white);
	--text-accent: var(--accent-200);

	/* Brand */
	--brand-tint: var(--primary-400);
	--brand-subtle: var(--primary-400);
	--brand-default: var(--primary-300);
	--brand-strong: var(--primary-200);

	/* Accent */
	--accent-tint: var(--accent-400);
	--accent-default: var(--accent-200);
	--accent-strong: var(--accent-100);
	--accent-link: var(--accent-200);
	--accent-badge-bg: var(--accent-400);
	--accent-badge-text: var(--accent-200);

	/* Border */
	--border-default: var(--neutral-300);
	--border-strong: var(--neutral-200);
	--border-brand: var(--primary-300);
	--border-focus: var(--accent-200);
}

/* TODO: Adjust header font sizes for medium sized screens
Currently headers are too large for tablet devices in dual column layouts.
*/

/* Body carries the type tokens so text outside a p, nav links and list
items included, inherits them instead of the Underscores scaffold stack. */
body {
	font-family: var(--font-family-body);
	font-size: var(--font-size-body);
}

h1 {
	font-family: var(--font-family-heading);
	font-size: var(--font-size-h1);
	font-style: normal;
	font-weight: 700;
	line-height: var(--line-height-heading);
	color: var(--color-heading);
	margin: 0;
}

h2 {
	font-family: var(--font-family-heading);
	font-size: var(--font-size-h2);
	font-style: normal;
	font-weight: 400;
	line-height: var(--line-height-heading);
	color: var(--color-heading);
	margin: 0;
}

h3 {
	font-family: var(--font-family-heading);
	font-size: var(--font-size-h3);
	font-style: normal;
	font-weight: 400;
	line-height: 1.25;
	color: var(--color-heading);
	margin: 0;
}

h4 {
	font-family: var(--font-family-body);
	font-size: var(--font-size-h4);
	font-style: normal;
	font-weight: 600;
	line-height: var(--line-height-heading);
	color: var(--color-heading);
}

h5 {
	font-family: var(--font-family-body);
	font-size: var(--font-size-h5);
	font-style: normal;
	font-weight: 600;
	line-height: normal;
	color: var(--neutral-400);
}

p {
	font-family: var(--font-family-body);
	font-size: var(--font-size-body);
	font-style: normal;
	font-weight: 500;
	line-height: 1.4;
}

a {
	text-decoration: none;
}

/* TODO: Create button system that allows leading icon and two buttons in one container */

a.btn {
	display: inline-block;
	align-self: flex-start;
	border-radius: var(--btn-radius);
	padding: var(--btn-padding-y) var(--btn-padding-x);
	box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
	font-size: var(--font-size-body);
}

a.btn-primary {
	background-color: var(--btn-bg);
	color: var(--btn-text);
}

a.btn-primary:hover {
	background-color: var(--btn-bg-hover);
	color: var(--btn-text-hover);
	transition: 0.25s;
}

/* Global form styles */

.gform_wrapper .gform_heading .gform_description:empty{
	display: none;
}

.gform_wrapper .gform_heading .gform_required_legend{
	display: none;
}

.gform_wrapper .gform_heading .gform_title{
	font-family: var(--font-family-heading);
	font-size: var(--font-size-h1);
	font-style: normal;
	font-weight: 700;
	line-height: normal;
	margin: 0;
}

.gform_wrapper .gform_body .gform_fields .gfield input,
.gform_wrapper .gform_body .gform_fields .gfield textarea,
.gform_wrapper .gform_body .gform_fields .gfield select {
	border-radius: 8px;
	border: solid 1px var(--border-default);
	padding: 10px 14px;
	/* Form controls do not inherit from body, they carry the Underscores
	scaffold stack unless set here. */
	font-family: var(--font-family-body);
	font-size: var(--font-size-body);
}

.gform_wrapper .gform_body .gform_fields .gfield .gfield_label {
	font-family: var(--font-family-body);
	font-size: var(--font-size-body);
	font-style: normal;
	font-weight: 500;
	line-height: 1.4;
}

.gform_wrapper .gform_body .gform_fields .gfield .gfield_label .gform-field-label--type-sub {
	font-family: var(--font-family-body);
	font-size: var(--font-size-body);
	font-style: normal;
	font-weight: 500;
	line-height: 1.4;
}

.gform_wrapper .gform_footer input[type=submit],
.gform_wrapper .gform_footer button[type=submit] {
	/* gravity_form() renders the submit as <button>, the shortcode rendered
	<input>. Both covered so the markup path cannot unstyle it. Colours ride
	the CTA tokens like a.btn does. */
	border-radius: var(--btn-radius);
	border: none;
	padding: var(--btn-padding-y) var(--btn-padding-x);
	box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
	background-color: var(--btn-bg) !important;
	color: var(--btn-text);
	cursor: pointer;

	font-family: var(--font-family-body);
	font-size: var(--font-size-body) !important;
	font-style: normal;
	font-weight: 500;
	line-height: 1.4;
}

/* Editor only empty states. All of this markup is emitted only during
block preview, so these rules are inert on the front end. */
.lp-editor-placeholder {
	display: block;
	color: var(--text-secondary);
	font-size: 15px;
	line-height: 1.4;
	cursor: pointer;
	margin-block: 12px;
}

/* Placeholder image tile, sized like the media it stands in for. */
.lp-editor-media-placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: 16 / 10;
	width: 100%;
	border: 1px solid var(--border-default);
	border-radius: 12px;
	background: color-mix(in srgb, var(--text-secondary) 12%, transparent);
	color: var(--text-secondary);
	cursor: pointer;
}

.lp-editor-media-placeholder {
	gap: 20px;
}

.lp-editor-media-placeholder.lp-two-column__bleed-embed {
	aspect-ratio: auto;
	/* Grid centring: immune to the flex quirks of the absolute bleed box. */
	display: grid;
	place-items: center;
}

/* Editor canvas: nudge the bleed tile's icon toward the visible area. */
.lp-editor-media-placeholder.lp-two-column__bleed-embed svg {
	position: relative;
	right: 300%;
}

.lp-editor-media-placeholder svg {
	width: 48px;
	height: 48px;
	fill: currentColor;
}

/* Breathing room between inline editable text elements in the canvas; the
attribute only exists in the editor. */
[data-acf-inline-contenteditable] {
	margin-block-end: 12px;
}

/* 404 template */
.lp-error-404 {
	display: flex;
	min-height: 60vh;
	padding-block: var(--margin-vertical-wider);
	padding-inline: 4vw;
}

.lp-error-404 .block-contents {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	gap: 12px;
	width: 100%;
	max-width: var(--content-width-narrow);
	margin-inline: auto;
}

.lp-error-404__code {
	margin: 0;
	font-family: var(--font-family-heading);
	font-size: clamp(64px, 12vw, 120px);
	font-weight: 700;
	line-height: 1;
	color: var(--brand-default);
}

.lp-error-404__header {
	color: var(--text-primary);
}

.lp-error-404__body {
	margin-block: 0 12px;
	color: var(--text-secondary);
}

/* Floating CTA, rendered on wp_footer when a page opts in. Pinned to the
right edge about a third of the way down the viewport. */
.lp-floating-buttons {
	position: fixed;
	right: 24px;
	top: 30vh;
	z-index: 50;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 12px;
}

.lp-floating-buttons__cta--has-icon {
	display: flex;
	align-items: center;
	gap: 8px;
}

.lp-floating-buttons__cta-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	flex-shrink: 0;
}

.lp-floating-buttons__cta-icon img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

/* The label collapses away leaving the icon, JS drives is-collapsed. */
.lp-floating-buttons__cta--has-icon .lp-floating-buttons__cta-label {
	max-width: 240px;
	overflow: hidden;
	white-space: nowrap;
	transition: max-width 0.3s ease, opacity 0.3s ease;
}

.lp-floating-buttons__cta--has-icon.is-collapsed .lp-floating-buttons__cta-label {
	max-width: 0;
	opacity: 0;
}

.lp-floating-buttons__top {
	position: fixed;
	left: 24px;
	bottom: 24px;
	z-index: 50;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border: none;
	border-radius: 50%;
	background-color: var(--btn-bg);
	color: var(--btn-text);
	box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
	cursor: pointer;

	opacity: 0;
	pointer-events: none;
	transition: opacity 0.25s;
}

.lp-floating-buttons__top.is-visible {
	opacity: 1;
	pointer-events: auto;
}

.lp-floating-buttons__top svg {
	width: 22px;
	height: 22px;
	fill: currentColor;
}

/* Gravity Forms character counter. Sits outside the input despite living
in ginput_container, so it follows the surrounding text colour and drops
the description spacing it inherits. */
.gform_wrapper .ginput_container .ginput_counter,
.gform_wrapper.gravity-theme .ginput_container .ginput_counter {
	margin-top: 0;
	padding-top: 0;
	color: var(--text-secondary);
}

/* Header
--------------------------------------------- */
/*TODO: add native support for mobile menu*/
/*TODO: make sure nav can support logos that are long (horizontal)*/

.entry-title{
	display: none;
}

.site-header{
	position: sticky;
	top: 0;
	z-index: 99;
	padding-inline: 4vw;
	background: #fff;
	box-shadow: rgba(17, 17, 26, 0.1) 0px 1px 0px;

	font-family: var(--font-family-heading);
	font-size: var(--font-size-body);
	font-weight: 400;
}

.lp-header__inner{
	display: flex;
	align-items: center;
	gap: 24px;
	height: 80px;
	max-width: var(--content-max-width);
	margin: 0 auto;
}

.site-branding{
	display: flex;
	align-items: center;
	margin-right: auto;
}

p.site-title{
	margin: 0;
}

.lp-header__nav{
	display: flex;
	align-items: center;
}

.lp-header__menu{
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.lp-header__item{
	position: relative;
	display: flex;
	align-items: center;
	gap: 4px;
}

.lp-header__link{
	display: block;
	text-decoration: none;
	color: var(--neutral-400);
}

.lp-header__link:hover{
	color: var(--accent-300);
}

.lp-header__submenu{
	display: none;
	position: absolute;
	top: 100%;
	right: 0;
	min-width: 200px;
	flex-direction: column;
	margin: 0;
	padding: 0;
	list-style: none;
	border-radius: 4px;
	box-shadow: rgba(0, 0, 0, 0.05) 0px 0px 0px 1px;
}

.lp-header__nav .lp-header__item--has-children:hover .lp-header__submenu,
.lp-header__nav .lp-header__item--has-children:focus-within .lp-header__submenu,
.lp-header__nav .lp-header__item.is-expanded .lp-header__submenu{
	display: flex;
}

.lp-header__subitem{
	background: #fff;
	border-bottom: 1px solid #e2e2e2;
}

.lp-header__subitem:first-child{
	border-radius: 4px 4px 0 0;
}

.lp-header__subitem:last-child{
	border-bottom: 0;
	border-radius: 0 0 4px 4px;
}

.lp-header__sublink{
	display: block;
	padding: 8px 16px;
	text-decoration: none;
	color: var(--neutral-400);
}

.lp-header__sublink:hover{
	color: var(--accent-300);
}

.lp-header__submenu-toggle{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	border: 0;
	background: none;
	color: currentColor;
	font-size: 10px;
	line-height: 1;
	cursor: pointer;
}

.lp-header__icon{
	display: block;
	width: 1em;
	height: 1em;
	transition: transform 0.2s ease;
}

.lp-header__icon-stem{
	transform-box: fill-box;
	transform-origin: center;
	transition: transform 0.2s ease;
}

.lp-header__submenu-toggle[aria-expanded="true"] .lp-header__icon--triangle,
.lp-header__nav .lp-header__item--has-children:hover .lp-header__icon--triangle{
	transform: rotate(-90deg);
}

.lp-header__submenu-toggle[aria-expanded="true"] .lp-header__icon-stem,
.lp-header__nav .lp-header__item--has-children:hover .lp-header__icon-stem{
	transform: scaleY(0);
}

.lp-header__toggle:focus-visible,
.lp-header__close:focus-visible,
.lp-header__submenu-toggle:focus-visible{
	outline: 2px solid var(--accent-300);
	outline-offset: 2px;
}

a.lp-header__cta{
	align-self: center;
}

.lp-header__toggle{
	display: none;
	flex-direction: column;
	justify-content: center;
	gap: 5px;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 0;
	background: none;
	cursor: pointer;
}

.lp-header__toggle-bar{
	display: block;
	width: 24px;
	height: 3px;
	margin-inline: auto;
	border-radius: 2px;
	background: var(--lp-header-toggle, var(--accent-300));
}

.lp-header__overlay{
	position: fixed;
	inset: 0;
	z-index: 100;
	visibility: hidden;
	opacity: 0;
	background: rgba(0, 0, 0, 0.5);
	transition: opacity 0.25s ease, visibility 0.25s ease;
}

.lp-header.is-open .lp-header__overlay{
	visibility: visible;
	opacity: 1;
}

.lp-header__panel{
	position: fixed;
	top: 0;
	right: 0;
	z-index: 101;
	display: flex;
	flex-direction: column;
	gap: 16px;
	width: min(320px, 80vw);
	height: 100%;
	padding: 16px 24px 32px;
	overflow-y: auto;
	overscroll-behavior: contain;
	visibility: hidden;
	transform: translateX(100%);
	background: var(--lp-header-panel-bg, var(--neutral-400));
	transition: transform 0.25s ease, visibility 0.25s ease;
}

.lp-header.is-open .lp-header__panel{
	visibility: visible;
	transform: translateX(0);
}

.lp-header__close{
	align-self: flex-end;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 0;
	background: none;
	color: var(--lp-header-toggle, var(--accent-300));
	font-size: 30px;
	line-height: 1;
	cursor: pointer;
}

.lp-header__close::before{
	content: "\00d7";
}

.lp-header__panel-nav .lp-header__menu{
	flex-direction: column;
	align-items: stretch;
	gap: 0;
}

.lp-header__panel-nav .lp-header__item{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
}

.lp-header__panel-nav .lp-header__link{
	flex: 1;
	padding-block: 12px;
	font-family: var(--font-family-heading);
	font-weight: 700;
	color: var(--lp-header-panel-link, var(--white));
}

.lp-header__panel-nav .lp-header__link:hover{
	color: var(--lp-header-panel-link-hover, var(--accent-200));
}

.lp-header__panel-nav .lp-header__submenu-toggle{
	width: 44px;
	height: 44px;
	color: var(--lp-header-submenu-icon, var(--accent-300));
	font-size: 20px;
}

.lp-header__panel-nav .lp-header__submenu{
	position: static;
	width: 100%;
	min-width: 0;
	border-radius: 0;
	box-shadow: none;
}

.lp-header__panel-nav .lp-header__item.is-expanded .lp-header__submenu{
	display: flex;
}

.lp-header__panel-nav .lp-header__subitem{
	background: none;
	border-bottom: 0;
}

.lp-header__panel-nav .lp-header__sublink{
	padding: 10px 0 10px 16px;
	color: var(--lp-header-panel-link, var(--white));
}

.lp-header__panel-nav .lp-header__sublink:hover{
	color: var(--lp-header-panel-link-hover, var(--accent-200));
}

a.lp-header__panel-cta{
	align-self: stretch;
	margin-top: auto;
	text-align: center;
}

body.lp-menu-open{
	overflow: hidden;
}

.custom-logo-link img{
	max-height: 80px;
	width: auto;
}

.entry-content{
	margin-top: 0;
}

.site-title a{
	font-family: var(--font-family-heading);
	font-size: var(--font-size-h5);
	color: var(--neutral-400);
	font-weight: 800;
}

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

/* Footer Container
--------------------------------------------- */
.site-footer.lp-footer{
	position: relative;
	color: var(--white);
	background: linear-gradient(-45deg, rgb(4, 12, 36) 0%, rgba(4, 12, 36, 0.8) 100%);
	overflow: hidden;
}

.lp-footer__top{
	padding-block: var(--margin-vertical-wide) var(--margin-vertical-normal);
	border-bottom: 1px solid rgba(255, 255, 255, 0.12);
	position: relative;
	z-index: 1;
	padding-inline: 4vw;
}

.lp-footer__inner{
	max-width: var(--content-max-width);
	margin-inline: auto;
}

.lp-footer__grid{
	display: grid;
	grid-template-columns: minmax(240px, 1.4fr) minmax(180px, 1fr) minmax(200px, 1fr);
	gap: 48px;
	align-items: start;
}

/* Footer Common Elements
--------------------------------------------- */
.lp-footer__heading{
	font-family: var(--font-family-heading);
	font-size: 24px;
	font-weight: 600;
	color: var(--white);
	margin: 0 0 16px;
}

/* Footer Column 1
--------------------------------------------- */

.lp-footer__brand{
	display: flex;
	flex-direction: column;
	gap: 24px;
}

/* Footer Logo */
.lp-footer__logo-image,
.lp-footer__logo .custom-logo{
	width: auto;
	max-width: 220px;
	height: 100px;
	max-height: 100px;
}

.lp-footer__logo .custom-logo-link{
	display: inline-flex;
}

.lp-footer__logo{
	max-height: 100px;
}

/* Footer Contact Info*/
.lp-footer__contact-list{
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.lp-footer__contact-item{
	display: flex;
	align-items: flex-start;
	gap: 12px;
	font-family: var(--font-family-body);
	font-size: var(--font-size-body);
	line-height: 1.4;
	color: var(--white);
}

.lp-footer__contact-icon{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	margin-top: 2px;
}

.lp-footer__contact-icon-image{
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.lp-footer__contact-link,
.lp-footer__contact-link:visited,
.lp-footer__contact-text{
	color: var(--neutral-200);
}

.lp-footer__contact-link:hover{
	color: var(--accent-200);
}

.lp-footer__contact-link:visited{

}

/* Column 2
--------------------------------------------- */
.lp-footer__quick-links{
	height: 100%;
	padding-left: 32px;
	border-left: 1px solid rgba(182, 191, 204, 0.2);
}

.lp-footer__links{
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.lp-footer__link-wrapper{
	position: relative;
	padding-left: 18px;
}

.lp-footer__link-wrapper::before{
	content: "›";
	position: absolute;
	left: 0;
	top: 0;
	color: var(--white);
	font-weight: 700;
}

.lp-footer__link{
	color: var(--neutral-200);
	font-family: var(--font-family-body);
	font-size: var(--font-size-body);
}

.lp-footer__link:visited{
	color: var(--neutral-200);
}

.lp-footer__link:hover{
	color: var(--accent-200);
}


/* Column 3
--------------------------------------------- */
.lp-footer__social-media{
	height: 100%;
	padding-left: 32px;
	border-left: 1px solid rgba(182, 191, 204, 0.2);
}

.lp-footer__social{
	display: flex;
	gap: 12px;
	flex-wrap: wrap;
}

.lp-footer__social-link{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 10px;
	background: rgba(255, 255, 255, 0.12);
	transition: background 0.2s ease, transform 0.2s ease;
}

.lp-footer__social-link:hover{
	background: rgba(255, 255, 255, 0.2);
}

.lp-footer__social-icon{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 22px;
	height: 22px;
}

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

.lp-footer-disclaimers{
	position: relative;
	z-index: 1;
	padding-inline: 4vw;
}

.lp-footer-disclaimers{
	padding-block: 18px;
}

.lp-footer-disclaimers__wrapper{
	max-width: var(--content-max-width);
	margin-inline: auto;
}

.lp-footer-disclaimers__content{
	display: flex;
	flex-direction: row-reverse;
	justify-content: flex-start;
	gap: 18px;
	flex-wrap: wrap;
	font-family: var(--font-family-body);
	font-size: var(--font-size-small);
	line-height: 1.4;
}

.lp-footer__disclaimer-link{
	color: var(--neutral-200);
}


.lp-footer__disclaimer-link:visited{
	color: var(--neutral-200);
}

.lp-footer__disclaimer-link:hover{
	color: var(--accent-200);
}

@media screen and (max-width: 767px){
	.lp-footer__grid{
		grid-template-columns: 1fr;
		gap: 32px;
	}

	.lp-footer__contact{
		height: 100%;
		padding-left: 32px;
		border-left: 1px solid rgba(182, 191, 204, 0.2);
	}

	.lp-footer-disclaimers__content{
		justify-content: center;
		text-align: center;
	}
}
