:root {
    --Inter: "Inter", sans-serif;
    --Geologica: "Geologica", sans-serif;

    --Mini-Rounded: 12px;
    --Small-Rounded: 20px;
    --Large-Rounded: 50px;

    /* Colors */
    --Blue-Primary: #008ED5;
    --Blue-10: #A3DAF5;
    --Blue-30: #5EBEED;
    --Blue-70: #006699;
    --Blue-90: #004466;

    --Sky-Primary: #A7E2FF;
    --Sky-10: #E5F7FF;
    --Sky-30: #CCEEFF;
    --Sky-70: #7DC5E8;
    --Sky-90: #5CAED6;

    --Navy-Primary: #082F61;
    --Navy-10: #ADC8EB;
    --Navy-30: #295EA3;
    --Navy-70: #04172F;
    --Navy-90: #020B18;

    --Kelp-Primary: #03695D;
    --Kelp-10: #ADEBE4;
    --Kelp-30: #40BFB1;
    --Kelp-70: #02312C;
    --Kelp-90: #011916;

    --Purple-Primary: #3E1B40;
    --Purple-10: #DABDDB;
    --Purple-30: #824785;
    --Purple-70: #2A122B;
    --Purple-90: #1C0C1D;

    --Maroon-Primary: #6A0E31;
    --Maroon-10: #E5B2C6;
    --Maroon-30: #AC5375;
    --Maroon-70: #43091F;
    --Maroon-90: #2D0615;

    --Orange-Primary: #F39820;
    --Orange-10: #FCE9CF;
    --Orange-30: #F7BC6E;
    --Orange-70: #915608;
    --Orange-90: #492B04;

    --Coral-Primary: #CE4C37;
    --Coral-10: #EBB6AD;
    --Coral-30: #D76C5B;
    --Coral-70: #7B2B1E;
    --Coral-90: #3D150F;

    --Green-Primary: #82D99F;
    --Green-10: #D8F3E1;
    --Green-30: #B1E7C3;
    --Green-70: #367D4D;
    --Green-90: #1F472C;

    --White: #FFFFFF;
    --Gray-10: #E1F0FA;
    --Gray-20: #E1F0FA;
    --Gray-30: #ADC8D9;
    --Gray-40: #86A1B2;
    --Gray-50: #6C8FA6;
    --Gray-60: #5B798C;
    --Gray-70: #4B6373;
    --Gray-80: #3A4D59;
    --Gray-90: #263640;
    --Blue-100: #001A2A;

    --transition-speed: 0.3s;
    --transition-easing: ease-in-out;
}

* {
    transition: all var(--transition-speed) var(--transition-easing);
}

h1,h2,h3,h4,h5,h6 {
    font-family: var(--Geologica);
}
.info-form h1,
.info-form h3,
.info-form h4,
.info-form h5,
.info-form h6 {
    color: var(--White);
}

.info-form h2,
.donate-form h1,
.donate-form h2,
.donate-form h3,
.donate-form h4,
.donate-form h5,
.donate-form h6 {
    color: var(--Blue-100);
}

h1 {
    font-size: clamp(2rem, 6vw + 1rem, 4rem);
    font-weight: 700;
    line-height: 112%;
    letter-spacing: -1.92px;
    text-transform: capitalize;
}

h5 {
    font-size: clamp(1rem, 1.2vw + 0.5rem, 1.375rem);
    font-weight: 700;
    line-height: 118%;
    letter-spacing: -0.66px;
    margin-bottom: 15px;
}

h4 {
    font-family: var(--Geologica);
    font-size: clamp(1.25rem, 1.5vw + 0.5rem, 1.75rem);
    font-weight: 800;
    line-height: 121%;
    margin-bottom: 25px;
}

p, 
input[type="checkbox"] + label {
    font-family: var(--Inter) !important;
    font-weight: 500 !important;
}

.info-form p {
    color: var(--White);
}
.donate-form p,
.donate-form input[type="checkbox"] + label,
.info-form input[type="checkbox"] + label {
    color: var(--Blue-100);
}

