@tailwind base;
@tailwind components;
@tailwind utilities;

@layer utilities {
  .aspect-box {
    position: relative;
    width: 100%;
  }

  .aspect-box img,
  .aspect-box video,
  .aspect-box canvas,
  .aspect-box iframe,
  .aspect-box svg {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    object-fit: cover;
  }

  .aspect-box:before {
    content: '';
    display: block;
    padding-top: calc(var(--aspect-ratio) * 100%);
  }
}

/* fonts */
@font-face {
  font-family: 'Balto Book';
  src: url(../fonts/balto-book.eot) format('eot'),
    url(../fonts/balto-book.woff) format('woff');
  font-weight: bold;
  font-style: normal;
}

@font-face {
  font-family: 'Balto Bold';
  src: url(../fonts/balto-bold.eot) format('eot'),
    url(../fonts/balto-bold.woff) format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'Balto Bold Italic';
  src: url(../fonts/Balto-BoldItalic.woff2) format('woff2'),
      url(../fonts/Balto-BoldItalic.woff) format('woff');
  font-weight: bold;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Publico';
  src: url(../fonts/publico.woff2) format('woff2'),
    url(../fonts/publico.woff) format('woff');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: 'Publico Italic';
  src: url(../fonts/publico-italic.woff2) format('woff2'),
    url(../fonts/publico-italic.woff) format('woff');
  font-weight: 400;
  font-style: italic;
}

@font-face {
  font-family: 'Publico Bold';
  src: url(../fonts/publico-bold.woff2) format('woff2'),
    url(../fonts/publico-bold.woff) format('woff');
  font-weight: 700;
  font-style: normal;
}

@font-face {
  font-family: 'Publico Bold Italic';
  src: url(../fonts/publico-bold-italic.woff2) format('woff2'),
    url(../fonts/publico-bold-italic.woff) format('woff');
  font-weight: 700;
  font-style: italic;
}

@font-face {
  font-family: 'Publico Headline';
  src: url(../fonts/publico-headline.woff2) format('woff2'),
    url(../fonts/publico-headline.woff) format('woff');
  font-weight: 700;
  font-style: normal;
}

@font-face {
  font-family: 'Publico Headline Italic';
  src: url(../fonts/publico-headline-italic.woff2) format('woff2'),
    url(../fonts/publico-headline-italic.woff) format('woff');
  font-weight: 700;
  font-style: italic;
}

/* custom global styles */
::selection {
  background-color: theme('colors.fastBlue');
  color: theme('colors.fastWhite');
}

a {
  @apply cursor-pointer hover:opacity-70;
}

.l-link {
  @apply inline-block relative uppercase font-baltoBold text-custom14 leading-custom1_4 px-5 overflow-hidden before:content-[''] before:block before:absolute before:top-1 before:left-0 before:w-3 before:h-3 before:rounded-full before:bg-[var(--progress-color)] after:content-[''] after:w-4 after:h-4 after:bg-arrow after:absolute after:top-0 lg:after:top-[-100%] after:right-0 lg:after:transition-all lg:hover:after:top-0 hover:opacity-[unset];
}

.l-link--plain {
  @apply inline-block relative uppercase font-baltoBold text-custom14 leading-custom1_4 pr-5 overflow-hidden after:content-[''] after:w-4 after:h-4 after:bg-arrow after:absolute after:top-0 lg:after:top-[-100%] after:right-0 lg:after:transition-all lg:hover:after:top-0 hover:opacity-[unset];
}

.b-link {
  @apply inline-block relative uppercase font-baltoBold text-custom12 leading-custom0_91 pl-5 before:content-[''] before:block before:absolute before:top-1/2 before:left-0 before:transform before:-translate-y-1/2 before:w-4 before:h-4 before:bg-back-arrow;
}

.rich-text a,
.featured-links a,
.logo a {
  @apply hover:opacity-100;
}

.wrapper {
  @apply mx-auto md:max-w-screen-2xl px-4 lg:px-10;
}

/* button enable/disable -> https://gorails.com/episodes/turbo-data-confirm-method-and-disable */
button .show-when-enabled {
  display: initial;
}

button .show-when-disabled {
  display: none;
}

button[disabled] .show-when-enabled {
  display: none;
}

button[disabled] .show-when-disabled {
  display: initial;
}

/* Page Layout */
.page .about-fast-category .category-label {
  @apply bg-fastMidGrey;
}

.page .about-as-category .category-label {
  @apply bg-fastMidGrey;
}

.page .donors-category .category-label {
  @apply bg-fastRed;
}

.page .families-category .category-label {
  @apply bg-fastBlue;
}

.page .industry-category .category-label {
  @apply bg-fastPurple;
}

.page .research-category .category-label {
  @apply bg-fastGreen;
}

.page .about-as-category .page-title,
.page .about-fast-category .page-title {
  @apply border-t-6 border-fastMidGrey;
}

.page .families-category .page-title {
  @apply border-t-6 border-fastBlue;
}

.page .research-category .page-title {
  @apply border-t-6 border-fastGreen;
}

.page .industry-category .page-title {
  @apply border-t-6 border-fastPurple;
}

.page .donors-category .page-title {
  @apply border-t-6 border-fastRed;
}

.page .call-to-action-text {
  @apply underline hover:no-underline decoration-2 underline-offset-[0.7rem] md:underline-offset-[1rem] decoration-fastLinkGrey;
}

.page .families-category .call-to-action-text {
  @apply decoration-fastBlue;
}

/* Subnav link styles */
.subnav-link-default {
  @apply decoration-fastLinkGrey;
}

.subnav-link-families-caregivers {
  @apply decoration-fastBlue;
}

.subnav-link-donors-investors,
.subnav-link-donors {
  @apply decoration-fastRed;
}

