/**
 SASS files that don't get compiled into CSS. Do not put element selectors in here.
 Every file not starting with '_' should import this file if you want to use functions and mixins.
 */
/**
 * SASS variables
 *
 These are only used in the properties and abstract SASS files.
 */
/**
 Breakpoints and columns
 */
/**
 Text
 */
/**
Fill in the header styles, only write the properties you want to override.
 */
/**
 Form
 */
/**
  Buttons
 */
/**
 Breakpoints

 @param {Keyword} $breakpoint - The breakpoint name of the minimum width. Can be any of the names in the $breakpoint variable
 */
/**
  Custom column size.
  Especially handy inside other columns.

  @param {Number|string} $size - the size in columns or 'expand'/'shrink'.
  @param {number} $total - the total size in columns. Ignored when size is 'expand'/'shrink'
 */
/**
  Custom offset size.
  Especially handy inside other columns.

  @param {Number|string} $size - the size of the offset.
  @param {number} $total - the total size in columns.
  @param {string} - the side from the offset.
 */
.paragraph--type--cards {
  --views-responsive-grid--column-count: 3;
  --views-responsive-grid--cell-min-width: 280px;
  --views-responsive-grid--layout-gap: 20px;
  --views-responsive-grid--gap-count: calc(var(--views-responsive-grid--column-count) - 1);
  --views-responsive-grid--total-gap-width: calc(var(--views-responsive-grid--gap-count) * var(--views-responsive-grid--layout-gap));
  --views-responsive-grid-item--max-width: calc((100% - var(--views-responsive-grid--total-gap-width)) / var(--views-responsive-grid--column-count));
  --views-responsive-grid-item--calculated-min-width: min(100%, var(--views-responsive-grid--cell-min-width));
}
.paragraph--type--cards h3 {
  margin-bottom: 24px;
}
@media (min-width: 1200px) {
  .paragraph--type--cards h3 {
    margin-bottom: 48px;
  }
}
.paragraph--type--cards .field--name-field-cards > .field__items {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(max(var(--views-responsive-grid-item--calculated-min-width), var(--views-responsive-grid-item--max-width)), 1fr));
  gap: var(--views-responsive-grid--layout-gap);
}
.paragraph--type--cards .paragraph--type--card {
  background-color: var(--accent2);
  border-radius: 50px;
  padding-bottom: 10px;
}
@media (min-width: 1200px) {
  .paragraph--type--cards .paragraph--type--card {
    padding-bottom: 20px;
  }
}
.paragraph--type--cards .paragraph--type--card img {
  border-radius: 50px;
}
.paragraph--type--cards .paragraph--type--card h4 {
  margin-top: 16px;
  margin-bottom: 10px;
  padding-left: 24px;
}
@media (min-width: 992px) {
  .paragraph--type--cards .paragraph--type--card h4 {
    padding-left: 32px;
  }
}
@media (min-width: 1200px) {
  .paragraph--type--cards .paragraph--type--card h4 {
    margin-top: 32px;
    margin-bottom: 20px;
  }
}
.paragraph--type--cards .paragraph--type--card .paragraph__actions {
  padding-left: 24px;
}
@media (min-width: 992px) {
  .paragraph--type--cards .paragraph--type--card .paragraph__actions {
    padding-left: 32px;
  }
}
