/*
Theme Name: Heart & Soil 2025
Theme URI: https://github.com/lancemonotone/theme-tw
Author: Rus Miller
Author URI: https://underscoretw.com/
Description: A custom theme for Heart & Soil Collective based on TailwindCSS
Version: 0.1.0
Tested up to: 6.2
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: heart-soil-2025
Tags:

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

heart-soil-2025 is based on _tw https://underscoretw.com/, (C) 2021-2024 Greg Sullivan
_tw is distributed under the terms of the GNU GPL v2 or later.

_tw is based on Underscores https://underscores.me/ and Varia https://github.com/Automattic/themes/tree/master/varia, (C) 2012-2023 Automattic, Inc.
Underscores and Varia are distributed under the terms of the GNU GPL v2 or later.
*/

/**
 * The line above injects the WordPress file header. It needs to be first,
 * before this comment.
 */

/*
! tailwindcss v3.4.10 | MIT License | https://tailwindcss.com
*/

/*
1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
*/

*,
::before,
::after {
  box-sizing: border-box;
  /* 1 */
  border-width: 0;
  /* 2 */
  border-style: solid;
  /* 2 */
  border-color: #e5e7eb;
  /* 2 */
}

::before,
::after {
  --tw-content: '';
}

/*
1. Use a consistent sensible line-height in all browsers.
2. Prevent adjustments of font size after orientation changes in iOS.
3. Use a more readable tab size.
4. Use the user's configured `sans` font-family by default.
5. Use the user's configured `sans` font-feature-settings by default.
6. Use the user's configured `sans` font-variation-settings by default.
7. Disable tap highlights on iOS
*/

html,
:host {
  line-height: 1.5;
  /* 1 */
  -webkit-text-size-adjust: 100%;
  /* 2 */
  -moz-tab-size: 4;
  /* 3 */
  -o-tab-size: 4;
     tab-size: 4;
  /* 3 */
  font-family: var(--font-sans);
  /* 4 */
  font-feature-settings: normal;
  /* 5 */
  font-variation-settings: normal;
  /* 6 */
  -webkit-tap-highlight-color: transparent;
  /* 7 */
}

/*
1. Remove the margin in all browsers.
2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.
*/

body {
  margin: 0;
  /* 1 */
  line-height: inherit;
  /* 2 */
}

/*
1. Add the correct height in Firefox.
2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
3. Ensure horizontal rules are visible by default.
*/

hr {
  height: 0;
  /* 1 */
  color: inherit;
  /* 2 */
  border-top-width: 1px;
  /* 3 */
}

/*
Add the correct text decoration in Chrome, Edge, and Safari.
*/

abbr:where([title]) {
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted;
}

/*
Remove the default font size and weight for headings.
*/

h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: inherit;
  font-weight: inherit;
}

/*
Reset links to optimize for opt-in styling instead of opt-out.
*/

a {
  color: inherit;
  text-decoration: inherit;
}

/*
Add the correct font weight in Edge and Safari.
*/

b,
strong {
  font-weight: bolder;
}

/*
1. Use the user's configured `mono` font-family by default.
2. Use the user's configured `mono` font-feature-settings by default.
3. Use the user's configured `mono` font-variation-settings by default.
4. Correct the odd `em` font sizing in all browsers.
*/

code,
kbd,
samp,
pre {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  /* 1 */
  font-feature-settings: normal;
  /* 2 */
  font-variation-settings: normal;
  /* 3 */
  font-size: 1em;
  /* 4 */
}

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

/*
1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
3. Remove gaps between table borders by default.
*/

table {
  text-indent: 0;
  /* 1 */
  border-color: inherit;
  /* 2 */
  border-collapse: collapse;
  /* 3 */
}

/*
1. Change the font styles in all browsers.
2. Remove the margin in Firefox and Safari.
3. Remove default padding in all browsers.
*/

button,
input,
optgroup,
select,
textarea {
  font-family: inherit;
  /* 1 */
  font-feature-settings: inherit;
  /* 1 */
  font-variation-settings: inherit;
  /* 1 */
  font-size: 100%;
  /* 1 */
  font-weight: inherit;
  /* 1 */
  line-height: inherit;
  /* 1 */
  letter-spacing: inherit;
  /* 1 */
  color: inherit;
  /* 1 */
  margin: 0;
  /* 2 */
  padding: 0;
  /* 3 */
}

/*
Remove the inheritance of text transform in Edge and Firefox.
*/

button,
select {
  text-transform: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Remove default button styles.
*/

button,
input:where([type='button']),
input:where([type='reset']),
input:where([type='submit']) {
  -webkit-appearance: button;
  /* 1 */
  background-color: transparent;
  /* 2 */
  background-image: none;
  /* 2 */
}

/*
Use the modern Firefox focus style for all focusable elements.
*/

:-moz-focusring {
  outline: auto;
}

/*
Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
*/

:-moz-ui-invalid {
  box-shadow: none;
}

/*
Add the correct vertical alignment in Chrome and Firefox.
*/

progress {
  vertical-align: baseline;
}

/*
Correct the cursor style of increment and decrement buttons in Safari.
*/

::-webkit-inner-spin-button,
::-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;
  /* 1 */
  outline-offset: -2px;
  /* 2 */
}

/*
Remove the inner padding in Chrome and Safari on macOS.
*/

::-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;
  /* 1 */
  font: inherit;
  /* 2 */
}

/*
Add the correct display in Chrome and Safari.
*/

summary {
  display: list-item;
}

/*
Removes the default spacing and border for appropriate elements.
*/

blockquote,
dl,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
figure,
p,
pre {
  margin: 0;
}

fieldset {
  margin: 0;
  padding: 0;
}

legend {
  padding: 0;
}

ol,
ul,
menu {
  list-style: none;
  margin: 0;
  padding: 0;
}

/*
Reset default styling for dialogs.
*/

dialog {
  padding: 0;
}

/*
Prevent resizing textareas horizontally by default.
*/

textarea {
  resize: vertical;
}

/*
1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
2. Set the default placeholder color to the user's configured gray 400 color.
*/

input::-moz-placeholder, textarea::-moz-placeholder {
  opacity: 1;
  /* 1 */
  color: #9ca3af;
  /* 2 */
}

input::placeholder,
textarea::placeholder {
  opacity: 1;
  /* 1 */
  color: #9ca3af;
  /* 2 */
}

/*
Set the default cursor for buttons.
*/

button,
[role="button"] {
  cursor: pointer;
}

/*
Make sure disabled buttons don't get the pointer cursor.
*/

:disabled {
  cursor: default;
}

/*
1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
   This can trigger a poorly considered lint error in some tools but is included by design.
*/

img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
  display: block;
  /* 1 */
  vertical-align: middle;
  /* 2 */
}

/*
Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
*/

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

/* Make elements with the HTML hidden attribute stay hidden by default */

[hidden] {
  display: none;
}

/* Default fonts */

:root {
  --font-sans: "Lato";
  --font-serif: "Spectral";
}

/* Sans-serif font options */

.font-lato {
  --font-sans: "Lato";
}

.font-nunito {
  --font-sans: "Nunito";
}

/*test*/

.font-opensans {
  --font-sans: "Open Sans";
}

/* Serif font options */

.font-alegreya {
  --font-serif: "Alegreya";
}

.font-cormorant {
  --font-serif: "Cormorant";
}

.font-spectral {
  --font-serif: "Spectral";
}

html {
  font-family: var(--font-sans);
  font-size: var(--font-size-body);
  text-align: pretty;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  line-height: 1.5;
}

body {
  text-wrap: pretty;
}

/* Global headings */

h1,
	h2,
	h3,
	h4,
	h5,
	h6 {
  font-family: var(--font-serif);
  letter-spacing: -0.02em;
  text-rendering: optimizeLegibility;
  line-height: var(--heading-line-height);
  text-wrap: balance;
}

h1,
	h2.wp-block-heading {
  font-size: var(--font-size-h1);
  margin-block-end: var(--margin-h1);
  line-height: 0.8;
}

h2 {
  font-size: var(--font-size-h2);
  margin-block-end: var(--margin-h2);
}

h3 {
  font-size: var(--font-size-h4);
  margin-block-end: var(--margin-h4);
}

h4 {
  font-size: var(--font-size-h5);
  margin-block-end: var(--margin-h5);
}

h5 {
  font-size: var(--font-size-h6);
  margin-block-end: var(--margin-h6);
}

h6 {
  font-size: var(--font-size-h6);
  margin-block-end: var(--margin-h6);
}

a {
  text-decoration: underline;
}

/* Global body text */

p {
  font-family: var(--font-sans);
  line-height: 1.625;
  font-size: var(--font-size-body);
  margin-block-end: var(--margin-p);
  line-height: var(--paragraph-line-height);
}

/* Navigation */

nav {
  font-family: var(--font-sans);
  font-weight: 500;
}

/* Forms */

input,
	textarea,
	select {
  font-family: var(--font-sans);
}

/* Buttons and interactive elements */

/* button,
	.btn,
	input[type="submit"] {
		font-family: var(--font-sans);
		font-weight: 500;
	} */

/* Content area and article list styles */

/* List styles */

main ul,
		main ol {
  margin-block-end: var(--margin-p);
  padding-left: var(--list-indent);
  line-height: var(--paragraph-line-height);
}

main ul {
  list-style-type: disc;
}

main ol {
  list-style-type: decimal;
}

/* Nested lists */

main ul ul,
		main ol ol,
		main ul ol,
		main ol ul {
  margin-block-start: var(--list-item-spacing);
  margin-block-end: var(--list-item-spacing);
}

/* List items */

main li {
  margin-block-end: var(--list-item-spacing);
  padding-left: var(--list-item-padding);
  position: relative;
}

/* Ensure last item doesn't have bottom margin */

main li:last-child {
  margin-block-end: 0;
}

/* Custom list markers */

main ul li::marker {
  color: var(--list-marker-color);
}

main ol li::marker {
  color: var(--list-marker-color);
  font-weight: 600;
}

/* Second level lists */

main ul ul {
  list-style-type: circle;
}

main ol ol {
  list-style-type: lower-alpha;
}

/* Third level lists */

main ul ul ul {
  list-style-type: square;
}

main ol ol ol {
  list-style-type: lower-roman;
}

:root {
  --white: #ffffff;
  --black: #000000;
  /* Neutral Colors */
  --color-white: #ede3d5;
  --color-black: #2a2a2a;
  --color-text: #2a2a2a;
  /* Primary Colors */
  --color-primary: #2c4534;
  --color-primary-alt: #7f9a88;
  /* Accent Colors */
  --color-accent: #a282c4;
  --color-accent-alt: #602816;
  /* Text Colors */
  --color-link: #c79142;
  --color-link-hover: #382c45;
  /* Utility Colors */
  --color-success: #2d5a27;
  --color-warning: #e88d4d;
  --color-error: #ff7f6a;
  --color-info: #3b5141;
  /* Background Colors */
  --color-background: color-mix(in srgb, var(--color-link) 10%, white);
  --color-background-alt: color-mix(in srgb, var(--color-link) 5%, white);
}

.theme-rooted {
  /* Primary Colors */
  --color-primary: #2c4534;
  --color-primary-alt: #7f9a88;
  /* Accent Colors */
  --color-accent: #a282c4;
  --color-accent-alt: #602816;
  /* Text Colors */
  --color-link: #c79142;
  --color-link-hover: #382c45;
  /* Utility Colors */
  --color-success: #2d5a27;
  --color-warning: #e88d4d;
  --color-error: #ff7f6a;
  --color-info: #3b5141;
}

.theme-lilac {
  /* Primary Colors */
  --color-primary: #4b3f33;
  --color-primary-alt: #9f8e7d;
  /* Accent Colors */
  --color-accent: #5b5075;
  --color-accent-alt: #54875a;
  /* Text Colors */
  --color-link: #724bcc;
  --color-link-hover: #39324a;
  /* Utility Colors */
  --color-success: #5c6d3a;
  --color-warning: #a96e3e;
  --color-error: #c97b63;
  --color-info: #6b5e4f;
  --color-background: color-mix(in srgb, var(--color-link) 5%, white);
  --color-background-alt: color-mix(in srgb, var(--color-link) 3%, white);
}

.theme-rustic {
  /* Primary Colors */
  --color-primary: #6b4423;
  --color-primary-alt: #c09e7f;
  /* Accent Colors */
  --color-accent: #2b5c34;
  --color-accent-alt: #34234f;
  /* Text Colors */
  --color-link: #2b5c34;
  --color-link-hover: #34234f;
  /* Utility Colors */
  --color-success: #4a5d32;
  --color-warning: #c49b7c;
  --color-error: #a65d57;
  --color-info: #8b5e3c;
}

.theme-night {
  --white: #000000;
  --black: #ffffff;
  /* Primary Colors */
  --color-primary: #a14f33;
  --color-primary-alt: #615c49;
  /* Accent Colors */
  --color-accent: #e0ca7b;
  --color-accent-alt: #c1e0d9;
  /* Base Colors */
  --color-background: #1a1a1a;
  --color-background-alt: #2a2a2a;
  --color-text: #e4d8c6;
  --color-link: var(--color-accent);
  --color-link-hover: var(--color-accent-alt);
  /* Utility Colors */
  --color-success: #587728;
  --color-warning: #8f7338;
  --color-error: #773018;
  --color-info: #602816;
}

.theme-night .btn-primary {
  color: var(--color-text);
}

*, ::before, ::after {
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position:  ;
  --tw-gradient-via-position:  ;
  --tw-gradient-to-position:  ;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
  --tw-contain-size:  ;
  --tw-contain-layout:  ;
  --tw-contain-paint:  ;
  --tw-contain-style:  ;
}

::backdrop {
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position:  ;
  --tw-gradient-via-position:  ;
  --tw-gradient-to-position:  ;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
  --tw-contain-size:  ;
  --tw-contain-layout:  ;
  --tw-contain-paint:  ;
  --tw-contain-style:  ;
}

.container {
  width: 100%;
}

@media (min-width: 640px) {
  .container {
    max-width: 640px;
  }
}

@media (min-width: 768px) {
  .container {
    max-width: 768px;
  }
}

@media (min-width: 1024px) {
  .container {
    max-width: 1024px;
  }
}

@media (min-width: 1280px) {
  .container {
    max-width: 1280px;
  }
}

@media (min-width: 1536px) {
  .container {
    max-width: 1536px;
  }
}

/* Article specific styles */

article h1,
		article h2,
		article h3,
		article h4,
		article h5,
		article h6 {
  font-family: var(--font-serif);
  text-rendering: optimizeLegibility;
}

article p {
  font-family: var(--font-sans);
}

article blockquote {
  font-family: var(--font-serif);
}

article blockquote p {
  font-family: var(--font-serif);
  font-size-adjust: 0.5;
  font-style: italic;
}

/* Widget and Heading styles */

.widget-title,
	.wp-block-heading {
  font-size: 1.5rem;
  margin-bottom: 1rem;
}

.wp-block-heading {
  text-align: center;
}

/* Table-related styles */

thead th {
  font-family: var(--font-sans);
  font-weight: 600;
}

tbody td {
  font-family: var(--font-sans);
}

.has-text-align-center {
  text-align: center;
}

.has-text-align-right {
  text-align: right;
}

.has-text-align-left {
  text-align: left;
}

.has-text-align-justify {
  text-align: justify;
}

/* Base button styles */

.btn,
	input.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.32rem 1.5rem;
  font-family: var(--font-serif);
  font-weight: 500;
  font-size: var(--font-size-h5);
  text-align: center;
  transition: all 200ms ease-in-out;
  width: auto;
  cursor: pointer;
  -moz-appearance: none;
       appearance: none;
  -webkit-appearance: none;
  /* text-transform: uppercase; */
  text-decoration: none;
  border: 2px solid transparent;
  border-radius: 10px;
  text-shadow: var(--text-shadow-default);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.btn:focus, input.btn:focus {
  outline: none;
  ring: 2px solid currentColor;
  ring-offset: 2px;
}

.btn:hover {
  text-decoration: none;
  box-shadow:
			inset 3px 2px 4px 2px rgb(255 255 255 / 12%),
			0 4px 8px rgba(0, 0, 0, 0.15);
}

/* Primary button */

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

.btn-primary:hover {
  background-color: var(--color-accent);
  color: var(--color-background);
  border-color: transparent;
}

/* Secondary button - outlined */