.subnav-link-industry {
  @apply decoration-fastPurple;
}

.subnav-link-researchers {
  @apply decoration-fastGreen;
}

/* Article layout */
.article .families-category .category-label {
  @apply bg-fastBlue;
}

.article .families-category .article-title {
  @apply border-t-6 border-fastBlue;
}

.article .research-category .category-label {
  @apply bg-fastGreen;
}

.article .research-category .article-title {
  @apply border-t-6 border-fastGreen;
}

.article .industry-category .category-label {
  @apply bg-fastPurple;
}

.article .industry-category .article-title {
  @apply border-t-6 border-fastPurple;
}

.article .donors-category .category-label {
  @apply bg-fastRed;
}

.article .donors-category .article-title {
  @apply border-t-6 border-fastRed;
}

.article .call-to-action-text {
  @apply underline hover:no-underline decoration-2 underline-offset-[0.7rem] md:underline-offset-[1rem] decoration-fastLinkGrey;
}

.article .families-category .call-to-action-text {
  @apply decoration-fastBlue;
}

/* section: rich text */
.rich-text {
  @apply font-publico text-lg sm:text-xl md:text-2xl text-fastWhite;
}

.rich-text h2 {
  @apply font-baltoBold text-2xl md:text-3xl lg:text-4xl pt-4 md:pt-6 mb-8 md:mb-12;
}

.rich-text h3 {
  @apply font-baltoBold text-xl md:text-2xl lg:text-3xl pt-4 md:pt-6 mb-6 md:mb-8;
}

.rich-text h4 {
  @apply font-baltoBold text-lg md:text-xl lg:text-2xl pt-2 md:pt-4 mb-6 md:mb-8;
}

.rich-text b,
.rich-text strong {
  @apply font-publicoBold;
}

.rich-text i,
.rich-text em {
  @apply font-publicoItalic;
}

.rich-text p,
.rich-text ul,
.rich-text ol,
.rich-text blockquote,
.rich-text dl {
  @apply mb-6 md:mb-8 lg:mb-10;
}

.rich-text ul {
  @apply inline-block w-full list-disc pl-4 md:pl-12;
}

.rich-text ol {
  @apply list-decimal ml-8;
}

.rich-text li {
  @apply w-full;
}

.rich-text ul li,
.rich-text ol li {
  @apply mb-4 md:mb-6;
}

.rich-text ul li:last-child,
.rich-text ol li:last-child {
  @apply mb-0 md:mb-0;
}

.rich-text ul li ul,
.rich-text ul li ol {
  @apply mb-0 md:mb-0 lg:mb-0;
}

.rich-text ul li ul li,
.rich-text ul li ul li {
  @apply list-square mt-1 md:mt-2 mb-0 md:mb-0 lg:mb-0;
}

.rich-text ul li ul,
.rich-text ul li ol,
.rich-text ol li ul,
.rich-text ol li ol {
  @apply mb-0 md:mb-0 lg:mb-0;
}

.rich-text li p {
  @apply block mb-0;
}

.rich-text a {
  @apply underline hover:no-underline decoration-2 underline-offset-4 decoration-fastLinkGrey;
}

.rich-text blockquote {
  @apply block w-full mx-auto px-8 md:px-48 md:pt-8 font-baltoBold italic text-lg md:text-xl lg:text-2xl;
}

.families-category .rich-text a,
#families-category .rich-text a {
  @apply decoration-fastBlue;
}

.research-category .rich-text a,
#research-category .rich-text a {
  @apply decoration-fastGreen;
}

.industry-category .rich-text a,
#industry-category .rich-text a {
  @apply decoration-fastPurple;
}

.donors-category .rich-text a,
#donors-category .rich-text a {
  @apply decoration-fastRed;
}

/* Section: Accordion */
.misc-category .accordion-icon,
.accordion-icon {
  @apply bg-fastLinkGrey;
}

#families-category .accordion-icon,
.families-category .accordion-icon {
  @apply bg-fastBlue;
}

#research-category .accordion-icon,
.research-category .accordion-icon {
  @apply bg-fastGreen;
}

#industry-category .accordion-icon,
.industry-category .accordion-icon {
  @apply bg-fastPurple;
}

#donors-category .accordion-icon,
.donors-category .accordion-icon {
  @apply bg-fastRed;
}

/* Archived Posts */
.archived-post img {
  @apply mx-auto pb-8 md:pb-12;
}

/* Bios */
.bio-rich-text a {
  @apply font-baltoBold underline hover:no-underline decoration-2 underline-offset-4 decoration-fastLinkGrey;
}

.bio-rich-text p {
  @apply mb-6 lg:mb-8;
}

/* section: image with caption */
.caption .rich-text {
  @apply font-baltoBook text-base md:text-lg text-fastWhite;
}

/* section: window with text */
#families-category .window,
.page .families-category .window {
  @apply bg-fastBlue;
}

#research-category .window,
.page .research-category .window {
  @apply bg-fastGreen;
}

#industry-category .window,
.page .industry-category .window {
  @apply bg-fastPurple;
}

#donors-category .window,
.page .donors-category .window {
  @apply bg-fastRed;
}

.page .misc-category .window,
.page .about-fast-category .window,
.page .about-as-category .window {
  @apply bg-fastGrey;
}

/* section: category page featured links */
.featured-links .rich-text {
  @apply font-baltoBook text-lg md:text-xl lg:text-2xl mb-4 md:mb-6 lg:mb-8;
}

.featured-links a {
  @apply underline hover:no-underline decoration-2 underline-offset-[0.7rem] md:underline-offset-[0.8rem] decoration-fastLinkGrey;
}