.navy-purple-gradient-background {
    background: linear-gradient(180deg, var(--Navy-Primary) 0%, var(--Purple-Primary) 73.36%);
}
.kelp-gradient-background {
    background: linear-gradient(180deg, var(--Green-Primary) 0%, var(--Kelp-Primary) 100%);
}

.body-header,
.content-footer {
    padding: var(--engrid__body-main_padding);
}

[data-engrid-theme="oc2"] .body-top:after,
[data-engrid-theme="oc2"] .content-footer:before {
    content: none;
}

.body-header,
.body-title,
.body-top,
.body-main,
.body-footer,
.content-footer {
    background-color: transparent;
    padding-left: clamp(30px, 5vw, 7rem);
    padding-right: clamp(30px, 5vw, 7rem);
}


.body-top {
    padding-left: clamp(30px, 5vw, 7rem);
    padding-right: clamp(30px, 5vw, 7rem);
    padding-bottom: 0;
}

.content-footer h4,
.content-footer p {
    color: var(--White) !important;
}

.en__submit {
    align-items: center;
    display: flex;
    justify-content: center;
}
.en__submit button {
    border: none;
    border-radius: 50px;
    gap: 5px; 
    justify-content: space-around;
    padding: 20px 40px;
    text-transform: uppercase;
    width: auto;
}
.info-form .en__submit button {
    background-color: var(--Sky-Primary);
    color: var(--Blue-100);
    font-family: var(--Geologica);
}
.donate-form .en__submit button {
    background-color: var(--Kelp-Primary);
}
.donate-form .en__submit button:hover,
.info-form .en__submit button:hover {
    background-color: var(--Navy-Primary);
    color: var(--White);
}

.en__component--formblock {
    margin-right: 0;
    margin-left: 0;
}
.en__component--formblock > * {
    padding-left: 0;
    padding-right: 0;
}

.body-main .en__component--formblock,
.body-main .en__component--copyblock,
.body-main .en__component--codeblock {
    background-color: var(--White);
    padding: 0 5%;
}

.body-main .en__component--formblock {
    justify-content: space-between;
}
.info-form .en__component--formblock .en__field--title,
.info-form .en__component--formblock .en__field--firstName {
    flex-basis: 47%;
}

.donate-form .read-more span,
.donate-form .read-more a {
    font-family: var(--Inter) !important;
    font-weight: 500 !important;
    color: var(--Blue-100);
}

.donate-form .read-more a {
    text-decoration: underline;
}

.info-form .read-more span,
.info-form .read-more a {
    font-family: var(--Inter) !important;
    font-weight: 500 !important;
    color: var(--White);
}

.info-form .read-more a {
    text-decoration: underline;
}
/* DONATION FORM: FREQUENCY */

[data-engrid-theme="oc2"] .recurring-upsell-text p {
    font-style: italic;
    font-size: clamp(1rem, 1vw + 0.5rem, 1.25rem);
    width: 100%;
}

.en__component--formblock .en__field--recurrfreq {
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 10px;
    padding: 10px;
}
.en__component--formblock .en__field--recurrfreq .en__field__element--radio {
    border: 3px solid var(--Gray-50);
    border-radius: 50px;
    flex-wrap: nowrap;
    justify-content: space-between;
    padding: 10px;
    width: 100%;
}

.radio-to-buttons_recurrfreq .en__field--recurrfreq.en__field--radio input[type="radio"] + label,
.radio-to-buttons_donationAmt .en__field--donationAmt.en__field--radio .en__field__item input[type="radio"] + label {
    background-color: unset;
}

[data-engrid-theme="oc2"] .radio-to-buttons_recurrfreq .en__field--recurrfreq.en__field--radio .en__field__element .en__field__item,
.en__component--formblock .en__field--recurrfreq .en__field__element--radio .en__field__item {
    align-items: center;
    border-radius: 100px;
    display: flex;
    flex-wrap: nowrap;
    gap: 10px;
    justify-content: center;
    max-width: 214px;
    padding: 0;
    width: 100%;
}

