/*
Theme Name: BLUEPRINT INTERACTIVE Theme
Author: Blueprint Interactive
Author URI: https://blueprintinteractive.com
Description: Blueprint Interactive Custom Theme.
Version: 2.0
License: GNU General Public License
Text Domain: blueprint
/* -------------------------------------------------------------- */
/* Normalize Reset 
-------------------------------------------------------------- */

* {
  box-sizing: border-box;
}

html {
  line-height: 1.15; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
  scroll-behavior: smooth;
}
/* Sections
   ========================================================================== */
/**
 * Remove the margin in all browsers.
 */
body {
  margin: 0;
}
/**
 * Render the `main` element consistently in IE.
 */
main {
  display: block;
}
/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}
/* Grouping content
   ========================================================================== */
/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
  box-sizing: content-box; /* 1 */
  height: 0; /* 1 */
  overflow: visible; /* 2 */
}
/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}
/* Text-level semantics
   ========================================================================== */
/**
 * Remove the gray background on active links in IE 10.
 */
a {
  background-color: transparent;
}
/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
  border-bottom: none; /* 1 */
  text-decoration: underline; /* 2 */
  text-decoration: underline dotted; /* 2 */
}
/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
  font-weight: bold;
}
/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
samp {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}
/**
 * Add the correct font size in all browsers.
 */
small {
  font-size: 80%;
}
/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
sub {
  bottom: -0.25em;
}
sup {
  top: -0.5em;
}
/* Embedded content
========================================================================== */
/**
 * Remove the border on images inside links in IE 10.
 */
img {
  border-style: none;
}
/* Forms
   ========================================================================== */
/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */
button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-size: 100%; /* 1 */
  line-height: 1.15; /* 1 */
  margin: 0; /* 2 */
}
/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
button,
input {
  /* 1 */
  overflow: visible;
}
/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button,
select {
  /* 1 */
  text-transform: none;
}
/**
 * Correct the inability to style clickable types in iOS and Safari.
 */
button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
}
/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}
/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText;
}
/**
 * Correct the padding in Firefox.
 */
fieldset {
  padding: 0.35em 0.75em 0.625em;
}
/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */
legend {
  box-sizing: border-box; /* 1 */
  color: inherit; /* 2 */
  display: table; /* 1 */
  max-width: 100%; /* 1 */
  padding: 0; /* 3 */
  white-space: normal; /* 1 */
}
/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
  vertical-align: baseline;
}
/**
 * Remove the default vertical scrollbar in IE 10+.
 */
textarea {
  overflow: auto;
}
/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */
[type="checkbox"],
[type="radio"] {
  box-sizing: border-box; /* 1 */
  padding: 0; /* 2 */
}
/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}
/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
[type="search"] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}
/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */
[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}
/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
*/
::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}
/* Interactive
   ========================================================================== */
/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */
details {
  display: block;
}
/*
 * Add the correct display in all browsers.
 */
summary {
  display: list-item;
}
/* Misc
   ========================================================================== */
/**
 * Add the correct display in IE 10+.
 */
template {
  display: none;
}
/**
 * Add the correct display in IE 10.
 */
[hidden] {
  display: none;
}

/* -------------------------------------------------------------- */
/*  DESIGN TOKENS */
/* -------------------------------------------------------------- */
:root {
  /* Fonts */
  --body-font: "adelle-sans", sans-serif;
  --headline-font: "Mona Sans", sans-serif;

  /* Palette */
  --color-dark-teal: #0e3e4e;
  --color-dark-gray: #4d4d4d;
  --color-med-gray: #6f7675;
  --color-light-gray-2: #d9dedd;
  --color-light-gray: #f6f9f9;
  --color-teal: #09abaf;
  --color-light-green: #aef075;
  --color-green: #81c745;
  --color-white: #ffffff;
  --color-red: #fa2e50;
  --color-purple: #4f3894;
  --color-yellow: #ffea00;
  --color-light-blue: #75f0f0;
  --color-pink: #feb4cc;

  /* Rainbow colors: labeled with the classic mnemonic ROYGBIV for easier recall, 
    though not entirely accurate descriptions. */
  --color-rainbow-r: #e74d7f;
  --color-rainbow-o: #f09f46;
  --color-rainbow-y: #f7d052;
  --color-rainbow-g: #93c555;
  --color-rainbow-b: #51a8ad;
  --color-rainbow-i: #3371bc;
  --color-rainbow-v: #453195;

  /* Rainbow patterns using gradient stops. */
  --rainbow-gradient-v: linear-gradient(
    180deg,
    var(--color-rainbow-r) 0%,
    var(--color-rainbow-r) 14.29%,
    var(--color-rainbow-o) 14.29%,
    var(--color-rainbow-o) 28.57%,
    var(--color-rainbow-y) 28.57%,
    var(--color-rainbow-y) 42.86%,
    var(--color-rainbow-g) 42.86%,
    var(--color-rainbow-g) 57.14%,
    var(--color-rainbow-b) 57.14%,
    var(--color-rainbow-b) 71.43%,
    var(--color-rainbow-i) 71.43%,
    var(--color-rainbow-i) 85.71%,
    var(--color-rainbow-v) 85.71%,
    var(--color-rainbow-v) 100%
  );

  --rainbow-gradient-h: linear-gradient(
    -90deg,
    var(--color-rainbow-r) 0%,
    var(--color-rainbow-r) 14.29%,
    var(--color-rainbow-o) 14.29%,
    var(--color-rainbow-o) 28.57%,
    var(--color-rainbow-y) 28.57%,
    var(--color-rainbow-y) 42.86%,
    var(--color-rainbow-g) 42.86%,
    var(--color-rainbow-g) 57.14%,
    var(--color-rainbow-b) 57.14%,
    var(--color-rainbow-b) 71.43%,
    var(--color-rainbow-i) 71.43%,
    var(--color-rainbow-i) 85.71%,
    var(--color-rainbow-v) 85.71%,
    var(--color-rainbow-v) 100%
  );

  --pastel-gradient: linear-gradient(
    90deg,
    rgb(117 240 240 / 0.3) 0%,
    rgb(254 180 204 / 0.3) 100%
  );

  /* Typography */
  --line-height: 1.2;
  --font-size: 18px;
  --font-size-mobile: 16px;

  /* Colors */
  --hover-light: var(--color-red);
  --hover-dark: var(--color-light-green);
  --heading-color: var(--color-dark-teal);
  --body-text-color: var(--color-dark-gray);
  --body-text-color-secondary: var(--color-med-gray);

  /* Layout */
  --flow-space-xs: 0.625rem;
  --flow-space-s: 1rem;
  --flow-space: 1.5rem;
  --flow-space-l: 2.5rem;
  --flow-space-xl: 5.5rem;
  --content-wide: 1200px;
  --content-narrow: 800px;

  /* Interaction */
  --transition-timing: 250ms;
  --transition-easing: ease;
}

p, ul, ol, li {line-height: 1.5em;}

/* -------------------------------------------------------------- */
/* UTILITY CLASSES */
/* -------------------------------------------------------------- */
.stack > * + * {
  margin-block-start: var(--flow-space, 1.5rem);
}

.staff-list__card a {
  width: 100%;
  height: auto;
}
.staff-list--board .staff-list__location {
  display: none !important;
}
.staff-list--board .staff-list__links a:nth-last-of-type(1) {
  display: none !important;
}
blockquote {
  font-size: 1.25rem;
  line-height: 1.3;
  margin-top: 15px;
  margin-bottom: 35px;
}

blockquote p {
  margin-top: 0px !important;
  font-size: 1.25rem;
  line-height: 1.5em;
  margin-bottom: 0px !important;
}

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

/* utility for centered and cropped images */
.frame {
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}

.frame > img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

/* utility for text labels, with and without preceding dots and underlying border */
.eyebrow {
  color: var(--color-teal);
  text-transform: uppercase;
  font-family: var(--body-font);
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.0875rem;
  display: flex;
  align-items: center;
  gap: var(--flow-space-xs);
}

.eyebrow--full {
  padding-bottom: 12px;
  border-bottom: 1px solid rgb(29 31 30 / 0.24);
  margin-bottom: var(--flow-space-l);
}

.eyebrow--full::before {
  content: "";
  display: inline-block;
  background-color: var(--color-teal);
  height: 8px;
  width: 8px;
  border-radius: 50%;
}

/* -------------------------------------------------------------- */
/* GLOBAL & CORE BLOCK STYLES
/* -------------------------------------------------------------- */
body {
  font-family: var(--body-font);
  font-weight: 300;
  color: var(--body-text-color);
  line-height: var(--line-height);
  font-size: var(--font-size);
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--headline-font);
  font-weight: 800;
  color: var(--heading-color);
  margin: 0 0 var(--flow-space) 0;
}

h1 {
  font-size: 4.5rem;
}

h2 {
  font-size: 4rem;
      line-height: 1.1;
}

h3 {
  font-size: 3.4rem;
  line-height: .9;
}

h4 {
  font-size: 2.6rem;
  line-height: 1.4em;
}

h5 {
  font-size: 1.8rem;
}

h6 {
  font-size: 1.5rem;
}

ul,
ol {
  margin-inline-start: var(--flow-space);
  padding-inline-start: var(--flow-space-s);
}

li {
  margin-block-end: var(--flow-space-xs);
}

li::marker {
  color: var(--color-dark-teal);
}

blockquote {
  font-size: 1.5rem;
  line-height: 1.3;
  letter-spacing: -0.015rem;
  text-align: left;
  padding-left: var(--flow-space);
  border-left: 2px solid var(--color-light-gray-2);
  display: flex;
  flex-direction: column;
  gap: var(--flow-space);
}