#families-category .featured-links a,
.families-category .featured-links a {
  @apply decoration-fastBlue;
}

#research-category .featured-links a,
.research-category .featured-links a {
  @apply decoration-fastGreen;
}

#industry-category .featured-links a,
.industry-category .featured-links a {
  @apply decoration-fastPurple;
}

#donors-category .featured-links a,
.donors-category .featured-links a {
  @apply decoration-fastRed;
}

/* section: side by side images */
.families-category .article-images {
  @apply border-y border-fastBlue;
}

.research-category .article-images {
  @apply border-y border-fastGreen;
}

.industry-category .article-images {
  @apply border-y border-fastPurple;
}

.donors-category .article-images {
  @apply border-y border-fastRed;
}


.image-caption .rich-text p {
  @apply mb-4 md:mb-6;
}


/* section: news ticker */
.border-color-fastBlue {
  @apply border-fastBlue;
}

.border-color-fastGreen {
  @apply border-fastGreen;
}

.border-color-fastPurple {
  @apply border-fastPurple;
}

.border-color-fastRed {
  @apply border-fastRed;
}

.border-color-fastGrey {
  @apply border-fastLinkGrey;
}

/* Footer constant contact newsletter form*/
#constant-contact .ctct-form-embed.form_1 .ctct-form-defaults {
  @apply bg-fastDarkGrey;
}

#constant-contact .grecaptcha-badge {
  @apply hidden;
}

#constant-contact #gdpr_text {
  @apply hidden;
}

#constant-contact #email_address_label_1 {
  @apply hidden;
}

#constant-contact #first_name_label_1 {
  @apply hidden;
}

#constant-contact #last_name_label_1 {
  @apply hidden;
}

#constant-contact .ctct-form-errorMessage {
  @apply text-fastRed;
}

#constant-contact form .ctct-form-field,
#constant-contact form #email_field_1,
#constant-contact form #first_name_field_1,
#constant-contact form #last_name_field_1 {
  @apply mb-0;
}

#constant-contact form #first_name_field_1 {
  @apply order-1;
}

#constant-contact form #last_name_field_1 {
  @apply order-2;
}

#constant-contact form #email_address_field_1 {
  @apply order-3;
}

#constant-contact form .ctct-form-button {
  @apply order-4;
}

#constant-contact form #ctct_recaptcha_1 {
  @apply order-5;
}

#constant-contact form #email_address_1,
#constant-contact form #first_name_1,
#constant-contact form #last_name_1 {
  @apply font-baltoBold text-base md:text-xl bg-fastDarkGrey text-fastLightGrey shadow-none border-b border-fastLightGrey border-t-0 border-r-0 border-l-0 rounded-none focus:outline-none focus:ring-0 placeholder:text-fastLightGrey focus:placeholder:text-fastWhite px-0 pt-0 pb-2 md:pb-4 mb-0;
}

#constant-contact form .ctct-form-button {
  @apply font-baltoBold text-base md:text-xl text-fastWhite border-t border-b border-r-0 border-l-0 border-fastGrey focus:border-transparent focus:outline-none rounded-none hover:bg-fastGrey relative bottom-3 md:bottom-4;
}

#constant-contact #ctct_form_1 {
  @apply grid grid-cols-2 md:grid-cols-4 gap-x-4 md:gap-x-8 gap-y-10 md:gap-y-12;
}

#constant-contact .ctct-form-defaults {
  @apply p-0;
}

#constant-contact #success_message_1 .ctct-form-header,
#constant-contact #success_message_1 .ctct-form-text,
#constant-contact #success_message_1 h2,
#constant-contact #success_message_1 p {
  @apply text-fastLightGrey;
}


/* Page embed constant contact newsletter form*/
#page-constant-contact .ctct-form-embed.form_1 .ctct-form-defaults {
  @apply bg-fastBlack;
}

#page-constant-contact .grecaptcha-badge {
  @apply hidden;
}

#page-constant-contact #gdpr_text {
  @apply hidden;
}

#page-constant-contact #email_address_label_1 {
  @apply hidden;
}

#page-constant-contact #first_name_label_1 {
  @apply hidden;
}

#page-constant-contact #last_name_label_1 {
  @apply hidden;
}

#page-constant-contact .ctct-form-errorMessage {
  @apply text-fastRed;
}

#page-constant-contact form .ctct-form-field,
#page-constant-contact form #email_field_1,
#page-constant-contact form #first_name_field_1,
#page-constant-contact form #last_name_field_1 {
  @apply mb-0;
}

#page-constant-contact form #first_name_field_1 {
  @apply order-1;
}

#page-constant-contact form #last_name_field_1 {
  @apply order-2;
}

#page-constant-contact form #email_address_field_1 {
  @apply order-3;
}

#page-constant-contact form .ctct-form-button {
  @apply order-4;
}

#page-constant-contact form #ctct_recaptcha_1 {
  @apply order-5;
}

#page-constant-contact form #email_address_1,
#page-constant-contact form #first_name_1,
#page-constant-contact form #last_name_1 {
  @apply font-baltoBold text-base md:text-xl bg-fastBlack text-fastLightGrey shadow-none border-b border-fastLightGrey border-t-0 border-r-0 border-l-0 rounded-none focus:outline-none focus:ring-0 placeholder:text-fastLightGrey focus:placeholder:text-fastWhite px-0 pt-0 pb-2 md:pb-4 mb-0;
}

#page-constant-contact form .ctct-form-button {
  @apply font-baltoBold text-base md:text-xl text-fastWhite border-t border-b border-r-0 border-l-0 border-fastGrey focus:border-transparent focus:outline-none rounded-none hover:bg-fastGrey relative bottom-3 md:bottom-4;
}

