﻿@import url('https://fonts.googleapis.com/css2?family=Instrument+Sans:wght@400;500;600;700&family=Jost:wght@100;200;300;400;500;600;700;800;900&display=swap');


:root
{
	--device: Desktop;
	--breakpoints: 1440px;
	--columns: 12px;
	--gutters: 16px;
	--column-width: 96px;
	--color-brand-green: #46b246;
	--color-neutrals-white: #ffffff;
	--color-neutrals-light-grey: #c7c7c6;
	--color-neutrals-grey: #8b8e8b;
	--color-neutrals-dark-grey: #5f5f5f;
	--color-neutrals-black: #000000;
	--color-brand-tea-green: #c8e094;
	--color-brand-roxteel-green: #46b246;
	--color-brand-metallic-seaweed: #007992;
	--color-brand-casal: #345a6b;
	--color-system-light-green: #e2ffe9;
	--color-system-green: #05c031;
	--color-system-light-blue: #dfecff;
	--color-system-blue: #458fff;
	--font-body-copy: "instrument sans", "instrument sans";
	--font-headlines: "jost", "jost";
}

html, body {margin: 0 auto !important; }

/* Device Agnostic/Body Copy */
.block{
	font-family: "Instrument Sans";
	font-size: 18px;
	font-style: normal;
	font-weight: 500;
	line-height: 28px; /* 155.556% */
	letter-spacing: 0.36px;
}
.block .container{
	width:100%;
	max-width: 1100px;
    margin-inline: auto;
	padding-inline: 30px;
	@media (width >= 1440px){
		padding-inline: 60px;
	}
}

/* Standard button with chamferred corner */
.shared-set-cta{
	display: flex;
	padding: 10px 22px 10px 32px;
	justify-content: center;
	align-items: center;
	border-image-source: url('/wp-content/acftb-content/acftb-blocks/Main Site Nav/images/shape-bg-slice-5-20-20-5-default.svg');
	border-image-slice: 5 20 20 5 fill;
	border-image-width: 5px 20px 20px 5px;
	border-image-repeat: stretch;
}


header,
footer,
.site,
.is-root-container
{
	/* Resets */
	* { margin: 0; box-sizing: border-box; }
	button { appearance: none; -webkit-appearance: none; background: none; border: none; padding: 0; cursor: pointer; text-align: left; }
	a { text-decoration: none; color: inherit; cursor: pointer; }
	input, select, textarea { appearance: none; -webkit-appearance: none; background: none; border: none; padding: 0; outline: none; }
	select, label { cursor: pointer; }
	summary { list-style: none; cursor: pointer; }
	summary::-webkit-details-marker { display: none; }
	img { display: block; }
	input[type="date"]::-webkit-calendar-picker-indicator { opacity: 0; position: absolute; right: 0; width: 100%; height: 100%; cursor: pointer; }
	.swiper { overflow: clip; width: 100%; height: 100%; }
	.swiper-button-prev::after, .swiper-button-next::after { display: none; }
	.swiper-button-prev, .swiper-button-next { position: relative; top: auto; margin-top: 0; color: inherit; }

	h1, .h1
	{
		font-size: 48px;
		line-height: 48px;
		font-weight: 300;
		font-family: var(--font-headlines);

		@media (min-width: 1440px)
		{
			font-size: 60px;
			line-height: 64px;
			font-weight: 300;
			font-family: var(--font-headlines);
		}
	}

	h2, .h2
	{
		font-size: 36px;
		line-height: 40px;
		font-weight: 300;
		font-family: var(--font-headlines);

		@media (min-width: 1440px)
		{
			font-size: 48px;
			line-height: 52px;
			font-weight: 300;
			font-family: var(--font-headlines);
		}
	}

	h3, .h3
	{
		font-size: 32px;
		line-height: 36px;
		font-weight: 300;
		font-family: var(--font-headlines);

		@media (min-width: 1440px)
		{
			font-size: 40px;
			line-height: 34px;
			font-weight: 300;
			font-family: var(--font-headlines);
		}
	}

	h4, .h4
	{
		font-size: 26px;
		line-height: 30px;
		font-weight: 300;
		font-family: var(--font-headlines);

		@media (min-width: 1440px)
		{
			font-size: 30px;
			line-height: 34px;
			font-weight: 300;
			font-family: var(--font-headlines);
		}
	}

	h5, .h5
	{
		font-size: 22px;
		line-height: 26px;
		font-weight: 300;
		font-family: var(--font-headlines);

		@media (min-width: 1440px)
		{
			font-size: 26px;
			line-height: 30px;
			font-weight: 300;
			font-family: var(--font-headlines);
		}
	}

	h6, .h6
	{
		font-size: 18px;
		line-height: 22px;
		font-weight: 300;
		font-family: var(--font-headlines);

		@media (min-width: 1440px)
		{
			font-size: 22px;
			line-height: 26px;
			font-weight: 300;
			font-family: var(--font-headlines);
		}
	}

	p, .p
	{
		font-size: 18px;
		line-height: 28px;
		font-weight: 300;
		font-family: var(--font-body-copy);

		@media (min-width: 1440px)
		{
			font-size: 18px;
			line-height: 28px;
			font-weight: 300;
			font-family: var(--font-body-copy);
		}
	}

	/* Device Agnostic/Captions */
	.caption{
		font-family: "Instrument Sans";
		font-size: 14px;
		font-style: italic;
		font-weight: 500;
		line-height: 20px; /* 142.857% */
		letter-spacing: 0.28px;
	}

}