blockquote::before {
  content: "";
  display: block;
  width: 26px;
  height: 24px;
  background-image: url("./images/quote-mark.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

cite {
  font-size: 1.25rem;
  font-style: normal;
  line-height: 1.6;
  letter-spacing: -0.0125rem;
  text-align: left;
}

a,
a:visited {
  color: var(--body-text-color);
  text-decoration: underline;
  text-underline-offset: 2px;
  transition:
    color var(--transition-timing) var(--transition-easing),
    outline var(--transition-timing) var(--transition-easing);
}

p a:hover,
p a:focus-visible,
p a:active {
  color: var(--color-teal);
  text-underline-offset: 2px;
}

.wp-caption-text,
.wp-element-caption {
  color: var(--body-text-color-secondary);
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: 0.09rem;
  text-transform: uppercase;
}

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

.wp-element-caption {
  margin-top: var(--flow-space-xs);
}

.alignleft {
  float: left;
  margin-right: var(--flow-space);
}

.alignright {
  float: right;
  margin-left: var(--flow-space);
}

thead,
.wp-block-table thead,
tfoot,
.wp-block-table tfoot {
  background-color: var(--color-light-gray);
  color: var(--color-teal);
  font-size: 0.875rem;
  font-weight: 700;
  letter-spacing: 0.0875rem;
  text-transform: uppercase;
}

h2.wp-block-heading,
h3.wp-block-heading,
h4.wp-block-heading,
h5.wp-block-heading,
h6.wp-block-heading {
  padding-top: 35px !important;
}

td,
.wp-block-table td,
th,
.wp-block-table th {
  border: 1px solid var(--color-light-gray-2);
  font-size: 1rem;
}

thead,
.wp-block-table thead {
  border-bottom: 1px solid var(--color-light-gray-2);
}

tfoot,
.wp-block-table tfoot {
  border-top: 1px solid var(--color-light-gray-2);
}

figure {
  margin: 0 0 var(--flow-space);
}

.wp-block-columns.is-layout-flex {
  gap: var(--flow-space);
}

.wp-block-columns.is-layout-flex {
  gap: var(--flow-space);
}

.wp-block-pullquote {
  padding: var(--flow-space-l) 0;
}

/* Buttons, base class to be used with additional classes for setting color variations. */
.button {
  display: flex;
  padding: var(--flow-space-xs) var(--flow-space);
  justify-content: center;
  align-items: center;
  gap: 3px;
  font-size: 16px;
  font-family: var(--body-font);
  font-weight: bold;
  letter-spacing: 0.08rem;
  text-transform: uppercase;
  text-decoration: none;
  border: 2px solid transparent;
  transition:
    color var(--transition-timing) var(--transition-easing),
    background-color var(--transition-timing) var(--transition-easing),
    border-color var(--transition-timing) var(--transition-easing);
}

.button--purple,
.button--purple:visited {
  background-color: var(--color-purple);
  color: var(--color-white);
  border-color: var(--color-purple);
}

.button--purple:hover,
.button--purple:visited:hover,
.button--purple:active,
.button--purple:visited:active,
.button--purple:focus-visible,
.button--purple:visited:focus-visible {
  background-color: var(--color-teal);
  border-color: var(--color-teal);
  color: var(--color-white);
}

.button--outline,
.button--outline:visited {
  background-color: var(--color-white);
  color: var(--color-dark-teal);
  border-color: var(--color-green);
}

.button--outline:hover,
.button--outline:active,
.button--outline:focus-visible {
  background-color: #AEF075;
  color: var(--color-dark-teal) !important;
  border-color: #AEF075 !important;;
}

.button--blue,
.button--blue:visited {
  background-color: var(--color-light-blue);
  border-color: var(--color-light-blue);
  color: var(--color-dark-teal);
}

.button--blue:hover,
.button--blue:active,
.button--blue:focus-visible {
  background: #fff;
  color: #0e3e4e !important;
  border-color: #fff !important;
}

.button--clear {
  background-color: transparent;
  border-color: transparent;
  color: var(--color-dark-teal);
}

.button--clear:hover,
.button--clear:active,
.button--clear:focus-visible {
  background-color: transparent;
  border-color: transparent;
  color: var(--color-red);
}

.button--red,
.button--red:visited {
  background-color: var(--color-red);
  border-color: transparent;
  color: var(--color-white);
}

.button--red:hover,
.button--red:active,
.button--red:focus-visible {
  background-color: var(--color-purple);
  border-color: var(--color-purple);
  color: var(--color-white);
}

/* Styles to make core buttons block match. Supports only the outline style. */
.wp-block-button__link {
  font-family: var(--body-font);
  font-weight: bold;
  letter-spacing: 0.08rem;
  text-transform: uppercase;
  background-color: var(--color-purple);
  color: var(--color-white);
  border-color: var(--color-purple);
  border-radius: 0;
  transition:
    color var(--transition-timing) var(--transition-easing),
    background-color var(--transition-timing) var(--transition-easing),
    border-color var(--transition-timing) var(--transition-easing);
}

.wp-block-button__link:visited {
  color: var(--color-white);
}

.wp-block-button__link:hover,
.wp-block-button__link:active,
.wp-block-button__link:focus-visible {
  background-color: var(--color-teal);
  border-color: var(--color-teal);
  color: var(--color-white);
}

.is-style-outline .wp-block-button__link {
  background-color: var(--color-white);
  color: var(--color-dark-teal);
  border-color: var(--color-green);
}

.is-style-outline .wp-block-button__link:visited {
  color: var(--body-text-color);
}

.is-style-outline .wp-block-button__link:hover,
.is-style-outline .wp-block-button__link:active,
.is-style-outline .wp-block-button__link:focus-visible {
  background-color: var(--color-white);
  color: var(--color-purple);
  border-color: var(--color-purple);
}

/* Archive filter form elements */
.filters {
  --filters-border: 1.5px solid rgb(2 44 34 / 0.1);
  --filters-color: #6f7675;
  --filters-padding: 7px 16px;
  display: flex;
  gap: var(--flow-space-s);
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
}

.filters--column {
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  gap: var(--flow-space);
}

.filters__label {
  flex: 1 1 auto;
  min-width: 0;
  display: inline-block;
  font-size: 1rem;
  line-height: 1.5rem;
  letter-spacing: -0.004rem;
}

.filters--column .filters__label {
  flex: 0 1 auto;
}

.filters__input-wrap {
  position: relative;
  
  display: inline-block;
  width: 100%;
  min-width: 0;
  
}

.filters__input-wrap::after {
  font: var(--fa-font-solid);
  font-size: 14px;
  position: absolute;
  top: 50%;
  right: 12px;
  transform: translateY(-50%);
  width: 16px;
  height: 16px;
  color: var(--filters-color);
  pointer-events: none;
}

.filters__input-wrap--search::after {
  content: "\f002"; /* Font Awesome: magnifying-glass */
}

.filters__text {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  padding: var(--filters-padding);
  border: var(--filters-border);
  font: inherit;
  color: var(--filters-color);
}

.search-results__filters .filters__text {    height: 42.5px;}

.search-results__apply {    max-width: 270px;}

.filters__text::placeholder {
  color: var(--filters-color);
}

.filters__label:has(.filters__select-wrap) {
  max-width: 270px;
}

.filters__select-wrap {
  position: relative;
  display: inline-block;
  width: 100%;
  max-width: 275px;
  min-width: 0;
}

.filters__select-wrap::after {
  content: "\f078";
  font: var(--fa-font-solid);
  font-size: 14px;
  position: absolute;
  top: 50%;
  right: 12px;
  transform: translateY(-50%);
  width: 16px;
  height: 16px;
  color: var(--filters-color);
  pointer-events: none;
}

.filters__select-wrap select {
  width: 100%;
  min-width: 0;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  box-sizing: border-box;
  font: inherit;
  color: var(--filters-color);
  margin: 0;
  border: var(--filters-border);
  border-radius: 0;
  background-color: #fff;
  padding: var(--filters-padding);
  position: relative;
}

.filters__active {
  display: flex;
  gap: var(--flow-space-xs);
  flex-wrap: wrap;
}

.filters__pill {
  border: var(--filters-border);
  border-radius: 1.5rem;
  background: var(--color-white);
  font-family: var(--body-font);
  font-size: 0.75rem;
  letter-spacing: 0.0375rem;
  padding: var(--filters-padding);
  display: flex;
  gap: 8px;
  align-items: center;
  cursor: pointer;
  transition:
    color var(--transition-timing) var(--transition-easing),
    border-color var(--transition-timing) var(--transition-easing);
}

.filters__pill:hover,
.filters__pill:active,
.filters__pill:focus-visible {
  color: var(--color-red);
  border-color: var(--color-red);
}

.filters__pill i {
  font-size: 10px;
}

.filters__switch {
  --thumb-size: 1.125rem;
  --track-size: calc(var(--thumb-size) * 2);
  display: flex;
  align-items: center;
  gap: var(--flow-space-xs);
  justify-content: space-between;
  cursor: pointer;
  user-select: none;
  font-size: 1rem;
  line-height: 1.5rem;
  letter-spacing: -0.004rem;
}

.filters__switch > input {
  --thumb-position: 0%;
  appearance: none;
  border: none;
  outline-offset: 5px;
  box-sizing: content-box;
  background-color: var(--color-med-gray);
  border-radius: 2rem;
  width: var(--track-size);
  height: var(--thumb-size);
  padding: 2px;
  flex-shrink: 0;
  display: grid;
  align-items: center;
  grid: [track] 1fr / [track] 1fr;
  cursor: pointer;
}

.filters__switch > input:checked {
  --thumb-position: calc(var(--track-size) - 100%);
  background-color: var(--color-green);
}

.filters__switch > input::before {
  content: "";
  grid-area: track;
  width: var(--thumb-size);
  height: var(--thumb-size);
  background: var(--color-white);
  border-radius: 50%;
  transform: translateX(var(--thumb-position));
  transition: transform var(--transition-timing) var(--transition-easing);
}

.filters__toggle {
  background: transparent;
  border: 0;
  pointer-events: none;
}

.filters__drawer-inner {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  padding-bottom: 150px;
  gap: var(--flow-space);
}

/* Archive pagination */
.pagination .nav-links {
  display: flex;
  gap: var(--flow-space);
  justify-content: center;
  align-items: center;
}

.pagination .nav-links a {
  font-size: 0.875rem;
  text-decoration: none;
}

.pagination .nav-links a:hover,
.pagination .nav-links a:active {
  text-decoration: underline;    text-underline-offset: 4px;
}

.pagination .nav-links span {
  font-size: 0.875rem;
}

/* -------------------------------------------------------------- */
/* GLOBAL LAYOUT */
/* -------------------------------------------------------------- */
.content-wrapper--wide,
.content-wrapper--narrow {
  margin: 0 auto;
  width: 80%;
}

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

.content-wrapper--narrow {
  max-width: var(--content-narrow);
}

.social-wrapper {
  display: flex;
  background-color: transparent;
  justify-content: center;
  padding: 0 6px;
  width: fit-content;
  gap: 12px;
  align-items: center;
}

/* Hero Banner Styling */
.full-width-banner {
  position: relative;
  background-color: var(--color-light-green);
  transition: background-color var(--transition-timing) var(--transition-easing);
  padding: 6px 15px;
  overflow: hidden;
}

/* When the banner is a link: rainbow overlay fades in on hover */
.full-width-banner:has(> .banner-link)::before {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--rainbow-gradient-h);
  opacity: 0;
  transition: opacity 0.4s var(--transition-easing);
  pointer-events: none;
  z-index: 0;
}

.full-width-banner:has(> .banner-link):hover {
  background: white;
}

.full-width-banner:has(> .banner-link):hover::before {
  opacity: 0.6;
}
.mega-menu__row a {
  color: #0e3e4e !important;
  letter-spacing: 0.5px !important;
}

.full-width-banner .banner-link {
  position: relative;
  z-index: 1;
  display: block;
  text-decoration: none;
}

.full-width-banner .banner-text {
  position: relative;
  z-index: 1;
  color: #000;
  font-size: 16px;
  text-align: center;
}

.full-width-banner .banner-text p {
  margin: 0;
}

/* Desktop banner: visible above 800px */
.full-width-banner.desktop-banner {
  display: block;
}

/* Mobile banner: hidden above 800px */
.full-width-banner.mobile-banner {
  display: none;
}

/* Takeover / lightbox promo */
.takeover-promo__panel {
  position: relative;
  background-color: var(--color-yellow);
}

.takeover-promo__close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.25rem;
  height: 2.25rem;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--color-dark-teal);
  font-size: 1.25rem;
  line-height: 1;
  cursor: pointer;
  transition: transform 0.5s ease-in-out;
}

.takeover-promo--lightbox .takeover-promo__panel > .takeover-promo__close {
  position: absolute;
  top: 0.75rem;
  right: 0.75rem;
  z-index: 2;
}