#page-constant-contact #ctct_form_1 {
  @apply grid grid-cols-2 md:grid-cols-4 gap-x-4 md:gap-x-8 gap-y-10 md:gap-y-12;
}

#page-constant-contact .ctct-form-defaults {
  @apply p-0;
}

#page-constant-contact #success_message_1 .ctct-form-header,
#page-constant-contact #success_message_1 .ctct-form-text,
#page-constant-contact #success_message_1 h2,
#page-constant-contact #success_message_1 p {
  @apply text-fastLightGrey;
}

/* Google Custom Search */
#search table {
  @apply text-fastDarkGrey !important;
}
/*# sourceMappingURL=style.css.map */

.chart {
  background-color: #1B1C1E;
  padding: 48px 20px;
  margin: 0 -20px;
}

.chart p em, .chart p i{
  font-family: "Publico Italic", Georgia,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;
}

.chart p strong, .chart p strong {
  font-family: "Publico Bold", Georgia,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;
}

.chart p strong em, .chart p strong i {
  font-family: "Publico Bold Italic", Georgia,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;
}

.chart h1 em, .chart h1 i,
.chart h2 em, .chart h2 i,
.chart h3 em, .chart h3 i,
.chart h4 em, .chart h4 i,
.chart h5 em, .chart h5 i,
.chart h6 em, .chart h6 i {
  font-family: "Balto Bold Italic", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

@media only screen and (min-width: 1024px) {
  .chart {
    margin: 0;
    padding: 48px;
    border-radius: 16px;
  }
}

.chart.chart--plain {
  background-color: transparent;
  padding: 0;
  border-radius: 0;
  margin-left: 0;
  margin-right: 0;
}

.chart .chart__headline {
  margin-bottom: 42px;
}

@media only screen and (min-width: 1024px) {
  .chart .chart__headline {
    margin-bottom: 24px;
  }
}

@media only screen and (min-width: 1024px) {
  .chart .chart__grid {
    --progress-lines: 14.06%;
    background: linear-gradient(90deg, #1B1C1E 15%, transparent 15%, 
      transparent 27.9%, rgba(84, 85, 86, 1) calc(27.9% + 1px), transparent calc(27.9% + 2px), 
      transparent 42.15%, rgba(84, 85, 86, 1) calc(42.15% + 1px), transparent calc(42.15% + 2px), 
      transparent 56.75%, rgba(84, 85, 86, 1) calc(56.75% + 1px), transparent calc(56.75% + 2px), 
      transparent 71%, rgba(84, 85, 86, 1) calc(71% + 1px), transparent calc(71% + 2px),
      transparent 85.4%, rgba(84, 85, 86, 1) calc(85.4% + 1px), transparent calc(85.4% + 2px),
      transparent calc(100% - 2px), rgba(84, 85, 86, 1) 100%
    );
  }
}

@media only screen and (min-width: 1024px) {
  .chart.chart--plain .chart__grid {
    position: relative;
    background: none;
  }
}

@media only screen and (min-width: 1024px) {
  .chart.chart--plain .chart__grid::after {
    content: '';
    pointer-events: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; 
    background: linear-gradient(90deg, transparent, 
      transparent 16.66%, #FFFFFF4D calc(16.66% + 1px), transparent calc(16.66% + 2px), 
      transparent 33.33%, #FFFFFF4D calc(33.33% + 1px), transparent calc(33.33% + 2px), 
      transparent 49.98%, #FFFFFF4D calc(49.98% + 1px), transparent calc(49.98% + 2px), 
      transparent 66.66%, #FFFFFF4D calc(66.66% + 1px), transparent calc(66.66% + 2px),
      transparent 83.33%, #FFFFFF4D calc(83.33% + 1px), transparent calc(83.33% + 2px),
      transparent calc(100% - 2px), transparent 100%
    );
  }
}

.chart .chart__grid .chart__grid__col {
  display: none;
}

@media only screen and (min-width: 1024px) {
  .chart .chart__grid .chart__grid__col {
    display: grid;
    grid-template-columns: 13.5% repeat(6, 1fr);
    margin-bottom: 21px;
    padding-top: 8px;
  }
}


@media only screen and (min-width: 1024px) {
  .chart.chart--plain .chart__grid .chart__grid__col {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    margin-bottom: 12px;
  }
}

.chart .chart__grid .chart__grid__col h3 {
  text-transform: uppercase;
  font-family: "Balto Bold", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  font-size: 12px;
  line-height: 11px;
  font-weight: 700;
}

.chart.chart--plain .chart__grid .chart__grid__col h3 {
  padding-left: 9px;
}

.chart .chart__grid .chart__grid__col h3:first-child {
  color: #FFFFFF80;
}

.chart .chart__grid .chart__grid__col h3:not(:first-child, :nth-child(2)) {
  padding-left: 9px;
}

.chart .chart__grid .chart__pillar:not(:last-child) {
  margin-bottom: 40px;
}

@media only screen and (min-width: 1024px) {
  .chart .chart__grid .chart__pillar:not(:last-child) {
    margin-bottom: 19px;
  } 
}

@media only screen and (min-width: 1024px) {
  .chart.chart--plain .chart__grid .chart__pillar {
    grid-template-columns: repeat(6, 1fr);
  }
}

.chart .chart__grid .chart__pillar h4 {
  color: #FFFFFF80;
  font-size: 18px;
  line-height: 20.7px;
  margin-bottom: 40px;
}

@media only screen and (min-width: 1024px) {
  .chart .chart__grid .chart__pillar h4 {
    grid-column: 1 / 2;
    margin-bottom: 6px;
  }
}

.chart .chart__grid .chart__pillar .chart__approach {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(6, 1fr);
}

.chart .chart__grid .chart__pillar .chart__approach:not(:last-child) {
  margin-bottom: 40px;
}

@media only screen and (min-width: 1024px) {
  .chart .chart__grid .chart__pillar .chart__approach:not(:last-child) {
    margin-bottom: 6px;
  }
}

@media only screen and (min-width: 1024px) {
  .chart .chart__grid .chart__pillar .chart__approach {
    grid-template-columns: 13.5% repeat(6, 1fr);
    margin-bottom: 0;
  }
}

@media only screen and (min-width: 1024px) {
  .chart.chart--plain .chart__grid .chart__pillar .chart__approach {
    grid-template-columns: repeat(6, 1fr);
  }
}

@media only screen and (min-width: 1024px) {
  .chart.chart--plain .chart__grid .chart__pillar .chart__approach {
    grid-template-columns: repeat(6, 1fr);
  }
}

.chart .chart__grid .chart__pillar .chart__approach .chart__approach__name {
  grid-column: 1 / 2;
  margin-bottom: 15px;
  position: relative;
}

@media only screen and (min-width: 1024px) {
  .chart .chart__grid .chart__pillar .chart__approach .chart__approach__name {
    margin-bottom: 0;
    padding-right: 6px;
    max-height: 22px;
    display: flex;
    align-items: center;
  } 
}

.chart .chart__grid .chart__pillar .chart__approach .chart__approach__name h5 {
  font-size: 14px;
  line-height: 16.94px;
  font-weight: 700;
  font-family: "Balto Bold", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  cursor: default;
  text-transform: uppercase;
}

.chart .chart__grid .chart__pillar .chart__approach .chart__approach__name dialog {
  -webkit-backdrop-filter: blur(50px);
  backdrop-filter: blur(50px);
  background-color: transparent;
  max-width: unset;
  max-height: unset;
  padding: 24px;
}

.chart .chart__grid .chart__pillar .chart__approach .chart__approach__name dialog h1 {
  font-size: 64px;
  color: #ffffff;
  font-family: "Balto Bold", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
.chart .chart__grid .chart__pillar .chart__approach .chart__approach__name dialog h2 {
  font-size: 52px;
  color: #ffffff;
  font-family: "Balto Bold", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
.chart .chart__grid .chart__pillar .chart__approach .chart__approach__name dialog h3 {
  font-size: 48px;
  color: #ffffff;
  font-family: "Balto Bold", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
.chart .chart__grid .chart__pillar .chart__approach .chart__approach__name dialog h4 {
  font-size: 36px;
  color: #ffffff;
  font-family: "Balto Bold", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
.chart .chart__grid .chart__pillar .chart__approach .chart__approach__name dialog h5 {
  font-size: 32px;
  color: #ffffff;
  font-family: "Balto Bold", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

.chart .chart__grid .chart__pillar .chart__approach .chart__approach__name dialog h6 {
  color: #ffffff;
  font-family: "Balto Bold", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  font-size: 24px;
  line-height: 27.6px;
  letter-spacing: -0.02em;
  margin-bottom: 4px;
}

.chart .chart__grid .chart__pillar .chart__approach .chart__approach__name dialog p {
  color: #FFFFFFE5;
  font-size: 16px;
  line-height: 22.4px;
  font-family: "Publico",Georgia,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;
}

.chart .chart__grid .chart__pillar .chart__approach .chart__approach__name dialog p.dialog-close {
  font-family: "Balto Book", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  font-size: 10px;
  line-height: 12.1px;
  color: #FFFFFF80;
  text-transform: uppercase;
  position: absolute;
  bottom: 16px;
  left: 24px;
  font-weight: 700;
  -webkit-font-smoothing: antialiased;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
}

.chart .chart__grid .chart__pillar .chart__approach .chart__approach__name dialog[open] {
  position: fixed;
  top: 0;
  left: 0;
  height: 100vh;
  height: 100dvh;
  width: 100vw;
  display: flex;
  flex-direction: column;
  justify-content: center;
  outline: none;
}

@media only screen and (min-width: 1024px) {
  .chart .chart__grid .chart__pillar .chart__approach .chart__approach__name dialog p.dialog-close {
    display: none;
  }
  .chart .chart__grid .chart__pillar .chart__approach .chart__approach__name dialog[open] {
    position: absolute; 
    height: min-content;
    width: unset;
    display: none;
    flex-direction: unset;
    justify-content: unset;
  }
  .chart .chart__grid .chart__pillar .chart__approach .chart__approach__name dialog {
    animation: vanish 0.3s;
    background-color: transparent;
    -webkit-backdrop-filter: blur(50px);
    backdrop-filter: blur(50px);
    position: absolute;
    left: 70%;
    top: -30px;
    padding: 24px;
    min-width: 378px;
    max-width: 378px;
    height: min-content;
    z-index: 2;
    box-shadow: 8px 16px 24px 0px #000000B2;
    border-radius: 8px;
    display: none;
  }
  
  .chart .chart__grid .chart__pillar .chart__approach .chart__approach__name dialog::after {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 0;
    padding: 1px;
    border-radius: 8px;
    background: linear-gradient(to right, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0.15));
    mask: 
     linear-gradient(#000 0 0) exclude, 
     linear-gradient(#000 0 0) content-box;
  }
  
  .chart .chart__grid .chart__pillar .chart__approach .chart__approach__name dialog h6 {
    font-size: 18px;
    line-height: 20.7px;
    margin-bottom: 8px;
  }
  
  .chart .chart__grid .chart__pillar .chart__approach .chart__approach__name dialog p {
    font-size: 18px;
    line-height: 25.2px;
    letter-spacing: -0.02em;
  }
}

@media only screen and (min-width: 1024px) {
  .chart .chart__grid .chart__pillar .chart__approach .chart__approach__name h5:hover + dialog {
    display: block !important;
    animation: appear 0.3s;
  }
  .chart .chart__grid .chart__pillar .chart__approach .chart__approach__name dialog:hover {
    display: block !important;
    animation: appear 0.3s;
  }
}

@media only screen and (min-width: 1024px) {
  .chart .chart__grid .chart__pillar .chart__approach .chart__approach__name h5 {
    font-size: 12px;
    line-height: 20px;
    font-weight: 700;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
  }
}

.chart .chart__grid .chart__pillar .chart__approach .chart__approach__progress {
  grid-column: 1 / -1;
}

@media only screen and (min-width: 1024px) {
  .chart .chart__grid .chart__pillar .chart__approach .chart__approach__progress {
    grid-column: 2 / -1;
  } 
}


@media only screen and (min-width: 1024px) {
  .chart.chart--plain .chart__grid .chart__pillar .chart__approach .chart__approach__progress {
    grid-column: 1 / -1;
  } 
}

.chart .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li em,
.chart .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li i {
  font-family: "Balto Bold Italic", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

.chart .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li:not(:last-child) {
  margin-bottom: 16px;
}

@media only screen and (min-width: 1024px) {
  .chart .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li:not(:last-child) {
    margin-bottom: 6px;
  } 
}

@media only screen and (min-width: 1024px) {
  .chart .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li {
    border-radius: 100px;
    position: relative;
    height: 22px;
    overflow: hidden;
    display: flex;
    background: #00000040;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
  }
}

@media only screen and (min-width: 1024px) {
  .chart.chart--plain .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li {
    height: 44px;
    margin-bottom: 0;
  }
}

@media only screen and (min-width: 1024px) {
  .chart.chart--plain .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li {
    height: 44px;
    margin-bottom: 0;
  }
}

@media only screen and (min-width: 1024px) {
  .chart .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li:hover {
    background: rgba(104, 104, 104, 0.2);
    -webkit-box-shadow:inset 0px 0px 0px 1px rgba(104, 104, 104, 0.2);
    -moz-box-shadow:inset 0px 0px 0px 1px rgba(104, 104, 104, 0.2);
    box-shadow:inset 0px 0px 0px 1px rgba(104, 104, 104, 0.2);
  }
}

.chart .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li p.chart__phase__mobile {
  text-transform: uppercase;
  font-family: "Balto Bold", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  font-weight: 700;
  font-size: 14px;
  line-height: 16.94px;
  color: rgba(255, 255, 255, 0.5);
  margin-bottom: 4px;
}

@media only screen and (min-width: 1024px) {
  .chart .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li p.chart__phase__mobile {
    display: none;
  }
}



.chart .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li a {
  display: inline-block;
  font-size: 14px;
  line-height: 16.94px;
  font-family: "Balto Bold", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  margin-bottom: 1px;
  -webkit-font-smoothing: antialiased;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
}

@media only screen and (min-width: 1024px) {
  .chart .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li a {
    display: block;
    width: 100%;
    position: relative;
    top: 0;
    left: 0;
    z-index: 1;
    font-size: 12px;
    line-height: 11px;
    padding-left: 9px;
    margin-bottom: 0;
  }
}

.chart .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li a span {
  transition: all 0.2s ease-in-out;
  text-transform: uppercase;
  line-height: 22px;
}

@media only screen and (min-width: 1024px) {
  .chart .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li a span {
    position: absolute;
  }
}

.chart .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li a span:first-child {
  display: none;
}

@media only screen and (min-width: 1024px) {
  .chart .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li a span:first-child {
    display: block;
    top: -100%;
  } 
}

.chart .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li a span:last-child {
  position: relative;
  padding-right: 24px;
}

@media only screen and (min-width: 1024px) {
  .chart .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li a span:last-child {
    top: 0;
    position: absolute;
    padding-right: 0;
  }
}

@media only screen and (min-width: 1024px) {
  .chart .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li a span:first-child::after {
    content: "";
    width: 16px;
    height: 16px;
    background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzE1MzJfMzQ2MikiPgo8ZyBjbGlwLXBhdGg9InVybCgjY2xpcDFfMTUzMl8zNDYyKSI+CjxwYXRoIGQ9Ik0xMC42Njg5IDYuMjc2TDQuOTMwOTUgMTIuMDE0TDMuOTg4MjggMTEuMDcxM0w5LjcyNTYxIDUuMzMzMzNINC42Njg5NVY0SDEyLjAwMjNWMTEuMzMzM0gxMC42Njg5VjYuMjc2WiIgZmlsbD0id2hpdGUiIHN0eWxlPSJmaWxsOndoaXRlO2ZpbGwtb3BhY2l0eToxOyIvPgo8L2c+CjwvZz4KPGRlZnM+CjxjbGlwUGF0aCBpZD0iY2xpcDBfMTUzMl8zNDYyIj4KPHJlY3Qgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2IiBmaWxsPSJ3aGl0ZSIgc3R5bGU9ImZpbGw6d2hpdGU7ZmlsbC1vcGFjaXR5OjE7Ii8+CjwvY2xpcFBhdGg+CjxjbGlwUGF0aCBpZD0iY2xpcDFfMTUzMl8zNDYyIj4KPHJlY3Qgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2IiBmaWxsPSJ3aGl0ZSIgc3R5bGU9ImZpbGw6d2hpdGU7ZmlsbC1vcGFjaXR5OjE7Ii8+CjwvY2xpcFBhdGg+CjwvZGVmcz4KPC9zdmc+Cg==');
    display: inline-block;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
  }
}

.chart .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li a span:last-child::after {
  content: "";
  width: 16px;
  height: 16px;
  background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzE1MzJfMzQ2MikiPgo8ZyBjbGlwLXBhdGg9InVybCgjY2xpcDFfMTUzMl8zNDYyKSI+CjxwYXRoIGQ9Ik0xMC42Njg5IDYuMjc2TDQuOTMwOTUgMTIuMDE0TDMuOTg4MjggMTEuMDcxM0w5LjcyNTYxIDUuMzMzMzNINC42Njg5NVY0SDEyLjAwMjNWMTEuMzMzM0gxMC42Njg5VjYuMjc2WiIgZmlsbD0id2hpdGUiIHN0eWxlPSJmaWxsOndoaXRlO2ZpbGwtb3BhY2l0eToxOyIvPgo8L2c+CjwvZz4KPGRlZnM+CjxjbGlwUGF0aCBpZD0iY2xpcDBfMTUzMl8zNDYyIj4KPHJlY3Qgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2IiBmaWxsPSJ3aGl0ZSIgc3R5bGU9ImZpbGw6d2hpdGU7ZmlsbC1vcGFjaXR5OjE7Ii8+CjwvY2xpcFBhdGg+CjxjbGlwUGF0aCBpZD0iY2xpcDFfMTUzMl8zNDYyIj4KPHJlY3Qgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2IiBmaWxsPSJ3aGl0ZSIgc3R5bGU9ImZpbGw6d2hpdGU7ZmlsbC1vcGFjaXR5OjE7Ii8+CjwvY2xpcFBhdGg+CjwvZGVmcz4KPC9zdmc+Cg==');
  display: inline-block;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 0px;
}

@media only screen and (min-width: 1024px) {
  .chart .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li a span:last-child::after {
    display: none;
  }
}

.chart .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li a:hover {
  opacity: unset;
}

.chart .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li a:hover span:first-child {
  top: 0;
}
.chart .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li a:hover span:last-child {
  top: 100%;
}

.chart .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li .chart__progress-mobile {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 4px;
}

.chart .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li .chart__progress-mobile span {
  font-size: 0;
  display: block;
  height: 12px;
  border-radius: 100px;
  background-color: #000000;
  position: relative;
  overflow: hidden;
}

.chart.chart--plain .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li .chart__progress-mobile span {
  background-color: #191919;
}

.chart.chart--plain .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li .chart__progress-mobile span {
  background-color: #191919; 
}

.chart .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li .chart__progress-mobile span::before {
  content: "";
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-color: var(--progress-1);
  border-radius: 100px;
}

.chart .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li .chart__progress-mobile span:nth-child(1)::before {
  width: min(100%, calc(100% * (var(--research-progress) / 16.67)));
  background-color: var(--progress-1);
}
.chart .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li .chart__progress-mobile span:nth-child(2)::before {
  width: min(100%, calc(100% * ((var(--research-progress) - 16.67) / 16.67)));
  background-color: var(--progress-1);
}
.chart .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li .chart__progress-mobile span:nth-child(3)::before {
  width: min(100%, calc(100% * ((var(--research-progress) - 33.34) / 16.67)));
  background-color: var(--progress-2);
}
.chart .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li .chart__progress-mobile span:nth-child(4)::before {
  width: min(100%, calc(100% * ((var(--research-progress) - 50.01) / 16.67)));
  background-color: var(--progress-2);
}
.chart .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li .chart__progress-mobile span:nth-child(5)::before {
  width: min(100%, calc(100% * ((var(--research-progress) - 66.68) / 16.67)));
  background-color: var(--progress-2);
}
.chart .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li .chart__progress-mobile span:nth-child(6)::before {
  width: min(100%, calc(100% * ((var(--research-progress) - 83.35) / 16.67)));
  background-color: var(--progress-3);
}

.chart .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li .chart__progress-mobile span:nth-child(6){
  position: relative;
}
.chart .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li .chart__progress-mobile span:nth-child(6)::after {
  content: "";
  width: 12px;
  height: 12px;
  background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTMiIGhlaWdodD0iMTIiIHZpZXdCb3g9IjAgMCAxMyAxMiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEwLjc1IDNMNS4yNSA4LjVMMi43NSA2IiBzdHJva2U9IndoaXRlIiBzdHlsZT0ic3Ryb2tlOndoaXRlO3N0cm9rZS1vcGFjaXR5OjE7IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==');
  display: inline-block;
  position: absolute;
  top: 50%;
  right: 50%;
  transform: translate(50%, -50%);
  opacity: 0.4;
}

@media only screen and (min-width: 1024px) {
  .chart .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li .chart__progress-mobile span:nth-child(6)::after {
    display: none;
  }
}

.chart .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li .chart__progress-mobile span.active:nth-child(6)::after {
  opacity: 1;
}

@media only screen and (min-width: 1024px) {
  .chart .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li .chart__progress-mobile {
    display: none;
  }
}

.chart .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li .chart__progress-bar {
  display: none;
}

@media only screen and (min-width: 1024px) {
  .chart .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li .chart__progress-bar {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
    display: block;
  }
}


@media only screen and (min-width: 1024px) {
  .chart.chart--plain .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li .chart__progress-bar {
    background-color: #FFFFFF1A;
  }
}

.chart .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li .chart__progress-bar .chart__current {
  width: calc(var(--research-progress) * 1%);
  height: 100%;
  overflow: hidden;
  border-radius: 100px;
  clip-path: border-box;
}

.chart .chart__grid .chart__pillar .chart__approach .chart__approach__progress ul li .chart__progress-bar .chart__current .chart__total {
  position: absolute;
  top: 0;
  left: 0;
  background: linear-gradient(90deg, var(--progress-1) 0%, var(--progress-1) 33.14%, white calc(33.14% + 1px), white calc(33.14% + 2px), var(--progress-2) calc(33.14% + 2px), var(--progress-2) 83.16%, white calc(83.14% + 1px), white calc(83.14% + 2px), var(--progress-3) calc(83.14% + 2px), var(--progress-3) 100%);
  width: 100%;
  height: 100%;
}

@keyframes vanish {
  from {
    display: block;
    opacity: 1;
  }
  to {
    display: none;
    opacity: 0;
  }
}

@keyframes appear {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

* {
  -webkit-font-smoothing: antialiased;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
}

dialog.disclaimer {
  margin: 0;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  position: fixed;
  padding: 36.5px 24px 43.5px;
  background-color: transparent;
  z-index: 99;
  color: white;
  width: 100vw;
  overflow: auto;
  max-width: unset;
}

@media only screen and (min-width: 768px) {
  dialog.disclaimer {
    min-height: auto;
    width: 80vw;
    padding: 24px;
    border-radius: 8px;
    -webkit-backdrop-filter: blur(90px);
    backdrop-filter: blur(90px);
    max-width: 662px;
    box-shadow: 8px 16px 24px 0px #000000B2;
  }
}

@media only screen and (min-width: 768px) {
  dialog.disclaimer::after {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 0;
    padding: 1px;
    border-radius: 8px;
    background: linear-gradient(125.5deg, rgba(255, 255, 255, 0.6) 2.88%, rgba(255, 255, 255, 0.15) 52.45%);
    mask: 
     linear-gradient(#000 0 0) exclude, 
     linear-gradient(#000 0 0) content-box;
  }
}

.disclaimer h2 {
  font-weight: 700;
  font-size: 18px;
  line-height: 20.7px;
  letter-spacing: -0.02em;
  font-family: "Balto Bold", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  margin-bottom: 8px;
}

@media only screen and (min-width: 768px) {
  .disclaimer h2 {
    margin-bottom: 4px;
    line-height: 25.2px;
  }
}

.disclaimer article {
  margin-bottom: 24px;
}

.disclaimer article p {
  font-size: 16px;
  line-height: 22.4px;
  font-family: "Publico",Georgia,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;
  color: rgba(255, 255, 255, 0.9);
}

@media only screen and (min-width: 768px) {
  .disclaimer article p {
    font-size: 18px;
    line-height: 25.2px;
    letter-spacing: -0.02em;
  }
}

.disclaimer button {
  padding: 13px 40px;
  border-radius: 100px;
  border: 1px solid white;
  font-size: 16px;
  line-height: 18.4px;
  font-weight: 700;
  font-family: "Balto Bold", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  transition: all 0.2s ease-in-out;
}

.disclaimer button:focus {
  outline: none;
}

.disclaimer button:hover {
  background-color: white;
  color: black;
}

.disclaimer::backdrop {
  -webkit-backdrop-filter: blur(50px);
  backdrop-filter: blur(50px);
}

@media only screen and (min-width: 768px) {
  .disclaimer::backdrop {
    -webkit-backdrop-filter: blur(40px);
    backdrop-filter: blur(40px);
  }
}

.disclaimer input {
  display: none;
}

.disclaimer input:checked + label::before {
  border-color: transparent;
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='25' viewBox='0 0 24 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='24' height='24' transform='translate(0 0.5)' fill='white' style='fill:white;fill-opacity:1;'/%3E%3Cg clip-path='url(/%23clip0_1494_5031)'%3E%3Cpath d='M10.4996 14.879L17.3936 7.98425L18.4548 9.04475L10.4996 17L5.72656 12.227L6.78706 11.1665L10.4996 14.879Z' fill='black' style='fill:black;fill-opacity:1;'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_1494_5031'%3E%3Crect width='18' height='18' fill='white' style='fill:white;fill-opacity:1;' transform='translate(3 3.5)'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
}

.disclaimer label {
  text-transform: uppercase;
  font-family: "Balto Bold", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  font-size: 14px;
  line-height: 16px;
  font-weight: 700;
  display: flex;
  align-items: center;
  gap: 16px;
}

.disclaimer label::before {
  content: "";
  -webkit-appearance: none;
  border: 1px solid white;
  display: inline-block;
  width: 24px;
  height: 24px;
  background-size: cover;
  background-repeat: no-repeat;
}

body.no-scroll {
  overflow: hidden;
}
/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS (and SCSS, if configured) file within this directory, lib/assets/stylesheets, or any plugin's
 * vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *


 */

.font-baltoBold i, .font-baltoBold em {
  font-family: "Balto Bold Italic", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
.font-baltoBold .font-publico i, .font-baltoBold .font-publico em {
  font-family: "Publico Italic", Georgia,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;
}
.font-publico .font-baltoBold i, .font-publico .font-baltoBold em {
  font-family: "Balto Bold Italic", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
.font-publico i, .font-publico em {
  font-family: "Publico Italic", Georgia,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;
}
.font-publico strong {
  font-family: "Publico Bold", Georgia,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;
}
.font-publico strong em, .font-publico strong i {
  font-family: "Publico Bold Italic", Georgia,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;
}
.font-publico h1, 
.font-publico h2,
.font-publico h3, 
.font-publico h4, 
.font-publico h5, 
.font-publico h6 {
  font-weight: 700;
}
.font-publico h1 {
  font-size: 64px;
}
.font-publico h2 {
  font-size: 52px;
}
.font-publico h3 {
  font-size: 48px;
}
.font-publico h4 {
  font-size: 36px;
}
.font-publico h5 {
  font-size: 32px;
}
.font-publico h6 {
  font-size: 28px;
}

.font-publico ul, .font-publico ol {
  padding-left: 20px;
}
.font-publico ul {
  list-style: disc;
}
.font-publico ol {
  list-style: decimal;
}