.pf-colour-cards:is([data-layout=grid]){display:grid;gap:var(--cc--grid--gap);grid-template-columns:repeat(var(--cc--grid--columns--mobile,1),1fr);grid-template-rows:auto;--cc--grid--gap:var(--space--xsmall)}@media screen and (min-width:768px) and (max-width:991px){.pf-colour-cards:is([data-layout=grid]){grid-template-columns:repeat(calc(var(--cc--grid--columns--desktop, 3) - 1),1fr)}}@media screen and (min-width:992px){.pf-colour-cards:is([data-layout=grid]){grid-template-columns:repeat(var(--cc--grid--columns--desktop,3),1fr)}}.pf-colour-cards:is([data-layout=scroller]) .swiper{overflow:visible}.pf-colour-cards .pf-colour-card{align-items:flex-start;backface-visibility:hidden;border-radius:var(--radius--large);display:flex;overflow:hidden;position:relative;--cc--ratio--width:5;--cc--ratio--height:7;--cc--ratio:var(--cc--ratio--width)/var(--cc--ratio--height)}.pf-colour-cards .pf-colour-card:before{content:" ";float:left;padding-bottom:calc(100%/(var(--cc--ratio--width))*var(--cc--ratio--height))}.pf-colour-cards .pf-colour-card:after{clear:both;content:" ";display:table}.pf-colour-cards .pf-colour-card .colour-card__content{display:flex;flex-flow:column nowrap;gap:var(--space--xxsmall);height:stretch;padding:var(--cc--padding--vertical) var(--cc--padding--horizontal);position:relative;width:100%}.pf-colour-cards .pf-colour-card .colour-card__content>*{margin:0}.pf-colour-cards .pf-colour-card .colour-card__content .colour-card__text{display:flex;flex:1 1 auto;flex-flow:column nowrap;gap:var(--space--xxsmall);justify-content:var(--cc--text--justify,flex-start)}.pf-colour-cards .pf-colour-card .colour-card__content .colour-card__text>*{margin:0}.pf-colour-cards .pf-colour-card .colour-card__content .colour-card__heading>*{font-weight:var(--weight--bold);margin:0}.pf-colour-cards .pf-colour-card .colour-card__content .colour-card__summary{max-width:720px}.pf-colour-cards .pf-colour-card .colour-card__content .colour-card__summary>:is(:first-child){margin-top:0}.pf-colour-cards .pf-colour-card .colour-card__content .colour-card__summary>:is(:last-child){margin-bottom:0}.pf-colour-cards .pf-colour-card .colour-card__content .colour-card__button{margin-top:auto}.pf-colour-cards__controls{align-items:center;display:flex;gap:var(--space--xxsmall);justify-content:center;padding:var(--space--small)}.pf-colour-cards__controls button .material-icons{font-size:calc(var(--button--font-size)*2.5)}