.btn-secondary {
  border: 2px solid var(--color-primary);
  color: var(--color-primary);
  background-color: transparent;
}

.btn-secondary:hover {
  background-color: var(--color-primary);
  color: var(--color-background);
}

.btn-secondary:focus {
  box-shadow: 0 0 0 2px rgb(var(--color-primary) / 0.2);
}

/* Accent button */

.btn-accent {
  background-color: var(--color-accent);
  color: var(--color-background);
}

.btn-accent:hover {
  background-color: var(--color-accent-alt);
  color: var(--color-background);
}

.btn-accent:focus {
  box-shadow: 0 0 0 2px rgb(var(--color-accent) / 0.2);
}

/* Text button */

.btn-text {
  color: var(--color-link);
  font-size: var(--font-size-body);
  background: none;
  padding: 0;
  margin: 0;
  border: none;
  box-shadow: none;
  text-transform: none;
  font-weight: normal;
  text-shadow: none;
  text-decoration: underline;
  display: inline;
}

.btn-text:hover {
  color: var(--color-link-hover);
  box-shadow: none;
  background: none;
  border: none;
  text-decoration: underline;
}

.btn-text:focus {
  box-shadow: none;
}

/* Small size */

.btn-sm {
  padding: 0.375rem 1rem;
  font-size: 0.875rem;
}

/* Large size */

.btn-lg {
  padding: 0.75rem 2rem;
  font-size: 1.125rem;
}

/* Full width */

.btn-full {
  width: 100%;
}

/* Disabled state */

.btn[disabled],
	.btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}

/* Loading state */

.btn-loading {
  position: relative;
  color: transparent;
}

.btn-loading::after {
  content: "";
  position: absolute;
  inset: 0;
  margin: auto;
  width: 1.25rem;
  height: 1.25rem;
  border: 2px solid currentColor;
  border-top-color: transparent;
  border-radius: 9999px;
  animation: button-spin 0.6s linear infinite;
}

@keyframes button-spin {
  to {
    transform: rotate(360deg);
  }
}

/* Icon button */

.btn-icon {
  padding: 0.5rem;
}

.btn-icon.btn-sm {
  padding: 0.375rem;
}

.btn-icon.btn-lg {
  padding: 0.75rem;
}

/* Group buttons */

.btn-group {
  display: inline-flex;
}

.btn-group .btn {
  border-radius: 0;
}

.btn-group .btn:first-child {
  border-top-left-radius: 0.375rem;
  border-bottom-left-radius: 0.375rem;
}

.btn-group .btn:last-child {
  border-top-right-radius: 0.375rem;
  border-bottom-right-radius: 0.375rem;
}

.btn-group .btn + .btn {
  margin-left: -1px;
}

/* Widget container styles */

.widget_mc4wp_form_widget {
  width: 100%;
}

.widget_mc4wp_form_widget .widget-title {
  text-align: center;
}

.widget_mc4wp_form_widget form {
  margin-top: 2rem;
}

/* Form layout */

.widget_mc4wp_form_widget .mailchimp-footer {
  display: grid;
  gap: 1rem;
}

.widget_mc4wp_form_widget .mailchimp-footer p {
  width: 100%;
  margin: 0;
}

@media (min-width: 768px) {
  .widget_mc4wp_form_widget .mailchimp-footer {
    grid-template-columns: 2fr 1fr 1fr auto;
    align-items: center
  }

  .widget_mc4wp_form_widget .mailchimp-footer p {
    margin: 0;
  }
}

/* Base Form Styles */

/* Form Input Styles */

form input[type="email"],
		form input[type="text"],
		form input[type="number"],
		form input[type="tel"],
		form textarea {
  width: 100%;
  padding: 0.5rem 1rem;
  transition: all 150ms ease-in-out;
  border: 1px solid var(--color-text);
  border-radius: 0.375rem;
  background-color: var(--color-background);
}

form textarea {
  min-height: 6rem;
  resize: vertical;
  line-height: 1.5;
}

form input[type="email"]:focus,
		form input[type="text"]:focus,
		form input[type="number"]:focus,
		form input[type="tel"]:focus,
		form textarea:focus {
  outline: none;
  border-color: var(--color-primary);
  box-shadow: 0 0 0 2px rgb(var(--color-primary) / 0.2);
  background-color: var(--white);
}

/* Form Labels */

form label {
  display: block;
  margin-bottom: 0.5rem;
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--color-text);
}

form label:has(input[type="checkbox"]),
		form label:has(input[type="radio"]) {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0;
  font-weight: 400;
  cursor: pointer;
}

form .wpcf7-form-control-wrap {
  margin-block-start: 0.5rem;
  display: block;
}

form .wpcf7-checkbox,
		form .mc4wp-checkbox {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

form .wpcf7-list-item {
  display: block;
  margin: 0;
}

/* Checkbox Styles */

form input[type="checkbox"] {
  position: relative;
  -moz-appearance: none;
       appearance: none;
  -webkit-appearance: none;
  width: 1.25rem;
  height: 1.25rem;
  flex-shrink: 0;
  border: 1px solid var(--color-text);
  border-radius: 0.25rem;
  cursor: pointer;
  transition: all 150ms ease-in-out;
  background-color: var(--color-background);
}

form input[type="checkbox"]:checked {
  border-color: var(--color-primary);
  background-color: var(--white);
  box-shadow: 0 0 0 2px rgb(var(--color-primary) / 0.2);
}

form input[type="checkbox"]:checked::after {
  content: "";
  position: absolute;
  top: 45%;
  left: 50%;
  width: 0.35rem;
  height: 0.65rem;
  border: solid var(--color-primary);
  border-width: 0 2px 2px 0;
  transform: translate(-50%, -50%) rotate(45deg);
}

form input[type="checkbox"]:focus {
  outline: none;
  border-color: var(--color-primary);
  box-shadow: 0 0 0 2px rgb(var(--color-primary) / 0.2);
  background-color: var(--white);
}

/* Radio Button Styles */

form input[type="radio"] {
  position: relative;
  -moz-appearance: none;
       appearance: none;
  -webkit-appearance: none;
  width: 1.25rem;
  height: 1.25rem;
  flex-shrink: 0;
  border: 1px solid var(--color-text);
  border-radius: 50%;
  cursor: pointer;
  transition: all 150ms ease-in-out;
  background-color: var(--color-background);
}

form input[type="radio"]:checked {
  border-color: var(--color-primary);
  background-color: var(--white);
  box-shadow: 0 0 0 2px rgb(var(--color-primary) / 0.2);
}

form input[type="radio"]:checked::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 0.625rem;
  height: 0.625rem;
  border-radius: 50%;
  background-color: var(--color-primary);
  box-shadow: 0 0 0 2px rgb(var(--color-primary) / 0.2);
}

form input[type="radio"]:focus {
  outline: none;
  border-color: var(--color-primary);
  box-shadow: 0 0 0 2px rgb(var(--color-primary) / 0.2);
  background-color: var(--white);
}

/* Error states */

form input:invalid,
		form textarea:invalid {
  box-shadow: 0 0 0 2px rgb(var(--color-accent) / 0.2);
}

form input:invalid:focus,
		form textarea:invalid:focus {
  border-color: var(--color-accent);
}

/* Placeholder styling */

form input::-moz-placeholder, form textarea::-moz-placeholder {
  color: var(--color-text/60);
}

form input::placeholder,
		form textarea::placeholder {
  color: var(--color-text/60);
}

/* Focus styles */

form input:focus,
		form textarea:focus {
  outline: none;
}

/* Form Messages */

form .success-message {
  color: var(--color-primary);
  font-size: 0.875rem;
  margin-top: 0.5rem;
}

form .error-message {
  color: var(--color-accent);
  font-size: 0.875rem;
  margin-top: 0.5rem;
}

/* CF7 / form submit — use [submit class:btn class:btn-primary "Label"] in CF7 */

form p:has(.wpcf7-submit) {
  margin-block-start: 1rem;
}

form input.wpcf7-submit:not(.btn) {
  width: auto;
}

form .form-submit.loading,
		form button[type="submit"].loading,
		form input[type="submit"].loading {
  /* btn-loading class styles are inherited from buttons.css */
}

/* MailChimp Specific Styles */

/* Form-specific button styles */

#mc_embed_signup .form-submit,
		#mc_embed_signup button[type="submit"],
		#mc_embed_signup input[type="submit"] {
  /* btn class styles are inherited from buttons.css */
  margin-block-start: 1rem;
}

/* Loading state for form buttons */

#mc_embed_signup .form-submit.loading,
		#mc_embed_signup button[type="submit"].loading,
		#mc_embed_signup input[type="submit"].loading {
  /* btn-loading class styles are inherited from buttons.css */
}

#mc_embed_signup .mc-field-group {
  margin-block-end: 1rem;
}

#mc_embed_signup .indicates-required {
  font-size: 0.75rem;
  color: var(--color-text/80);
  margin-block-end: 0.75rem;
  text-align: right;
}

/* Radio Button List */

#mc_embed_signup .input-group ul {
  list-style: none;
  padding: 0;
  margin: 0.5rem 0;
}

#mc_embed_signup .input-group li {
  display: flex;
  align-items: center;
  margin-bottom: 0.5rem;
}

#mc_embed_signup .input-group li label {
  margin-bottom: 0;
  cursor: pointer;
}

#mc_embed_signup .input-group strong {
  display: block;
  margin-bottom: 0.5rem;
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--color-text);
}

/* Adjust header and menu positioning when nav is open */

body.nav-is-open.admin-bar #masthead {
  top: var(--wp-admin--admin-bar--height) !important;
  position: relative !important;
}

body.nav-is-open.admin-bar #primary-menu {
  top: calc(
			var(--wp-admin--admin-bar--height) + var(--header-height)
		) !important;
}

/* Base navigation structure */

#site-navigation {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

#site-navigation a {
  text-decoration: none;
}

/* Toggle button and menu visibility */

#site-navigation #site-nav-toggle {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  left: -9999px;
}

#site-navigation #site-nav-toggle:checked ~ #primary-menu {
  display: flex;
}

#site-navigation #site-nav-toggle:checked ~ * .nav-toggle-label {
  color: var(--color-link);
}

#site-navigation #site-nav-toggle:checked ~ * .nav-toggle-icon span:first-child {
  top: 0.75rem;
  transform: rotate(45deg);
  background-color: var(--color-link);
}

#site-navigation #site-nav-toggle:checked ~ * .nav-toggle-icon span:nth-child(2) {
  opacity: 0;
}

#site-navigation #site-nav-toggle:checked ~ * .nav-toggle-icon span:last-child {
  top: 0.75rem;
  transform: rotate(-45deg);
  background-color: var(--color-link);
}

/* Toggle button styling */

#site-navigation .nav-toggle-label {
  display: block;
  cursor: pointer;
  margin-left: auto;
}

#site-navigation .nav-toggle-label:hover {
  color: var(--color-link-hover);
}

@media (min-width: 768px) {
  #site-navigation .nav-toggle-label {
    display: none
  }
}

#site-navigation .nav-toggle-icon {
  position: relative;
  width: 1.5rem;
  height: 1.5rem;
}

#site-navigation .nav-toggle-icon span {
  position: absolute;
  left: 0;
  display: block;
  height: 0.125rem;
  width: 1.5rem;
  background-color: currentColor;
  transform: translateZ(0);
  transition: all 200ms;
}

#site-navigation .nav-toggle-icon span:first-child {
  top: 0.25rem;
}

#site-navigation .nav-toggle-icon span:nth-child(2) {
  top: 0.75rem;
}

#site-navigation .nav-toggle-icon span:last-child {
  top: 1.25rem;
}

/* Primary menu container */

#site-navigation #primary-menu {
  position: fixed;
  inset: 0;
  top: var(--header-height);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0;
  display: none;
  z-index: 50;
  padding: 1rem 1rem 1rem 2rem;
  background-color: var(--color-background);
  overflow-y: auto;
}

@media (min-width: 768px) {
  #site-navigation #primary-menu {
    position: static;
    width: auto;
    background-color: transparent;
    flex-direction: row;
    align-items: center;
    gap: 1rem;
    display: flex;
    overflow: visible;
    padding: 0
  }
}

#site-navigation #primary-menu > .sub-menu {
  filter: drop-shadow(2px 3px 3px rgba(0, 0, 0, 0.3));
}

/* Menu items base styles */

#site-navigation .menu-item {
  position: relative;
  width: 100%;
}

@media (min-width: 768px) {
  #site-navigation .menu-item {
    width: auto
  }
}

#site-navigation .menu-item > a {
  padding: 1rem;
  color: var(--color-text);
  word-break: break-word;
  display: flex;
  align-items: center;
  font-size: 1.125rem;
  line-height: 1;
  transition: color 200ms;
}

/* font-weight: bold; */

#site-navigation .menu-item > a:hover {
  color: var(--color-link);
}

@media (min-width: 768px) {
  #site-navigation .menu-item > a {
    font-size: clamp(0.85rem, -0.023rem + 1.818vw, 1rem);
    padding: 0.5rem 0;
    white-space: nowrap
  }
}

/* Submenu styles */

/* Mobile: Make room for toggle button */

@media (max-width: 767px) {
  #site-navigation .menu-item-has-children {
    display: flex;
    flex-wrap: wrap;
    align-items: center
  }

  #site-navigation .menu-item-has-children > a {
    flex: 1;
  }
}

/* Toggle button styling */

#site-navigation .menu-item-has-children .submenu-toggle {
  padding: 1.15rem;
  font-size: 1.125rem;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--color-text);
  transition: color 200ms;
}

#site-navigation .menu-item-has-children .submenu-toggle:hover {
  color: var(--color-link);
}

@media (min-width: 768px) {
  #site-navigation .menu-item-has-children .submenu-toggle {
    display: none
  }
}

#site-navigation .menu-item-has-children .submenu-toggle::after {
  content: "";
  width: 1rem;
  height: 1rem;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(-45deg);
  transition: transform 200ms;
}

/* Parent focus state rotates toggle arrow */

#site-navigation .menu-item-has-children.focus-within > .submenu-toggle {
  color: var(--color-link);
}

#site-navigation .menu-item-has-children.focus-within > .submenu-toggle::after {
  transform: translateX(5px) rotate(45deg);
}

/* Top level toggle buttons */

#site-navigation .menu-item-has-children > .submenu-toggle:active {
  background-color: var(--color-background-alt);
}

/* Submenu toggle buttons */

#site-navigation .menu-item-has-children .sub-menu .submenu-toggle:active {
  background-color: var(--color-background);
}

/* Desktop arrow indicator */

@media (min-width: 768px) {
  #site-navigation .menu-item-has-children > a::after {
    content: "";
    display: inline-block;
    width: 0.25rem;
    height: 0.25rem;
    margin-left: 0.5rem;
    border-right: 1px solid currentColor;
    border-bottom: 1px solid currentColor;
    transform: rotate(45deg);
    transition: transform 200ms;
  }
}

/* Submenu default (mobile) styles */

#site-navigation .menu-item-has-children > .sub-menu {
  display: none;
  width: 100%;
  background-color: var(--color-background-alt);
}

@media (min-width: 768px) {
  #site-navigation .menu-item-has-children > .sub-menu {
    display: none;
    position: absolute;
    left: 0;
    top: 100%;
    padding-left: 0;
    background-color: var(--color-background-alt);
    min-width: 11rem;
    width: -moz-max-content;
    width: max-content;
    max-width: 20rem;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.1));
    box-shadow: 0 -1px 0 var(--color-link)
  }
}

/* Mobile submenu visibility */

#site-navigation .menu-item-has-children.focus-within > .sub-menu {
  display: block !important;
}

/* Desktop submenu visibility */

@media (min-width: 768px) {
  #site-navigation .menu-item-has-children:hover > .sub-menu {
    display: block;
  }
}

/* Nested submenu items */

#site-navigation .menu-item-has-children .sub-menu .menu-item > a {
  padding: 0.75rem 1rem;
  font-size: 0.875rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

#site-navigation .menu-item-has-children .sub-menu .menu-item > a:hover {
  background-color: var(--color-background);
  box-shadow: inset 0 4px 3px -2px rgba(0, 0, 0, 0.07);
}

@media (min-width: 768px) {
  #site-navigation .menu-item-has-children .sub-menu .menu-item > a {
    padding: 1rem
  }
}

/* Add consistent padding for second level items */

#site-navigation .menu-item-has-children .sub-menu .menu-item > a {
  padding-left: 2rem;
}