.takeover-promo--takeover .takeover-promo__content > .takeover-promo__close {
  position: absolute;
  top: 0.75rem;
  right: 0.75rem;
  z-index: 2;
}

.takeover-promo__close i {
  display: inline-block;
  transition: transform 0.5s ease-in-out
}

.takeover-promo__close:hover,
.takeover-promo__close:active,
.takeover-promo__close:focus-visible {
  color: var(--color-purple);
  outline: none;
}

.takeover-promo__close:hover i,
.takeover-promo__close:active i,
.takeover-promo__close:focus-visible i {
  transform: rotate(90deg) scale(1.05);
  color: var(--color-purple);
}

.takeover-promo--takeover .takeover-promo__panel,
.takeover-promo--lightbox .takeover-promo__panel {
  height: auto;
  overflow: visible;
}

.takeover-promo__layout {
  display: flex;
  align-items: stretch;
  height: auto;
}

.takeover-promo--lightbox .takeover-promo__layout {
  min-height: 400px;
}

/* .takeover-promo--takeover {
  border-bottom: .25px solid rgba(0, 0, 0, 1);
} */

.takeover-promo--takeover .takeover-promo__layout {
  min-height: 400px;
}

.takeover-promo__media {
  flex: 3 1 0;
  min-width: 0;
  min-height: 0;
  align-self: stretch;
  overflow: hidden;
}

.takeover-promo--takeover .takeover-promo__media {
  position: relative;
}

.takeover-promo--takeover .takeover-promo__content {
  position: relative;
  min-width: 0;
  padding: 1.5rem 2rem 1.5rem 5rem;
}

@media (min-width: 801px) {
  .takeover-promo--takeover .takeover-promo__media {
    flex: 2 1 0;
    min-width: 350px;
  }

  .takeover-promo--takeover .takeover-promo__content {
    flex: 1 1 calc(600px + 7rem);
    flex-shrink: 1;
    padding-right: 80px;
  }
}

.takeover-promo__image {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 100%;
  object-fit: cover;
  object-position: center;
}

.takeover-promo--takeover .takeover-promo__image {
  position: absolute;
  inset: 0;
  min-height: 0;
  object-position: center 30%;
}

.takeover-promo__separator {
  flex: 0 0 6px;
  width: 6px;
  background: var(--rainbow-gradient-v);
}

.takeover-promo--lightbox .takeover-promo__content {
  padding: 2rem 2.5rem 2rem 3.75rem;
}

.takeover-promo__content {
  flex: 4.5 1 0;
  min-width: 0;
  min-height: min-content;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: var(--flow-space);
}

.takeover-promo__headline {
  margin: 0;
  color: var(--color-dark-teal);
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  line-height: 1.1;
  font-weight: 700;
  padding-right: 2rem;
}

.takeover-promo__subhead {
  margin: 0;
  color: var(--body-text-color);
  font-size: 1rem;
  line-height: 1.5;
  max-width: 700px;
}

.takeover-promo--takeover .takeover-promo__subhead {
  width: 100%;
  max-width: 700px;
}

.takeover-promo__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--flow-space-s);
  margin-top: var(--flow-space-xs);
}

