@import url("https://jsypctdhynsdqrfifvdh.supabase.co/storage/v1/object/public/cp-blog-css/global.css");

:root {
  /* Fonts */
  --font-header: "Items Condensed", serif;
  --font-body: "Basel", sans-serif;

  --blog-color-white: #fff;
  --blog-color-black: #1c1915;
  --blog-color-1: #1c1915;
  --blog-color-2: #e6e6e6;
  --blog-color-3: #e5ce9a;
  --blog-color-4: #967c43;

  /* Colors */
  --a-tag-color: var(--blog-color-4);
  --a-tag-hover-color: var(--blog-color-3);

  --blog-header-color: var(--blog-color-black);
  --blog-wrapper-bg: transparent;


  /* Box Shadows */
  --box-shadow-light: none;
  --box-shadow-medium: none;
  --box-shadow-callout: none;

  /* Border Radius */
  --border-radius-standard: 0;
  --border-radius-button: 0;

  --lead-section-bg: var(--blog-color-white);
  --lead-section-font-color: var(--blog-color-black);

  --summary-bg-color: var(--blog-color-3);
  --summary-border-color: none;
  --summary-heading-color: var(--blog-color-black);
  --summary-text-color: var(--blog-color-black);

  --callout-left-bg-color: var(--blog-color-2);
  --callout-left-after-color: none;
  --callout-left-text-color: var(--blog-color-black);
  --callout-left-cta-bg-color: var(--blog-color-3);
  --callout-left-cta-text-color: var(--blog-color-black);
  --callout-left-cta-hover-bg-color: var(--blog-color-2);
  --callout-left-cta-hover-text-color: var(--blog-color-black);
  --callout-right-bg-color: var(--blog-color-2);
  --callout-right-after-color: none;
  --callout-right-text-color: var(--blog-color-black);
  --callout-right-cta-bg-color: var(--blog-color-3);
  --callout-right-cta-text-color: var(--blog-color-black);

  --callout-right-cta-hover-bg-color: var(--blog-color-4);
  --callout-right-cta-hover-text-color: var(--blog-color-black);
  --border-width-accent: 0;


  --quote-bg-color: #D1CA8A;
  --quote-text-color: var(--blog-color-2);
  --quote-border-color: var(--blog-color-2);
  --key-takeaways-bg-color: var(--blog-color-2);
  --key-takeaways-border-color: #e7e8f0;
  --key-takeaways-text-color: #000;
  --key-takeaways-heading-color: var(--blog-color-2);
  --key-takeaways-cta-bg-color: #1c1915;
  --key-takeaways-cta-text-color: var(--blog-color-white);
  --key-takeaways-cta-hover-bg-color: var(--blog-color-white);
  --key-takeaways-cta-hover-text-color: #1c1915;
  --references-bg-color: var(--blog-color-2);
  --references-border-color: var(--blog-color-black);
  --references-text-color: var(--blog-color-black);
  --references-heading-color: var(--blog-color-black);
  --references-link-color: var(--blog-color-4);
  --references-divider-color: var(--blog-color-black);
  --references-divider-width: 2px;
  --about-company-bg-color: var(--blog-color-3);
  --about-company-heading-color: #000;
  --about-company-text-color: #000;
  --about-company-icon-color: #000;
  --toc-bg-color: var(--blog-color-2);
  --toc-heading-color: var(--blog-color-black);
  --toc-text-color: var(--blog-color-black);
  --toc-link-color: var(--blog-color-black);
  --toc-border-color: var(--blog-color-black);
  --toc-active-bg-color: var(--blog-color-3);
  --toc-active-text-color: var(--blog-color-black);
  --toc-active-divider-color: var(--blog-color-black);


}


.blog-content .callout_left_cta_button,
.blog-content .callout_right_cta_button,
.key_takeaways_cta_button {
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: .77px;
  line-height: 1.12;
  font-family: Roboto Condensed Bold, Trebuchet MS, sans-serif;
}

.blog-content #key-takeaways ul {
  margin-top: 1rem;
}

.blog-content #key-takeaways ul li,
.blog-content #key-takeaways ol li {
  position: relative;
  padding-left: 40px;
  margin-bottom: 12px;
  list-style-type: none;
}

.blog-content #key-takeaways ul li:before,
.blog-content #key-takeaways ol li:before {
  content: '';
  position: absolute;
  top: 0px;
  left: 0;
  z-index: 1;
  width: 32px;
  height: 32px;
  background-image: url('data:image/svg+xml, <svg viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" fill="currentColor" clip-rule="evenodd" d="M12.854 4.854L6.5 11.207 3.146 7.854l.708-.708L6.5 9.793l5.646-5.647.707.708z"></path></svg>');
  background-repeat: no-repeat;
  background-color: rgb(230, 206, 154);
  border-radius: 9999px;
  background-position: center;
}

#key-takeaways strong {
  font-size: 18px;
  font-weight: bold;
}