[data-engrid-theme="oc2"] .radio-to-buttons_recurrfreq .en__field--recurrfreq.en__field--radio .en__field__element .en__field__item:first-of-type label,
[data-engrid-theme="oc2"] .radio-to-buttons_recurrfreq .en__field--recurrfreq.en__field--radio .en__field__element .en__field__item:last-of-type label {
    background-color: none;
    border: none;
    border-radius: 100px;
    font-family: var(--Geologica);
    padding: 10px 60px;
    text-transform: uppercase;
    width: 100%;
}

.radio-to-buttons_recurrfreq .en__field--recurrfreq.en__field--radio .en__field__item input[type="radio"]:checked + label,
.radio-to-buttons_donationAmt .en__field--donationAmt.en__field--radio .en__field__item input[type="radio"]:checked + label {
    background-color: var(--Kelp-Primary) !important;
    border-color: var(--Kelp-Primary) !important;
}

.radio-to-buttons_donationAmt .en__field--donationAmt.en__field--radio .en__field__item input[type="radio"] + label:hover,
.radio-to-buttons_recurrfreq .en__field--recurrfreq.en__field--radio .en__field__item input[type="radio"] + label:hover {
    background-color: var(--Blue-100);
}

[data-engrid-theme="oc2"] .radio-to-buttons_recurrfreq .en__field--recurrfreq.en__field--radio input[value="MONTHLY"] + label:before,
[data-engrid-theme="oc2"] .radio-to-buttons_recurrfreq .en__field--recurrfreq.en__field--radio input[value="MONTHLY"] + label:after,
[data-engrid-theme=oc2] .header-with-divider:before {
    content: none;
}

/* Select gift amount */

.en__component--formblock .en__field .en__field__element.en__field__element--radio {
    gap: 15px; 
    justify-content: space-between;
}

/* @media screen and (max-width: 551px) {
    .en__component--formblock .en__field .en__field__element.en__field__element--radio {
        flex-direction: column;
    }
} */

.radio-to-buttons_donationAmt .en__field--donationAmt.en__field--radio > .en__field__element .en__field__item {
    max-width: 180px;
    padding: 0;
    width: 100%;
}

.radio-to-buttons_donationAmt .en__field--donationAmt.en__field--radio input[type="radio"] + label {
    align-items: center;
    border: 3px solid var(--Gray-50);
    border-radius: 50px;
    display: flex;
    justify-content: center;
    /* max-width: 158px; */
    padding: 20px 0;
}

[data-engrid-theme="oc2"] .en__field--withOther.en__field--radio.en__field--donationAmt .en__field__item--other {
    max-width: 100%;
}

[data-engrid-theme="oc2"] .en__field--withOther.en__field--radio.en__field--donationAmt .en__field__item--other input {
    align-items: center;
    border: 3px solid var(--Gray-50);
    border-radius: 50px;
    display: flex;
    justify-content: space-between;
    padding: 20px 60px;
}

/* INPUT FIELDS */
input, input.en__field__input,
select, select.en__field__input--select, select.en__field__input--splitselect, select.en__field__input--tripleselect
input[type="checkbox"] + label:before  {
    border: 2px solid var(--Gray-50);
    border-radius: var(--Mini-Rounded);
    background-color: unset;
}

input::placeholder, input.en__field__input::placeholder {
  color: transparent;
}

.en__field__input--other::placeholder {
    color: var(--Gray-50);
}

.info-form input[type="checkbox"]:checked + label:before {
    background-color: var(--Sky-Primary);
    border-color: var(--Sky-Primary);
}

.donate-form input[type="checkbox"]:checked + label:before {
    background-color: var(--Kelp-Primary);
    border-color: var(--Kelp-Primary);
}

[data-engrid-theme=oc2] .form-section-header:after {
    content: none;
}

.en__component .en__field__error {
    color: var(--Coral-Primary);
    font-family: var(--Inter);
}
[class*=validationFail]:not(.has-value):not(.has-focus) [type], [class*=validationFail]:not(.has-value):not(.has-focus) select, [class*=validationFail]:not(.has-value):not(.has-focus) textarea {
    background-color: inherit;
    border-color: var(--Coral-Primary);
}
[data-engrid-theme=oc2] input:not([type=radio]):not([type=checkbox]):focus {
    border-color: var(--Blue-Primary);
    outline: 1px solid var(--Blue-Primary);
}