/* ________________________________________ GRAVITY FORMS ________________________________________ */
.block {

    .gform_wrapper {
        font-size: 16px;
        color:var(--color-neutrals-white);

        .gform_fields{
            gap:40px 60px;
        }

        .gform_validation_errors{
            display: none;
        }
        &.gravity-theme{
            .gform_heading{
                text-align: center;
                margin-block: 20px 40px;
            }
            .gfield_description.gfield_validation_message{
                padding: 0;
                border: 0;
                background: transparent;
            }
            .gfield {
                position: relative;
                margin-bottom: 40px;
            }
            .gfield_label{
                position: absolute;
                pointer-events: none;
                background: var(--color-neutrals-black);
                padding: 5px;
                display: block;
                width: fit-content;
                line-height: 1;
                font-weight: 400;
                font-size: 16px;
                margin: 0;
                z-index: 2;
                top: -13px;
                left: 20px;
            }
			.gfield_required{
				color: #46B246;
				display: inline-block;
				font-size: 18px;
				padding-inline-start: 0.125em;
			}
            input[type=color], input[type=date], input[type=datetime-local], input[type=datetime], input[type=email], input[type=month], input[type=number], input[type=password], input[type=search], input[type=tel], input[type=text], input[type=time], input[type=url], input[type=week], select, textarea{
                border:2px solid #C7C7C6;
                padding:20px;
                border-radius:3px;
                font-size:16px;
                width: 100%;
				color: var(--color-neutrals-white);
            }
            .gfield--type-select{
                /* .gfield_label{
                    left: -999px;
                } */
            }
            .ginput_container_select{
                &:after {
                    pointer-events: none;
                    content: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTciIGhlaWdodD0iMTAiIHZpZXdCb3g9IjAgMCAxNyAxMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4NCjxwYXRoIGQ9Ik0xOCAtMUw4LjUgOEwtMSAtMSIgc3Ryb2tlPSIjNDZCMjQ2IiBzdHJva2Utd2lkdGg9IjIiLz4NCjwvc3ZnPg0K);
                    display: block;
                    width: 30px;
                    height: 30px;
                    background: transparent;
                    position: absolute;
                    top: 13px;
                    right: 5px;
                    place-content: center;
                    text-align: center;
                    transform-origin: center;
                    transition: rotate .3s;
                    border-radius: 15px;
                }
                select{
                    padding-block:17px 18px;
                    background: transparent;
                    display: block;
                    width:100%;
                    color:var(--color-neutrals-white);
                    option{
                        background: var(--color-neutrals-black);
                        color:var(--color-neutrals-white);
                    }
                }
                &:has(select:focus):after{
                    rotate: 180deg;
                }
            }
            .gfield_radio, .gfield_checkbox {
                input{
                    position: absolute;
                    width: 0;
                    height: 0;
                    opacity: 0;
                }
            }
            .gfield_checkbox {
                label{
                    position: relative;
                    padding-left: 44px;

                    &:before{
                        content: "";
                        display: block;
                        width: 30px;
                        height: 30px;
                        border: 2px solid #C7C7C6;
                        position: absolute;
                        top: 5px;
                        left: 0;
                        border-radius:4px;
                    }
                }
                /* When checkbox is checked */
                input:checked + label:after{
					content: '✔';
					width: 30px;
					height: 30px;
					position: absolute;
					top: 7px;
					left: 2px;
					border-radius: 2px;
					border: 0;
					background: var(--color-brand-green);
					place-items: center;
					display: grid;
                }

                /* When checkbox has focus */
                input:focus + label:before{
                    border-color:var(--color_deep_teal);
                }
            }
            .ginput_container_date{
                border: 2px solid var(--color_gray);
                border-radius: 2px;
                padding-right: 10px;

                input[type=text]{
                    border: unset;
                    outline: none;
                }

                &:focus-within{
                    outline: 2px solid;
                    outline-offset: -2px;
                }
            }
            .gform_footer{
                padding-top: 0;
                justify-content: center;
                margin: 0;

                .gform_button button{
                    margin:0;
                    padding: 13px 30px;
                }

				input[type=submit]{
					cursor:pointer;
					display: flex;
					padding: 14px 40px 14px 40px;
					justify-content: center;
					align-items: center;
					border-image-source: url("/wp-content/acftb-content/acftb-blocks/Main Site Nav/images/shape-bg-slice-5-20-20-5-hover.svg");
					border-image-slice: 5 20 20 5 fill;
					border-image-width: 5px 20px 20px 5px;
					border-image-repeat: stretch;
					font-family: "Instrument Sans";
					font-style: normal;
					font-size: 18px;
					font-weight: 600;
					line-height: 20px /* 111% */;

					&:after{
						content:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzAiIGhlaWdodD0iMzAiIHZpZXdCb3g9IjAgMCAzMCAzMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4NCjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMF85NjQ5XzMzMDYpIj4NCjxwYXRoIGQ9Ik05IDUuNUwxOCAxNUw5IDI0LjUiIHN0cm9rZT0iIzQ2QjI0NiIgc3Ryb2tlLXdpZHRoPSIyIi8+DQo8L2c+DQo8ZGVmcz4NCjxjbGlwUGF0aCBpZD0iY2xpcDBfOTY0OV8zMzA2Ij4NCjxyZWN0IHdpZHRoPSIxMCIgaGVpZ2h0PSIxNyIgZmlsbD0id2hpdGUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEwIDYuNSkiLz4NCjwvY2xpcFBhdGg+DQo8L2RlZnM+DQo8L3N2Zz4NCg==");
						display: block;
						width:20px;
						height:20px;
					}

					&:hover{
						border-image-source: url("/wp-content/acftb-content/acftb-blocks/Main Site Nav/images/shape-bg-slice-5-20-20-5-hover.svg");
						filter: drop-shadow(0 4px 0 rgba(129, 129, 129, 1));
					}
				}
                input[type=submit]:focus{
                    background-color: var(--color_red);
                }

            }
        }


		/* Move labels up on focus
		&.gravity-theme .gfield:has(:focus) .gfield_label,
		&.gravity-theme :not(.gfield:has(:placeholder-shown)) .gfield_label{
			transform: translate(-20px, -50px);
		} */

        /* Gravity forms datepicker */
        /* .gfield--type-date{
            position: relative;
        }
        #ui-datepicker-div{
            position: absolute !important;
            top: unset !important;
            left: 0 !important;
        } */
    }

	.gravity-theme .gform_confirmation_message{
		text-align: center;
		padding-block: 80px 20px;
		color: var(--color-neutrals-white);

		.h5{
			color: var(--color-brand-tea-green);
		}
	}

}