@charset "UTF-8";
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Breakpoints
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
* {
  margin: 0;
  line-height: calc(1em + 0.5rem);
}

*, *::before, *::after {
  box-sizing: border-box;
}

html, body {
  height: 100%;
}

/* html:focus-within {scroll-behavior: smooth;} */
body {
  -webkit-font-smoothing: antialiased;
  min-height: 100vh;
  text-rendering: optimizeSpeed;
}

p, h1, h2, h3, h4, h5, h6 {
  overflow-wrap: break-word;
}

input, button, textarea, select {
  font: inherit;
}

ul[role=list], ol[role=list] {
  list-style: none;
  padding: 0;
}

a:not([class]) {
  text-decoration-skip-ink: auto;
}

img, picture, figure, video, canvas, svg {
  display: block;
  max-width: 100%;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}
.hide {
  display: none !important;
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Typography
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
.gradient-text {
  background-clip: text !important;
  -webkit-background-clip: text !important;
  text-fill-color: transparent !important;
  -webkit-text-fill-color: transparent !important;
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Layout
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
.hide {
  display: none !important;
}

#signup {
  position: fixed;
  z-index: 200;
  top: 0;
  left: 0;
  min-height: 100dvh;
  height: fit-content;
  width: 100%;
  padding: 2rem 0.2rem 2rem;
  display: flex;
  justify-content: center;
  opacity: 1;
  filter: blur(0rem);
  transform: scale(1);
  transition: all 500ms;
}
@media (max-width: 60rem) {
  #signup {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    align-items: center;
  }
}
#signup div.overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: flex-end;
  justify-content: center;
}
#signup div.overlay span {
  width: 5vw;
  height: 5vh;
  background: hsla(0deg, 0%, 10%, 0.4);
  backdrop-filter: blur(0.9rem);
  -webkit-backdrop-filter: blur(0);
  border-radius: 3rem;
  margin-bottom: 5rem;
}
#signup div.modal {
  position: relative;
  width: 100%;
  max-width: 40rem;
  height: fit-content;
  max-height: 100%;
  display: flex;
  flex-direction: column;
  border-radius: 1.8rem 1.8rem 1.8rem 1.8rem;
  color: hsl(201deg, 5%, 24%);
  background: hsl(212deg, 18%, 93%);
  box-shadow: hsl(204deg, 28%, 81%) 0px 0px 1px 1px inset, rgba(255, 255, 255, 0.1) 0px 1px 1px 0px inset, rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;
  transition: all 180ms;
  opacity: 0;
  filter: blur(2.5rem);
}
#signup div.modal > * {
  z-index: 3;
}
#signup div.modal *::selection {
  background: hsl(242deg, 100%, 63%);
  color: hsl(224deg, 100%, 93%);
  text-fill-color: hsl(224deg, 100%, 93%);
  -webkit-text-fill-color: hsl(224deg, 100%, 93%);
}
#signup div.modal .bg {
  border-radius: inherit;
  position: absolute;
  top: 1px;
  left: 1px;
  width: calc(100% - 2px);
}
#signup div.modal .gradient {
  z-index: 1;
  height: 8rem;
  background: linear-gradient(to bottom, hsl(220deg, 72%, 85%) 0%, hsl(261deg, 75%, 94%) 50%, hsl(216deg, 100%, 98%) 65%, hsl(212deg, 18%, 93%) 100%);
}
#signup div.modal .blur {
  z-index: 2;
  height: 12rem;
  backdrop-filter: blur(0.5rem);
  -webkit-backdrop-filter: blur(0.5rem);
}
#signup div.modal h1 {
  width: 100%;
  padding: 0.9rem 0.7rem;
  margin-bottom: 0rem;
  text-align: center;
  font-weight: 700;
  font-size: 1.8rem;
  color: hsl(221deg, 100%, 58%);
  background: linear-gradient(to bottom, hsl(220deg, 100%, 53%) 20%, hsl(277deg, 100%, 84%) 80%);
  background-clip: text !important;
  -webkit-background-clip: text !important;
  text-fill-color: transparent !important;
  -webkit-text-fill-color: transparent !important;
}
#signup div.modal h1 span {
  font-family: "Source Serif Text";
  font-weight: 300;
  letter-spacing: -0.015em;
}
#signup div.modal input {
  --box-shadow:
  	inset 0 0 0 2px hsla(165, 6%, 13%, 0.09),
  	inset 0 -2px 0 0 hsla(0, 0%, 0%, 0.08),
  	0 2px 5px 0 rgba(154,174,181,0.17);
  --box-shadow-hover: inset 0 0 0 2px hsla(165, 6%, 13%, 0.09),
  	inset 0 -2px 0 0 hsla(0, 0%, 0%, 0.12),
  	0 2px 5px 1px rgba(154,174,181,0.17);
  --box-shadow-focus: inset 0 0 0 2px hsla(207, 100%, 50%, 0.8),
  inset 0 -2px 0 0 hsla(0, 0%, 0%, 0.5),
  0 2px 5px 1px rgba(154,174,181,0.17),
  0 0 0 4px hsla(211, 100%, 60%, 0.3);
  margin: 1rem auto;
  padding: 0.3rem 1.3rem;
  border-radius: 1.5rem;
  height: 4rem;
  flex-shrink: 0;
  width: 23rem;
  border: none;
  font-size: 1.5rem;
  background: linear-gradient(to bottom, hsl(0deg, 0%, 100%), hsl(216deg, 26%, 95%));
  border: none;
  box-shadow: var(--box-shadow);
  -webkit-appearance: none;
  -webkit-box-shadow: var(--box-shadow);
  transition: all ease-in-out 300ms;
}
#signup div.modal input::placeholder {
  color: hsl(0deg, 0%, 49%);
}
#signup div.modal input:hover, #signup div.modal input:focus {
  background: linear-gradient(to bottom, hsl(0deg, 0%, 100%), hsl(216deg, 100%, 99%));
  box-shadow: var(--box-shadow-hover);
  -webkit-box-shadow: var(--box-shadow-hover);
}
#signup div.modal input:hover::placeholder, #signup div.modal input:focus::placeholder {
  color: hsl(0deg, 0%, 40%);
}
#signup div.modal input:focus {
  outline: none;
  box-shadow: var(--box-shadow-focus);
  -webkit-box-shadow: var(--box-shadow-focus);
}
@media (max-width: 60rem) {
  #signup div.modal input {
    width: calc(100% - 2.5rem);
    max-width: 23rem;
  }
}
#signup div.modal > p {
  font-size: 1.3rem;
  font-weight: 500;
  text-align: center;
  color: hsla(0deg, 0%, 0%, 0.7);
}
#signup div.modal > p.subtext {
  background: linear-gradient(to bottom, hsl(216deg, 57%, 57%) 6%, hsl(222deg, 66%, 50%) 32%, hsl(260deg, 70%, 62%) 92%);
  background-clip: text !important;
  -webkit-background-clip: text !important;
  text-fill-color: transparent !important;
  -webkit-text-fill-color: transparent !important;
}
#signup div.modal > p.email-disclaimer {
  font-size: 0.9rem;
  color: hsla(0deg, 0%, 0%, 0.6);
  padding-top: 0.3rem;
  padding-bottom: 2.5rem;
}
#signup div.modal > p.email-disclaimer span {
  font-weight: 600;
}
#signup div.modal div.options {
  overflow-y: scroll;
}
@media (max-width: 60rem) {
  #signup div.modal div.options div.facilitated p.scheduled, #signup div.modal div.options div.facilitated p.future-sessions {
    display: none;
  }
  #signup div.modal div.options div.community-practice {
    display: none;
  }
}
#signup div.modal div.options > div {
  padding: 2.3rem 1.5rem;
  box-shadow: inset 0 1px 0 0px hsl(212deg, 9%, 81%), inset 0 2px 0 0px hsl(212deg, 2%, 99%);
  text-align: center;
}
@media (max-width: 60rem) {
  #signup div.modal div.options > div {
    padding: 1.5rem 0.8rem;
  }
}
#signup div.modal div.options > div h2 {
  padding-bottom: 0.7rem;
  font-size: 1.6rem;
  letter-spacing: -0.014em;
  color: hsl(212deg, 3%, 18%);
}
#signup div.modal div.options > div p {
  line-height: 1.55;
  padding: 0 1.5rem 0.7rem;
}
@media (max-width: 60rem) {
  #signup div.modal div.options > div p {
    padding: 0 0.4rem 0.9rem;
  }
}
#signup div.modal div.options > div div.donation {
  position: relative;
  width: fit-content;
  margin: auto;
  margin-bottom: 0.8rem;
  border-radius: 10rem;
  overflow: hidden;
}
#signup div.modal div.options > div div.donation p {
  position: relative;
  padding: 0.3rem 0.7rem;
  color: hsla(0deg, 0%, 5%, 0.8);
  font-size: 1rem;
  font-weight: 500;
  z-index: 2;
}
#signup div.modal div.options > div div.donation em {
  opacity: 0.9;
}
#signup div.modal div.options > div div.donation::before, #signup div.modal div.options > div div.donation::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#signup div.modal div.options > div div.donation::after {
  z-index: 5;
  border-radius: inherit;
  box-shadow: inset 0 1.5px hsla(0deg, 0%, 0%, 0.13);
}
#signup div.modal div.options > div div.donation::before {
  z-index: 1;
  background: linear-gradient(114deg, hsl(136deg, 100%, 94%) 5%, hsl(36deg, 100%, 93%) 16%, hsl(271deg, 100%, 92%) 25%, hsl(53deg, 40%, 98%) 50%);
  transition: all 300ms;
  transition-timing-function: ease-out;
}
#signup div.modal div.options > div div.donation:hover::before {
  width: 130%;
}
#signup div.modal div.options > div div.donation:hover {
  cursor: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'  width='40' height='48' viewport='0 0 100 100' style='fill:black;font-size:24px;'><text y='50%'>❤️</text></svg>") 16 0, auto; /*!emojicursor.app*/
}
#signup div.modal div.options > div p.scheduled {
  font-family: "Inter Var", "Inter V", "Inter";
  font-size: 1.23rem;
  font-weight: 500;
  width: fit-content;
  padding: 0.3rem 0.9rem 0.3rem 0.6rem;
  margin: 0.4rem auto;
  border-radius: 3rem;
  background: hsl(212deg, 12%, 92%);
  color: hsl(231deg, 2%, 20%);
  box-shadow: inset 0 0 0 1px hsla(0deg, 0%, 0%, 0.07), inset 0 -1px hsla(0deg, 0%, 0%, 0.09), inset 0 1px hsla(0deg, 0%, 0%, 0.14);
}
@media (max-width: 60rem) {
  #signup div.modal div.options > div p.scheduled {
    width: 100%;
    border-radius: 1.5rem;
    background: hsl(212deg, 30%, 96%);
    padding: 0.6rem 0.3rem 0.6rem;
    box-shadow: inset 0 0 0 1px hsla(0deg, 0%, 0%, 0.08), inset 0 -1px hsla(0deg, 0%, 0%, 0.07), inset 0 1px hsla(0deg, 0%, 0%, 0.1);
  }
}
#signup div.modal div.options > div p.scheduled .region {
  font-weight: 600;
  color: hsl(221deg, 85%, 43%);
}
@media (max-width: 60rem) {
  #signup div.modal div.options > div p.scheduled .region {
    display: block;
  }
}
#signup div.modal div.options > div p.scheduled .time-detail {
  font-size: 0.85em;
}
#signup div.modal div.options > div p.scheduled a {
  margin-left: 0.7rem;
  padding: 0.2rem 0.7rem;
  border-radius: 3rem;
  color: hsl(221deg, 100%, 60%);
  background: hsl(202deg, 100%, 94%);
}
#signup div.modal div.options > div p.scheduled a:hover {
  color: hsl(221deg, 98%, 47%);
}
#signup div.modal div.options > div p.future-sessions {
  font-size: 1rem;
  color: hsla(0deg, 0%, 0%, 0.6);
}
#signup.show div.overlay span {
  animation: modal-overlay-in forwards 310ms ease-in;
}
@keyframes modal-overlay-in {
  0% {
    width: 5vw;
    height: 5vh;
    background: hsla(0deg, 0%, 10%, 0.4);
    backdrop-filter: blur(0rem);
    -webkit-backdrop-filter: blur(0rem);
    border-radius: 3rem;
    margin-bottom: 5rem;
    filter: blur(1.5rem);
  }
  50% {
    border-radius: 5rem;
    filter: blur(1.4rem);
    margin-bottom: 5rem;
  }
  100% {
    width: 100%;
    height: 100%;
    background: hsla(0deg, 0%, 10%, 0.5);
    backdrop-filter: blur(0.9rem);
    -webkit-backdrop-filter: blur(0.9rem);
    border-radius: 0rem;
    margin-bottom: 0rem;
    filter: blur(0rem);
  }
}
#signup.show div.modal {
  animation: modal-in forwards 260ms 180ms ease-out;
}
@keyframes modal-in {
  0% {
    opacity: 0;
    filter: blur(1.5rem);
    transform: translateY(20%) scale(0.9);
  }
  100% {
    opacity: 1;
    filter: blur(0rem);
    transform: translateY(0) scale(1);
  }
}
#signup.close {
  opacity: 0;
  filter: blur(3rem);
  transform: scale(1.5);
}

html, body {
  font-family: "Inter Var", "Inter V", "Inter", sans-serif;
  background-color: rgb(234, 239, 240);
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Overscrolls
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
.overscroll {
  width: 100%;
  position: fixed;
  height: 300px;
  z-index: -2;
}

.overscroll.top {
  top: 0;
  transform: translateY(-299px);
  background: var(--overscroll-top);
}

.overscroll.bottom {
  bottom: 0;
  transform: translateY(299px);
  background: var(--overscroll-bottom);
}

.overscroll.mobile {
  height: 200px;
  z-index: -3;
  transform: translateY(0) scale(-1, -1);
}

/* Overscrolls [End] */
footer {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 1rem;
  padding: 0.8rem 1.5rem 2rem;
  font-weight: 500;
}
footer a, footer a:visited, footer a:active {
  color: hsl(0deg, 0%, 34%);
  text-decoration: none;
  transition: all 250ms;
}
footer a:hover {
  color: hsl(216deg, 82%, 56%);
  text-decoration: underline;
}
footer p.open-practice {
  font-style: italic;
  font-weight: 550;
}