@media (min-width: 768px) {
  #site-navigation .menu-item-has-children .sub-menu .menu-item > a {
    padding-left: 1rem
  }
}

/* Parent gets background when submenu is hovered */

@media (min-width: 768px) {
  #site-navigation .menu-item-has-children .sub-menu .menu-item-has-children:hover > a,
						#site-navigation .menu-item-has-children .sub-menu .menu-item-has-children:focus-within > a {
    background-color: var(--color-background);
    box-shadow:
								0 -1px 0 var(--color-link),
								inset 0 4px 3px -2px rgba(0, 0, 0, 0.07);
  }
}

#site-navigation .menu-item-has-children .sub-menu .menu-item-has-children > .sub-menu {
  width: 100%;
}

@media (min-width: 768px) {
  #site-navigation .menu-item-has-children .sub-menu .menu-item-has-children > .sub-menu {
    width: auto;
    left: 100%;
    top: 0;
    margin-top: 0;
    padding-left: 0;
    filter: none
  }
}

/* Third level items have increased padding on mobile */

#site-navigation .menu-item-has-children .sub-menu .menu-item-has-children > .sub-menu .menu-item > a {
  padding-left: 3rem;
}

@media (min-width: 768px) {
  #site-navigation .menu-item-has-children .sub-menu .menu-item-has-children > .sub-menu .menu-item > a {
    padding-left: 1rem
  }
}

/* Add box shadow to nested submenu parents when hovered */

@media (min-width: 768px) {
  #site-navigation .menu-item-has-children .sub-menu .menu-item-has-children:hover > a {
    box-shadow:
								0 -1px 0 var(--color-link),
								inset 0 4px 3px -2px rgba(0, 0, 0, 0.07);
  }
}

#site-navigation .menu-item-has-children .sub-menu .menu-item-has-children > a::after {
  transform: rotate(-45deg);
  margin-left: auto;
}

@media (min-width: 768px) {
  #site-navigation .menu-item-has-children .sub-menu .menu-item-has-children > a::after {
    transform: rotate(-45deg)
  }
}

#site-navigation .menu-item-has-children .sub-menu .menu-item-has-children.focus-within > a::after {
  transform: rotate(45deg);
}

@media (min-width: 768px) {
  #site-navigation .menu-item-has-children .sub-menu .menu-item-has-children.focus-within > a::after {
    transform: rotate(-45deg)
  }
}

/* Edge detection for last items */

@media (min-width: 768px) {
  #site-navigation .menu-item-has-children:nth-last-child(-n + 2) > .sub-menu {
    right: 0;
    left: auto
  }

  #site-navigation .menu-item-has-children:nth-last-child(-n + 2) > .sub-menu .menu-item-has-children > .sub-menu {
    right: 100%;
    left: auto
  }
}

#site-navigation .menu-item-has-children:nth-last-child(-n + 2) > .sub-menu .menu-item-has-children > a::after {
  transform: rotate(135deg);
}

/* Focus and current item styles */

#site-navigation .menu-item a:focus-visible {
  outline: none;
  ring: 2px solid var(--color-link-hover);
  ring-offset: 2px;
  ring-offset-color: var(--color-background);
  border-radius: 0.25rem;
}

/* Current item styles for top level */

#site-navigation .menu-item.current-menu-item > a, #site-navigation .menu-item.current-menu-parent > a, #site-navigation .menu-item.current-menu-ancestor > a {
  color: var(--color-link);
}

/* Make the arrow match the text color */

#site-navigation .menu-item.current-menu-item > a::after, #site-navigation .menu-item.current-menu-parent > a::after, #site-navigation .menu-item.current-menu-ancestor > a::after {
  border-color: currentColor;
}

/* Current item styles for submenu items */

#site-navigation .sub-menu .menu-item.current-menu-item > a {
  color: var(--color-link);
  background-color: var(--color-background-alt);
}

/* Style all ancestors in the submenu */

#site-navigation .sub-menu .menu-item.current-menu-parent > a,
			#site-navigation .sub-menu .menu-item.current-menu-ancestor > a {
  color: var(--color-link);
}

/* Rotate arrows for current items and ancestors */

#site-navigation .sub-menu .menu-item.current-menu-item > a::after, #site-navigation .sub-menu .menu-item.current-menu-parent > a::after, #site-navigation .sub-menu .menu-item.current-menu-ancestor > a::after {
  border-color: currentColor;
}

@media (min-width: 768px) {
  #site-navigation .sub-menu .menu-item.current-menu-item > a::after, #site-navigation .sub-menu .menu-item.current-menu-parent > a::after, #site-navigation .sub-menu .menu-item.current-menu-ancestor > a::after {
    transform: rotate(-45deg)
  }
}

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

.pointer-events-none {
  pointer-events: none;
}

.visible {
  visibility: visible;
}

.collapse {
  visibility: collapse;
}

.static {
  position: static;
}

.fixed {
  position: fixed;
}

.absolute {
  position: absolute;
}

.relative {
  position: relative;
}

.inset-0 {
  inset: 0px;
}

.bottom-0 {
  bottom: 0px;
}

.left-0 {
  left: 0px;
}

.left-1 {
  left: 0.25rem;
}

.left-1\/2 {
  left: 50%;
}

.left-full {
  left: 100%;
}

.right-0 {
  right: 0px;
}

.right-2 {
  right: 0.5rem;
}

.right-full {
  right: 100%;
}

.top-0 {
  top: 0px;
}

.top-1 {
  top: 0.25rem;
}

.top-2 {
  top: 0.5rem;
}

.top-3 {
  top: 0.75rem;
}

.top-full {
  top: 100%;
}

.isolate {
  isolation: isolate;
}

.z-10 {
  z-index: 10;
}

.z-50 {
  z-index: 50;
}

.z-\[9999\] {
  z-index: 9999;
}

.col-span-1 {
  grid-column: span 1 / span 1;
}

.col-span-2 {
  grid-column: span 2 / span 2;
}

.col-span-3 {
  grid-column: span 3 / span 3;
}

.col-span-full {
  grid-column: 1 / -1;
}

.m-0 {
  margin: 0px;
}

.m-0\.5 {
  margin: 0.125rem;
}

.mx-auto {
  margin-left: auto;
  margin-right: auto;
}

.my-0 {
  margin-top: 0px;
  margin-bottom: 0px;
}

.my-auto {
  margin-top: auto;
  margin-bottom: auto;
}

.-mr-1 {
  margin-right: -0.25rem;
}

.mb-0 {
  margin-bottom: 0px;
}

.mb-12 {
  margin-bottom: 3rem;
}

.mb-2 {
  margin-bottom: 0.5rem;
}

.mb-3 {
  margin-bottom: 0.75rem;
}

.mb-4 {
  margin-bottom: 1rem;
}

.mb-6 {
  margin-bottom: 1.5rem;
}

.mb-8 {
  margin-bottom: 2rem;
}

.ml-1 {
  margin-left: 0.25rem;
}

.ml-2 {
  margin-left: 0.5rem;
}

.ml-auto {
  margin-left: auto;
}

.mr-3 {
  margin-right: 0.75rem;
}

.mr-auto {
  margin-right: auto;
}

.mt-0 {
  margin-top: 0px;
}

.mt-1 {
  margin-top: 0.25rem;
}

.mt-12 {
  margin-top: 3rem;
}

.mt-2 {
  margin-top: 0.5rem;
}

.mt-4 {
  margin-top: 1rem;
}

.mt-8 {
  margin-top: 2rem;
}

.mt-\[46px\] {
  margin-top: 46px;
}

.mt-auto {
  margin-top: auto;
}

.line-clamp-3 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.block {
  display: block;
}

.inline-block {
  display: inline-block;
}

.inline {
  display: inline;
}

.flex {
  display: flex;
}

.inline-flex {
  display: inline-flex;
}

.table {
  display: table;
}

.grid {
  display: grid;
}

.contents {
  display: contents;
}

.hidden {
  display: none;
}

.h-0 {
  height: 0px;
}

.h-2 {
  height: 0.5rem;
}

.h-20 {
  height: 5rem;
}

.h-32 {
  height: 8rem;
}

.h-4 {
  height: 1rem;
}

.h-40 {
  height: 10rem;
}

.h-48 {
  height: 12rem;
}

.h-5 {
  height: 1.25rem;
}

.h-8 {
  height: 2rem;
}

.h-auto {
  height: auto;
}

.h-full {
  height: 100%;
}

.h-px {
  height: 1px;
}

.w-1 {
  width: 0.25rem;
}

.w-12 {
  width: 3rem;
}

.w-2 {
  width: 0.5rem;
}

.w-20 {
  width: 5rem;
}

.w-32 {
  width: 8rem;
}

.w-4 {
  width: 1rem;
}

.w-40 {
  width: 10rem;
}

.w-48 {
  width: 12rem;
}

.w-5 {
  width: 1.25rem;
}

.w-6 {
  width: 1.5rem;
}

.w-auto {
  width: auto;
}

.w-full {
  width: 100%;
}

.w-max {
  width: -moz-max-content;
  width: max-content;
}

.w-px {
  width: 1px;
}

.min-w-14 {
  min-width: 3.5rem;
}

.max-w-11 {
  max-width: 2.75rem;
}

.max-w-16 {
  max-width: 4rem;
}

.max-w-2xl {
  max-width: 42rem;
}

.max-w-48 {
  max-width: 12rem;
}

.max-w-7xl {
  max-width: 80rem;
}

.max-w-full {
  max-width: 100%;
}

.max-w-lg {
  max-width: 32rem;
}

.max-w-md {
  max-width: 28rem;
}

.max-w-medium {
  max-width: var(--width--content-medium);
}

.max-w-none {
  max-width: none;
}

.max-w-screen-2xl {
  max-width: 1536px;
}

.max-w-screen-md {
  max-width: 768px;
}

.max-w-screen-xl {
  max-width: 1280px;
}

.max-w-wide {
  max-width: var(--width--content-wide);
}

.max-w-xl {
  max-width: 36rem;
}

.max-w-xs {
  max-width: 20rem;
}

.flex-shrink {
  flex-shrink: 1;
}

.flex-grow {
  flex-grow: 1;
}

.grow {
  flex-grow: 1;
}

.border-collapse {
  border-collapse: collapse;
}

