:root {
	--brand-green: #09eda3;
	--brand-purple: #2D2A6D;
}

/** GLOBAL STYLES **/
* { font-family: "Space Grotesk", sans-serif; }
.section-subtitle { font-size: 1.1rem; font-weight: 700; line-height: 1.5; color: var(--brand-green); text-transform: uppercase; padding: 0 0 1.5rem 0; }
.text-brand-green { color: var(--brand-green); }
.text-brand-purple { color: var(--brand-purple); }
.bg-brand-green { background-color: var(--brand-green); }
.bg-brand-purple { background-color: var(--brand-purple); }
.btn-brand-green { background-color: var(--brand-green); color: var(--brand-purple); border: 1px solid  var(--brand-green); }
.btn-brand-green:hover { background-color: var(--brand-purple); color: var(--brand-green); border: 1px solid  var(--brand-green); }

.subhead { font-weight: bold; font-size: 1.3rem; text-transform: uppercase; }

h3{color: white}

/** NAV STYLES **/
.nav-link { font-size: 18px; font-weight: 400; font-stretch: normal; font-style: normal; line-height: 1.44; letter-spacing: normal; color: #1a1c1f; position: relative; text-transform: uppercase; padding: 15px 20px!important; }
.nav-link:hover { text-decoration: underline; }

/** HEADER STYLES **/
.header-main { background-size: cover; background-position: 50%; background-image: url('storage/images/bg-header.png'); /* min-height: 70vh; */ margin-top: 70px; }
.header-main h1 { font-size: 5rem; font-weight: 400; line-height: 1; letter-spacing: -4px; color: #fff; }
.header-main p { margin: 0; font-size: 18px; font-weight: 400; line-height: 1.44; color: #fff; }
.tablet-main { padding: 150px 0 0 0; }
.ipad-wrapper { position: relative; width: 100%; }
.video-overlay { position: absolute; top: 4%; left: 11%; width: 76%; height: 67%; overflow: hidden; z-index: 1; }
.video-overlay video { object-fit: cover; width: 100%; height: 100%; }

/** HOW IT WORKS STYLES **/
#howitworks { background-size: cover; background-position: 50%; background-image: url('storage/images/bg-how-it-works.png'); /* min-height: 70vh; */ }
#howitworks .card { background-color: transparent; backdrop-filter: blur(48px); background-size: cover; background-image: url('storage/images/bg-card.png'); background-repeat: no-repeat; background-position: center; border-radius: 15px; }

/** FOR PATIENTS / CLINICIANS STYLES **/
#forpatients, #forclinicians, #contact-us-support, #trustedby { background-image: linear-gradient(129deg,#1c1854 7%,#081440 94%); }
#forpatients h3, #forclinicians h3 { font-size: 1.3rem; }
#forpatients p, #forclinicians p { font-size: 1rem; font-weight: 400; font-stretch: normal; font-style: normal; line-height: 1.5; letter-spacing: normal; color: #fff; }
#clinicianpricing .card-footer { background-color: transparent!important; border-top: none; }
#clinicianpricing sup { font-size: 0.5em; top: -.7em!important; }
#clinicianpricing .card-price { font-size: clamp(44px, 4.5vw, 76px); font-weight: bold; letter-spacing: -2px; }
#clinicianpricing .card-price-month { margin: -10px 0 0 0; text-align: right; font-size: 0.8rem; }

/** APP DOWNLOAD STYLES **/
#appdownload { background-size: cover; background-position: 50%; background-image: url('storage/images/bg-download-app.png');  }

/** RESEARCH STYLES **/
#research { background-size: cover; background-position: 50%; background-image: url('storage/images/bg-research.png'); /* min-height: 70vh; */ }
#research .card { background-color: transparent; backdrop-filter: blur(48px); background-size: cover; background-image: url('storage/images/bg-card.png'); background-repeat: no-repeat; background-position: center; border-radius: 15px; }
#research .card .h3 { font-size: 20px; font-weight: 500; line-height: 1.4; color: var(--brand-green) !important; padding-bottom: 20px; }

/** FAQ STYLES **/
.accordion-header { background-color: #fff; }
.accordion-button { font-weight: bold; text-transform: uppercase; }
.accordion-button:not(.collapsed) { background-color: #fff; box-shadow: none;  }
.accordion-button::after { background-image: url('storage/images/icon-plus.svg'); background-size: auto; width: 34px; height: 34px; }
.accordion-button:not(.collapsed)::after { background-image: url('storage/images/icon-minus.svg'); }

/** FOOTER STYLES **/
footer { background-image: linear-gradient(99deg,#1c1854 10%,#081440 89%); }
footer a { text-decoration: none; }
footer a:hover { text-decoration: underline; }
.footer-icon { font-size: 1.5rem; margin: 0 1.1rem 0 0; }
#backToTop { position: fixed; bottom: 11.5%; right: 50px; opacity: 0; transition: all 0.3s linear; }
#backToTop span { font-size: 2.5rem; }

@media all and (max-width: 768px) {
	.w-75 { width: 100%; }
	.tablet-main { padding: 0; }

	/** HEADER STYLES **/
	.header-main h1 { font-size: 4rem; }

	#backToTop { position: fixed; bottom: 2.5%; right: 20px; opacity: 0; transition: all 0.3s linear; }
}