/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Apr 07 2026 | 17:02:05 */
/* Hero */

#hero .slide {
    padding: 4rem;
    height: 85vh;
    display: flex;
    align-items: center;
    background: linear-gradient(231.08deg, #EBF4FF 55.85%, #ACD1FF 94.57%);
    position: relative;
}
#hero .slide-content {
    z-index: 99;
}
#hero .slide-bg-swirl {
	display: none;
}
#hero .slide-swirl--desktop {
	position: absolute;
    left: 0;
    top: 0;
    height: 100%;
}
#hero .slide-swirl--mobile {
    display: none;
}
#hero .eyebrow {
    font-family: var(--font-family-heading);
    font-size: 48px;
    color: var(--color-accent-navy);
    font-weight: 600;
    letter-spacing: -2px;
    line-height: 1;
	display: block;
}
#hero h1 {
    font-size: 110px;
    line-height: 1;
    font-weight: 800;
    letter-spacing: -2px;
    color: var(--color-accent-navy);
    margin-bottom: 10px;
    position: relative;
    display: inline-block;
}
#hero .desc {
    max-width: 400px;
    margin-bottom: 4rem;
    color: var(--color-accent-navy);
}
#hero .h4 {
    font-size: 24px;
    font-weight: 700;
    color: var(--color-accent-navy);
    line-height: 1;
    margin-bottom: 1.5rem;
}
#hero .slide-img {
    position: absolute;
    right: 0;
    top: 0;
    height: 85vh;
    width: 65%;
    clip-path: circle(72% at 73% 50%);
    z-index: 1;
}
#hero .slide-img img {
    height: 100%;
    object-fit: cover;
    object-position: 0% 50%;
}


/* What */

#what {
    padding: 8rem 4rem !important;
}
#what::before {
    content: "";
    position: absolute;
    background-image: url(/wp-content/uploads/2025/12/lightblue-highlight.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    width: 1600px;
    height: 400px;
    left: 50%;
    transform: translateX(-50%);
    top: 280px;
    z-index: -1;
}
#what .title {
    text-align: center;
    max-width: 400px;
    margin: 0 auto 2rem;
}
#what .what-pills {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px;
  max-width: 1100px;
  margin: 0 auto;
}
#what .what-pills .pill {
    flex: 0 0 320px;
    max-width: 320px;
    border: 4px solid #EBF4FF;
    padding: 30px;
    border-radius: 20px;
    background-color: #fff;
	
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-rows: auto auto;
    align-items: center;
    column-gap: 0.5rem;
}
#what .pill svg {
    grid-column: 1;
    grid-row: 1;
    width: 25px;
    height: 25px;
	fill: white;
}

#what .pill h3 {
    font-size: 1.35rem;
    font-weight: 600;
    color: var(--color-accent-navy);
    line-height: 1;
    position: relative;
    grid-column: 2;
    grid-row: 1;
    margin: 0;
    font-family: var(--font-family-body);
    letter-spacing: -0.05ch;
}
#what .pill .desc {
    line-height: 1.45;
    font-size: 0.9rem;
    grid-column: 1 / -1;
    grid-row: 2;
    margin-top: 0.75rem;
}
.register-or {
    margin: 0 auto;
}


/* Counter */

