/*
  Theme Name: Funders Together Child Theme - Collaboration Circle
  Template: funders-together
  Author: Effusion
  Author URI: https://www.effusion.co.uk/
*/
:root {
  /*	Colours - Generics: Use these values in styling
  ***********************************  */
  --color__pageBackground: white;
  /*	Sizes
  ***********************************  */
  --colabcirc__borderRadius--medium: 20px;
  /*	Assets
  ***********************************  */
  --colabcirc__asset__pullQuote--color--red: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' xml:space='preserve' viewBox='0 0 37.1 27.6'%3E%3Cpath d='M7.6 27.6c-2.2 0-4.1-.7-5.5-2.2Q0 23.15 0 19.4C0 15.1 1.5 11.2 4.4 8s6.5-5.9 10.7-8l1 1.7c-1.7 1.1-3.3 2.5-4.7 4.1C9.9 7.5 8.8 9.4 8 11.3l2.9 2.1c1.2.7 2.1 1.7 2.9 3 .7 1.3 1.1 2.4 1.1 3.6 0 2.2-.7 4-2 5.4-1.4 1.5-3.2 2.2-5.3 2.2m21 0c-2.2 0-4.1-.7-5.5-2.2q-2.1-2.25-2.1-6c0-4.4 1.5-8.2 4.4-11.4 3-3.2 6.5-5.9 10.7-8l1 1.7c-1.7 1.1-3.3 2.5-4.7 4.1-1.5 1.7-2.6 3.5-3.4 5.5l2.9 2.1c1.2.7 2.1 1.7 2.9 3 .7 1.3 1.1 2.4 1.1 3.6 0 2.2-.7 4-2 5.4-1.4 1.5-3.2 2.2-5.3 2.2' style='fill:%23e83c62'/%3E%3C/svg%3E");
}

/*	Webfonts
		- if the project requires selfhosted webfonts,
		place @font-face rules here
*********************************** */
/* Set Initial grid values
   'fixed' means it is a fixed numerical value
*********************************** */
/*	Size variables
***********************************  */
/*	Transition variables
***********************************  */
/*	Selector variables
***********************************  */
/* Media Queries
*********************************** */
/*
  I am working with REMs for the whole site, except for the media queries which is not viable
  These media queries are better suited to mobile first.
*/
/*  SVG
*********************************** */
/*  PNG
*********************************** */
/*  Display mixins
*********************************** */
/*  Show/hide mixins
*********************************** */
/*  Type hierarchy size mixins
    - Do not use typeHierarchySizes to set type styles on text elements!
    The purpose of this is to use relative units on non-text elements
    (without applying the entire type style, which is unnecessary)
*********************************** */
/*  'Paragraph style' Mixins
    - These are actual type styles, apply these to text elements
*********************************** */
.pane__header .funders-together-link {
  display: inline-block !important;
}

@media only screen {
  .site-logo {
    width: clamp(10.9375rem, 17.5vw, 15.75rem);
    aspect-ratio: 1/0.15936255;
    background-image: url("./img/logo/logo_collaboration_circle.png");
  }
}

.ft-quicklinks a {
  display: inline-flex;
  align-items: center;
  gap: 0.6em;
  padding-top: 0.32em;
  padding-bottom: 0.32em;
  padding-left: 0.32em;
  padding-right: 1.2em;
  margin-bottom: 0.55em;
}
.ft-quicklinks a::before {
  flex-shrink: 0;
  content: " ";
  display: block;
  width: 2.278em;
  height: 2.278em;
  background: conic-gradient(var(--color__purple), #045879 0deg, var(--color__purple) 270deg);
  border-radius: 50%;
}

.flexible-row.text-section .explainer-accordion {
  border-radius: var(--colabcirc__borderRadius--medium);
}
.flexible-row.pull-quote {
  font-size: clamp(1.375rem, 3.2894736842vw, 1.875rem);
}
.flexible-row.pull-quote blockquote {
  padding-left: 1.4em;
  padding-right: 1.4em;
  padding-top: 1em;
  padding-bottom: 1.25em;
  border: 1px solid var(--color__borderDefault);
  border-radius: var(--colabcirc__borderRadius--medium);
}
.flexible-row.pull-quote blockquote::before {
  content: " ";
  display: block;
  width: 1.238em;
  height: 0.97em;
  background-image: var(--colabcirc__asset__pullQuote--color--red);
  background-repeat: no-repeat;
  background-size: contain;
  margin-bottom: 0.45em;
}

/*# sourceMappingURL=style.css.map */