[data-engrid-theme=oc2] input[type=checkbox]+label:before {
    margin-top: 4px;
}

/* Adjustments to the top and bottom borders */
.rounded-border-top {
    border-top-left-radius: var(--Large-Rounded);
    border-top-right-radius: var(--Large-Rounded);
    padding-top: 20px !important;
}
.rounded-border-bottom {
    border-bottom-left-radius: var(--Large-Rounded);
    border-bottom-right-radius: var(--Large-Rounded);
    padding-bottom: 20px !important;
}

@media screen and (max-width: 840px) {
    [data-engrid-theme=oc2][data-replace-banner-with-background=if-banner-empty][data-engrid-body-banner=empty][data-engrid-page-background=image] [class*=page-backgroundImage]:after {
        content: none;
    }

}

[data-engrid-theme=oc2] .engrid-mobile-cta-container .primary:after {
    content: none;
}

.arrow .en__submit .button:after, .arrow .en__submit button:after {
    content: "";
    display: block;
    width: 20px;
    height: 20px;
    background-color: currentColor;
    -webkit-mask: url("https://aaf1a18515da0e792f78-c27fdabe952dfc357fe25ebf5c8897ee.ssl.cf5.rackcdn.com/1991/2025-next-button-icon.svg?v=1755176377000") no-repeat center;
    -webkit-mask-size: contain;
    mask: url("https://aaf1a18515da0e792f78-c27fdabe952dfc357fe25ebf5c8897ee.ssl.cf5.rackcdn.com/1991/2025-next-button-icon.svg?v=1755176377000") no-repeat center;
    mask-size: contain;
    transform: translate(15px, 13px);
}

/* SET FONT SIZE FOR ALL PLAIN TEXT */
input, input.en__field__input,
[data-engrid-theme="oc2"] .radio-to-buttons_recurrfreq .en__field--recurrfreq.en__field--radio .en__field__element .en__field__item:first-of-type label,
[data-engrid-theme="oc2"] .radio-to-buttons_recurrfreq .en__field--recurrfreq.en__field--radio .en__field__element .en__field__item:last-of-type label,
.radio-to-buttons_donationAmt .en__field--donationAmt.en__field--radio input[type="radio"] + label,
[data-engrid-theme="oc2"] .en__field--withOther.en__field--radio.en__field--donationAmt .en__field__item--other input,
select, select.en__field__input--select, select.en__field__input--splitselect, select.en__field__input--tripleselect {
    font-size: clamp(0.875rem, 0.8vw + 0.5rem, 1.125rem);
}

[data-engrid-theme=oc2] .sms-opt-in-disclaimer+div a {
    font-weight: bold;
}

/* PAYMENT SELECTION */
.segmented{
  border-radius: 50px;
  border: 3px solid var(--Gray-50);
  padding: 10px 20px;
  justify-content: space-between;
  align-items: center;
  display: flex;
  gap: 10px;
  margin-bottom: 20px;
  inline-size: fit-content;
  width: 100%;
}

@media screen and (max-width: 585px) {
    .segmented {
        flex-direction: column;
    }
}

.segment{
  display: flex;
  padding: 10px 25px;
  justify-content: center;
  font-family: var(--Geologica);
  font-size: clamp(0.875rem, 0.8vw + 0.5rem, 1.125rem);
  font-weight: 600;
  line-height: 111%;
  letter-spacing: 0.72px;
  align-items: center;
  align-self: stretch;
  border-radius: 100px;
  background: transparent;
  color: var(--Blue-100);
  cursor: pointer;
  user-select: none;
  opacity: 0.6;
  text-align: center;
  transition: opacity .15s ease, background-color .15s ease, color .15s ease, transform .05s ease;
}
.segment:hover{ opacity: 0.85; }
.segment:active{ transform: scale(0.98); }
.segment:focus-visible{
  outline: 2px solid color-mix(in oklab, var(--Gray-50), white 40%);
  outline-offset: 2px;
}

.segment.is-selected{
  background: var(--Kelp-Primary);
  color: #fff;
  opacity: 1;
}

.target{
  margin: 16px 0;
  padding: 12px 16px;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
}
.target[hidden]{ display: none !important; }

.en-target-hidden{ display: none !important; }