@layer dependency, foundation, component;

@import url("https://use.typekit.net/gcu6gbt.css") layer(dependency);
@import url("https://cdn.jsdelivr.net/npm/charts.css/dist/charts.min.css") layer(dependency);

@import url("./jf-box.css") layer(component);
@import url("./jf-button.css") layer(component);
@import url("./jf-cover.css") layer(component);
@import url("./jf-columns.css") layer(component);
@import url("./jf-form.css") layer(component);
@import url("./jf-footer.css") layer(component);
@import url("./jf-heading.css") layer(component);
@import url("./jf-icon.css") layer(component);
@import url("./jf-link.css") layer(component);
@import url("./jf-media-card.css") layer(component);
@import url("./jf-media-content.css") layer(component);
@import url("./jf-navigation.css") layer(component);
@import url("./jf-overdose-chart.css") layer(component);
@import url("./jf-partner-logo.css") layer(component);
@import url("./jf-population-chart.css") layer(component);
@import url("./jf-stack.css") layer(component);
@import url("./jf-substance-chart.css") layer(component);
@import url("./jf-testimonials.css") layer(component);

@layer foundation {
  :where(:root) {
    --jf--aspect-ratio--portrait: calc(5 / 7);
    --jf--aspect-ratio--square: calc(1 / 1);
    --jf--breakpoint--3xs: var(--jf--space--48);
    --jf--breakpoint--2xs: var(--jf--space--64);
    --jf--breakpoint--xs: var(--jf--space--80);
    --jf--breakpoint--sm: var(--jf--space--96);
    --jf--breakpoint--md: var(--jf--space--112);
    --jf--breakpoint--lg: var(--jf--space--128);
    --jf--breakpoint--xl: var(--jf--space--144);
    --jf--breakpoint--2xl: var(--jf--space--168);
    --jf--breakpoint--3xl: var(--jf--space--192);
    --jf--breakpoint--4xl: var(--jf--space--224);
    --jf--breakpoint--5xl: var(--jf--space--256);
    --jf--breakpoint--6xl: var(--jf--space--288);
    --jf--breakpoint--7xl: var(--jf--space--320);
    --jf--breakpoint--8xl: var(--jf--space--360);
    --jf--breakpoint--9xl: var(--jf--space--400);
    --jf--color--dark-teal: #00819d;
    --jf--color--deep-purple: #350862;
    --jf--color--light-gray: #edf1f4;
    --jf--color--light-teal: #9de4f0;
    --jf--color--light-violet: #bec7eb;
    --jf--color--teal: #299cb4;
    --jf--color--violet: #9491cb;
    --jf--color--white: #ffffff;
    --jf--font-family--body: "area-normal", sans-serif;
    --jf--font-family--display: "freight-text-pro", serif;
    --jf--font-size: 1rem;
    --jf--font-size--3xs: calc(var(--jf--font-size) * 12 / 16);
    --jf--font-size--2xs: calc(var(--jf--font-size) * 13 / 16);
    --jf--font-size--xs: calc(var(--jf--font-size) * 14 / 16);
    --jf--font-size--sm: calc(var(--jf--font-size) * 15 / 16);
    --jf--font-size--md: calc(var(--jf--font-size) * 16 / 16);
    --jf--font-size--lg: calc(var(--jf--font-size) * 20 / 16);
    --jf--font-size--xl: calc(var(--jf--font-size) * 24 / 16);
    --jf--font-size--2xl: calc(var(--jf--font-size) * 28 / 16);
    --jf--font-size--3xl: calc(var(--jf--font-size) * 32 / 16);
    --jf--font-size--4xl: calc(var(--jf--font-size) * 40 / 16);
    --jf--font-size--5xl: calc(var(--jf--font-size) * 48 / 16);
    --jf--font-size--6xl: calc(var(--jf--font-size) * 56 / 16);
    --jf--icon--facebook: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentcolor'%3E%3Cpath d='M22.675 0h-21.35C.597 0 0 .597 0 1.326v21.348C0 23.403.597 24 1.326 24h11.495v-9.294H9.691V11.01h3.13V8.413c0-3.1 1.893-4.788 4.659-4.788 1.325 0 2.463.099 2.795.143v3.24h-1.918c-1.505 0-1.797.716-1.797 1.766v2.316h3.587l-.467 3.696h-3.12V24h6.116C23.403 24 24 23.403 24 22.674V1.326C24 .597 23.403 0 22.675 0z'/%3E%3C/svg%3E");
    --jf--icon--joining-forces: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512' fill='currentcolor'%3E%3Cpath d='M396 280H280v116c0 64.07 51.93 116 116 116s116-51.93 116-116-51.93-116-116-116M232 396V280H116C51.93 280 0 331.93 0 396s51.93 116 116 116 116-51.93 116-116M396 0c-64.07 0-116 51.93-116 116v116h116c64.07 0 116-51.93 116-116S460.07 0 396 0M116 232h116V116C232 51.93 180.07 0 116 0S0 51.93 0 116s51.93 116 116 116'/%3E%3C/svg%3E");
    --jf--icon--instagram: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512' fill='currentcolor'%3E%3Cpath d='M256.15 141.02c-63.6 0-114.9 51.3-114.9 114.9s51.3 114.9 114.9 114.9 114.9-51.3 114.9-114.9-51.3-114.9-114.9-114.9Zm0 189.6c-41.1 0-74.7-33.5-74.7-74.7s33.5-74.7 74.7-74.7 74.7 33.5 74.7 74.7-33.6 74.7-74.7 74.7Zm146.4-194.3c0 14.9-12 26.8-26.8 26.8s-26.8-12-26.8-26.8 12-26.8 26.8-26.8 26.8 12 26.8 26.8Zm76.1 27.2c-1.7-35.9-9.9-67.7-36.2-93.9-26.2-26.2-58-34.4-93.9-36.2-37-2.1-147.9-2.1-184.9 0-35.8 1.7-67.6 9.9-93.9 36.1s-34.4 58-36.2 93.9c-2.1 37-2.1 147.9 0 184.9 1.7 35.9 9.9 67.7 36.2 93.9 26.3 26.2 58 34.4 93.9 36.2 37 2.1 147.9 2.1 184.9 0 35.9-1.7 67.7-9.9 93.9-36.2 26.2-26.2 34.4-58 36.2-93.9 2.1-37 2.1-147.8 0-184.8Zm-47.8 224.5c-7.8 19.6-22.9 34.7-42.6 42.6-29.5 11.7-99.5 9-132.1 9s-102.7 2.6-132.1-9c-19.6-7.8-34.7-22.9-42.6-42.6-11.7-29.5-9-99.5-9-132.1s-2.6-102.7 9-132.1c7.8-19.6 22.9-34.7 42.6-42.6 29.5-11.7 99.5-9 132.1-9s102.7-2.6 132.1 9c19.6 7.8 34.7 22.9 42.6 42.6 11.7 29.5 9 99.5 9 132.1s2.7 102.7-9 132.1Z'/%3E%3C/svg%3E");
    --jf--icon--mark: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512' fill='currentcolor'%3E%3Cpath d='M400.93 19.08c25.43-25.43 66.57-25.43 92 0 25.43 25.43 25.43 66.57 0 92-25.43 25.37-66.57 25.43-92 0-25.43-25.43-25.43-66.57 0-92Z'/%3E%3Cpath d='M269.96 6.2c37.13-10.19 76.82 1.38 102.51 30.03l-.26.79c-15.57 41.27 5.32 87.34 46.59 102.84 18.4 6.97 38.7 6.83 57.04-.26 14.72 13.21 25.3 30.56 30.36 49.81 14.19 54.35-18.27 109.88-72.61 124.14-15.18 3.81-31.15 5.85-46.72 6.77-24.12 1.38-116.05-13.41-138.46-16.43 2.96-19.32 4.14-26.94 7.36-48.1 30.69 4.67 107.57 17.09 109.15 17.09 5.13 0 10.25 0 15.44-.26 5.19-.26 10.45-.66 15.57-1.12 9.2-.99 18.07-2.43 25.56-4.34 28.72-7.56 45.87-36.93 38.38-65.58-4.27-16.5-16.23-29.97-32-36.28-23.46-9.46-49.22-11.89-73.99-6.9 4.99-24.84 2.56-50.54-6.9-74-5.65-14.13-17.02-25.17-31.28-30.49-10.12-20.11-25.96-36.67-45.54-47.64l-.2-.07Z'/%3E%3Cpath d='M189.01 5.54c54.34-14.26 109.94 18.27 124.13 72.62 3.81 15.18 5.85 31.22 6.77 46.72 1.38 24.12-12.62 115.86-15.64 138.2-19.78-1.97-30.75-4.47-48.56-7.36 4.6-30.75 16.82-107.31 16.82-108.89 0-5.06-.07-10.25-.26-15.44-.2-5.19-.59-10.45-1.12-15.51-.92-9.2-2.43-18.07-4.34-25.56-7.56-28.72-36.86-45.87-65.58-38.38-16.49 4.34-29.96 16.17-36.27 32-9.53 23.46-11.89 49.22-6.9 74.06-24.77-4.99-50.6-2.56-74.06 6.9a53.626 53.626 0 0 0-30.42 31.28c-20.11 10.06-36.67 25.96-47.64 45.54-10.19-37.06 1.45-76.76 30.03-102.52l.72.26c41.27 15.58 87.33-5.32 102.84-46.59 6.97-18.33 6.83-38.64-.26-56.98 13.27-14.79 30.62-25.3 49.81-30.36h-.07Z'/%3E%3Cpath d='M19.07 19.07c25.43-25.43 66.57-25.43 92 0 25.43 25.43 25.43 66.57 0 92-25.43 25.43-66.57 25.43-92 0-25.43-25.43-25.43-66.57 0-92Zm381.86 381.88c25.43-25.43 66.57-25.43 92 0 25.37 25.37 25.43 66.57 0 92-25.43 25.37-66.57 25.37-92 0-25.43-25.43-25.37-66.57 0-92ZM125.2 191.78c24.12-1.38 115.65 12.29 138 15.31-2.1 18.01-4.27 29.9-7.23 48.43-19.98-3.02-96.4-16.3-108.82-16.3-5.13 0-10.25 0-15.44.33-5.19.2-10.45.59-15.51 1.18-9.2.92-18.07 2.43-25.56 4.27-28.72 7.49-45.87 36.87-38.31 65.58a53.495 53.495 0 0 0 32 36.27c23.46 9.46 49.22 11.9 74.06 6.9-4.99 24.84-2.56 50.54 6.9 74 5.65 14.13 17.02 25.17 31.28 30.49 10.05 20.04 25.96 36.67 45.54 47.64-37.06 10.19-76.75-1.38-102.51-30.03l.26-.79c15.57-41.27-5.32-87.34-46.59-102.85-18.4-6.9-38.7-6.83-57.04.26-14.79-13.27-25.3-30.56-30.36-49.81-14.19-54.28 18.27-109.88 72.61-124.14 15.18-3.81 31.21-5.85 46.79-6.77h-.07Z'/%3E%3Cpath d='M207.41 247.5c18 2.76 30.23 4.99 48.3 7.62-4.67 30.76-16.49 107.58-16.56 109.15 0 5.13.07 10.25.26 15.44.2 5.19.59 10.38 1.12 15.51.92 9.2 2.43 18.07 4.34 25.56 7.49 28.72 36.86 45.87 65.58 38.38 16.49-4.34 29.9-16.23 36.27-32.07 9.46-23.46 11.89-49.22 6.9-74.06 24.84 4.93 50.6 2.56 74.06-6.9a53.671 53.671 0 0 0 30.43-31.28c20.11-10.05 36.67-25.96 47.64-45.54 10.19 37.06-1.45 76.82-30.03 102.52l-.72-.26c-41.27-15.57-87.33 5.32-102.84 46.59-6.9 18.4-6.83 38.71.26 57.04-13.27 14.79-30.56 25.3-49.81 30.36-54.34 14.26-109.87-18.27-124.13-72.55-3.81-15.18-5.85-31.21-6.77-46.79-1.38-24.12 12.62-116.32 15.64-138.66l.07-.07ZM19.07 400.95c25.43-25.43 66.57-25.43 92 0 25.43 25.43 25.37 66.57 0 92-25.43 25.37-66.57 25.43-92 0-25.43-25.43-25.36-66.57 0-91.94v-.07Z'/%3E%3C/svg%3E");
    --jf--icon--youtube: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentcolor'%3E%3Cpath d='M23.498 6.186a3.016 3.016 0 0 0-2.122-2.136C19.505 3.545 12 3.545 12 3.545s-7.505 0-9.377.505A3.017 3.017 0 0 0 .502 6.186C0 8.07 0 12 0 12s0 3.93.502 5.814a3.016 3.016 0 0 0 2.122 2.136c1.871.505 9.376.505 9.376.505s7.505 0 9.377-.505a3.015 3.015 0 0 0 2.122-2.136C24 15.93 24 12 24 12s0-3.93-.502-5.814zM9.545 15.568V8.432L15.818 12l-6.273 3.568z'/%3E%3C/svg%3E");
    --jf--layout: var(--jf--breakpoint--2xl);
    --jf--line-height--none: calc(8 / 8);
    --jf--line-height--compact: calc(9 / 8);
    --jf--line-height--tight: calc(10 / 8);
    --jf--line-height--snug: calc(11 / 8);
    --jf--line-height--normal: calc(12 / 8);
    --jf--line-height--relaxed: calc(13 / 8);
    --jf--line-height--slack: calc(14 / 8);
    --jf--line-height--wide: calc(15 / 8);
    --jf--line-height--loose: calc(16 / 8);
    --jf--rhythm: var(--jf--space--8);
    --jf--rhythm--xs: calc(var(--jf--rhythm) * 1 / 4);
    --jf--rhythm--sm: calc(var(--jf--rhythm) * 2 / 4);
    --jf--rhythm--md: calc(var(--jf--rhythm) * 4 / 4);
    --jf--rhythm--lg: calc(var(--jf--rhythm) * 6 / 4);
    --jf--rhythm--xl: calc(var(--jf--rhythm) * 8 / 4);
    --jf--rhythm--2xl: calc(var(--jf--rhythm) * 12 / 4);
    --jf--rhythm--3xl: calc(var(--jf--rhythm) * 16 / 4);
    --jf--rhythm--4xl: calc(var(--jf--rhythm) * 20 / 4);
    --jf--rhythm--5xl: calc(var(--jf--rhythm) * 24 / 4);
    --jf--space: calc(1rem / 4);
    --jf--space--0: 0;
    --jf--space--0_5: calc(var(--jf--space) * 0.5);
    --jf--space--1: calc(var(--jf--space) * 1);
    --jf--space--1_5: calc(var(--jf--space) * 1.5);
    --jf--space--2: calc(var(--jf--space) * 2);
    --jf--space--3: calc(var(--jf--space) * 3);
    --jf--space--4: calc(var(--jf--space) * 4);
    --jf--space--5: calc(var(--jf--space) * 5);
    --jf--space--6: calc(var(--jf--space) * 6);
    --jf--space--8: calc(var(--jf--space) * 8);
    --jf--space--10: calc(var(--jf--space) * 10);
    --jf--space--12: calc(var(--jf--space) * 12);
    --jf--space--16: calc(var(--jf--space) * 16);
    --jf--space--20: calc(var(--jf--space) * 20);
    --jf--space--24: calc(var(--jf--space) * 24);
    --jf--space--28: calc(var(--jf--space) * 28);
    --jf--space--32: calc(var(--jf--space) * 32);
    --jf--space--36: calc(var(--jf--space) * 36);
    --jf--space--40: calc(var(--jf--space) * 40);
    --jf--space--48: calc(var(--jf--space) * 48);
    --jf--space--64: calc(var(--jf--space) * 64);
    --jf--space--80: calc(var(--jf--space) * 80);
    --jf--space--96: calc(var(--jf--space) * 96);
    --jf--space--112: calc(var(--jf--space) * 112);
    --jf--space--128: calc(var(--jf--space) * 128);
    --jf--space--144: calc(var(--jf--space) * 144);
    --jf--space--168: calc(var(--jf--space) * 168);
    --jf--space--192: calc(var(--jf--space) * 192);
    --jf--space--224: calc(var(--jf--space) * 224);
    --jf--space--256: calc(var(--jf--space) * 256);
    --jf--space--288: calc(var(--jf--space) * 288);
    --jf--space--320: calc(var(--jf--space) * 320);
    --jf--space--360: calc(var(--jf--space) * 360);
    --jf--space--400: calc(var(--jf--space) * 400);
    --jf--space--half: 50%;
    --jf--space--full: 100%;
    --jf--space--px: 1px;
  }

  @media (min-width: 64rem) {
    :where(:root) {
      --jf--layout: var(--jf--breakpoint--7xl);
    }
  }

  :root {
    accent-color: var(--jf--color--deep-purple);
    background-color: var(--jf--color--white);
    color: var(--jf--color--deep-purple);
    font-family: var(--jf--font-family--body);
    line-height: var(--jf--line-height--loose);
    min-inline-size: var(--jf--breakpoint--xs);
  }

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

  ::selection {
    background-color: var(--jf--color--deep-purple);
    color: var(--jf--color--white);
  }

  a {
    color: inherit;
    text-decoration: none;
  }

  body,
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  p {
    margin-block: var(--jf--space--0);
  }

  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    font-family: var(--jf--font-family--display);
    font-weight: 700;
    text-wrap: balance;
    line-height: var(--jf--line-height--tight);
  }

  h1 {
    font-size: var(--jf--font-size--5xl);
  }

  h2 {
    font-size: var(--jf--font-size--4xl);
  }

  h3 {
    font-size: var(--jf--font-size--3xl);
  }

  h4 {
    font-size: var(--jf--font-size--2xl);
  }

  h5 {
    font-size: var(--jf--font-size--xl);
  }

  h6 {
    font-size: var(--jf--font-size--lg);
  }

  img {
    display: block flow;
    max-inline-size: var(--jf--space--full);
    object-fit: cover;
  }

  p {
    font-size: var(--jf--font-size--sm);
  }
}