.-translate-x-1 {
  --tw-translate-x: -0.25rem;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.-translate-x-1\/2 {
  --tw-translate-x: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.-translate-y-1 {
  --tw-translate-y: -0.25rem;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.-translate-y-2 {
  --tw-translate-y: -0.5rem;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.-translate-y-full {
  --tw-translate-y: -100%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.translate-x-1 {
  --tw-translate-x: 0.25rem;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.translate-y-0 {
  --tw-translate-y: 0px;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.translate-y-1 {
  --tw-translate-y: 0.25rem;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.translate-y-2 {
  --tw-translate-y: 0.5rem;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.translate-y-full {
  --tw-translate-y: 100%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.-rotate-45 {
  --tw-rotate: -45deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.rotate-45 {
  --tw-rotate: 45deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.scale-105 {
  --tw-scale-x: 1.05;
  --tw-scale-y: 1.05;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.transform {
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.cursor-not-allowed {
  cursor: not-allowed;
}

.cursor-pointer {
  cursor: pointer;
}

.select-none {
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}

.resize {
  resize: both;
}

.list-none {
  list-style-type: none;
}

.grid-cols-1 {
  grid-template-columns: repeat(1, minmax(0, 1fr));
}

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

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

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

.grid-rows-none {
  grid-template-rows: none;
}

.flex-row {
  flex-direction: row;
}

.flex-row-reverse {
  flex-direction: row-reverse;
}

.flex-col {
  flex-direction: column;
}

.flex-wrap {
  flex-wrap: wrap;
}

.place-items-start {
  place-items: start;
}

.place-items-center {
  place-items: center;
}

.content-start {
  align-content: flex-start;
}

.items-start {
  align-items: flex-start;
}

.items-end {
  align-items: flex-end;
}

.items-center {
  align-items: center;
}

.items-stretch {
  align-items: stretch;
}

.justify-start {
  justify-content: flex-start;
}

.justify-end {
  justify-content: flex-end;
}

.justify-center {
  justify-content: center;
}

.justify-between {
  justify-content: space-between;
}

.justify-around {
  justify-content: space-around;
}

.justify-items-center {
  justify-items: center;
}

.gap-0 {
  gap: 0px;
}

.gap-1 {
  gap: 0.25rem;
}

.gap-2 {
  gap: 0.5rem;
}

.gap-3 {
  gap: 0.75rem;
}

.gap-4 {
  gap: 1rem;
}

.gap-6 {
  gap: 1.5rem;
}

.gap-8 {
  gap: 2rem;
}

.space-y-16 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(4rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(4rem * var(--tw-space-y-reverse));
}

.space-y-2 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));
}

.space-y-4 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(1rem * var(--tw-space-y-reverse));
}

.self-start {
  align-self: flex-start;
}

.self-end {
  align-self: flex-end;
}

.justify-self-start {
  justify-self: start;
}

.justify-self-center {
  justify-self: center;
}

.overflow-hidden {
  overflow: hidden;
}

.overflow-y-auto {
  overflow-y: auto;
}

.whitespace-nowrap {
  white-space: nowrap;
}

.text-wrap {
  text-wrap: wrap;
}

.text-nowrap {
  text-wrap: nowrap;
}

.break-words {
  overflow-wrap: break-word;
}

.rounded {
  border-radius: 0.25rem;
}

.rounded-2xl {
  border-radius: 1rem;
}

.rounded-full {
  border-radius: 9999px;
}

.rounded-lg {
  border-radius: 0.5rem;
}

.rounded-md {
  border-radius: 0.375rem;
}

.rounded-b-lg {
  border-bottom-right-radius: 0.5rem;
  border-bottom-left-radius: 0.5rem;
}

.border {
  border-width: 1px;
}

.border-2 {
  border-width: 2px;
}

.border-b {
  border-bottom-width: 1px;
}

.border-b-2 {
  border-bottom-width: 2px;
}

.border-r {
  border-right-width: 1px;
}

.border-r-2 {
  border-right-width: 2px;
}

.border-t {
  border-top-width: 1px;
}

.border-dashed {
  border-style: dashed;
}

.border-current {
  border-color: currentColor;
}

.border-gray-300 {
  --tw-border-opacity: 1;
  border-color: rgb(209 213 219 / var(--tw-border-opacity));
}

.border-t-accent {
  border-top-color: var(--color-accent);
}

.border-t-transparent {
  border-top-color: transparent;
}

.bg-accent {
  background-color: var(--color-accent);
}

.bg-accent-alt {
  background-color: var(--color-accent-alt);
}

.bg-background {
  background-color: var(--color-background);
}

.bg-background-alt {
  background-color: var(--color-background-alt);
}

.bg-current {
  background-color: currentColor;
}

.bg-gray-100 {
  --tw-bg-opacity: 1;
  background-color: rgb(243 244 246 / var(--tw-bg-opacity));
}

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

.bg-transparent {
  background-color: transparent;
}

.bg-white {
  background-color: var(--color-white);
}

.bg-gradient-to-t {
  background-image: linear-gradient(to top, var(--tw-gradient-stops));
}

.to-transparent {
  --tw-gradient-to: transparent var(--tw-gradient-to-position);
}

.object-contain {
  -o-object-fit: contain;
     object-fit: contain;
}

.object-cover {
  -o-object-fit: cover;
     object-fit: cover;
}

.p-0 {
  padding: 0px;
}

.p-0\.5 {
  padding: 0.125rem;
}

.p-1 {
  padding: 0.25rem;
}

.p-2 {
  padding: 0.5rem;
}

.p-3 {
  padding: 0.75rem;
}

.p-4 {
  padding: 1rem;
}

.p-5 {
  padding: 1.25rem;
}

.p-6 {
  padding: 1.5rem;
}

.p-8 {
  padding: 2rem;
}

.px-0 {
  padding-left: 0px;
  padding-right: 0px;
}

.px-3 {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}

.px-4 {
  padding-left: 1rem;
  padding-right: 1rem;
}

.px-6 {
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}

.px-8 {
  padding-left: 2rem;
  padding-right: 2rem;
}

.py-1 {
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
}

.py-2 {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}

.py-3 {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}

.py-4 {
  padding-top: 1rem;
  padding-bottom: 1rem;
}

.py-8 {
  padding-top: 2rem;
  padding-bottom: 2rem;
}

.pl-0 {
  padding-left: 0px;
}

.pl-1 {
  padding-left: 0.25rem;
}

.pl-4 {
  padding-left: 1rem;
}

.pl-8 {
  padding-left: 2rem;
}

.pr-8 {
  padding-right: 2rem;
}

.pt-4 {
  padding-top: 1rem;
}

.pt-8 {
  padding-top: 2rem;
}

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

.font-sans {
  font-family: var(--font-sans);
}

.font-serif {
  font-family: var(--font-serif);
}

.text-2xl {
  font-size: 1.5rem;
  line-height: 2rem;
}

.text-3xl {
  font-size: 1.875rem;
  line-height: 2.25rem;
}

.text-4xl {
  font-size: 2.25rem;
  line-height: 2.5rem;
}

.text-6xl {
  font-size: 3.75rem;
  line-height: 1;
}

.text-base {
  font-size: 1rem;
  line-height: 1.5rem;
}

.text-lg {
  font-size: 1.125rem;
  line-height: 1.75rem;
}

.text-sm {
  font-size: 0.875rem;
  line-height: 1.25rem;
}

.text-xl {
  font-size: 1.25rem;
  line-height: 1.75rem;
}

.text-xs {
  font-size: 0.75rem;
  line-height: 1rem;
}

.font-bold {
  font-weight: 700;
}

.font-light {
  font-weight: 300;
}

.font-medium {
  font-weight: 500;
}

.font-normal {
  font-weight: 400;
}

.font-semibold {
  font-weight: 600;
}

.uppercase {
  text-transform: uppercase;
}

.normal-case {
  text-transform: none;
}

.italic {
  font-style: italic;
}

.leading-none {
  line-height: 1;
}

.leading-relaxed {
  line-height: 1.625;
}

.tracking-tight {
  letter-spacing: -0.025em;
}

.tracking-tighter {
  letter-spacing: -0.05em;
}

.tracking-wider {
  letter-spacing: 0.05em;
}

.text-accent {
  color: var(--color-accent);
}

.text-background {
  color: var(--color-background);
}

.text-black {
  color: var(--color-black);
}

.text-link {
  color: var(--color-link);
}

.text-primary {
  color: var(--color-primary);
}

.text-text {
  color: var(--color-text);
}

.text-white {
  color: var(--color-white);
}

.underline {
  text-decoration-line: underline;
}

.no-underline {
  text-decoration-line: none;
}

.antialiased {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.opacity-0 {
  opacity: 0;
}

.opacity-100 {
  opacity: 1;
}

.opacity-20 {
  opacity: 0.2;
}

.opacity-30 {
  opacity: 0.3;
}

.opacity-40 {
  opacity: 0.4;
}

.opacity-50 {
  opacity: 0.5;
}

.opacity-80 {
  opacity: 0.8;
}

.shadow {
  --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.shadow-lg {
  --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.shadow-md {
  --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.shadow-none {
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.shadow-sm {
  --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
  --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.outline-none {
  outline: 2px solid transparent;
  outline-offset: 2px;
}

.outline {
  outline-style: solid;
}

.outline-1 {
  outline-width: 1px;
}

.ring {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}

.ring-2 {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}

.ring-link-hover {
  --tw-ring-color: var(--color-link-hover);
}

.ring-offset-2 {
  --tw-ring-offset-width: 2px;
}

.ring-offset-background {
  --tw-ring-offset-color: var(--color-background);
}

.blur {
  --tw-blur: blur(8px);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}

.drop-shadow {
  --tw-drop-shadow: drop-shadow(0 1px 2px rgb(0 0 0 / 0.1)) drop-shadow(0 1px 1px rgb(0 0 0 / 0.06));
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}

.grayscale {
  --tw-grayscale: grayscale(100%);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}

.filter {
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}

.backdrop-filter {
  -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}

.transition {
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.transition-all {
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.transition-colors {
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.transition-opacity {
  transition-property: opacity;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.transition-shadow {
  transition-property: box-shadow;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.transition-transform {
  transition-property: transform;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.duration-100 {
  transition-duration: 100ms;
}

.duration-150 {
  transition-duration: 150ms;
}

.duration-200 {
  transition-duration: 200ms;
}

.duration-300 {
  transition-duration: 300ms;
}

.ease-in {
  transition-timing-function: cubic-bezier(0.4, 0, 1, 1);
}

.ease-in-out {
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

.ease-out {
  transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
}

.content-none {
  --tw-content: none;
  content: var(--tw-content);
}

#page {
  opacity: 0;
  animation-name: fade-in;
  animation-duration: 0.1s;
  animation-delay: 0.1s;
  animation-timing-function: cubic-bezier(1, -0.02, 1, 1);
  animation-fill-mode: forwards;
}

@keyframes fade-in {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.screen-reader-text {
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  height: 1px;
  width: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
}

/**
 * This injects custom `@font-face` rules.
 */

/**
 * Custom `@font-face` rules
 *
 * These will be added immediately before Tailwind's `base` layer.
 */

/* Sans-serif Fonts */

/* Lato */

@font-face {
  font-family: "Lato";

  src: url("fonts/Lato/Lato-Regular.ttf") format("truetype");

  font-weight: 400;

  font-style: normal;

  font-display: swap;
}

@font-face {
  font-family: "Lato";

  src: url("fonts/Lato/Lato-Bold.ttf") format("truetype");

  font-weight: 700;

  font-style: normal;

  font-display: swap;
}

/* Nunito */

@font-face {
  font-family: "Nunito";

  src: url("fonts/Nunito/Nunito-VariableFont_wght.ttf")
		format("truetype-variations");

  font-weight: 200 1000;

  font-style: normal;

  font-display: swap;
}

@font-face {
  font-family: "Nunito";

  src: url("fonts/Nunito/Nunito-Italic-VariableFont_wght.ttf")
		format("truetype-variations");

  font-weight: 200 1000;

  font-style: italic;

  font-display: swap;
}

/* Open Sans */

@font-face {
  font-family: "Open Sans";

  src: url("fonts/Open_Sans/OpenSans-VariableFont_wdth,wght.ttf")
		format("truetype-variations");

  font-weight: 300 800;

  font-stretch: 75% 100%;

  font-style: normal;

  font-display: swap;

  size-adjust: 95%;
}

@font-face {
  font-family: "Open Sans";

  src: url("fonts/Open_Sans/OpenSans-Italic-VariableFont_wdth,wght.ttf")
		format("truetype-variations");

  font-weight: 300 800;

  font-stretch: 75% 100%;

  font-style: italic;

  font-display: swap;

  size-adjust: 95%;
}

/* Serif Fonts */

/* Cormorant */

@font-face {
  font-family: "Cormorant";

  src: url("fonts/Cormorant/Cormorant-Bold.ttf") format("truetype");

  font-weight: 900;

  font-style: normal;

  font-display: swap;
}

/* Spectral */

@font-face {
  font-family: "Spectral";

  src: url("fonts/Spectral/Spectral-SemiBold.ttf") format("truetype");

  font-weight: 700;

  font-style: normal;

  font-display: swap;
}

/* Alegreya */

@font-face {
  font-family: "Alegreya";

  src: url("fonts/Alegreya/AlegreyaSansSC-Regular.ttf") format("truetype");

  font-weight: 400;

  font-style: normal;

  font-display: swap;
}

@font-face {
  font-family: "Alegreya";

  src: url("fonts/Alegreya/AlegreyaSansSC-Medium.ttf") format("truetype");

  font-weight: 500;

  font-style: normal;

  font-display: swap;
}

@font-face {
  font-family: "Alegreya";

  src: url("fonts/Alegreya/AlegreyaSansSC-Bold.ttf") format("truetype");

  font-weight: 700;

  font-style: normal;

  font-display: swap;
}

/* Font Classes */

/**
 * This injects Tailwind's base styles and any base styles registered by
 * plugins, then adds custom base styles.
 */

/**
 * Custom styles to immediately follow Tailwind's `base` layer
 *
 * "Add things like base typography styles [or] opinionated global resets."
 *
 * from https://tailwindcss.com/docs/plugins#adding-base-styles
 */

/* Explicit layer ordering for cascade control */

@layer base, components, utilities;

:root {
  --border-radius-card: 1rem;
  /* 16px, matches the button's rounded-2xl */
  --text-shadow-default: 0px 1px 1px rgba(0, 0, 0, 0.7);
  --card-accent-color: currentColor;
  /* Default to inheriting color */
}

/**
 * This uses the background and foreground colors declared in the
 * `theme.json` file and is applied both to the frontend and in the block
 * editor.
*/

body {
  background-color: var(--color-background);
}

a {
  color: var(--color-link);
}

a:hover {
  color: var(--color-link-hover);
}

img,
video {
  border-radius: var(--border-radius-card);
}

article figure img {
  border-radius: var(--border-radius-card);
  display: block;
  height: auto;
  max-width: 100%;
  margin-inline: auto;
}

article figure.alignfull img {
  border-radius: var(--border-radius-card);
}

/* dmitry https://youtu.be/MQFg2bdSY4Q?si=41fuNWcoWG_3TgaZ */

:root {
  /* Space */
  --space-3xs: clamp(0.25rem, 0.2283rem + 0.1087vw, 0.3125rem);
  --space-2xs: clamp(0.5rem, 0.4783rem + 0.1087vw, 0.5625rem);
  --space-xs: clamp(0.75rem, 0.7065rem + 0.2174vw, 0.875rem);
  --space-s: clamp(1rem, 0.9565rem + 0.2174vw, 1.125rem);
  --space-m: clamp(1.5rem, 1.4348rem + 0.3261vw, 1.6875rem);
  --space-l: clamp(2rem, 1.913rem + 0.4348vw, 2.25rem);
  --space-xl: clamp(3rem, 2.8696rem + 0.6522vw, 3.375rem);
  --space-2xl: clamp(4rem, 3.8261rem + 0.8696vw, 4.5rem);
  --space-3xl: clamp(5rem, 4.7826rem + 1.087vw, 5.625rem);
  /* Flow Space */
  --flow-space: var(--space-s);
  --flow-space-md: var(--space-m);
  --flow-space-lg: var(--space-l);
  --flow-space-xl: var(--space-xl);
  --flow-space-2xl: var(--space-xl);
  --flow-space-3xl: var(--space-xl);
  /* Content width */
  --width--content: 640px;
  --width--content-medium: 960px;
  --width--content-wide: 1400px;
  --width--site-gutter: var(--space-m);
}

/* Sticky footer using :has() selector */

#page:has(> header):has(> main):has(> footer) {
  min-height: 100dvh;
  display: grid;
  grid-template-rows: auto 1fr auto;
  grid-template-columns: minmax(0, 1fr);
  row-gap: var(--space-m);
}

/* Adjust for WordPress admin bar */

body.admin-bar #page:has(> header):has(> main):has(> footer) {
  min-height: calc(100dvh - 32px);
}

@media screen and (max-width: 782px) {
  body.admin-bar #page:has(> header):has(> main):has(> footer) {
    min-height: calc(100dvh - 46px);
  }
}

/* Flow Spacing */

.content-flow > * + * {
  /* margin-block-start: var(--flow-space); */
  margin-block-start: var(--flow-space-3xl);
}

.content-flow > * + :is(h1, h2, h3) {
  margin-block-start: var(--flow-space-lg);
}

.content-flow > * + .has-medium-flow-space,
.content-flow > .has-medium-flow-space + * {
  margin-block-start: var(--flow-space-md);
}

.content-flow > * + .has-large-flow-space,
.content-flow > .has-large-flow-space + * {
  margin-block-start: var(--flow-space-lg);
}

/* Content Width */

.content-width {
  --width--max: var(--width--content);
  margin-inline: auto;
  max-inline-size: min(
		100% - var(--width--site-gutter) * 2,
		var(--width--max)
	);
}

/* Default width for blocks that don't contain "align" in their class */

.wp-block-group:not([class*="align"]) {
  --width--max: var(--width--content-medium);
  margin-inline: auto;
  max-inline-size: min(
		100% - var(--width--site-gutter) * 2,
		var(--width--max)
	);
}

/* Clear floats */

.content-container::after {
  content: "";
  display: table;
  clear: both;
}

/* Remove the child selector approach since it was causing float issues */

.content-width > * {
  max-inline-size: 100%;
}

/* WordPress Alignments */

.alignfull {
  max-inline-size: none;
  margin-inline: auto;
}

.alignwide {
  --width--max: var(--width--content-wide);
  max-inline-size: min(
		100% - var(--width--site-gutter) * 2,
		var(--width--max)
	);
  margin-inline: auto;
}

.alignmedium {
  --width--max: var(--width--content-medium);
  max-inline-size: min(
		100% - var(--width--site-gutter) * 2,
		var(--width--max)
	);
  margin-inline: auto;
}

/* Basic image alignments */

figure.alignleft,
.alignleft,
.wp-block-image.alignleft,
.is-layout-constrained > .alignleft {
  float: none !important;
  margin: 1em auto !important;
  display: block;
}

figure.alignleft img,
.alignleft img,
.wp-block-image.alignleft img,
.is-layout-constrained > .alignleft img {
  margin: 0 auto !important;
}

figure.alignright,
.alignright,
.wp-block-image.alignright,
.is-layout-constrained > .alignright {
  float: none !important;
  margin: 1em auto !important;
  display: block;
}

figure.alignright img,
.alignright img,
.wp-block-image.alignright img,
.is-layout-constrained > .alignright img {
  margin: 0 auto !important;
}

@media screen and (min-width: 768px) {
  figure.alignleft,
	.alignleft,
	.wp-block-image.alignleft,
	.is-layout-constrained > .alignleft {
    float: left !important;
    margin: 0.5em 1.5em 1em 0 !important;
    margin-inline-end: 1.5em !important;
    margin-inline-start: 0 !important;
  }

  figure.alignleft img,
	.alignleft img,
	.wp-block-image.alignleft img,
	.is-layout-constrained > .alignleft img {
    margin: 0 !important;
  }

  figure.alignright,
	.alignright,
	.wp-block-image.alignright,
	.is-layout-constrained > .alignright {
    float: right !important;
    margin: 0.5em 0 1em 1.5em !important;
    margin-inline-start: 1.5em !important;
    margin-inline-end: 0 !important;
  }

  figure.alignright img,
	.alignright img,
	.wp-block-image.alignright img,
	.is-layout-constrained > .alignright img {
    margin: 0 !important;
  }
}

.aligncenter {
  clear: both;
  display: block;
  margin: 1em auto;
}

/* Image Width */

figure {
  margin: 0;
}

figure img {
  border-radius: 4px;
  display: block;
  height: auto;
  max-width: 100%;
}

figure figcaption {
  font-size: var(--step--1);
  font-style: italic;
  margin-block-start: var(--space-xs);
}

figure.alignfull {
  margin-inline: auto;
  max-inline-size: min(100vw, 100% - var(--width--site-gutter) * 2);
}

figure.alignfull img {
  inline-size: 100%;
  max-inline-size: 100%;
  border-radius: 0;
}

figure.alignfull figcaption {
  padding-inline: var(--width--site-gutter);
}

/* Typography System */

/* Font Size Configuration */

:root {
  /* Heading sizes with fluid typography */
  --font-size-xl: clamp(42.75px, 20.71px + 1.632vw, 53.25px);
  --font-size-h1: clamp(33.25px, 20.71px + 1.632vw, 42.75px);
  --font-size-h2: clamp(28.5px, 17.1px + 1.632vw, 38px);
  --font-size-h3: clamp(22.8px, 15.2px + 2.85vw, 28.5px);
  --font-size-h4: clamp(19px, 15.2px + 1.9vw, 22.8px);
  --font-size-h5: clamp(17.1px, 15.2px + 1.425vw, 19px);
  --font-size-h6: clamp(15.2px, 15.2px + 0.95vw, 17.1px);
  --font-size-body: clamp(15.2px, 11.4px + 0.95vw, 16.72px);
  --font-size-small: clamp(13.3px, 12.16px + 0.475vw, 13.68px);
  --heading-line-height: 1;
  --paragraph-line-height: 1.5;
  /* List styling variables */
  --list-indent: 2.5rem;
  --list-item-spacing: 0.5rem;
  --list-marker-color: currentColor;
  --list-item-padding: 0.5rem;
  /* Font Families */
  /* Original font configuration (with font switcher)
	--font-sans: var(--font-sans), system-ui, sans-serif;
	--font-serif: var(--font-serif), Georgia, serif;
	*/
  /* Client-selected fonts (January 2024) */
  --font-sans: "Nunito", system-ui, sans-serif;
  --font-serif: "Alegreya", Georgia, serif;
  /* Responsive margin-block-end values */
  --margin-h1: clamp(1.9rem, 4.75vw, 2.85rem);
  --margin-h2: clamp(1.6625rem, 3.8vw, 2.375rem);
  --margin-h3: clamp(1.425rem, 2.85vw, 1.9rem);
  --margin-h4: clamp(1.1875rem, 2.375vw, 1.6625rem);
  --margin-h5: clamp(0.95rem, 1.9vw, 1.425rem);
  --margin-h6: clamp(0.7125rem, 1.425vw, 1.1875rem);
  --margin-p: clamp(0.95rem, 1.9vw, 1.425rem);
}

/**
 * This injects Tailwind's component classes and any component classes
 * registered by plugins, then adds custom component classes.
 *
 * The `@import-glob` line imports all CSS files from the `components`
 * directory (except for `components.css`, which is imported on the following
 * line). This is meant to simplify the process of integrating styles from
 * JavaScript components or WordPress plugins.
 */

/**
 * Button Component Styles
 * A comprehensive button system with multiple variants, sizes, and states.
 * For form-specific button styles, see forms.css
 *
 * Usage:
 * 1. Base class required: .btn
 * 2. Combine with variants: .btn-primary, .btn-secondary, .btn-accent, .btn-text
 * 3. Optional size modifiers: .btn-sm, .btn-lg
 * 4. Additional modifiers: .btn-full (full-width), .btn-icon (icon-only)
 * 
 * Examples:
 * <button class="btn btn-primary">Primary Button</button>
 * <button class="btn btn-secondary btn-sm">Small Secondary</button>
 * <button class="btn btn-accent btn-lg">Large Accent</button>
 * <button class="btn btn-text">Text Button</button>
 * 
 * States:
 * - Hover: Changes background/text color
 * - Focus: Adds focus ring
 * - Disabled: Add disabled attribute
 * - Loading: Add .btn-loading class
 * 
 * Button Groups:
 * <div class="btn-group">
 *   <button class="btn btn-primary">Left</button>
 *   <button class="btn btn-primary">Right</button>
 * </div>
 */

/* Base wrapper styles */

/* width: 100%;
	max-width: var(--wp--style--global--content-size);
	margin-inline: auto; */

.hs-card-wrapper:not(.alignwide):not(.alignfull), .hs-card-repeater:not(.alignwide):not(.alignfull) {
  max-width: var(--wp--style--global--wide-size, 1400px);
}

.hs-card-wrapper .cards-grid > .acf-innerblocks-container {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  width: 100%;
}

@media (min-width: 768px) {
  .hs-card-wrapper .cards-grid > .acf-innerblocks-container {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr))
  }
}

.hs-card-repeater > .cards-grid {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  width: 100%;
}

@media (min-width: 768px) {
  .hs-card-repeater > .cards-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr))
  }
}

/* Empty state styling */

.card-empty-state {
  background-color: var(--wp--preset--color--gray-100);
  padding: 2rem;
  text-align: center;
}

/* Section styling */

.card-section-title,
.card-section-content {
  text-align: center;
  max-width: 42rem;
  margin-inline: auto;
}

.card-section-title {
  color: var(--wp--preset--color--text);
  margin-bottom: 3rem;
}

.card-section-content.card-section-content-above {
  margin-bottom: 3rem;
}

.card-section-content.card-section-content-below {
  margin-top: 3rem;
}

.card-section-button {
  margin-top: 2rem;
  text-align: center;
}

/**
 * Event Card Styles
 * 
 * Styles for the event cards in the events list view
 * These styles extend the base card styles to handle the specific
 * structure of the events list.
 * Using mobile-first approach
 */

/* Month separator styling */

.tribe-events-calendar-list__month-separator {
  margin: var(--flow-space-md) 0 !important;
  padding: var(--space-s) 0 !important;
  font-size: var(--font-size-h3) !important;
  color: var(--color-text) !important;
  border-bottom: 1px solid var(--color-primary) !important;
}

/* Event navigation */

.tribe-events-calendar-list-nav {
  margin-top: var(--flow-space-lg);
  padding-top: var(--space-m);
  border-top: 1px solid var(--color-border);
  display: flex;
  justify-content: space-between;
}

/* Adjust spacing for multiple events */

.tribe-events-calendar-list > div:not(:last-child) {
  margin-bottom: var(--flow-space-md);
}

/* Event card specific styles - Mobile First */

.tribe-events-calendar-list .hs-card.hs-card-event {
  margin-bottom: var(--flow-space-md);
}

.tribe-events-calendar-list .hs-card.hs-card-event .card-hover-text {
  color: var(--color-link) !important;
}

.tribe-events-calendar-list .hs-card.hs-card-event:hover .card-hover-text {
  color: var(--color-accent) !important;
}

/* Stack content and image on mobile by default */

.tribe-events-calendar-list .hs-card.hs-card-event .card-container {
  flex-direction: column;
}

.tribe-events-calendar-list .hs-card.hs-card-event .card-content {
  align-items: start;
}

.tribe-events-calendar-list .hs-card.hs-card-event .card-title {
  text-align: left;
}

.tribe-events-calendar-list .hs-card.hs-card-event .card-description {
  text-align: left;
}

/* Full width image on mobile */

.tribe-events-calendar-list .hs-card.hs-card-event .card-img {
  width: 100%;
  margin-block-start: var(--space-m);
}

/* Desktop layout (768px and above) */

@media (min-width: 768px) {
  .tribe-events-calendar-list .hs-card.hs-card-event .card-container {
    flex-direction: row;
  }

  .tribe-events-calendar-list .hs-card.hs-card-event .card-img {
    margin-block-start: 0;
  }
}

/* Center the entire card content */

.hs-card.hs-card-icon .card-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

/* Card icon wrapper */

.hs-card.hs-card-icon .card-icon-wrapper {
  position: relative;
  width: 12rem;
  height: 12rem;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  margin-left: auto;
  margin-right: auto;
}

/* Background circle */

.hs-card.hs-card-icon .card-icon-background {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border-radius: 9999px;
  opacity: 0.3;
  transition: all 100ms;
  left: 50%;
  transform: translateX(-50%);
  outline: 0px solid var(--shadow-color);
}

/* Icon image */

.hs-card.hs-card-icon .card-icon {
  width: 95%;
  height: 95%;
  margin-left: auto;
  margin-right: auto;
  -o-object-fit: contain;
     object-fit: contain;
  transition: all 150ms;
  z-index: 1;
}

/* Hover states */

.hs-card.hs-card-icon.has-link:hover .card-icon-background {
  opacity: 0.5;
  outline-width: 6px;
  outline-offset: -1px;
}

.hs-card.hs-card-icon.has-link:hover .card-icon {
  width: 100%;
  height: 100%;
}

/* Center title and description */

.hs-card.hs-card-icon .card-title,
		.hs-card.hs-card-icon .card-description {
  width: 100%;
  text-align: center;
}

.hs-card.hs-card-icon .card-subtitle {
  width: 100%;
  text-align: center;
  font-size: var(--font-size-h4);
}

/* Hover effect for text */

.hs-card.hs-card-icon .card-hover-text {
  transition: color 150ms;
}

.hs-card.hs-card-icon.has-link:hover .card-hover-text {
  color: var(--shadow-color);
}

/* WordPress default lightbox trigger styling */

.wp-lightbox-container {
  position: relative;
  margin-left: auto;
  margin-right: auto;
}

.wp-lightbox-container img {
  cursor: pointer;
  transition: opacity 0.2s ease;
  max-width: var(--img-width, auto);
  width: var(--img-width, auto);
  height: auto;
  border-radius: var(--border-radius-card);
}

.wp-lightbox-container img:hover {
  opacity: 0.9;
}

.wp-lightbox-container .lightbox-trigger {
  position: absolute;
  top: 25px;
  right: 25px;
  width: 32px;
  height: 32px;
  padding: 8px;
  background-color: rgba(0, 0, 0, 0.5);
  border: none;
  border-radius: 4px;
  cursor: pointer;
  opacity: 0;
  transition:
			opacity 0.2s ease,
			transform 0.2s ease;
  z-index: 2;
}

.wp-lightbox-container .lightbox-trigger:hover {
  transform: scale(1.1);
  background-color: rgba(0, 0, 0, 0.7);
}

.wp-lightbox-container .lightbox-trigger:focus {
  opacity: 1;
  outline: 2px solid white;
  outline-offset: 2px;
}

.wp-lightbox-container .lightbox-trigger svg {
  width: 16px;
  height: 16px;
}

.wp-lightbox-container .lightbox-trigger svg path {
  fill: white;
}

.wp-lightbox-container:hover .lightbox-trigger {
  opacity: 1;
}

.hs-card.hs-card-lightbox .card-meta {
  font-weight: 400;
}

/* Card overlay styles */

.lightbox-content-wrapper.hs-lightbox-card-overlay {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
  max-width: 90vw;
  max-height: 75vh;
  position: relative;
  margin: auto;
  background: var(--color-background);
  border-radius: var(--border-radius-card);
  overflow-y: auto;
}

@media (min-width: 768px) {
  .lightbox-content-wrapper.hs-lightbox-card-overlay {
    grid-template-columns: 1fr 1fr;
    max-width: 1200px;
    gap: 2rem;
    overflow: hidden
  }
}

.lightbox-content-wrapper.hs-lightbox-card-overlay .lightbox-image-wrapper {
  position: relative;
  width: 100%;
}

@media (min-width: 768px) {
  .lightbox-content-wrapper.hs-lightbox-card-overlay .lightbox-image-wrapper {
    aspect-ratio: auto;
    max-height: none
  }
}

.lightbox-content-wrapper.hs-lightbox-card-overlay .lightbox-image-wrapper .lightbox-image {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  margin: 0;
  border-radius: 0;
}

.lightbox-content-wrapper.hs-lightbox-card-overlay .lightbox-content-area {
  padding: 0 1.5rem 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  overflow-y: visible;
}

@media (min-width: 768px) {
  .lightbox-content-wrapper.hs-lightbox-card-overlay .lightbox-content-area {
    padding: 2rem 2rem 2rem 0;
    max-height: none;
    overflow-y: auto
  }
}

.lightbox-content-wrapper.hs-lightbox-card-overlay .lightbox-content-area .lightbox-title {
  margin: 0;
}

.lightbox-content-wrapper.hs-lightbox-card-overlay .lightbox-content-area .lightbox-subtitle {
  font-size: var(--font-size-small);
  font-weight: 400;
  text-transform: uppercase;
}

.lightbox-content-wrapper.hs-lightbox-card-overlay .lightbox-content-area .lightbox-description {
  line-height: 1.5;
  color: var(--color-text);
  font-size: 1rem;
}

.lightbox-content-wrapper.hs-lightbox-card-overlay .lightbox-content-area .lightbox-link {
  margin-top: auto;
}

.hs-card.hs-card-stats .card-container {
  align-items: center;
  text-align: center;
  height: 100%;
  width: 100%;
  margin-inline: auto;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  transition: all 200ms;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
  border-radius: var(--border-radius-card);
}

.hs-card.hs-card-stats .card-stat {
  font-size: var(--font-size-xl);
  font-weight: 700;
  text-shadow: var(--text-shadow-default);
  color: var(--color-text);
  line-height: 1;
}

.hs-card.hs-card-stats .card-description {
  font-size: 1.25rem;
  line-height: 1.2;
  margin: 0;
  text-shadow: var(--text-shadow-default);
  color: var(--color-text);
  text-align: center;
}

/* Base Card Block */

.wp-block-acf-card-image,
.wp-block-acf-card-event,
.wp-block-acf-card-post,
.wp-block-acf-video-embed {
  display: block;
  width: 100%;
}

/* Base Card Styles */

.hs-card {
  position: relative;
  transition: all 100ms ease-in-out;
  border-radius: var(--border-radius-card);
}

/* Group hover effects */

.hs-card.group.has-link {
  transition: all 100ms ease-in-out;
}

.hs-card.group.has-link:hover {
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}

/* Edit Button */

.hs-card .edit-button {
  position: absolute;
  top: 0.5rem;
  right: 0.5rem;
  z-index: 10;
  opacity: 0;
  transition: all 100ms;
  background-color: white;
  padding: 0.75rem;
  border-radius: 9999px;
  color: var(--color-text);
  text-decoration: none;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  display: flex;
  align-items: center;
  justify-content: center;
}

.hs-card .edit-button:hover {
  background-color: rgb(249, 250, 251);
  color: var(--color-primary);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}

.hs-card .edit-button .dashicons {
  width: 1.25rem;
  height: 1.25rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

.hs-card:hover .edit-button {
  opacity: 1;
}

/* Card Container */

.hs-card .card-container {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  margin: 0 auto;
  padding: 1rem;
  text-decoration: none;
}

/* Card Content */

.hs-card .card-content {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  align-items: center;
}

@media (min-width: 768px) {
  .hs-card .card-content {
    align-items: flex-start
  }
}

/* Alignment Classes */

.hs-card.align-center .card-content {
  justify-content: center;
}

.hs-card.align-start .card-content {
  justify-content: flex-start;
}

.hs-card.align-end .card-content {
  justify-content: flex-end;
}

/* Horizontal Layout */

@media (min-width: 768px) {
  .hs-card.span-2 .card-container {
    display: grid;
    grid-template-columns: 45% 1fr;
    gap: 2rem;
    align-items: start;
    height: 100%;
    position: relative;
  }

  .hs-card.span-2 .card-container .card-img {
    position: absolute;
    grid-column: 1;
    grid-row: 1 / -1;
    width: 45%;
    height: 100%;
    top: 0;
    left: 0;
    -o-object-fit: cover;
       object-fit: cover;
    aspect-ratio: unset;
  }

  .hs-card.span-2 .card-container .card-content {
    grid-column: 2;
    height: 100%;
  }

  .hs-card.span-3 .card-container {
    display: grid;
    grid-template-columns: 30% 1fr;
    gap: 2rem;
    align-items: center;
    position: relative;
    min-height: 300px;
  }

  .hs-card.span-3 .card-img {
    grid-column: 1;
    grid-row: 1;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    aspect-ratio: 4/3;
  }

  .hs-card.span-3 .card-content {
    grid-column: 2;
    grid-row: 1;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    height: 100%;
  }

  .hs-card.span-3.image-right .card-container {
    grid-template-columns: 1fr 30%;
  }

  .hs-card.span-3.image-right .card-img {
    grid-column: 2;
  }

  .hs-card.span-3.image-right .card-content {
    grid-column: 1;
  }

  .hs-card.span-3.align-center .card-content {
    justify-content: center;
  }

  .hs-card.span-3.align-start .card-content {
    justify-content: flex-start;
  }

  .hs-card.span-3.align-end .card-content {
    justify-content: flex-end;
  }
}

/* Card Image */

.hs-card .card-img {
  position: relative;
  width: 100%;
  /* Override lightbox container styles */
  height: auto;
  -o-object-fit: cover;
     object-fit: cover;
  aspect-ratio: 4/3;
  border-radius: var(--border-radius-card);
  outline: 2px solid transparent;
  transition: all 0.1s ease-in-out;
  max-width: none;
  /* Override lightbox container styles */
  /* &.is-contain {
			object-fit: contain;
			aspect-ratio: unset;
		} */
}

/* Hover states - only when card has a link */

.hs-card.group.has-link:hover .card-img {
  outline-color: color-mix(
			in srgb,
			var(--card-accent-color) 50%,
			transparent
		);
  outline-width: 5px;
}

.hs-card .rounded-full {
  outline: 0px solid var(--card-accent-color);
}

.hs-card.group:hover .rounded-full {
  outline-width: 5px;
}

/* Meta Text */

.hs-card .card-meta {
  font-size: var(--font-size-small);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin: 0;
  transition: all 100ms;
}

/* Title */

.hs-card .card-title {
  color: var(--color-text);
  margin: 0;
  transition: all 100ms;
  text-align: center;
}

@media (min-width: 768px) {
  .hs-card .card-title {
    text-align: left
  }
}

/* Description */

.hs-card .card-description {
  color: var(--color-text);
  margin: 0;
  text-align: center;
}

@media (min-width: 768px) {
  .hs-card .card-description {
    text-align: left
  }
}

.hs-card .card-description p:last-child {
  margin-bottom: 0;
}

/* Action Link */

.hs-card .action-link {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-weight: 500;
  margin: 0;
  transition: all 100ms;
}

/* Card Hover Effects */

.hs-card .card-hover-text {
  color: var(--card-accent-color);
  transition: all 100ms ease-in-out;
}

.hs-card.group.has-link .card-hover-text {
  color: var(--color-text);
}

.hs-card.group.has-link:hover .card-hover-text {
  color: var(--card-accent-color);
}

/* Column Spans */

.hs-card.span-1 {
  grid-column: span 1;
}

@media (min-width: 768px) {
  .hs-card.span-2 {
    grid-column: span 2
  }
}

.hs-card.span-3 {
  grid-column: 1 / -1;
}

body .content-footer .wp-block-social-links,
	body .wp-container-core-social-links-is-layout-1.wp-block-social-links {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  margin: 0 0 var(--margin-p) 0 !important;
  padding: 0 !important;
  float: none !important;
}

body .content-footer .wp-block-social-links .wp-social-link, body .wp-container-core-social-links-is-layout-1.wp-block-social-links .wp-social-link {
  display: flex !important;
  align-items: center !important;
  margin: 0 !important;
  padding: 0 !important;
}

body .content-footer .wp-block-social-links .wp-social-link a svg, body .wp-container-core-social-links-is-layout-1.wp-block-social-links .wp-social-link a svg {
  fill: currentColor !important;
  vertical-align: middle !important;
}

/**
 * Form Component Styles
 * Styles for form elements including form-specific buttons
 */

/* Lightbox overlay styles */

.wp-lightbox-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.9);
  display: none;
  justify-content: center;
  align-items: center;
  z-index: 9999;
}

.wp-lightbox-overlay.is-active {
  display: flex;
}

.lightbox-content {
  position: relative;
  max-width: 80vw;
}

/* Simple lightbox styles */

.lightbox-image-container {
  display: flex;
  justify-content: center;
  align-items: center;
}

.lightbox-image-container .lightbox-image {
  max-width: 100%;
  max-height: 80vh;
  -o-object-fit: contain;
     object-fit: contain;
  margin: auto;
  width: auto !important;
  /* Override any inline width */
  border-radius: var(--border-radius-card);
}

/* Close button styles */

.lightbox-close {
  position: absolute;
  top: -40px;
  right: -40px;
  width: 40px;
  height: 40px;
  background: transparent;
  border: none;
  color: white;
  cursor: pointer;
  padding: 8px;
  transition: transform 0.2s ease;
}

.lightbox-close:hover,
.lightbox-close:focus {
  transform: scale(1.1);
  outline: none;
}

.lightbox-close:focus-visible {
  outline: 2px solid white;
  outline-offset: 2px;
  border-radius: 4px;
}

/**
 * MailChimp Component Styles
 * Styles specific to MailChimp forms and elements
 */

/**
 * Navigation styles
 * Based on Flowbite's dropdown navigation pattern with mobile-first approach
 */

/* Import base styles and resets */

/* Base Tribe Events Styles */

.tribe-common .table-condensed {
  width: 100%;
}

/* General container */

.tribe-events .tribe-events-l-container {
  padding-top: var(--flow-space-lg) !important;
}

/* Buttons and inputs */

.tribe-common button[disabled],
.tribe-common input[disabled] {
  cursor: default;
  display: none;
}

/* Override Tribe's list reset for content area */

.tribe-events-content ul:not([class]),
.tribe-events-content ol:not([class]) {
  padding-left: var(--list-indent) !important;
  margin-block-end: var(--margin-p) !important;
  line-height: var(--paragraph-line-height) !important;
}

.tribe-events-content ul:not([class]) {
  list-style-type: disc !important;
}

.tribe-events-content ol:not([class]) {
  list-style-type: decimal !important;
}

/* Preserve Tribe's list reset for UI elements */

.tribe-events-header__events-bar ul,
.tribe-events-c-events-bar ul,
.tribe-events-c-view-selector__list,
.tribe-events-c-top-bar__nav-list,
.tribe-events-c-nav__list,
.tribe-events-c-search ul,
.tribe-events-header ul,
.tribe-events-header__top-bar ul,
.tribe-events-calendar-month-mobile-events__mobile-event-categories {
  padding-left: 0 !important;
  margin: 0 !important;
  list-style: none !important;
}

/* List items reset */

.tribe-events-header__events-bar li,
.tribe-events-c-events-bar li,
.tribe-events-c-view-selector__list-item,
.tribe-events-c-top-bar__nav-list-item,
.tribe-events-c-nav__list-item,
.tribe-events-c-search li,
.tribe-events-header li,
.tribe-events-header__top-bar li {
  padding-left: 0 !important;
  margin: 0 !important;
  position: static !important;
}

/* Import component styles */

/* Tribe Events Search Form Styles */

/* Search container */

@media (max-width: 767px) {
  .tribe-events .tribe-events-c-events-bar__search-container {
    background-color: var(--color-background-alt);
    box-shadow: 0px 7px 10px rgba(0, 0, 0, 0.2)
  }
}

/* Search input */

.tribe-common .tribe-common-form-control-text__input {
  height: auto;
  padding: 0.5rem 1rem !important;
  width: 100%;
}

/* Medium viewport styles */

.tribe-common--breakpoint-medium.tribe-events .tribe-events-c-search {
  gap: var(--space-s);
}

.tribe-common--breakpoint-medium.tribe-events .tribe-events-c-search__input-group {
  height: 100%;
}

.tribe-common--breakpoint-medium.tribe-events .tribe-events-c-search__input-control {
  flex: auto;
  margin: 0 !important;
  height: 100%;
}

.tribe-common--breakpoint-medium.tribe-common .tribe-common-form-control-text__input {
  padding: 0.5rem 1rem !important;
  height: 100%;
  margin: 0 !important;
}

/* Tribe Events Navigation Styles */

/* Event Navigation - applies to both header and footer navigation */

.tribe-events-nav-pagination {
  margin-top: var(--flow-space-md) !important;
  margin-bottom: var(--flow-space-md) !important;
}

/* Navigation list */

.tribe-events-sub-nav {
  display: flex;
  justify-content: space-between;
  padding-left: 0 !important;
  list-style-type: none !important;
  width: 100%;
}

.tribe-events-sub-nav li {
  position: relative;
  padding-left: 0 !important;
  max-width: 45%;
}

/* Navigation links - applies to both previous and next links */

.tribe-events-nav-previous a,
.tribe-events-nav-next a,
.tribe-events-back a {
  display: flex;
  align-items: center;
  text-decoration: none;
  font-weight: 500;
  transition: color 0.2s ease;
}

.tribe-events-nav-previous a:hover,
.tribe-events-nav-next a:hover,
.tribe-events-back a:hover {
  color: var(--color-link-hover);
}

/* Previous link alignment */

.tribe-events-nav-previous a {
  justify-content: flex-start;
}

/* Next link alignment */

.tribe-events-nav-next a {
  justify-content: flex-end;
}

/* Previous arrow (left-pointing) - applies to both header and footer */

.tribe-events-nav-previous a::before,
.tribe-events-back a::before {
  content: "";
  display: inline-block;
  width: 0.8em;
  height: 0.8em;
  border-top: 2px solid currentColor !important;
  border-left: 2px solid currentColor !important;
  transform: rotate(-45deg);
  margin-right: 0.75rem !important;
}

/* Next arrow (right-pointing) - applies to both header and footer */

.tribe-events-nav-next a::after {
  content: "";
  display: inline-block;
  width: 0.8em;
  height: 0.8em;
  border-top: 2px solid currentColor !important;
  border-right: 2px solid currentColor !important;
  transform: rotate(45deg);
  margin-left: 0.75rem !important;
}

/* Hide the original span characters */

.tribe-events-nav-previous a span,
.tribe-events-nav-next a span {
  display: none;
}

/* Back link specific styling */

.tribe-events-back {
  margin-bottom: var(--flow-space-md) !important;
}

/* List View Navigation */

.tribe-events-calendar-list-nav,
.tribe-events-c-nav {
  margin-top: var(--flow-space-md) !important;
  margin-bottom: var(--flow-space-md) !important;
}

.tribe-events-c-nav__list {
  display: flex;
  justify-content: space-between;
  padding-left: 0 !important;
  list-style-type: none !important;
  width: 100%;
}

.tribe-events-c-nav__list-item {
  position: relative;
  padding-left: 0 !important;
}

/* Style the navigation links */

.tribe-events-c-nav__prev,
.tribe-events-c-nav__next,
.tribe-events-c-nav__today {
  display: flex;
  align-items: center;
  text-decoration: none;
  font-weight: 500;
  transition: color 0.2s ease;
}

.tribe-events-c-nav__prev:hover,
.tribe-events-c-nav__next:hover,
.tribe-events-c-nav__today:hover {
  color: var(--color-link-hover);
}

/* Style the SVG icons to match our custom arrows */

.tribe-events .tribe-events-c-nav__next-icon-svg,
.tribe-events .tribe-events-c-nav__prev-icon-svg {
  display: block;
}

.tribe-events-c-nav__prev-icon-svg,
.tribe-events-c-nav__next-icon-svg {
  width: 0.8em;
  height: 0.8em;
  fill: currentColor;
}

.tribe-events-c-nav__prev-icon-svg {
  margin-right: 0.75rem !important;
}

.tribe-events-c-nav__next-icon-svg {
  margin-left: 0.75rem !important;
}

/* Ensure proper alignment */

.tribe-events-c-nav__prev {
  justify-content: flex-start;
}

.tribe-events-c-nav__next {
  justify-content: flex-end;
}

.tribe-events-c-nav__today {
  justify-content: center;
}

/* Top Bar Navigation */

.tribe-events-c-top-bar__nav-list {
  display: flex;
  gap: 0.5rem;
}

.tribe-events-c-top-bar__nav-list-item {
  display: flex;
  align-items: center;
}

/* Tribe Events Single Event Styles */

/* Featured image */

.tribe-events-event-image img {
  margin: auto !important;
}

/* Container */

.tribe-events-single > .tribe_events {
  overflow: visible;
}

/* Headers */

.tribe-events-schedule h1 {
  font-size: var(--font-size-h2);
}

.tribe-events-schedule h2 {
  font-size: var(--font-size-h3);
}

/* Primary meta section */

.tribe-events-event-meta.primary,
.tribe-events-event-meta.secondary {
  gap: var(--flow-space-md);
  width: 100%;
}

@media (min-width: 768px) {
  .tribe-events-event-meta.primary,
.tribe-events-event-meta.secondary {
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    position: static;
    width: 100%;
    display: grid;
    grid-template-columns: 60% 40%;
    gap: var(--flow-space-md)
  }
}

/* Secondary meta section */

.tribe-events-event-meta.secondary {
  margin-top: var(--flow-space-lg) !important;
}

/* Meta group */

.tribe-events-meta-group {
  margin-right: 0 !important;
  order: 0;
}

@media (min-width: 768px) {
  .tribe-events-meta-group {
    padding: 0 !important;
    width: 100%
  }
}

/* Venue map */

.tribe-events-venue-map {
  border-radius: var(--border-radius-card) !important;
  overflow: hidden;
}

@media (min-width: 768px) {
  .tribe-events-venue-map {
    width: 100%;
    margin: 0 !important
  }
}

/* Override the plugin's max-height restriction */

.tribe-events-venue-map > div,
	.tribe-events-venue-map > iframe {
  max-height: 241px;
  /* Keep the mobile height */
}

/* Subscribe dropdown */

.single-tribe_events
	.tribe-events-c-subscribe-dropdown
	.tribe-events-c-subscribe-dropdown__button,
.tribe-events
	.tribe-events-c-subscribe-dropdown
	.tribe-events-c-subscribe-dropdown__button {
  display: flex;
  align-items: center;
  gap: var(--space-xs);
  justify-content: flex-end;
  cursor: pointer;
}

.single-tribe_events
	.tribe-events-c-subscribe-dropdown
	.tribe-events-c-subscribe-dropdown__content,
.tribe-events
	.tribe-events-c-subscribe-dropdown
	.tribe-events-c-subscribe-dropdown__content {
  display: none;
  position: relative;
}

.single-tribe_events
	.tribe-events-c-subscribe-dropdown
	.tribe-events-c-subscribe-dropdown__list,
.tribe-events
	.tribe-events-c-subscribe-dropdown
	.tribe-events-c-subscribe-dropdown__list {
  position: absolute;
  inset-inline-end: 0;
  background-color: var(--color-background-alt);
  width: 220px;
  box-shadow: 0px 7px 10px rgba(0, 0, 0, 0.2);
}

/* Tribe Events Day View Styles */

/* Day View */

.tribe-events .tribe-events-calendar-day__type-separator {
  margin-bottom: var(--flow-space-lg) !important;
}

/* Tribe Events Month View Styles */

/* Month View Typography Overrides */

.tribe-common.tribe-events .tribe-events-calendar-month__header-column-title {
  font-size: var(--font-size-body) !important;
  font-family: var(--font-sans) !important;
  font-weight: 500 !important;
}

.tribe-common.tribe-events .tribe-events-calendar-month__day-date {
  font-size: var(--font-size-body) !important;
  font-family: var(--font-sans) !important;
}

.tribe-common.tribe-events
	.tribe-events-calendar-month__multiday-event-bar-title {
  font-family: var(--font-sans) !important;
  font-size: var(--font-size-small) !important;
  line-height: 1.3 !important;
  font-weight: 500 !important;
  overflow: visible !important;
  white-space: normal !important;
  padding: 2px 0 !important;
}

.tribe-events-calendar-month__multiday-event-bar-inner {
  padding: 2px 8px !important;
}

/* Position fix for multi-day events */

.tribe-events-calendar-month__multiday-event {
  position: relative !important;
}

/* Improve month view event display */

.tribe-common.tribe-events .tribe-events-calendar-month__calendar-event-title {
  font-family: var(--font-sans) !important;
  /* font-size: var(--font-size-body) !important; */
  font-weight: 500 !important;
}

.tribe-common.tribe-events
	.tribe-events-calendar-month__calendar-event-tooltip-title {
  font-family: var(--font-sans) !important;
  font-size: var(--font-size-body) !important;
  font-weight: 500 !important;
}

/* Ensure proper spacing in month view */

.tribe-common.tribe-events .tribe-events-calendar-month__day {
  padding: 0.5rem !important;
}

.tribe-common.tribe-events .tribe-events-calendar-month__calendar-event {
  margin-top: 0 !important;
  padding: 8px !important;
}

.tribe-common--breakpoint-medium.tribe-events
	.tribe-events-calendar-month__day-cell--selected {
  border: 2px solid var(--color-accent) !important;
}

.tribe-events-calendar-month__week:first-child
	.tribe-events-calendar-month__day {
  border-top-width: 1px !important;
}

.tribe-events-calendar-month__week
	.tribe-events-calendar-month__day:first-child {
  border-left-width: 1px !important;
}

.tribe-events-calendar-month__calendar-event {
  position: relative !important;
  margin: 0 !important;
  padding: 8px !important;
  border-radius: 4px !important;
  transition: background-color 0.2s ease !important;
}

.tribe-events-calendar-month__calendar-event-details {
  margin-top: 4px !important;
}

/* Remove any existing background */

.tribe-events-calendar-month__calendar-event-details {
  background-color: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
  border: none !important;
}

/* Create a wrapper that mimics the multiday event bar */

.tribe-events-calendar-month__calendar-event {
  background-color: color-mix(
		in srgb,
		var(--color-primary-alt) 10%,
		transparent
	) !important;
  border-left: 3px solid var(--color-primary) !important;
  border-radius: 5px !important;
  transition: background-color 0.2s ease !important;
  padding: 2px 8px !important;
  margin-top: 0.5rem !important;
  margin-bottom: 0.5rem !important;
}

.tribe-events-calendar-month__calendar-event:hover {
  background-color: color-mix(
		in srgb,
		var(--color-primary-alt) 20%,
		transparent
	) !important;
}

.tribe-events-calendar-month__calendar-event-datetime {
  font-family: var(--font-sans) !important;
  font-size: var(--font-size-small) !important;
  line-height: 1.3 !important;
  font-weight: 500 !important;
  color: var(--color-text) !important;
  margin-bottom: 2px !important;
}

.tribe-events-calendar-month__calendar-event-title {
  font-family: var(--font-sans) !important;
  font-size: var(--font-size-small) !important;
  line-height: 1.3 !important;
  font-weight: 500 !important;
  overflow: visible !important;
  white-space: normal !important;
  color: var(--color-text) !important;
}

/* Style the title link to look like regular text */

.tribe-events-calendar-month__calendar-event-title-link {
  color: var(--color-text) !important;
  text-decoration: none !important;
}

.tribe-events-calendar-month__calendar-event-title-link:hover,
.tribe-events-calendar-month__calendar-event-title-link:focus,
.tribe-events-calendar-month__calendar-event-title-link:active {
  color: var(--color-link-hover) !important;
}

/* Featured single-day event */

.tribe-events-calendar-month__calendar-event--featured {
  background-color: color-mix(
		in srgb,
		var(--color-accent) 15%,
		transparent
	) !important;
  border-left: 3px solid var(--color-accent) !important;
}

.tribe-events-calendar-month__calendar-event--featured:hover {
  background-color: color-mix(
		in srgb,
		var(--color-accent) 25%,
		transparent
	) !important;
}

/* Multi-day event styling */

.tribe-events-calendar-month__multiday-event {
  position: relative !important;
}

.tribe-events-calendar-month__multiday-event-bar {
  background-color: color-mix(
		in srgb,
		var(--color-primary-alt) 10%,
		transparent
	) !important;
  border-left: 3px solid var(--color-primary) !important;
  border-radius: 5px !important;
  transition: background-color 0.2s ease !important;
}

.tribe-events-calendar-month__multiday-event-bar:hover {
  background-color: var(--color-link-hover) !important;
}

.tribe-events-calendar-month__multiday-event-bar-inner {
  padding: 2px 8px !important;
}

.tribe-events-calendar-month__multiday-event-bar-title {
  font-family: var(--font-sans) !important;
  font-size: var(--font-size-small) !important;
  line-height: 1.3 !important;
  font-weight: 500 !important;
  overflow: visible !important;
  white-space: normal !important;
  color: var(--color-text) !important;
}

/* Featured multi-day event */

.tribe-events-calendar-month__multiday-event--featured
	.tribe-events-calendar-month__multiday-event-bar {
  background-color: color-mix(
		in srgb,
		var(--color-accent) 15%,
		transparent
	) !important;
  border-left: 3px solid var(--color-accent) !important;
}

.tribe-events-calendar-month__multiday-event--featured
	.tribe-events-calendar-month__multiday-event-bar:hover {
  background-color: color-mix(
		in srgb,
		var(--color-accent) 25%,
		transparent
	) !important;
}

.tribe-events-calendar-month__multiday-event-bar-featured-icon {
  margin-right: 5px !important;
}

/* Tribe Events Tooltip Styles */

/* Event Tooltip Styling */

.tooltipster-base.tribe-events-tooltip-theme {
  max-width: 320px !important;
  padding: 0 !important;
  border-radius: 8px !important;
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.15) !important;
  overflow: hidden !important;
}

.tooltipster-base.tribe-events-tooltip-theme .tooltipster-box {
  margin: 0 !important;
  border: none !important;
  border-radius: 8px !important;
  background-color: var(--white) !important;
}

.tooltipster-base.tribe-events-tooltip-theme .tooltipster-content {
  padding: 0 !important;
}

/* Featured image styling */

.tribe-events-calendar-month__calendar-event-tooltip-featured-image-wrapper {
  margin: 0 !important;
  width: 100% !important;
}

.tribe-events-calendar-month__calendar-event-tooltip-featured-image {
  width: 100% !important;
  height: 100% !important;
  -o-object-fit: cover !important;
     object-fit: cover !important;
  transform: scale(1.01) !important;
  /* Prevent tiny white border */
}

/* Content container */

.tribe-events-calendar-month__calendar-event-tooltip {
  padding: 16px !important;
}

/* Date styling */

.tribe-events-calendar-month__calendar-event-tooltip-datetime {
  font-family: var(--font-sans) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: var(--color-primary-alt) !important;
  margin-top: 12px !important;
  margin-bottom: 8px !important;
  display: block !important;
}

/* Title styling */

.tribe-events-calendar-month__calendar-event-tooltip-title {
  font-family: var(--font-sans) !important;
  font-size: 18px !important;
  line-height: 1.3 !important;
  margin: 0 0 12px 0 !important;
}

.tribe-events-calendar-month__calendar-event-tooltip-title-link {
  color: var(--color-link) !important;
  text-decoration: none !important;
  transition: color 0.2s ease !important;
}

.tribe-events-calendar-month__calendar-event-tooltip-title-link:hover {
  color: var(--color-link-hover) !important;
}

/* Description styling */

.tribe-events-calendar-month__calendar-event-tooltip-description {
  font-family: var(--font-sans) !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
  color: var(--color-text) !important;
  margin: 0 !important;
}

/* Cost styling */

.tribe-events-calendar-month__calendar-event-tooltip-cost {
  font-family: var(--font-sans) !important;
  font-weight: 600 !important;
  color: var(--color-primary) !important;
  margin-top: 12px !important;
  display: inline-block !important;
}

/* Tribe Events View Selector Styles */

/* Base selectors for tribe-events components */

/* View selector container */

@media (max-width: 767px) {
  .tribe-events .tribe-events-c-view-selector__content {
    background-color: var(--color-background-alt);
    box-shadow: 0px 7px 10px color-mix(in srgb, black 20%, transparent)
  }
}

/* View Selector Dropdown */

/* Individual selector components */

.tribe-events-c-view-selector__list {
  background-color: var(--color-background-alt);
  border-radius: 4px !important;
  box-shadow: 0 2px 10px color-mix(in srgb, black 10%, transparent);
}

.tribe-events-c-view-selector__list-item-link {
  display: flex;
  align-items: center;
  padding: 0.75rem 1rem !important;
  text-decoration: none;
  transition: background-color 0.2s ease;
}

/* Combined tribe-common and tribe-events styles */

/* View Selector Tabs (List/Month/Day) */

.tribe-common.tribe-events .tribe-events-header__events-bar .tribe-common-form-control-tabs__list,
	.tribe-common.tribe-events .tribe-events-c-view-selector__tabs-list,
	.tribe-common.tribe-events .tribe-events-c-view-selector--tabs .tribe-events-c-view-selector__list {
  display: flex !important;
  gap: 5px !important;
  padding: 0.5rem !important;
  background-color: var(--color-background-alt) !important;
  border-radius: 4px !important;
  border: 1px solid color-mix(in srgb, black 8%, var(--color-background)) !important;
  height: auto !important;
}

.tribe-common.tribe-events
		.tribe-events-header__events-bar
		.tribe-common-form-control-tabs__list-item,
	.tribe-common.tribe-events .tribe-events-c-view-selector__tabs-list-item,
	.tribe-common.tribe-events
		.tribe-events-c-view-selector--tabs
		.tribe-events-c-view-selector__list-item {
  margin: 0 !important;
  padding: 0 !important;
  position: static !important;
}

.tribe-common.tribe-events
		.tribe-events-header__events-bar
		.tribe-common-form-control-tabs__list-item-link,
	.tribe-common.tribe-events .tribe-events-c-view-selector__tabs-list-item-link,
	.tribe-common.tribe-events
		.tribe-events-c-view-selector--tabs
		.tribe-events-c-view-selector__list-item-link,
	.tribe-common.tribe-events
		.tribe-events-c-view-selector--labels
		.tribe-events-c-view-selector__list-item-link {
  padding: 0.5rem !important;
  text-decoration: none !important;
  font-weight: 500 !important;
  color: var(--color-text, #333) !important;
  border-bottom: 2px solid transparent !important;
  transition: all 0.2s ease !important;
  height: auto !important;
  position: relative !important;
}

.tribe-common.tribe-events
		.tribe-events-header__events-bar
		.tribe-common-form-control-tabs__list-item-link:hover, .tribe-common.tribe-events .tribe-events-c-view-selector__tabs-list-item-link:hover, .tribe-common.tribe-events
		.tribe-events-c-view-selector--tabs
		.tribe-events-c-view-selector__list-item-link:hover, .tribe-common.tribe-events
		.tribe-events-c-view-selector--labels
		.tribe-events-c-view-selector__list-item-link:hover {
  color: var(--color-accent) !important;
  border-bottom-color: var(--color-accent) !important;
}

.tribe-common.tribe-events
		.tribe-events-header__events-bar
		.tribe-common-form-control-tabs__list-item--active
		.tribe-common-form-control-tabs__list-item-link,
	.tribe-common.tribe-events
		.tribe-events-c-view-selector__tabs-list-item--active
		.tribe-events-c-view-selector__tabs-list-item-link,
	.tribe-common.tribe-events
		.tribe-events-c-view-selector--tabs
		.tribe-events-c-view-selector__list-item--active
		.tribe-events-c-view-selector__list-item-link,
	.tribe-common.tribe-events
		.tribe-events-c-view-selector--labels
		.tribe-events-c-view-selector__list-item--active
		.tribe-events-c-view-selector__list-item-link {
  color: var(--color-primary) !important;
  border-bottom-color: var(--color-primary) !important;
}

/* Active tab indicator for tabs view */

.tribe-common.tribe-events
		.tribe-events-c-view-selector--tabs
		.tribe-events-c-view-selector__list-item--active
		.tribe-events-c-view-selector__list-item-link:after {
  background-color: var(--color-primary) !important;
  bottom: 0 !important;
  content: "" !important;
  display: block !important;
  height: 2px !important;
  position: absolute !important;
  width: 100% !important;
}

/* Today/Upcoming tabs styling with higher specificity */

.tribe-common.tribe-events .tribe-events-header__messages + ul {
  display: flex !important;
  gap: 1rem !important;
  padding: 0.5rem 1rem !important;
  background-color: #fff !important;
  border-radius: 4px !important;
  border: 1px solid color-mix(in srgb, black 8%, var(--color-background)) !important;
  margin-bottom: 1rem !important;
  list-style: none !important;
}

.tribe-common.tribe-events .tribe-events-header__messages + ul li {
  padding: 0 !important;
  margin: 0 !important;
  position: static !important;
}

.tribe-common.tribe-events .tribe-events-header__messages + ul li a {
  padding: 0.25rem 0.5rem !important;
  text-decoration: none !important;
  font-weight: 500 !important;
  color: var(--color-text, #333) !important;
  border-bottom: 2px solid transparent !important;
  transition: all 0.2s ease !important;
  display: block !important;
}

.tribe-common.tribe-events .tribe-events-header__messages + ul li a:hover {
  color: var(--color-accent) !important;
  border-bottom-color: var(--color-accent) !important;
}

.tribe-common.tribe-events .tribe-events-header__messages + ul li.tribe-events-c-nav__list-item--active a {
  color: var(--color-primary) !important;
  border-bottom-color: var(--color-primary) !important;
}

/* Fix for view selector icons and double underline */

.tribe-common.tribe-events
		.tribe-events-c-view-selector--labels
		.tribe-events-c-view-selector__list-item-icon,
	.tribe-common.tribe-events
		.tribe-events-c-view-selector--tabs
		.tribe-events-c-view-selector__list-item-icon {
  display: inline-block !important;
  visibility: visible !important;
  margin-right: 0.5rem !important;
}

/* Keep the button icon hidden */

.tribe-common.tribe-events
		.tribe-events-c-view-selector--labels
		.tribe-events-c-view-selector__button-icon,
	.tribe-common.tribe-events
		.tribe-events-c-view-selector--tabs
		.tribe-events-c-view-selector__button {
  display: none !important;
  visibility: hidden !important;
}

/* Fix double underline issue */

.tribe-common.tribe-events
		.tribe-events-c-view-selector--tabs
		.tribe-events-c-view-selector__list-item--active
		.tribe-events-c-view-selector__list-item-link:after {
  display: none !important;
}

/* Ensure the list items in the dropdown have proper spacing */

.tribe-common.tribe-events .tribe-events-c-view-selector__list-item {
  margin-bottom: 0.25rem !important;
}

.tribe-common.tribe-events .tribe-events-c-view-selector__list-item:last-child {
  margin-bottom: 0 !important;
}

/* Fix for view selector button */

.tribe-common.tribe-events .tribe-events-c-view-selector__button {
  background: transparent !important;
  padding: 0.5rem !important;
  border: none !important;
}

.tribe-common.tribe-events .tribe-events-c-view-selector__button-text {
  display: inline-block !important;
  visibility: visible !important;
  font-weight: 500 !important;
  color: var(--color-text, #333) !important;
}

/* Hide the button icon but show the dropdown caret */

.tribe-common.tribe-events .tribe-events-c-view-selector__button-icon {
  display: none !important;
  visibility: hidden !important;
}

.tribe-common.tribe-events .tribe-events-c-view-selector__button-icon-caret-svg {
  display: inline-block !important;
  visibility: visible !important;
  margin-left: 0.5rem !important;
}

/* Fix for Today/Upcoming tabs - Base styles */

.tribe-events-header__messages + ul {
  list-style: none !important;
  padding-left: 0 !important;
  margin: 0 !important;
  display: flex;
  gap: 1rem;
}

.tribe-events-header__messages + ul li {
  padding-left: 0 !important;
  margin: 0 !important;
}

/* Tribe Events Notices Styles */

/* Event Notices */

.tribe-events-notices {
  margin: 1.5rem 0 !important;
  padding: 0 !important;
  border: none !important;
  background: none;
}

.tribe-events-notices ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  text-align: left;
}

.tribe-events-notices li {
  display: inline-block;
  padding: 0.5rem 1rem !important;
  margin: 0 !important;
  font-style: italic;
  font-size: 0.95em;
  color: var(--color-text) !important;
  background-color: var(--color-background-alt) !important;
  border-radius: 4px !important;
  border-left: 3px solid var(--color-info) !important;
}

/* Tribe Events Mobile Styles */

/* Mobile Event Styles */

.tribe-events-calendar-month-mobile-events__mobile-event--featured {
  border-left: 3px solid var(--color-accent) !important;
}

.tribe-events-calendar-month-mobile-events__mobile-event-details {
  padding: 20px !important;
  /* Increased padding for better spacing */
}

/* Featured image */

.tribe-events-calendar-month-mobile-events__mobile-event-featured-image-wrapper {
  margin-bottom: 0 !important;
  overflow: hidden;
  /* Removing max-height to prevent image cutoff */
}

.tribe-events-calendar-month-mobile-events__mobile-event-featured-image {
  width: 100%;
  height: auto;
  display: block;
}

/* Categories */

.tribe-events-calendar-month-mobile-events__mobile-event-categories {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin: 0 0 8px 0 !important;
  padding-left: 0 !important;
  list-style: none !important;
}

.tribe-events-calendar-month-mobile-events__mobile-event-category {
  display: inline-block;
  padding: 4px 10px !important;
  /* Increased padding for better pill appearance */
  border-radius: 12px !important;
  background: var(
		--color-primary,
		#3d9970
	);
  /* Changed to primary color instead of primary-alt */
  font-size: 11px;
  font-weight: 500;
  color: #fff;
  /* Changed to white text */
  text-transform: uppercase;
  letter-spacing: 0.5px;
  text-decoration: none;
  transition: all 0.2s ease;
}

.tribe-events-calendar-month-mobile-events__mobile-event-category:hover,
.tribe-events-calendar-month-mobile-events__mobile-event-category:focus {
  background: var(--color-link-hover);
}

/* Date display */

.tribe-events-calendar-month-mobile-events__mobile-event-date {
  margin: 8px 0 !important;
  color: var(--color-text);
  font-size: 14px;
  font-weight: 500;
  font-family: var(--font-sans, sans-serif);
}

.tribe-event-date-start,
.tribe-event-time {
  display: inline;
}

/* Title */

.tribe-events-calendar-month-mobile-events__mobile-event-title {
  margin: 12px 0 8px !important;
  font-size: 18px !important;
  line-height: 1.3 !important;
  font-weight: 600 !important;
  font-family: var(--font-sans, sans-serif);
}

.tribe-events-calendar-month-mobile-events__mobile-event-title-link {
  color: var(--color-text, #333) !important;
  text-decoration: none !important;
  transition: color 0.2s ease !important;
}

.tribe-events-calendar-month-mobile-events__mobile-event-title-link:hover {
  color: var(--color-link-hover) !important;
}

/* Time display */

.tribe-events-calendar-month-mobile-events__mobile-event-time {
  margin: 8px 0 !important;
  color: var(--color-text);
  font-size: 14px;
  display: flex;
  align-items: center;
  gap: 6px;
}

.tribe-events-calendar-month-mobile-events__mobile-event-time-icon {
  color: var(--color-text);
}

.tribe-events-calendar-month-mobile-events__mobile-event-time time {
  font-weight: 500;
}

/* Venue display */

.tribe-events-calendar-month-mobile-events__mobile-event-venue {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 8px 0 !important;
  color: var(--color-text);
  font-size: 14px;
}

.tribe-events-calendar-month-mobile-events__mobile-event-venue-icon {
  color: var(--color-text);
}

.tribe-events-calendar-month-mobile-events__mobile-event-venue-title {
  font-weight: 500;
}

/* Excerpt */

.tribe-events-calendar-month-mobile-events__mobile-event-excerpt {
  margin: 16px 0 4px !important;
  /* Increased top margin to add space between meta and description */
  font-size: 14px;
  line-height: 1.5;
  color: var(--color-text);
  padding-top: 12px !important;
  /* Added padding-top */
  border-top: 1px solid rgba(0, 0, 0, 0.05) !important;
  /* Added subtle separator */
}

/* Featured event indicator */

.tribe-events-calendar-month-mobile-events__mobile-event-datetime-featured-icon {
  display: inline-flex;
  margin-right: 4px !important;
  color: var(--color-accent, #f39c12);
}

.tribe-events-calendar-month-mobile-events__mobile-event-datetime-featured-text {
  color: var(--color-accent, #f39c12);
  font-weight: 600;
  margin-right: 8px !important;
}

.tribe-events-calendar-month-mobile-events__mobile-event-datetime-icon {
  margin-right: 4px !important;
  color: var(--color-text);
}

.tribe-events-calendar-month-mobile-events__mobile-event-title--featured {
  position: relative;
}

/* Video Embed block — card + section layouts, shared media/poster */

/* Section layout (content-flow, not inside Card Wrapper) */

.content-flow > .wp-block-acf-video-embed {
  --width--max: var(--width--content-wide);
  max-inline-size: min(
		100% - var(--width--site-gutter) * 2,
		var(--width--max)
	);
  margin-inline: auto;
  width: 100%;
}

.hs-video-embed--section {
  width: 100%;
}

.hs-video-embed--section__columns {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--flow-space-md);
  align-items: start;
}

@media (min-width: 768px) {
  .hs-video-embed--section__columns {
    grid-template-columns: 2fr 1fr;
  }
}

.hs-video-embed--section__description {
  display: flex;
  flex-direction: column;
  gap: var(--flow-space);
}

.hs-video-embed--section__description p:first-child {
  margin-top: 0;
}

.hs-video-embed--section__description p:last-child {
  margin-bottom: 0;
}

.hs-video-embed--section__description p {
  font-size: var(--font-size-small);
  font-style: italic;
}

/* Card layout — let .hs-video-embed__media set frame ratio (override cards.css 4/3 on .card-img) */

.hs-card-video-embed .card-img {
  aspect-ratio: unset !important;
}

/* Shared video frame — section + card, poster or iframe */

.hs-video-embed__media {
  position: relative;
  width: 100%;
  height: 100%;
  aspect-ratio: 5 / 2.8;
  overflow: hidden;
  border-radius: var(--border-radius-card);
  --hs-video-play-color: var(--color-link);
}

.hs-card-video-embed .hs-video-embed__media {
  --hs-video-play-color: var(--card-accent-color, var(--color-link));
}

/* Shared media / poster / player */

.hs-video-embed__media iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.hs-video-embed__play,
.hs-video-embed__preview-poster {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.hs-video-embed__play {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  margin: 0;
  border: 0;
  cursor: pointer;
  background: transparent;
}

.hs-video-embed__preview-poster {
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}

.hs-video-embed__poster {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}

.hs-video-embed__play-icon {
  position: relative;
  z-index: 1;
  pointer-events: none;
}

.hs-video-embed__play-icon svg {
  display: block;
  width: clamp(3rem, 12vw, 4.5rem);
  height: auto;
  transition: transform 200ms ease;
}

.hs-video-embed__play-icon-bg {
  fill: color-mix(
		in srgb,
		var(--hs-video-play-color, var(--color-link)) 95%,
		transparent
	);
  transition: fill 200ms ease;
}

.hs-video-embed__play-icon-mark {
  fill: var(--color-white, #fff);
}

.hs-video-embed__play:hover .hs-video-embed__play-icon-bg,
.hs-video-embed__play:focus-visible .hs-video-embed__play-icon-bg {
  fill: var(--hs-video-play-color, var(--color-link));
}

.hs-video-embed__play:hover .hs-video-embed__play-icon svg,
.hs-video-embed__play:focus-visible .hs-video-embed__play-icon svg {
  transform: scale(1.06);
}

.hs-video-embed__play:focus-visible {
  outline: 2px solid var(--hs-video-play-color, var(--color-link));
  outline-offset: 4px;
}

.hs-video-embed__media--facade .hs-video-embed__player {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.hs-video-embed__media--facade:not(.is-playing) .hs-video-embed__player {
  display: none;
}

.hs-video-embed__media--facade.is-playing .hs-video-embed__play {
  display: none;
}

/* Block editor preview — non-interactive; clicks select the block */

.hs-video-embed__media--editor-preview,
.hs-video-embed__media--editor-preview * {
  pointer-events: none;
}

/**
 * WordPress Block Integration Styles
 * 
 * This file contains styles to make WordPress blocks match our theme's styling.
 * It focuses on integrating core WordPress blocks with our custom design system.
 */

/**
 * WordPress Button Block Integration
 * 
 * These styles make WordPress buttons (.wp-block-button) match our theme's button styles (.btn)
 * while maintaining proper content flow.
 */

/* Button Component */

.wp-block-button {
  display: inline-block;
}

/* Style for default WordPress button (primary style) */

.wp-block-button:not(.is-style-outline) .wp-block-button__link {
  background-color: var(--color-primary);
  color: var(--color-background);
}

.wp-block-button:not(.is-style-outline) .wp-block-button__link:hover {
  background-color: var(--color-accent);
  color: var(--color-background);
  border-color: transparent;
}

/* Style for outlined WordPress button (secondary style) */

.wp-block-button.is-style-outline .wp-block-button__link {
  border: 2px solid var(--color-primary);
  color: var(--color-primary);
  background-color: transparent;
}

.wp-block-button.is-style-outline .wp-block-button__link:hover {
  background-color: var(--color-primary);
  color: var(--color-background);
}

/* Handle cases where both WordPress and theme button classes are present */

.wp-block-button.btn {
  /* Prevent conflicts when both classes are present */
  display: inline-block;
}

.wp-block-button.btn .wp-block-button__link {
  /* Use the same styles as our theme buttons */
  padding: 0.32rem 1.5rem;
  font-family: var(--font-serif);
  font-weight: 500;
  font-size: var(--font-size-h5);
}

/* Primary button style when manually added */

.wp-block-button.btn-primary .wp-block-button__link {
  background-color: var(--color-primary);
  color: var(--color-background);
}

.wp-block-button.btn-primary .wp-block-button__link:hover {
  background-color: var(--color-accent);
  color: var(--color-background);
}

/* Secondary button style when manually added */

.wp-block-button.btn-secondary .wp-block-button__link {
  border: 2px solid var(--color-primary);
  color: var(--color-primary);
  background-color: transparent;
}

.wp-block-button.btn-secondary .wp-block-button__link:hover {
  background-color: var(--color-primary);
  color: var(--color-background);
}

/* Button Link Styles */

.wp-block-button__link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.32rem 1.5rem;
  font-family: var(--font-serif);
  font-weight: 500;
  font-size: var(--font-size-h5);
  text-align: center;
  transition: all 200ms ease-in-out;
  width: auto;
  cursor: pointer;
  text-decoration: none;
  border: 2px solid transparent;
  border-radius: 10px;
  text-shadow: var(--text-shadow-default);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.wp-block-button__link:hover {
  text-decoration: none;
  box-shadow:
			inset 3px 2px 4px 2px rgb(255 255 255 / 12%),
			0 4px 8px rgba(0, 0, 0, 0.15);
}

.wp-block-button__link:focus {
  outline: none;
  ring: 2px solid currentColor;
  ring-offset: 2px;
}

/* Button Container Styles */

/* Fix for button groups */

.wp-block-buttons .wp-block-button {
  margin: 0.25em;
}

/* Ensure button groups respect content bounds within constrained layouts */

.is-layout-constrained .wp-block-buttons.is-layout-flex {
  display: block;
  max-width: var(--wp--style--global--content-size);
  margin-left: auto !important;
  margin-right: auto !important;
  justify-content: center;
}

/* Content Flow Integration */

/* Fix for WordPress button alignment in content flow */

.content-flow .wp-block-buttons:has(.has-text-align-center) {
  text-align: center;
}

.content-flow .wp-block-buttons:has(.has-text-align-left) {
  text-align: left;
}

.content-flow .wp-block-buttons:has(.has-text-align-right) {
  text-align: right;
}

/* Fix for WordPress button container in content flow */

.content-flow .wp-block-buttons.is-layout-flex.wp-block-buttons-is-layout-flex {
  gap: 0.5em;
}

/* Fix for WordPress button in article content */

article.content-flow .wp-block-buttons {
  /* Ensure buttons in article content respect the content flow */
  margin-block-start: var(--flow-space);
  margin-block-end: var(--flow-space);
}

/**
 * Custom styles to immediately follow Tailwind's `components` layer
 *
 * "Add more opinionated, complex classes like buttons, form controls, alerts,
 * etc; the sort of pre-built components you often see in other frameworks that
 * you might need to override with utility classes."
 *
 * from https://tailwindcss.com/docs/plugins#adding-components
 */

/**
 * Post title styles
 *
 * These will be applied to all headings with a `page-title` or `entry-title`
 * class on the frontend and to the post title in the block editor.
 *
 * The supplied styles are meant to match the default `h1` classes from
 * Tailwind Typography.
 */

.content-footer {
  background-color: var(--color-primary);
  padding: var(--flow-space-lg);
}

/* Footer content container */

.content-footer > div {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  max-width: var(--width--content-medium);
  margin-left: auto;
  margin-right: auto;
}

.content-footer p,
	.content-footer a,
	.content-footer h1,
	.content-footer h2,
	.content-footer h3,
	.content-footer h4,
	.content-footer h5,
	.content-footer h6 {
  color: var(--color-background);
}

.content-footer .wp-block-heading {
  font-size: 1.5rem;
  margin-bottom: 1rem;
  text-align: start;
}

.content-footer a {
  text-decoration: none;
}

.content-footer a:hover {
  color: var(--color-background-alt);
  text-decoration: underline;
}

.content-footer input,
	.content-footer select,
	.content-footer textarea {
  color: var(--color-text);
}

.content-footer button,
	.content-footer .btn {
  color: var(--color-background);
  margin-block-start: 0;
}

/* Override margin for wp-block-group */

.content-footer .wp-block-group:not([class*="align"]) {
  margin: 0 !important;
}

.content-footer ul {
  list-style: none;
  margin: 0;
  padding-left: 0;
}

.content-footer ul li:not(:first-child) {
  padding-top: var(--space-2xs);
  padding-left: 0;
}

.content-footer .menu-privacy-menu-container ul {
  margin-top: 0;
  margin-bottom: 0;
}

/* Footer rows */

.content-footer .footer-row {
  width: 100%;
}

/* Default grid layout for footer rows */

.content-footer .footer-row aside {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  height: 100%;
  gap: var(--space-m);
}

@media (min-width: 768px) {
  .content-footer .footer-row aside {
    display: flex;
    justify-content: center;
    gap: var(--space-xl);
  }

  .content-footer .footer-row aside section {
    flex: 0 1 auto;
    min-width: 180px;
    max-width: -moz-max-content;
    max-width: max-content;
    text-align: left;
  }

  .content-footer .footer-row-2-content .wp-block-heading {
    white-space: nowrap;
  }
}

/* Special layout for footer row 2 */

/* .footer-row-2 aside {
		display: flex;
		flex-direction: column;
	}

	@media (min-width: 768px) {
		.footer-row-2 aside {
			flex-direction: row;
			justify-content: center;
			gap: 6rem;
		}
	} */

/* Footer copyright section */

.content-footer .copyright {
  text-align: center;
  margin-top: 2rem;
  padding-top: 2rem;
  border-top: 1px solid var(--color-accent);
}

.theme-night .content-footer p,
		.theme-night .content-footer a,
		.theme-night .content-footer h1,
		.theme-night .content-footer h2,
		.theme-night .content-footer h3,
		.theme-night .content-footer h4,
		.theme-night .content-footer h5,
		.theme-night .content-footer h6 {
  color: var(--color-text);
}

.theme-night .content-footer a:hover {
  color: var(--color-text);
}

.theme-night .content-footer input,
		.theme-night .content-footer select,
		.theme-night .content-footer textarea {
  color: var(--color-text);
}

.theme-night .content-footer button,
		.theme-night .content-footer .btn {
  color: var(--color-background);
}

.entry-footer {
  text-align: right;
}

/* Header Container */

.content-header {
  padding: var(--flow-space);
}

/* Header Inner Container */

.header-inner {
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  max-width: var(--width--content-medium);
  margin-left: auto;
  margin-right: auto;
  position: relative;
  z-index: 10;
}

/* Header Branding Styles */

.branding {
  display: flex;
  align-items: center;
  gap: 1rem;
  justify-content: flex-start;
  margin-right: auto;
}

.branding-logo {
  height: 100%;
  width: 3rem;
  display: flex;
  align-items: center;
}

@media (min-width: 768px) {
  .branding-logo {
    width: 100%;
    max-width: 4rem
  }
}

.site-title {
  margin: 0;
  padding: 0;
  font-weight: bold;
  font-family: var(--font-serif);
  line-height: 1;
  font-size: 2.188rem;
  white-space: nowrap;
}

@media (min-width: 768px) {
  .site-title {
    font-size: clamp(2.188rem, 1.363rem + 1.718vw, 2.813rem)
  }
}

.site-description {
  font-size: 0.875rem;
  padding-left: 0.25rem;
  margin: 0;
  padding: 0;
}

/* Branding Link Styles */

.branding a {
  display: flex;
  flex-direction: column;
  text-decoration: none;
}

.branding a:hover {
  color: var(--color-link);
}

/* Front Page Title Container */

.branding .flex-col {
  display: flex;
  flex-direction: column;
  color: var(--color-accent);
}

/**
 * This injects Tailwind's utility classes and any utility classes registered
 * by plugins, then adds custom utility classes.
 */

/**
 * Custom styles to immediately follow Tailwind's `utilities` layer
 *
 * Add your own utility classes to this theme. Complex utility classes should
 * be added using Tailwind's plugin system:
 *
 * https://tailwindcss.com/docs/plugins#adding-utilities
 */

/* Fade in on page load */

/**
 * Theme Color Palette
 * These CSS custom properties reflect the base colors from the theme.json configuration
 * for easy access across the theme without Tailwind classes
 */

.hover\:bg-background-alt:hover {
  background-color: var(--color-background-alt);
}

.hover\:text-accent:hover {
  color: var(--color-accent);
}

.hover\:shadow-md:hover {
  --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.focus\:outline-none:focus {
  outline: 2px solid transparent;
  outline-offset: 2px;
}

.peer:checked ~ .peer-checked\:text-text {
  color: var(--color-text);
}

.data-\[expanded\=true\]\:bg-primary[data-expanded="true"] {
  background-color: var(--color-primary);
}

.data-\[expanded\=true\]\:text-background[data-expanded="true"] {
  color: var(--color-background);
}

@media (min-width: 640px) {
  .sm\:grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 768px) {
  .md\:mt-\[32px\] {
    margin-top: 32px;
  }

  .md\:w-1\/3 {
    width: 33.333333%;
  }

  .md\:max-w-screen-md {
    max-width: 768px;
  }

  .md\:flex-row {
    flex-direction: row;
  }

  .md\:items-center {
    align-items: center;
  }

  .md\:whitespace-nowrap {
    white-space: nowrap;
  }
}

@media (min-width: 1024px) {
  .lg\:max-w-wide {
    max-width: var(--width--content-wide);
  }

  .lg\:grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}