#counter {
    padding: 14rem 4rem 2rem !important;
}
#counter .vc_column-inner {
    max-width: 1120px;
    margin: 0 auto;
}
#counter .divider {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    margin-bottom: 1rem;
}
#counter .divider hr {
    flex: 1;
    height: 2px;
    border: none;
    background: linear-gradient(to right,transparent,#05245040,transparent);
}
#counter .divider h3 {
    font-family: var(--font-family-body);
    font-weight: 600;
    color: var(--color-accent-navy);
    font-size: 18px;
}
#counter .number-counter {
    display: block;
    height: 200px;
}
#counter .impact {
    padding: 4rem 0 8rem !important;
    text-align: center;
    background: linear-gradient(180deg, #FFFFFF 0%, #D3E7FF 100%);
    margin-top: 4rem;
	position: relative;
}
#counter .impact::before {
    content: "";
    position: absolute;
    background-image: url(/wp-content/uploads/2025/11/Ellipse-white.svg);
    background-size: cover;
    width: 100%;
    height: 130px;
    bottom: -85px;
    left: 0;
}
#counter .impact .desc {
    max-width: 300px;
    margin: 0 auto;
}
#counter .register-or {
    margin-top: -110px;
	box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.3), 0px 4px 17px -7px #00000026;
    z-index: 9;
    position: relative;
}
#counter .number-counter {
    display: flex;
    justify-content: center;
    gap: 10px;
    height: auto;
    margin: 2rem 0 3rem;
}
#counter .counter-card {
    position: relative;
    width: 170px;
    height: 200px;
    border-radius: 40px;
    overflow: hidden;
    background-size: cover;
    background-position: center;
    box-shadow: inset 0 0 0 8px rgba(255, 255, 255, 0.38);
    background-color: var(--color-accent-navy);
    background-blend-mode: luminosity;
}
#counter .counter-card::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background: var(--color-accent-navy);
    background: linear-gradient(0deg, var(--color-accent-navy) 0%, rgba(246, 250, 255, 0) 200%);
}
#counter .counter-digit {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    font-family: var(--font-family-heading);
    font-weight: 700;
    font-size: 140px;
    line-height: 1;
    color: #ffffff;
}


/* Stories */

