@layer webflow-base {
  @font-face {
    font-family: 'ClashDisplay Variable';
    src: url(/brand-fonts/vilo/fonts/ClashDisplay-Variable.ttf) format('truetype');
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
  }
  @font-face {
    font-family: 'Archivo VariableFont';
    src: url(/brand-fonts/vilo/fonts/Archivo-VariableFont.ttf) format('truetype');
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
  }

  :root {
    --about-believe-num-bg: var(--colors--accent--accent);
    --about-believe-num-fg: var(--colors--neutral--800);
    --about-hero-bg: var(--colors--accent--accent-lighter);
    --about-hero-headline-fg: var(--colors--accent--accent-darkest);
    --about-hero-tagline-fg: var(--colors--accent--accent-darkest);
    --about-steps-img-border-color: var(--colors--neutral--300);
    --btn-fg: var(--colors--neutral--white);
    --colors--accent--accent: #e5d6ff;
    --colors--accent--accent-darker: #c8aafb;
    --colors--accent--accent-darkest: #4220b0;
    --colors--accent--accent-lighter: #ece1ff;
    --colors--neutral--100: #fff7f4;
    --colors--neutral--200: #f4e9e5;
    --colors--neutral--300: #ebdcd6;
    --colors--neutral--600: #6b5d56;
    --colors--neutral--800: #0a0a0a;
    --colors--neutral--900: #0a0a0a;
    --colors--neutral--white: #ffffff;
    --colors--primary--primary: #c21111;
    --colors--primary--primary-darker: #8d5ede;
    --faq-dropdown-bg: var(--colors--neutral--100);
    --faq-question-fg: var(--colors--neutral--800);
    --fonts--general-sans: "ClashDisplay Variable", "Archivo VariableFont", Arial, sans-serif;
    --fonts--switzer: "Archivo VariableFont", Arial, sans-serif;
    --footer-bg: var(--colors--neutral--100);
    --footer-link-color: var(--colors--neutral--800);
    --footer-link-hover-color: var(--colors--neutral--600);
    --footer-soc-link-bg: var(--colors--neutral--white);
    --footer-soc-link-fg: var(--colors--neutral--800);
    --footer-soc-link-hover-bg: var(--colors--neutral--800);
    --footer-soc-link-hover-fg: var(--colors--neutral--white);
    --heading-h7-font: var(--font-display);
    --home-benefits-item-bg: #ece1ff;
    --home-benefits-item-bg-2: #c8f5e6;
    --home-benefits-item-bg-3: #fdecd3;
    --home-hero-bg: var(--colors--neutral--100);
    --nav-drawer-bg: var(--colors--primary--primary);
    --nav-drawer-cta-bg: var(--colors--neutral--white);
    --nav-drawer-cta-fg: var(--colors--primary--primary);
    --nav-link-fg: var(--colors--neutral--600);
    --nav-link-hover-fg: var(--colors--neutral--800);
    --nav-link-w-current-border-b: var(--colors--accent--accent-darker);
    --nav-link-w-current-fg: var(--colors--neutral--800);
    --nav-link-weight: 600;
    --rich-link-border: 0;
    --rich-link-fg: var(--colors--neutral--800);
    --rich-link-hover-deco: underline;
    --rich-link-hover-fg: var(--colors--neutral--800);
    --rich-p-mb: 1rem;
    --terms-headline-fg: var(--colors--accent--accent-darkest);
    --terms-hero-top-wrapper-bg: var(--colors--accent--accent-lighter);
    --testimonials-arrow-btn-bg: var(--colors--primary--primary);
    --testimonials-arrow-btn-fg: var(--colors--neutral--white);
    --testimonials-arrow-btn-hover-bg: var(--colors--neutral--300);
    --testimonials-arrow-disabled-fg: #bdaba5;
    --text-semibold-21-fg: var(--colors--neutral--800);
    --text-strong: var(--colors--neutral--800);
    --title-24-fg: var(--colors--neutral--800);
    --title-50-fg: var(--colors--neutral--800);
    --title-50-font: var(--fonts--general-sans);
    --title-50-weight: 600;
    --title-60-fg: var(--colors--neutral--800);
    --title-60-font: var(--fonts--general-sans);
    --title-60-weight: 600;
  }

  @import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600;700&display=swap');

  :root {
    --colors--primary--primary: #996ce9;
  }

  /* Feature card slots are ~square but our app screenshots are tall phone mockups —
     contain instead of stretch; the pastel card bg shows through the letterbox. */
  img[class*="FeatureCardGrid_image"] {
    object-fit: contain;
  }
}