.takeover-promo__button {
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.takeover-promo--takeover {
  transform: translateY(0);
  margin-bottom: 0;
  transition: transform 0.55s ease-in-out, margin-bottom 0.55s ease-in-out;
}

.takeover-promo--takeover.is-closing {
  transform: translateY(calc(-1 * var(--takeover-dismiss-offset, 100%)));
  margin-bottom: calc(-1 * var(--takeover-dismiss-offset, 100%));
}

.takeover-promo--takeover .takeover-promo__panel {
  width: 100%;
}

.takeover-promo--lightbox {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.7s ease, visibility 0.7s ease;
}

.takeover-promo--lightbox.is-visible {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.takeover-promo--lightbox.is-closing {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.takeover-promo--lightbox .takeover-promo__backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  padding: 0;
  background: rgba(14, 62, 78, 0.72);
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  cursor: pointer;
  opacity: 0;
  transition: opacity 0.7s ease;
}

.takeover-promo--lightbox.is-visible .takeover-promo__backdrop {
  opacity: 1;
}

.takeover-promo--lightbox.is-closing .takeover-promo__backdrop {
  opacity: 0;
}

.takeover-promo--lightbox .takeover-promo__panel {
  position: relative;
  z-index: 1;
  width: min(100%, 72rem);
  max-height: calc(100vh - 3rem);
  overflow: auto;
  box-shadow: 0 1.5rem 3rem rgba(0, 0, 0, 0.25);
  opacity: 0;
  transform: translateY(1rem);
  transition: opacity 0.7s ease, transform 0.7s ease;
}

.takeover-promo--lightbox.is-visible .takeover-promo__panel {
  opacity: 1;
  transform: translateY(0);
}

.takeover-promo--lightbox.is-closing .takeover-promo__panel {
  opacity: 0;
  transform: translateY(0.75rem);
}

body.takeover-promo-modal-open {
  position: fixed;
  left: 0;
  right: 0;
  width: 100%;
  overflow: hidden;
}

/* Header and main nav, desktop */
.site-header__inner {
  max-width: var(--content-wide);
  width: 90%;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  max-width: 1200px;
}

.site-header__upper {
  padding: var(--flow-space-xs) 0;
  background-color: var(--color-light-gray);
}

.site-header__upper .site-header__inner {
  justify-content: flex-end;
  gap: var(--flow-space);
}

.site-header__social-wrapper {
  display: flex;
  gap: var(--flow-space-s);
  align-items: center;
}

.site-header__social-label {
  font-size: 0.75rem;
  line-height: 1.3;
  letter-spacing: 0.0375rem;
}

.site-header__social-icons {
  display: flex;
  gap: var(--flow-space-xs);
}

.site-header__social-icon {
  text-decoration: none;
  color: var(--color-dark-teal);
  transition: 0.25s ease-out;
}


.site-header__social-icon:hover,
.site-header__social-icon:active,
.site-header__social-icon:focus-visible {
  color: var(--color-teal);
  outline-color: var(--color-teal);
  transition: 0.25s ease-out;
}

.page-numbers:hover {
  color: var(--color-red) !important;
}
.page-numbers.current {
  color: var(--color-red) !important;
  font-weight: 700 !important;
}
.page-numbers {
  transition: 0.25s ease-out;
}
.site-header__search button {
  appearance: none;
  background: transparent;
  border: 0;
  font-weight: 100;
  font-family: var(--body-font);
  font-size: 0.875rem;
  letter-spacing: -0.0035rem;
  line-height: 1.1;
  font-weight: normal;
  display: flex;
  gap: 5px;
  align-items: center;
  cursor: pointer;
}

.site-header__search i {
  font-size: 0.875rem;
  line-height: 1;
}

.site-header__shop-link a {
  text-decoration: none;
  font-size: 0.875rem;
  letter-spacing: -0.0035rem;
  display: flex;
  gap: var(--flow-space-xs);
  align-items: center;
}

.site-header__shop-link i {
  display: inline-block;
  height: 16px;
  width: 16px;
}

.site-header__shop-link i svg {
  width: 100%;
  height: 100%;
  object-position: center;
}

.hamburger-box {
  height: 19px !important;
}
.site-header__drawer {
  display: none; /* revealed by scripting */
  background-color: var(--color-light-gray);
}

.site-header__drawer-wrapper {
  display: flex;
  gap: var(--flow-space-s);
  justify-content: space-between;
  padding: var(--flow-space-s) 0;
  width: 100%;
}

.site-header__drawer-wrapper label {
  flex: 1 1 100%;
}

.site-header__input-wrapper {
  position: relative;
  display: inline-block;
  width: 100%;
  min-width: 0;
}

.site-header__input-wrapper::after {
  font: var(--fa-font-solid);
  content: "\f002"; /* Font Awesome: magnifying-glass */
  font-size: 14px;
  position: absolute;
  top: 50%;
  right: 12px;
  transform: translateY(-50%);
  width: 16px;
  height: 16px;
  color: var(--filters-color);
  pointer-events: none;
}
.post-carousel__image.news-listing__image--placeholder img {
  object-fit: cover !important;
}

/* .search-results__submit {
  padding-top: 7.5px;
  padding-bottom: 7.5px;
} */

.site-header__input-wrapper input[type="text"] {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  padding: 7px 16px;
  border: 1.5px solid rgb(2 44 34 / 0.1);
  font: inherit;
  color: #6f7675;
}

.site-header__input-wrapper input[type="text"]::placeholder {
  color: var(--filters-color);
}

.site-header__lower {
}

.site-header__logo {
  display: block;
  text-decoration: none;
  width: 186px;
  padding: 5px 0 0 0;
}

/* Header and main nav, mobile specific */
.site-header--mobile {
  display: none;
  padding: var(--flow-space-xs) 0;
}

.site-header--mobile .site-header__inner {
  width: 90%;
}

.site-header--mobile .site-header__donate .button {
  font-size: 1rem;
  padding: var(--flow-space-xs) var(--flow-space-s);
}

.hamburger {
  padding: 0;
  cursor: pointer;
}

.site-header__main-nav--mobile {
  /* display: none; */
  position: relative;
}

.site-header__mobile-wrapper {
  position: absolute;
  width: 100vw;
  min-height: fit-content;

  padding-top: var(--flow-space);
  background: var(--color-white);
  transform: translateX(-100%);
  transition: transform 250ms ease-in;
  z-index: 3;
  padding-bottom: 30px;
}

.site-header__mobile-wrapper.is-active {
  transform: translateX(0);
}

.site-header__mobile-wrapper > * {
  width: 90%;
  margin: 0 auto;
}

.site-header__main-nav--mobile .site-header__search {
  display: flex;
  gap: var(--flow-space-xs);
  align-items: center;
  margin: var(--flow-space-xl) auto var(--flow-space) auto;
}

body .site-header__search {
  display: flex !important;
}
.site-header__main-nav--mobile .site-header__social-icons {
  gap: var(--flow-space-s);
  justify-content: center;
  padding: var(--flow-space-s) 0;
  border-top: 1px solid var(--color-teal);
}

.site-header__main-nav--mobile .site-header__social-icon,
.site-header__main-nav--mobile .site-header__social-icon:visited {
  color: var(--color-teal);
}

.site-header__main-nav--mobile .site-header__social-icon:hover,
.site-header__main-nav--mobile .site-header__social-icon:active,
.site-header__main-nav--mobile .site-header__social-icon:focus-visible {
  color: var(--color-purple);
}

.site-header__main-nav--mobile .site-header__privacy-link {
  text-align: center;
}

.site-header__main-nav--mobile .site-header__copyright {
  color: #a1aaa8;
  text-align: center;
  font-size: 0.875rem;
  line-height: 1.6;
  letter-spacing: 0.02625rem;
}

/* donate full embed css */
.full-donate .at-title {
  display: none !important;
}

.full-donate .at-description {
  display: none !important;
}
.full-donate .at-markup.HeaderHtml {
  display: none !important;
}
.full-donate .at-markup.FastAction {
  display: none !important;
}

.full-donate .iti__flag-container {
  display: none !important;
}

/* .full-donate .multistep-layout fieldset.hideStep {
  visibility: visible !important;
  position: relative !important;
  height: fit-content !important;
  display: block !important;
  z-index: unset !important;
} */

.full-donate .at-steps {
  display: none !important;
}

.full-donate [class*="step-nav"],
.full-donate [class*="at-step-list"],
.full-donate ul[role="tablist"] {
  display: none !important;
}

/* ========== NGP EMBED: map each static design part to embed elements (!important to override NGP) ========== */

/* 1. Section wrapper: full viewport width (break out of narrow containers), static .support-banner--full (background) */
.full-donate {
  box-sizing: border-box !important;
  position: relative !important;
  left: unset !important;
  right: unset !important;
  margin-left: -50vw !important;
  margin-right: -50vw !important;
  background: transparent !important;
  padding: 0px !important;
  margin: 0px !important;
}

.full-donate .at-inner {
  background-color: transparent;
}

/* 2. Inner container: full width within section, static max-width (content-wide) */
.full-donate .multistep-layout {
  max-width: var(--content-wide) !important;
  width: 100% !important;
  padding: 0px !important;
  margin: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: var(--flow-space-l) !important;
  box-sizing: border-box !important;
}

.full-donate .multistep-layout.split-layout form {
  width: 100% !important;
}

/* 3. Main heading "Donate to EQFL": static .support-banner__heading → .full-donate .page-title */
.full-donate .page-title {
  font-family: var(--headline-font) !important;
  font-weight: 800 !important;
  color: var(--heading-color) !important;
  font-size: 3.875rem !important;
  line-height: var(--line-height) !important;
  margin: 0 0 var(--flow-space-xs) 0 !important;
}

/* 4. Subheading / intro text: static .support-banner__subheading → first paragraph(s) after title in embed */
.full-donate .multistep-layout > p,
.full-donate .at-description,
.full-donate .multistep-layout .at-intro {
  font-family: var(--body-font) !important;
  font-size: var(--font-size) !important;
  line-height: var(--line-height) !important;
  color: var(--body-text-color) !important;
  margin: 0 0 var(--flow-space) 0 !important;
}

.full-donate .at .at-fieldset {
  padding: 0;
}

/* 5. ONE TIME / MONTHLY toggle: static .support-banner__toggle → our JS-injected .support-banner__toggle; hide native frequency radios’ container or style it as grid */
.full-donate .support-banner__toggle {
  display: grid !important;
  grid-template-columns: repeat(
    2,
    calc(50% - (var(--flow-space-s) / 2))
  ) !important;
  gap: var(--flow-space-s) !important;
  margin: 0 0 var(--flow-space-s) 0 !important;
}

.full-donate .support-banner__toggle .button {
  min-width: 0 !important;
  flex: 1 1 auto !important;
  border-radius: 0 !important;
  padding: var(--flow-space-xs) var(--flow-space) !important;
  font-family: var(--body-font) !important;
  font-weight: bold !important;
  letter-spacing: 0.08rem !important;
  text-transform: uppercase !important;
  border: 2px solid #81c745 !important;
  background-color: var(--color-white) !important;
  color: var(--color-dark-teal) !important;
  transition:
    border-color var(--transition-timing) var(--transition-easing),
    color var(--transition-timing) var(--transition-easing) !important;
}

.full-donate .support-banner__toggle .button:hover,
.full-donate .support-banner__toggle .button:focus-visible {
  background-color: var(--color-white) !important;
  color: var(--color-purple) !important;
  border-color: var(--color-purple) !important;
}

.full-donate .support-banner__toggle--selected {
  border-color: #81c745 !important;
  border-width: 2px !important;
  background-color: var(--color-white) !important;
  color: var(--color-dark-teal) !important;
}

.full-donate .support-banner__toggle--selected .fa-check {
  margin-right: 3px !important;
}

/* Hide native Monthly/One-Time radios container; our appended buttons control them */
.full-donate .full-donate__frequency-native {
  display: none !important;
}

/* 6. "Select or enter an amount" label: static .support-banner__label; JS injects .full-donate__amount-label */
.full-donate .full-donate__amount-label,
.full-donate .full-donate__payment-label,
.full-donate .at-step legend,
.full-donate .at-step h2,
.full-donate .at-step h3,
.full-donate fieldset.hideStep > legend,
.full-donate fieldset.hideStep .at-step-title {
  font-family: var(--body-font) !important;
  font-size: 1.5rem !important;
  color: var(--body-text-color) !important;
  /* font-weight: 600 !important; */
  margin: 0 0 var(--flow-space-s) 0 !important;
  display: block !important;
}

.full-donate .at-row > [class^="at-"] {
  margin: 0;
}

.full-donate .at-row {
  gap: var(--flow-space-xs);
}

.full-donate .multistep-layout .clearfix:before,
.full-donate .multistep-layout .clearfix:after {
  display: none;
}

/* 7. Amount buttons (mockup: purple bg, white text, dollar before numbers; OTHER no icon; rectangular) */
.full-donate .label-amount:not(.label-otheramount),
.full-donate .at-step label[for*="amount"]:not(.label-otheramount),
.full-donate
  .multistep-layout
  fieldset.hideStep
  label:has(input[type="radio"][value="10.00"]),
.full-donate
  .multistep-layout
  fieldset.hideStep
  label:has(input[type="radio"][value="20.00"]),
.full-donate
  .multistep-layout
  fieldset.hideStep
  label:has(input[type="radio"][value="35.00"]),
.full-donate
  .multistep-layout
  fieldset.hideStep
  label:has(input[type="radio"][value="50.00"]),
.full-donate
  .multistep-layout
  fieldset.hideStep
  label:has(input[type="radio"][value="100.00"]) {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 3px !important;
  min-width: 110px !important;
  height: 53px !important;
  min-height: 53px !important;
  padding: var(--flow-space-xs) var(--flow-space) !important;
  font-family: var(--body-font) !important;
  font-weight: bold !important;
  letter-spacing: 0.08rem !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  text-align: center !important;
  box-sizing: border-box !important;
  border: 2px solid #4f3894 !important;
  border-radius: 0 !important;
  background-color: #4f3894 !important;
  background: #4f3894 none !important;
  background-image: none !important;
  color: #ffffff !important;
  cursor: pointer !important;
  box-shadow: none !important;
  transition:
    background-color var(--transition-timing) var(--transition-easing),
    border-color var(--transition-timing) var(--transition-easing) !important;
}

.full-donate .label-amount:not(.label-otheramount):has(input:checked),
.full-donate
  .multistep-layout
  fieldset.hideStep
  label:not(.label-otheramount):has(input[type="radio"]:checked),
.full-donate
  .at-step
  label:not(.label-otheramount):has(input[type="radio"]:checked) {
  background: #09abaf none !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* Amount buttons: ::before 1px (no visible icon) so button text centers; OTHER keeps "$" via rule below */
.full-donate .label-amount:not([title*="Other"]):not([title*="OTHER"])::before,
.full-donate
  .multistep-layout
  fieldset.hideStep
  label:has(input[type="radio"][value="10.00"])::before,
.full-donate
  .multistep-layout
  fieldset.hideStep
  label:has(input[type="radio"][value="20.00"])::before,
.full-donate
  .multistep-layout
  fieldset.hideStep
  label:has(input[type="radio"][value="35.00"])::before,
.full-donate
  .multistep-layout
  fieldset.hideStep
  label:has(input[type="radio"][value="50.00"])::before,
.full-donate
  .multistep-layout
  fieldset.hideStep
  label:has(input[type="radio"][value="100.00"])::before {
  content: "" !important;
  display: inline-block !important;
  width: 1px !important;
  height: 1px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background-image: none !important;
  vertical-align: middle !important;
}

.full-donate
  .multistep-layout
  fieldset.hideStep
  label:has(input[type="radio"][name*="SelectAmount"]):not(
    :has(input[type="radio"][value="other"])
  )::before {
  content: "" !important;
  display: inline-block !important;
  width: 1px !important;
  height: 1px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background-image: none !important;
  vertical-align: middle !important;
}

/* Hide dollar icon (SVG) on OTHER only; we show text "$" via rule below */
.full-donate .label-amount:not(.label-otheramount)[title*="Other"]::before,
.full-donate .label-amount:not(.label-otheramount)[title*="OTHER"]::before {
  content: none !important;
  display: none !important;
}

/* Other amount: hide span $, show "$" before input (::before + .js-otheramount-dollar) */
.full-donate .label-amount.label-otheramount .label-otheramount-prefix {
  display: none !important;
}

.full-donate .label-amount.label-otheramount {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 1 calc((100% - (var(--flow-space-s) * 2)) / 3) !important;
  flex-wrap: nowrap !important;
  gap: 0.25rem !important;
  min-width: 0 !important;
  width: auto !important;
  height: 53px !important;
  min-height: 53px !important;
  padding: var(--flow-space-xs) var(--flow-space) !important;
  font-size: 0 !important;
  box-sizing: border-box !important;
  border: 2px solid #4f3894 !important;
  border-radius: 0 !important;
  background: #4f3894 !important;
  background-color: #4f3894 !important;
  color: #ffffff !important;
  cursor: pointer !important;
}

/* Other amount: one "$" from ::before only (no JS span = no duplicate) */
.full-donate .label-amount.label-otheramount::before,
.full-donate
  .multistep-layout
  fieldset.hideStep
  label:has(input[type="radio"][value="other"])::before {
  content: "$" !important;
  display: none !important;
  font-size: 1rem !important;
  font-family: var(--body-font) !important;
  font-weight: bold !important;
  letter-spacing: 0.08rem !important;
  color: #4f3894 !important;
  width: auto !important;
  height: auto !important;
  overflow: visible !important;
}

.full-donate .at-check.CoverCostsAmount {
  margin: 0;
}

/* Checkbox in checked state */
.full-donate .at input[type="checkbox"]:checked + span:after {
  color: var(--color-purple);
}

.full-donate .label-amount.label-otheramount .js-otheramount-dollar {
  display: none !important;
}

.full-donate .label-amount.label-otheramount .edit-otheramount {
  width: 100% !important;
  min-width: 0 !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  color: var(--color-white) !important;
  font-family: var(--body-font) !important;
  font-size: 17px !important;
  font-weight: 600 !important;
  text-align: center !important;
  vertical-align: middle !important;
  box-sizing: border-box !important;
}

.full-donate .label-amount.label-otheramount .edit-otheramount::placeholder {
  color: var(--color-white) !important;
}

.full-donate .label-otheramount-field {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  box-sizing: border-box !important;
}

.full-donate .label-otheramount-idle {
  display: none !important;
  font-family: var(--body-font) !important;
  font-size: 17px !important;
  font-weight: 600 !important;
  letter-spacing: 0.08rem !important;
  text-transform: uppercase !important;
  color: var(--color-white) !important;
  line-height: 1 !important;
  pointer-events: none !important;
  white-space: nowrap !important;
}

.full-donate
  .label-amount.label-otheramount:not(:has(input[type="radio"]:checked)):not(
    :focus-within
  )
  .label-otheramount-idle {
  display: inline !important;
}

.full-donate
  .label-amount.label-otheramount:not(:has(input[type="radio"]:checked)):not(
    :focus-within
  )
  .edit-otheramount {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  border: 0 !important;
}

.full-donate
  .label-amount.label-otheramount:not(:has(input[type="radio"]:checked)):not(
    :focus-within
  )
  .label-otheramount-field {
  width: 100% !important;
  gap: 0 !important;
}

.full-donate
  .label-amount.label-otheramount:focus-within
  .label-otheramount-field,
.full-donate
  .label-amount.label-otheramount:has(input[type="radio"]:checked)
  .label-otheramount-field {
  gap: 0 !important;
  width: auto !important;
  max-width: 100% !important;
}

.full-donate .label-otheramount-infield-dollar,
.full-donate .label-otheramount-field .label-otheramount-suffix {
  display: none !important;
  flex: 0 0 auto !important;
  font-family: var(--body-font) !important;
  font-size: 17px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  color: var(--color-white) !important;
  line-height: 1 !important;
  pointer-events: none !important;
  white-space: nowrap !important;
}

.full-donate
  .label-amount.label-otheramount:focus-within
  .label-otheramount-infield-dollar,
.full-donate
  .label-amount.label-otheramount:has(input[type="radio"]:checked)
  .label-otheramount-infield-dollar {
  display: inline !important;
  margin-right: 1px !important;
}

.full-donate
  .label-amount.label-otheramount.full-donate__other-monthly:focus-within
  .label-otheramount-suffix,
.full-donate
  .label-amount.label-otheramount.full-donate__other-monthly:has(
    input[type="radio"]:checked
  )
  .label-otheramount-suffix {
  display: inline !important;
  padding-bottom: 2px;
  margin-left: -2px !important;
}

.full-donate
  .label-amount.label-otheramount:focus-within
  .label-otheramount-field
  .edit-otheramount,
.full-donate
  .label-amount.label-otheramount:has(input[type="radio"]:checked)
  .label-otheramount-field
  .edit-otheramount {
  flex: 0 0 auto !important;
  width: var(--other-input-width, 2.75ch) !important;
  min-width: 2.75ch !important;
  max-width: 8ch !important;
  height: auto !important;
  padding: 0 !important;
  margin: 0 !important;
  text-align: center !important;
  letter-spacing: 0 !important;
  -moz-appearance: textfield !important;
}

.full-donate .label-amount.label-otheramount:focus-within::before,
.full-donate
  .label-amount.label-otheramount:has(input[type="radio"]:checked)::before {
  display: none !important;
}

body .full-donate .label-amount.label-otheramount:hover,
body .full-donate fieldset label:has(input[type="radio"][value="other"]):hover {
  background-color: #09abaf !important;
  border-color: #09abaf !important;
  color: #ffffff !important;
}

.full-donate .label-amount.label-otheramount:has(input[type="radio"]:checked),
.full-donate
  fieldset
  label:has(input[type="radio"][value="other"]):has(
    input[type="radio"]:checked
  ) {
  background-color: #09abaf !important;
  border-color: #09abaf !important;
}

.full-donate .label-amount.label-otheramount:focus .js-otheramount-dollar,
.full-donate
  .label-amount.label-otheramount:has(input[type="radio"]:checked)
  .js-otheramount-dollar,
.full-donate .label-amount.label-otheramount:focus::before,
.full-donate
  .label-amount.label-otheramount:has(input[type="radio"]:checked)::before {
  color: #4f3894 !important;
}

.full-donate .label-amount input[type="radio"],
.full-donate
  .multistep-layout
  fieldset.hideStep
  label:has(input[type="radio"])
  input[type="radio"],
.full-donate .at-step label input[type="radio"] {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  border: 0 !important;
  appearance: none !important;
}

.event-hero__description a:hover {text-decoration: underline 1px #81c745!important; 
   transition: 0.3s ease-in-out;}
   .event-hero__description a{
    transition: 0.3s ease-in-out;}

.full-donate .label-amount:not(.label-otheramount):has(input:checked),
.full-donate
  .multistep-layout
  fieldset.hideStep
  label:not(.label-otheramount):has(input[type="radio"]:checked),
.full-donate
  .at-step
  label:not(.label-otheramount):has(input[type="radio"]:checked) {
  background-color: #09abaf !important;
  border-color: #09abaf !important;
}

.full-donate [class*="label-amount"]:not(.label-otheramount),
.full-donate form label[for*="SelectAmount"]:not(.label-otheramount),
.full-donate
  fieldset
  label:has(input[type="radio"][name*="SelectAmount"]):not(
    :has(input[type="radio"][value="other"])
  ) {
  background: #4f3894;
  background-color: #4f3894;
  border-color: #4f3894;
  font-size: 17px !important;
  font-weight: 600 !important;
  text-align: center !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  color: #fff;
  height: 53px !important;
  min-height: 53px !important;
  flex: 1 1 auto;
}

body .full-donate .label-amount:not(.label-otheramount):hover,
body
  .full-donate
  .multistep-layout
  fieldset.hideStep
  label:not(.label-otheramount):has(input[type="radio"]):hover,
body
  .full-donate
  .at-step
  label:not(.label-otheramount):has(input[type="radio"]):hover {
  background-color: #09abaf !important;
  border-color: #09abaf !important;
  color: #ffffff !important;
}

.full-donate .at-radios {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  gap: var(--flow-space-s) !important;
  margin-bottom: var(--flow-space-s) !important;
}

/* Amount row: 3 buttons per row */
.full-donate .at-radios .label-amount {
  flex: 0 1 calc((100% - (var(--flow-space-s) * 2)) / 3) !important;
  min-width: 0 !important;
  height: 53px !important;
  min-height: 53px !important;
}

.full-donate .at form .label-amount {
  margin-right: 0;
  margin-bottom: 0;
}

/* Amount options container: static .support-banner__amounts (flex, gap, justify space-between; each amount flex 0 1 20%) */
.full-donate .multistep-layout fieldset.hideStep > div:has(.label-amount),
.full-donate
  .multistep-layout
  fieldset.hideStep
  > div:has(label:has(input[type="radio"][value="10.00"])),
.full-donate .at-step > div:has(.label-amount),
.full-donate .at-step > div:has(label:has(input[type="radio"])) {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: var(--flow-space-s) !important;
  justify-content: space-between !important;
  margin-bottom: var(--flow-space-s) !important;
}

.full-donate .label-amount,
.full-donate .label-otheramount,
.full-donate label:has(input[type="radio"][value="other"]),
.full-donate .multistep-layout fieldset.hideStep > div:has(.label-amount) label,
.full-donate
  .multistep-layout
  fieldset.hideStep
  > div:has(label:has(input[type="radio"][value="10.00"]))
  label {
  flex: 0 1 calc((100% - (var(--flow-space-s) * 2)) / 3) !important;
  min-width: 0 !important;
  height: 53px !important;
  min-height: 53px !important;
  text-align: center !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}

/* 8. Transaction fee checkbox: static .support-banner__checkbox-label → embed checkbox + label */
.full-donate input[type="checkbox"][name*="transaction"],
.full-donate input[type="checkbox"][name*="fee"] {
  margin-top: 0.25rem !important;
  flex-shrink: 0 !important;
}

.full-donate label:has(input[type="checkbox"][name*="transaction"]),
.full-donate label:has(input[type="checkbox"][name*="fee"]) {
  display: flex !important;
  align-items: flex-start !important;
  gap: var(--flow-space-xs) !important;
  font-family: var(--body-font) !important;
  font-size: 0.875rem !important;
  color: var(--body-text-color) !important;
  cursor: pointer !important;
  margin: 0 0 var(--flow-space) 0 !important;
  text-align: left !important;
}

.full-donate .at-checkbox-title-container,
.full-donate .at-checkbox-title {
  text-align: left !important;
}

.full-donate .at-markup.SmsLegalDisclaimer.at-legal,
.full-donate .at-markup.SmsLegalDisclaimer.at-legal p,
.full-donate .at-markup.SmsLegalDisclaimer.at-legal em,
.full-donate .at-markup.SmsLegalDisclaimer.at-legal a {
  text-align: left !important;
}

.full-donate .at-markup.SmsLegalDisclaimer.at-legal {
  font-family: var(--body-font) !important;
  font-size: 0.875rem !important;
  line-height: var(--line-height) !important;
  color: var(--body-text-color) !important;
  margin-top: var(--flow-space-xs) !important;
}

.full-donate .at input[type="checkbox"] + span::before,
.full-donate input[type="checkbox"] + span::before {
  color: rgba(0, 0, 0, 0.7) !important;
  border-color: rgba(0, 0, 0, 0.7) !important;
  background-color: transparent !important;
}

.full-donate .at input[type="checkbox"],
.full-donate .at input[type="text"],
.full-donate .at input[type="email"],
.full-donate .at input[type="number"],
.full-donate .at input[type="tel"],
.full-donate .at select,
.full-donate .at textarea {
  color: rgba(0, 0, 0, 0.7) !important;
  border-color: rgba(0, 0, 0, 0.7) !important;
}

/* 9. Payment method buttons (mockup: PAYPAL, APPLE PAY, CREDIT CARD – white bg, green border, dark text, same as ONE TIME) */
.full-donate .at-btn-radio {
  flex: 1 0 30% !important;
  min-width: 5rem !important;
  border-radius: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: var(--flow-space-xs) var(--flow-space) !important;
  font-family: var(--body-font) !important;
  font-weight: bold !important;
  letter-spacing: 0.08rem !important;
  text-transform: uppercase !important;
  border: 2px solid #81c745 !important;
  background-color: var(--color-white) !important;
  color: var(--color-dark-teal) !important;
  cursor: pointer !important;
  transition:
    color var(--transition-timing) var(--transition-easing),
    border-color var(--transition-timing) var(--transition-easing),
    background-color var(--transition-timing) var(--transition-easing) !important;
}

.full-donate .at-btn-radio:hover,
.full-donate .at-btn-radio:focus,
.full-donate .at-btn-radio:focus-visible {
  background-color: var(--color-white) !important;
  color: var(--color-purple) !important;
  border-color: var(--color-purple) !important;
}

.full-donate .at-btn-radio.large,
.full-donate .at-btn-radio.small {
  flex: 1 0 30% !important;
  border-radius: 0 !important;
}

/* Payment: "Choose payment method" full width on top, method buttons same line equal width below */

.full-donate .full-donate__payment-label {
  flex: 0 0 100% !important;
  width: 100% !important;
  display: block !important;
  margin-bottom: 0 !important;
}

/* Payment option wrappers: same line, equal width */
.full-donate .at-btn-radio-wrapper {
  flex: 1 1 0 !important;
  min-width: 0 !important;
}

.full-donate
  fieldset
  label.label-otheramount:has(input[type="radio"][name*="SelectAmount"]),
.full-donate fieldset label:has(input[type="radio"][value="other"]) {
  flex: 0 1 calc((100% - (var(--flow-space-s) * 2)) / 3) !important;
  min-width: 0 !important;
}

.full-donate .at-btn-radio,
.full-donate .at-btn-radio.large,
.full-donate .at-btn-radio.small {
  flex: 1 1 auto !important;
  width: 100% !important;
  max-width: 100% !important;
}

.full-donate .at-select.StateProvince,
.full-donate .at-select.StateProvince * {
  font-size: 15px !important;
}
/* PayPal: hide all logos/images, show text "PAYPAL" only */
.full-donate .at-paypal-button img,
.full-donate .at-btn-radio.at-paypal-button img,
.full-donate a.at-paypal-button img,
.full-donate [class*="paypal"] img,
.full-donate .at-paypal-button .at-paypal-logo,
.full-donate .at-btn-radio.at-paypal-button .at-paypal-logo,
.full-donate .at-paypal-button svg,
.full-donate .at-btn-radio.at-paypal-button svg,
.full-donate a.at-paypal-button svg,
.full-donate .at-paypal-button picture,
.full-donate .at-btn-radio.at-paypal-button picture,
.full-donate .at-paypal-button [class*="logo"],
.full-donate .at-btn-radio.at-paypal-button [class*="logo"] {
  display: none !important;
  visibility: hidden !important;
  width: 0 !important;
  height: 0 !important;
  overflow: hidden !important;
  position: absolute !important;
  clip: rect(0, 0, 0, 0) !important;
}

.full-donate .at-paypal-button,
.full-donate .at-btn-radio.at-paypal-button,
.full-donate a.at-paypal-button {
  background-image: none !important;
  background-size: 0 !important;
}

/* 10. "Give with confidence" / disclaimer: static .support-banner__confidence-heading, .support-banner__disclaimer */
.full-donate .at-disclaimer,
.full-donate .multistep-layout + p,
.full-donate .at-footer {
  font-family: var(--body-font) !important;
  font-size: 0.875rem !important;
  line-height: var(--line-height) !important;
  color: var(--body-text-color) !important;
  margin: var(--flow-space-s) 0 0 0 !important;
}

/* Fieldset / step spacing */
.full-donate fieldset.hideStep,
.full-donate .at-step {
  margin-bottom: var(--flow-space-l) !important;
  padding: 0 !important;
  border: none !important;
}

.full-donate fieldset.hideStep legend,
.full-donate .at-step > legend {
  padding: 0 !important;
  float: none !important;
}

/* NGP embed: tablet (match static 1024px) */
@media (max-width: 1024px) {
  .full-donate .multistep-layout fieldset.hideStep > div:has(.label-amount),
  .full-donate
    .multistep-layout
    fieldset.hideStep
    > div:has(label:has(input[type="radio"][value="10.00"])) {
    flex-wrap: wrap !important;
  }

  .full-donate .at-radios .label-amount,
  .full-donate .label-amount,
  .full-donate .label-otheramount,
  .full-donate label:has(input[type="radio"][value="other"]),
  .full-donate
    .multistep-layout
    fieldset.hideStep
    > div:has(.label-amount)
    label,
  .full-donate
    .multistep-layout
    fieldset.hideStep
    > div:has(label:has(input[type="radio"][value="10.00"]))
    label {
    flex: 1 1 calc((100% - (var(--flow-space-s) * 2)) / 3) !important;
  }
}

/* NGP embed: tablet/mobile – 2 amount buttons per row */
@media (max-width: 768px) {
  .full-donate .at-radios,
  .full-donate .at-radios.clearfix {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: var(--flow-space-s) !important;
    width: 100% !important;
  }

  .full-donate .at-radios > .label-amount,
  .full-donate .at-radios > .label-otheramount,
  .full-donate .at-radios .label-amount,
  .full-donate .at-radios .label-otheramount,
  .full-donate .label-amount,
  .full-donate .label-amount.label-otheramount,
  .full-donate .label-otheramount,
  .full-donate label:has(input[type="radio"][value="other"]),
  .full-donate
    .multistep-layout
    fieldset.hideStep
    > div:has(.label-amount)
    label,
  .full-donate
    .multistep-layout
    fieldset.hideStep
    > div:has(label:has(input[type="radio"][value="10.00"]))
    label,
  .full-donate
    fieldset
    label.label-otheramount:has(input[type="radio"][name*="SelectAmount"]),
  .full-donate fieldset label:has(input[type="radio"][value="other"]),
  .full-donate .label-amount:not(.label-otheramount),
  .full-donate
    .multistep-layout
    fieldset.hideStep
    label:has(input[type="radio"][value="10.00"]),
  .full-donate
    .multistep-layout
    fieldset.hideStep
    label:has(input[type="radio"][value="20.00"]),
  .full-donate
    .multistep-layout
    fieldset.hideStep
    label:has(input[type="radio"][value="35.00"]),
  .full-donate
    .multistep-layout
    fieldset.hideStep
    label:has(input[type="radio"][value="50.00"]),
  .full-donate
    .multistep-layout
    fieldset.hideStep
    label:has(input[type="radio"][value="100.00"]) {
    flex: none !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
  }
}

.issues__subheading {
  padding-top: 20px;
}

.inner-wrapper {
  max-width: var(--content-wide);
  width: 80%;
  margin: 0 auto;
}

.page-title--fallback {
  padding-top: 40px;
}

article.inner-wrapper {
  padding-bottom: 60px;
  width: 80%;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
}

/* Single Post Template */
.single-post {
  --featured-image-height: 28rem;
  --featured-image-overlap: 7rem;
  --featured-image-margin: 2rem;
}

.single-hero {
  background-color: var(--color-dark-teal);
  background-image: url("./images/waves--dark-double.svg");
  background-repeat: no-repeat;
  background-position: center top -200px;
  background-size: cover;
}

.single-hero__inner {
  max-width: var(--content-wide);
  width: 80%;
  margin: 0 auto;
  padding: var(--flow-space-xl) 0;
}

.single-post--has-featured-image .single-hero__inner {
  /* Image is in-flow now (position: relative, height: auto) — no need to reserve clearance. */

  .full-donate .at-step.invalid {
    display: block;
  }

  .full-donate .at-step.valid {
    display: block;
  }
}

.single-hero__above {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: var(--flow-space-l);
}

.single-hero__backlink a {
  color: var(--color-white);
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.08rem;
  text-decoration: none;
  text-transform: uppercase;
  display: flex;
  gap: var(--flow-space-xs);
  align-items: center;
}

.single-hero__backlink a:visited {
  color: var(--color-white);
}

.single-hero__backlink a:hover,
.single-hero__backlink a:active,
.single-hero__backlink a:focus-visible {
  color: var(--color-light-green);
}

.single-hero__backlink a:focus-visible {
  outline-color: var(--color-light-green);
}

.single-hero__backlink i {
  color: var(--color-light-green);
  font-size: 12px;
}

.single-hero__share-heading {
  color: rgb(255 255 255 / 0.6);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.09rem;
  padding-bottom: 5px;
  text-transform: uppercase;
}

.single-hero__share-links {
  display: flex;
  gap: var(--flow-space-s);
}

.single-hero__share-links a {
  color: rgb(255 255 255 / 0.6);
  text-decoration: none;
}

.single-hero__share-links a:visited {
  color: rgb(255 255 255 / 0.6);
}

.single-hero__share-links a:hover,
.single-hero__share-links a:active,
.single-hero__share-links a:focus-visible {
  color: var(--color-light-green);
}

.single-hero__share-links a:focus-visible {
  outline-color: var(--color-light-green);
}

.single-hero__wrapper {
  max-width: var(--content-wide);
  /* width: 80%; */
  margin: 0 auto;
  position: relative;
}

.single-post--has-featured-image .single-hero__wrapper {
  margin-bottom: -14rem;
}

.single-hero__eyebrow {
  color: var(--color-white);
  display: flex;
  gap: var(--flow-space-s);
  align-items: center;
  margin-bottom: var(--flow-space);
}

.single-hero__eyebrow .eyebrow {
  color: var(--color-white);
}

.single-hero__title {
  color: var(--color-white);
  margin: 0 0 var(--flow-space) 0;
  line-height: 1.1;
}

.single-hero__date {
  font-size: 0.875rem;
}

.single-hero__tags {
  display: flex;
  gap: var(--flow-space-s);
  flex-wrap: wrap;
  margin-bottom: 1.5rem;
}

img.single-hero__featured-img {
  height: auto !important;
}

.single-hero__tags a {
  color: var(--color-white);
  border: 1px solid var(--color-teal);
  padding: 0 8px;
  border-radius: 20px;
  text-decoration: none;
  font-size: 0.875rem;
}

.single-hero__tags a:visited {
  color: var(--color-white);
}

.single-hero__tags a:hover,
.single-hero__tags a:active,
.single-hero__tags a:focus-visible {
  color: var(--color-light-green);
  border-color: var(--color-light-green);
  outline: none;
}

.single-hero__featured-image {
  position: relative;
  height: auto;
  width: 100%;
}

.single-hero__featured-caption {
  font-size: 14px;
  margin-top: 0.25em;
  opacity: 0.9 !important;
  text-align: right;
}

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

/* Image overlap effect now handled by `.single-post--has-featured-image .single-hero__wrapper { margin-bottom: -14rem }`. */

.single-content__inner {
  max-width: var(--content-narrow);
  width: 80%;
  margin: 10px auto;
  padding: var(--flow-space-l) 0;
}

.single-post--has-featured-image .single-content__inner {
  padding-top: calc(
    var(--featured-image-overlap) + var(--featured-image-margin)
  );
}
.staff-list__links a {
  width: fit-content !important;
}

.single-content__subtitle {
  font-size: 1.5rem;
  font-weight: 600;
  padding-top: 10px;
  padding-bottom: 10px;
  line-height: 1.3;
  letter-spacing: -0.015rem;
}

.single-content img,
.single-content .wp-caption {
  max-width: 100% !important;
}

/* Different styles for heading in post content */
.single-content h1,
.single-content h2,
.single-content h3,
.single-content h4,
.single-content h5,
.single-content h6 {
  font-family: var(--body-font);
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: -0.02rem;
}

.single-content h1 {
  font-size: 2.5rem;
}

.single-content h2 {
  font-size: 2rem;
}

.single-content h3 {
  font-size: 1.8rem;
  padding-top: 15px;
}

.single-content h4 {
  font-size: 1.7rem;
    padding-top: 10px;
}

.single-content h5 {
  font-size: 1.6rem;
  padding-top: 5px;
}

.single-content h6 {
  font-size: 1.5rem;
  padding-top: 5px;
}

/* Responsive embeds (e.g. YouTube, Vimeo) from Classic Editor */
.single-content .embed-responsive {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%; /* 16:9 */
  height: 0;
  overflow: hidden;
}

.single-content .embed-responsive iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.single-recommended__inner {
  max-width: var(--content-wide);
  width: 80%;
  margin: var(--flow-space-l) auto var(--flow-space-xl) auto;
}

.single-recommended__posts {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--flow-space);
}

.single-recommended__image {
  height: 284px;
  width: 100%;border: .5px solid rgba(0, 0, 0, .3);
  /* border: 2px solid transparent; */
  text-decoration: none;
  transition: border-color var(--transition-timing) var(--transition-easing);
  background-color: var(--color-light-gray);
  background-image: url("./images/logo-horizontal.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.page-title--sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.take-action__card-media img,
.take-action__hero-media img {
  transition: filter 0.3s ease;
}
.single-content__inner a img:hover,
.single-recommended__image:hover,
.wp-block-image a img:hover,
.take-action__card-media img:hover,
.take-action__hero-media img:hover,
.site-header__logo img:hover,
.single-recommended__image:active,
.single-recommended__image:focus-visible {
  /* border-color: var(--color-green); */
  outline: none;
  filter: brightness(1.1) grayscale(15%);
  transition: filter 0.3s ease;
}
.single-content__inner a img,
.wp-block-image a img,
.site-header__logo img,
.single-recommended__image {
  transition: filter 0.3s ease;
}

.single-recommended__text {
  --flow-space: var(--flow-space-s);
  padding: 0 2px;
}

.site-header__lower {
  border-bottom: 1px solid var(--Border-Solid-Light, #d9dedd);
}

.single-recommended__title {
  font-size: 1.5rem;
  line-height: 1.3;
  letter-spacing: -0.015rem;
  font-weight: 600;
  text-decoration: underline transparent solid 2px;
  transition: text-decoration-color var(--transition-timing)
    var(--transition-easing);
      text-underline-offset: 4px;
}

.single-recommended__title:hover,
.single-recommended__title:active,
.single-recommended__title:focus-visible {
  color: var(--body-text-color);
  text-decoration-color: var(--color-green);
  text-underline-offset: 4px;
  outline: none;
}

.single-recommended__excerpt {
  margin-top: var(--flow-space-xs);
}

/* Person Template */
.person__inner {
  max-width: var(--content-wide);
  width: 80%;
  margin: 0 auto;
  padding: var(--flow-space-l) 0;
}
.person__name {
  line-height: 1;
  margin-bottom: 10px;
  margin-top: 10px;
}
.person__columns {
  display: flex;
  gap: var(--flow-space-xl);
}

.person__column {
  min-width: 0;
}

.person__column:first-child {
  width: 100%;
  max-width: 700px;
  flex: 1 1 auto;
}

.person__column:last-child {
  flex: 1 1 0;
  min-width:280px;
  width:90%;
  max-width: 320px;;
}

.person__pronouns {
  color: #a1aaa8;
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.0875rem;
  text-transform: uppercase;
}

.person__title {
  font-size: 1.5rem;
  margin-top: var(--flow-space);
  line-height: 1.1;
  margin-bottom: var(--flow-space-s);
  font-weight: 600;
  color: var(--body-text-color-secondary);
}

.person__organization {
  font-size: 1.25rem;
  font-weight: 600;
  color: var(--body-text-color-secondary);
}
.staff-list__image.frame {
  width: 100%;
}

.staff-list__image,
.staff-list__image:hover {
  transition: 0.3s ease-in-out;
}

.staff-list__card .staff-list__image {
  transition: 0.3s ease-in-out;
}

.staff-list__card .staff-list__image:hover {
  filter: brightness(1.1) grayscale(15%);
}

.staff-list__card .staff-list__name a {
  text-decoration-color: transparent !important;
  text-underline-offset: 4px;
  transition: 0.3s ease-in-out;
}

.staff-list__card .staff-list__name a:hover {
  text-decoration-color: #81c745 !important;
  text-underline-offset: 4px;
  transition: 0.3s ease-in-out;
}

/* .staff-list__card:hover .staff-list__name {text-decoration: underline 3px #81c745!important;   text-underline-offset: 4px;

   transition: 0.3s ease-in-out;} */

.quotes__controls.mobile-only {
  display: none;
}
.quotes__controls.desktop-only {
  justify-content: flex-start;
  margin-top: 30px;
  display: flex;
}

.staff-list__image.frame img {
  object-position: top;
}

/* Organizer cards: arched photo shape (rounded top, flat bottom). Same mask as .person__headshot. */
.staff-list__image--arch.frame {
  aspect-ratio: 1 / 1;
  -webkit-mask-image: url("./images/arch-mask.svg");
  mask-image: url("./images/arch-mask.svg");
  mask-size: 100% 100%;
  mask-position: center;
  mask-repeat: no-repeat;
}

.single-hero__author {
  color: white;
  text-align: left;
  font-style: italic;
  padding-bottom: 10px;
  font-size: 15px;
}

.person__region {
  font-size: 1.25rem;
  font-weight: 400;
  font-style: italic;
  padding-top: 5px;
  color: var(--body-text-color-secondary);
}

.person__headshot.frame {
  width: 100%;
  max-width: 100%;
  margin-top: 20px;
  aspect-ratio: 1 / 1;
  margin-bottom: var(--flow-space-l);
  /* Mask the frame, not the img — image fills the box and is clipped by the arch */
  -webkit-mask-image: url("./images/arch-mask.svg");
  mask-image: url("./images/arch-mask.svg");
  mask-size: 100% 100%;
  mask-position: center;
  mask-repeat: no-repeat;
}

.person__socials {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  gap: 20px;
  justify-content: center;
}

.person__social a {
  font-size: 1.25rem;
  letter-spacing: -0.0035rem;
  text-decoration: none;
  display: flex;
  gap: 0.5rem;
  padding: 1rem 1rem 1rem 1rem;
}

.person__headshot.frame > img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top center;
}

/* Optional: clip-path instead of mask (no SVG file). Same arch shape, scales with the box. */
/*
.person__headshot.frame {
  aspect-ratio: 1 / 1;
  clip-path: path(
    'M288 0.5C446.782 0.5 575.5 129.218 575.5 288V575.5H0.5V288C0.5 129.218 129.218 0.5 288 0.5Z'
  );
}
*/

.person__socials {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  justify-content: flex-start;
  gap: var(--flow-space-xs);
}

.person__social-heading {
  margin-bottom: var(--flow-space);
}

.person__social a {
  letter-spacing: -0.0035rem;
  text-decoration: none;
  display: flex;
  gap: 0.5rem;

  height: 1.5rem;
  width: fit-content;
  align-items: center;
  background-color: var(--color-light-gray);
  border: 1px solid var(--color-teal);
  border-radius: 1.25rem;
  transition: background-color var(--transition-timing) var(--transition-easing);
}

.person__social a:hover,
.person__social a:active,
.person__social a:focus-within {
  background-color: var(--color-teal);
  color: var(--color-white);
}

.person__contact {
  margin-top: var(--flow-space-xl);
}

/* 404 Page */
.not-found {
  background:
    url("./images/teal-gradient-wave.svg") left 0 top -349px no-repeat,
    url("./images/teal-gradient-wave.svg") right 0 bottom -349px no-repeat,
    radial-gradient(circle at 50% 38.18%, #09abaf 0%, #0e3e4e 100%);
}

.not-found__inner {
  max-width: var(--content-narrow);
  width: 80%;
  margin: 0 auto;
  padding: 6.75rem 0;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-areas:
    "media text"
    "links links";
  align-items: center;
  row-gap: var(--flow-space-l);
}

.not-found__media {
  grid-area: media;
  width: 320px;
  height: 320px;
  border-radius: 50%;
}

.not-found__text {
  grid-area: text;
  color: var(--color-white);
  text-align: center;
}

h1.not-found__heading {
  color: var(--color-white);
  font-size: 10rem;
  line-height: 1.1;
}

.not-found__subheading {
  font-size: 1.5rem;
  margin-bottom: 10px;
  font-weight: 600;
}

.not-found__links {
  grid-area: links;
}

.not-found__links ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  gap: var(--flow-space-s);
  justify-content: stretch;
}

.not-found__links li {
  flex: 1 1 auto;
  margin: 0;
}

.not-found__link {
  font-size: 1rem;
  gap: 9px !important;
  line-height: 1;
  padding: 13px;
  background-color: transparent;
  color: var(--color-white);
}

.not-found__link:visited {
  color: var(--color-white);
}

.not-found__link:hover,
.not-found__link:active,
.not-found__link:focus-visible {
  color: var(--color-light-green) !important;
  border-color: var(--color-light-green) !important;
  background-color: transparent !important;
  outline-color: var(--color-light-green) !important;
}

/* Footer */
.footer {
  background-color: var(--color-dark-teal);
  color: var(--color-white);
}


.footer__logo.frame {opacity:1; transition:  0.25s ease-out; transform: scale(1);}
.footer__logo.frame:hover {opacity:0.85; transition:  0.25s ease-out; transform: scale(1.01);}

.footer__divider {
  width: 100%;
  height: 6px;
  background: var(--rainbow-gradient-h);
}

.footer__inner {
  max-width: var(--content-wide);
  width: 80%;
  margin: 0 auto;
  padding: 3rem 0 1rem;
}
.media-text-hero {
  min-height: 400px;
}

.rainbow-cta__link:hover {
  opacity: 0.75;
  transition: opacity 0.25s ease-out;
}
.rainbow-cta__link {
  transition: opacity 0.25s ease-out;
}

.rainbow-cta {
  background: var(--color-yellow);
}

.footer__upper-row {
  display: grid;
  grid-template-columns: 1fr 2fr 2fr;
  gap: var(--flow-space);
  margin-bottom: var(--flow-space);
}

.footer a,
.footer a:visited {
  color: var(--color-white);
}

.footer a:hover,
.footer a:visited:hover,
.footer a:active,
.footer a:visited:active,
.footer a:focus-visible,
.footer a:visited:focus-visible {
  color: var(--color-light-green);
}

.footer a:focus-visible {
  outline-color: var(--color-light-green);
}

.footer__logo {
  text-decoration: none;
  height: 180px;
  width: 137px;
}

.footer__nav {
  list-style: none;
  margin: 0;
  padding: 0;
  columns: 2;
}

.footer__badges img {
  object-fit: contain;
}
.footer__nav li {
  margin-bottom: var(--flow-space);
}

.footer__confidence {
  --flow-space: var(--flow-space-s);
}

.footer__subhead {
  font-weight: 600;
  opacity: 0.8;
}

.footer__confidence p {
  margin-top: 10px;
  color: rgb(255, 255, 255);
  font-size: 0.875rem;
  letter-spacing: 0.026rem;
  padding-bottom: 5px;
  opacity: 0.6;
}

.footer__badges {
  display: flex;
  gap: var(--flow-space-s);
}

.footer__badge {
  height: 74px;
}
.site-header__shop-icon,
.site-header__search button .fa-solid.fa-magnifying-glass {
  color: black !important;
  transition: 0.25s ease-out;
}

.header-custom-link,
.header-custom-link button {
  text-decoration: none;
  transition: 0.25s ease-out;
  transition: 0.25s ease-out;
  font-weight: 100 !important;
}
.header-custom-link:hover,
.header-custom-link:hover button {
  color: var(--color-teal);
  transition: 0.25s ease-out;
  text-decoration: none !important;
}

.header-custom-link:hover *, .site-header__search:hover button .fa-solid.fa-magnifying-glass  {
  stroke: var(--color-teal);
  transition: 0.25s ease-out;
  color: var(--color-teal) !important;
}
.footer__upper-row {
  padding-bottom: var(--flow-space-l);
  gap: var(--flow-space-xl);
  grid-template-columns: 1fr 2.25fr 1.5fr;
}
.search-results__no-results {
  padding-bottom: 170px;
}
.footer__lower-row {
  display: flex;
  justify-content: space-between;
  margin: var(--flow-space-l) 0;
  border-top: 1px solid rgba(255, 255, 255, 0.24);
  padding-top: var(--flow-space-s);
}

.footer__group {
  display: flex;
  gap: var(--flow-space);
  font-size: 0.875rem;
}

.footer .social-icons {
  display: flex;    gap: 20px;
}

.footer .social-icon {
  text-decoration: none;
}

/* temporary header styling */
.site-header .header-right {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
}
.site-header #menu-header {
  gap: 30px;
  display: flex;
}

/* -------------------------------------------------------------- */
/* Animate CSS
-------------------------------------------------------------- */
.fade-in-from-left {
  opacity: 0;
  animation-timing-function: ease-out;
  -webkit-transform: translateX(-15px);
  -moz-transform: translateX(-15px);
  -o-transform: translateX(-15px);
  -ms-transform: translateX(-15px);
  transform: translateX(-15px);
}

.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.fade-in-from-left.animated {
  animation-name: fade-from-left;
  animation-duration: 0.5s;
  opacity: 1;
  -webkit-transform: translateX(0);
  -moz-transform: translateX(0);
  -o-transform: translateX(0);
  -ms-transform: translateX(0);
  transform: translateX(0);
}

@keyframes fade-from-left {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-15px);
    -moz-transform: translateX(-15px);
    -o-transform: translateX(-15px);
    -ms-transform: translateX(-15px);
    transform: translateX(-15px);
  }

  45% {
    opacity: 0.5;
  }

  90% {
    opacity: 1;
  }

  100% {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -o-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.fade-in-from-bottom {
  opacity: 0;
  animation-timing-function: ease-out;
  -webkit-transform: translateY(15px);
  -moz-transform: translateY(15px);
  -o-transform: translateY(15px);
  -ms-transform: translateY(15px);
  transform: translateY(15px);
}

.fade-in-from-bottom.animated {
  animation-name: fade-from-bottom;
  animation-duration: 1s;
  opacity: 1;
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -o-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
}

@keyframes fade-from-bottom {
  0% {
    opacity: 0;
    -webkit-transform: translateY(15px);
    -moz-transform: translateY(15px);
    -o-transform: translateY(15px);
    -ms-transform: translateY(15px);
    transform: translateY(15px);
  }
  90% {
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -o-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.fade-in-from-right {
  opacity: 0;
  animation-timing-function: ease-out;
  -webkit-transform: translateX(40px);
  -moz-transform: translateX(40px);
  -o-transform: translateX(40px);
  -ms-transform: translateX(40px);
  transform: translateX(40px);
}

.fade-in-from-right.animated {
  animation-name: fade-from-right;
  animation-duration: 0.5s;
  opacity: 1;
  -webkit-transform: translateX(0);
  -moz-transform: translateX(0);
  -o-transform: translateX(0);
  -ms-transform: translateX(0);
  transform: translateX(0);
}

@keyframes fade-from-right {
  0% {
    opacity: 0;
    -webkit-transform: translateX(40px);
    -moz-transform: translateX(40px);
    -o-transform: translateX(40px);
    -ms-transform: translateX(40px);
    transform: translateX(40px);
  }

  90% {
    opacity: 1;
  }

  100% {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -o-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes gradient {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}

.page-template-page-news_listing .page-title--fallback {
  text-align: center;
}

.rtecenter {
  margin: 30px auto;
  display: flex;
  width: 100%;
  justify-content: center;
  align-items: center;
}

/* Drupal migration: legacy CKEditor / RTE classes from old Drupal posts */
.rteleft,
.text-align-left {
  text-align: left;
}

.rteright,
.text-align-right {
  text-align: right;
}

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

.rtejustify,
.text-align-justify {
  text-align: justify;
}

.rteindent1 {
  margin-left: 40px;
}
.rteindent2 {
  margin-left: 80px;
}
.rteindent3 {
  margin-left: 120px;
}
.rteindent4 {
  margin-left: 160px;
}

.rteunderline {
  text-decoration: underline;
}
.rtestrike {
  text-decoration: line-through;
}

/* Bootstrap 3 image classes commonly emitted by Drupal 7 Bootstrap themes */
.img-responsive {
  display: block;
  max-width: 100%;
  height: auto;
}

.img-responsive.center,
img.img-responsive.center,
.img-center,
img.center {
  margin-left: auto;
  margin-right: auto;
}

.img-responsive.left,
img.img-responsive.left,
img.left {
  float: left;
  margin: 0 var(--flow-space) var(--flow-space-s) 0;
}

.img-responsive.right,
img.img-responsive.right,
img.right {
  float: right;
  margin: 0 0 var(--flow-space-s) var(--flow-space);
}

.img-rounded {
  border-radius: 6px;
}
.img-circle {
  border-radius: 50%;
}
.img-thumbnail {
  padding: 4px;
  background-color: var(--color-white);
  border: 1px solid var(--color-light-gray-2);
  max-width: 100%;
  height: auto;
}

/* Bootstrap 3 responsive embeds (YouTube/Vimeo iframes in migrated posts) */
.embed-responsive {
  position: relative;
  display: block;
  height: 0;
  padding: 0;
  overflow: hidden;
}

.embed-responsive .embed-responsive-item,
.embed-responsive iframe,
.embed-responsive embed,
.embed-responsive object,
.embed-responsive video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.embed-responsive-16by9 {
  padding-bottom: 56.25%;
}
.embed-responsive-4by3 {
  padding-bottom: 75%;
}
.embed-responsive-21by9 {
  padding-bottom: 42.857143%;
}
.embed-responsive-1by1 {
  padding-bottom: 100%;
}

/* Drupal image alignment (often emitted by core's align filter) */
img.align-left,
.align-left {
  float: left;
  margin: 0 var(--flow-space) var(--flow-space-s) 0;
}

img.align-right,
.align-right {
  float: right;
  margin: 0 0 var(--flow-space-s) var(--flow-space);
}

img.align-center,
.align-center {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

/* Drupal caption filter wraps media in <figure class="caption caption-img"> */
.caption {
  margin: var(--flow-space) 0;
}

.caption img {
  display: block;
  max-width: 100%;
  height: auto;
}

.caption-img figcaption,
.caption figcaption {
  color: var(--body-text-color-secondary);
  font-size: 0.875rem;
  line-height: 1.3;
  margin-top: var(--flow-space-xs);
}
img.single-hero__featured-img {margin-top:10px}

/* 700px? */
/* Post carousel — wider slides: Slick controls width; drop legacy 520px flex cap */
.post-carousel__posts:not(.slick-initialized) .post-carousel__post {
  flex: 0 1 572px;
}



.post-carousel__posts.slick-initialized .post-carousel__post {
  flex: 1 1 auto;
  width: 100%;
  max-width: none;
}

.post-carousel__posts.slick-initialized .slick-slide {
  box-sizing: border-box;
}

.post-carousel__image {
  overflow: hidden;
}
.full-donate__amount-label.support-banner__label {
  margin-top: 20px !important;
}

.post-carousel__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.post-carousel__image.news-listing__image--placeholder img {
  object-fit: contain;
  object-position: center;
}
.single-recommended__image {
  height: auto;
  aspect-ratio: 8 / 5;
}

.ff-message-success p:has(img) {
  text-align: center;
}
.ff-message-success {
  border: unset !important;
  box-shadow: unset !important;
}

.page-id-210 h1::after {
  content: "";
  display: inline-block;
  width: 45px;
  height: 45px;
  margin-left: 15px;

  background-image: url("/wp-content/themes/blueprintinteractive/images/mail.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;

  vertical-align: middle;
}

.full-donate .at-row label.at-text,
.full-donate .at-checkbox-title-container {
  font-size: 0.875rem;
  font-weight: 500 !important;
  color: #32383f;
}

.ff-default .ff-el-form-control {
  border: 1px solid rgba(0, 0, 0, 0.3) !important;
  border-radius: 0px !important;
}

.ngp-form input,
.ngp-form textarea,
.ngp-form select,
.frm-fluent-form input,
.frm-fluent-form textarea,
.frm-fluent-form select,
.frm-fluent-form option,
.ngp-form option {
  font-family: var(--body-font) !important;
}

.person__contact {
  margin: 40px auto 20px auto;
  max-width: 600px;
}

.take-action {
  padding-top: var(--flow-space-l) !important;
  padding-bottom: var(--flow-space-l) !important;
}

.gallery-band {
  padding-top: 80px;
}

.timeline__scroll-hint {
  display: none !important;
}

.full-email-signup .at-form-submit .at-submit {
  margin-top: 0px !important;
}
.staff-list__title {
  color: var(--body-text-color) !important;
  font-weight: 400 !important;
  opacity: 1 !important;
}
.staff-list__pronouns {
  font-style: italic !important;
  color: #a1aaa8 !important;
  opacity: 1 !important;
  font-size: 14px !important;
}

body form .wpf_has_custom_css.ff-btn-submit, .full-email-signup .at input[type="submit"] {
  padding: var(--flow-space-xs) var(--flow-space);
  justify-content: center;
  align-items: center;
  gap: 3px;
  font-size: 16px;
  font-family: var(--body-font);
  font-weight: bold;
  letter-spacing: 0.08rem;
  text-transform: uppercase;
  text-decoration: none;
  border: 2px solid transparent;
  background-color: rgba(79, 56, 148, 1);
  border-color: rgba(79, 56, 148, 1);
  color: #ffffff;
  border-radius: 0px;
  min-width: 180px;
}

form.fluent_form_4 .wpf_has_custom_css.ff-btn-submit:hover, body .full-email-signup .at input[type="submit"]:hover {
  background-color: rgba(9, 171, 175, 1);
  border-color: rgba(9, 171, 175, 1);
  color: rgba(255, 255, 255, 1);
  min-width: 180px;
}

.background-img-hero__inner{width:90%}

.job-listings-container{width:89%;max-width:1200px; margin: 0 auto;}

.search-results__posts {
  max-width: 850px;

  width: 100%;
  margin: 0 auto;
}
.news-listing.search-results .search-results__inner{max-width: 850px;}

.resources__icon-container{
display: flex;
gap: 10px;

}

.resources__link,.resources__description {padding-left: 37px;}

/* Safari */
@supports (font: -apple-system-body) and (-webkit-appearance: none) {
  .button {
    line-height: 1;
  }
}

/* Firefox */
@supports (-moz-appearance: none) {
  .button {
    line-height: 1;
  }
}

/* Shared column styling */
.three-columns,
.two-columns {
  text-align: center;
  column-gap: 40px;
}

.three-columns p,
.two-columns p {
  margin-top: 0;
  margin-bottom: 12px;
  break-inside: avoid;
  page-break-inside: avoid;
}

/* Three-column variant */
.three-columns {
  column-count: 3;
}
.home .timeline__content,.home .timeline--pillars .timeline__content {
  gap: var(--flow-space-xl);
}
.home .timeline__media.frame {max-height:350px}
.home .timeline--pillars .timeline__content {
  grid-template-columns: 1.5fr 2fr !important}
/* Two-column variant */
.two-columns {
  column-count: 2;
}




.postid-729 .post-grid {padding-top:10px !important;}

.menu-item-mega>.mega-menu__row {
  display: inline-flex;
  align-items: center;
  gap: 0.15rem;
}
.site-header .menu-item.menu-item-type-post_type > a{
font-size: 1.1rem !important;

text-transform: uppercase !important;
text-decoration: none;margin-right: 5px;
transition: color 0.45s ease;
font-style: normal;
  font-weight: 700;
  line-height: 24px;
font-size: 16px !important;
color: #0e3e4e !important;
letter-spacing: 0.5px !important;}

.site-header .menu-item.menu-item-type-post_type  a:hover{color: #09ABAF !important;}