#stories {
    background: linear-gradient(180deg, #C4DFFF 0%, #FFFFFF 53.52%);
    padding: 12rem 0 6rem !important;
}
#stories .title {
    text-align: center;
    font-size: 60px;
    margin: 0 0 -1rem!important;
}
#stories .section-divider {
    width: 100%;
    height: 1px; /* divider thickness */
    background: linear-gradient(
        to right,
        rgba(5, 36, 80, 0) 0%,
        rgba(5, 36, 80, 0.25) 50%, /* #05245040 ≈ 25% opacity */
        rgba(5, 36, 80, 0) 100%
    );
    margin: 60px 0; /* adjust spacing above/below */
}
.story-slider .js-story-swiper {
  overflow: visible;
}
.story-slider {
  --story-slide-width: 70%;
}
.story-slider .story-slide {
  width: var(--story-slide-width);
  max-width: 820px;
  opacity: 0.25;
  transform: scale(0.9);
  transition: transform 0.3s ease, opacity 0.3s ease;
}
.story-slider .story-slide.swiper-slide-prev,
.story-slider .story-slide.swiper-slide-next {
  opacity: 0.22;
  transform: scale(0.95);
}
.story-slider .story-slide.swiper-slide-active {
  opacity: 1;
  transform: scale(1);
}
.story-slide__card {
    align-items: center;
    display: flex;
    gap: 40px;
}
.headshot {
    position: relative;
    width: 400px;
    height: 500px;
    background-size: cover;
    background-position: center;
    border-radius: 40px;
    z-index: 0;
}
.headshot::before {
    content: "";
    position: absolute;
    background-image: url(/wp-content/uploads/2025/11/corner-swirl.svg);
    background-size: cover;
    height: 200px;
    width: 200px;
    bottom: 0;
    right: 0;
    border-bottom-right-radius: 40px;
    z-index: -1;
}
.headshot::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    box-shadow: inset 0 0 0 8px rgba(255,255,255,0.3);
    pointer-events: none;
    z-index: 1;
}
.story-slide__content h2 {
    font-size: 36px;
    color: var(--color-accent-navy);
    font-weight: 700;
    margin-bottom: 10px;
}
.story-slide__reason-pill {
    background-color: #fff;
    border: 3px solid #E5F0FF;
    border-radius: 18px;
    padding: 15px 20px 17px 50px;
    display: table;
    line-height: 1;
    position: relative;
    margin-bottom: 2rem;
}
.story-slide__reason-pill::before {
    content: "";
    position: absolute;
    background-image: url(/wp-content/uploads/2025/12/green-swirl.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    width: 20px;
    height: 20px;
    left: 20px;
    top: 50%;
    transform: translateY(-50%);
}
.story-slide__description p {
    padding-bottom: 1.5rem;
}
.story-slide__description p:last-child {
    padding-bottom: 0;
}
.story-slider__cta {
    display: table;
    margin: 2rem auto 0;
    display: none;
}
.story-slider__cta .register-btn {
    padding: 15px 4rem 15px 15px;
	font-weight: 700;
}
button.story-nav-button.story-nav-button--next,
button.story-nav-button.story-nav-button--prev {
    position: absolute;
    z-index: 99;
}
button.story-nav-button {
    background-color: #fff !important;
    border-radius: 25px;
    padding: 10px;
	box-shadow: 0px 4px 12px 0px #0000000F;
	backdrop-filter: blur(8px);
}
button.story-nav-button.story-nav-button--prev:hover,
button.story-nav-button.story-nav-button--next:hover {
    background-color: #fff;
}
.story-nav-button span {
    background-color: var(--color-accent-green);
    display: block;
    border-radius: 100px;
    line-height: 1;
    color: var(--color-accent-navy);
    font-family: var(--font-family-heading);
    font-weight: 700;
    font-size: 14px;
	position: relative;
}
.story-nav-button span::before {
    content: "";
    background-image: url(/wp-content/uploads/2025/12/slider-arrow.svg);
    background-color: #fff;
    border-radius: 50%;
    position: absolute;
    background-size: 70%;
    background-repeat: no-repeat;
    background-position: center;
    width: 30px;
    height: 30px;
    top: 50%;
    transform: translateY(-50%);
}
.story-nav-button.story-nav-button--prev span::before {
    left: 4px;
    transform: translateY(-50%) rotate(180deg);
}
.story-nav-button.story-nav-button--next span::before {
    right: 4px;
}
.story-nav-button.story-nav-button--prev span {
	padding: 12px 12px 12px 50px;
}
.story-nav-button.story-nav-button--next span {
	padding: 12px 50px 12px 12px;
}
button.story-nav-button.story-nav-button--prev {
    top: 50%;
    transform: translateY(-50%);
    left: 120px;
}
button.story-nav-button.story-nav-button--next {
    top: 50%;
    transform: translateY(-50%);
    right: 120px;
}
.story-nav-meta {
    padding: 4px;
}
.js-story-prev-name {
    color: var(--color-accent-navy) !important;
    text-align: left;
    font-size: 12px;
    font-weight: 600;
}
.js-story-prev-reason {
    color: var(--navy-subtle, #052450BF);
    font-size: 12px;
    text-align: left;
    line-height: 1;
}
.js-story-next-name {
    color: var(--color-accent-navy) !important;
    text-align: right;
    font-size: 12px;
    font-weight: 600;
}
.js-story-next-reason {
    color: var(--navy-subtle, #052450BF);
    font-size: 12px;
    text-align: right;
    line-height: 1;
}


/* Signup CTA */

#signup-cta {
    padding: 6rem 0 !important;
}
#signup-cta .cta-flex {
    max-width: 1120px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 2fr 3fr;
    align-items: center;
    gap: 20px;
}
#signup-cta .left .title {
    font-weight: 600;
}
#signup-cta .left .title .thick {
    font-weight: 700;
}
.cta-flex .left .desc {
    max-width: 330px;
}
.cta-links {
    display: flex;
    border: 8px solid #DDEDFF;
    background-color: #F2F8FF;
    border-radius: 20px;
}
.link-col {
    padding: 2.22rem;
}
.link-col.link-left {
    position: relative;            /* required for pseudo-element positioning */
}
.link-col.link-left::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;                      /* border on the right side */
    width: 1px;                    /* line thickness */
    height: 100%;                  /* match column height */

    background: linear-gradient(
        to bottom,
        rgba(5, 36, 80, 0) 0%,     /* transparent top */
        rgba(5, 36, 80, 0.25) 50%, /* middle solid (#05245040 opacity) */
        rgba(5, 36, 80, 0) 100%    /* transparent bottom */
    );
}
.cta-links .desc {
    margin-bottom: 2rem;
}
.cta-links .thick {
    font-weight: 600;
}


/* MOBILE */

@media screen and (max-width: 768px) {
	
	/* Hero */
	
	#hero .slide-content {
    	padding: 0 2rem;
	}
	#hero .slide {
		padding: 0 0 2rem;
        height: auto;
        background: linear-gradient(231.08deg, #EBF4FF 55.85%, #ACD1FF 94.57%);
        flex-direction: column-reverse;
		align-items: stretch;
	}
	#hero .slide-img {
        width: 100%;
        right: 0;
        top: 0;
        clip-path: ellipse(95% 70% at 70% 20%);
        position: relative;
        height: 45vh;
	}
	#hero .slide-bg-swirl {
		display: block;
		position: absolute;
	}
	#hero .eyebrow {
		font-size: 35px;
		margin-bottom: 6px;
	}
	#hero h1 {
		font-size: 75px;
	}
	#hero .bottom .register-or {
		display: none;
	}
	#hero .h4 {
		font-size: 20px;
	}
	#hero .fact {
		top: 200px;
		right: 0;
		max-width: 330px;
		height: fit-content;
		border-top-right-radius: 0;
		border-bottom-right-radius: 0;
	}
	
	/* What */
	
	#what {
		padding: 4rem 1.5rem !important;
	}
	#what .title {
		max-width: 300px;
	}
	#what .what-pills {
		width: 100%;
		display: block;
	}
	#what .what-pills .pill {
		max-width: 100%;
		width: 100%;
		margin-bottom: 20px;
	}
	#what .register-or {
		display: none;
	}
	
	/* Counter */
	
	#counter {
		padding: 6rem 0 0 !important;
	}
	#counter .divider {
		gap: 6px;
		margin: 0 1rem;
	}
	#counter .divider h4 {
		font-size: 14px;
		text-align: center;
		max-width: 280px;
	}
	#counter .number-counter {
		gap: 6px;
		margin: 3rem 0 3.5rem;
	}
	#counter .counter-card {
		width: 180px;
		height: 100px;
		border-radius: 18px;
		box-shadow: inset 0 0 0 4px rgba(255, 255, 255, 0.38);
	}
	#counter .counter-digit {
		font-size: 60px;
	}
	#counter .register-or {
		display: none;
	}
	#counter .impact {
		margin: 0;
		padding: 4rem 0 !important;
	}
	#counter .impact::before {
		display: none;
	}
	#counter .impact .title {
		max-width: 300px;
		margin: 0 auto 1.5rem;
	}
	
	/* Stories */
	
	#stories {
		padding: 8rem 0 !important;
	}
	#stories svg.nectar-shape-divider {
		fill: #d4e8ff;
	}
	#stories .title {
		font-size: 50px;
	}
	#stories .section-divider {
		display: none;
	}
	#stories .story-slider__inner.swiper {
		margin-top: 5rem;
	}
	.story-slider {
		--story-slide-width: 100% !important;
		padding: 0 1.5rem;
	}
	.story-slide__card {
		display: block;
	}
	.headshot {
		width: 100%;
	}
	.story-slide__content {
		padding-top: 2rem;
	}
	.story-slide__reason-pill {
		margin-bottom: 1.5rem;
	}
	.story-slider__cta {
		display: none;
	}
	button.story-nav-button.story-nav-button--prev {
		top: unset;
		bottom: -120px;
		transform: unset;
		left: 0;
		box-shadow: none;
	}
	button.story-nav-button.story-nav-button--next {
		top: unset;
		bottom: -120px;
		transform: unset;
		right: 0;
		box-shadow: none;
	}
	.story-nav-button span {
		min-width: 150px;
	}
	
	/* Signup CTA */
	
	#signup-cta {
		padding: 6rem 1.5rem !important;
	}
	#signup-cta .cta-flex {
		max-width: 1120px;
		margin: 0 auto;
		display: grid;
		grid-template-columns: 1fr;
		align-items: center;
		gap: 20px;
	}
	.cta-links {
		flex-direction: column;
	}
	.link-col.link-left::before {
		left: 0;
		bottom: 0;
		width: 100%;
		height: 1px;

		background: linear-gradient(
			to right,
			rgba(5, 36, 80, 0) 0%,
			rgba(5, 36, 80, 0.25) 50%,
			rgba(5, 36, 80, 0) 100% 
		);
		top: unset;
		pointer-events: none;
	}
}