/*!**************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[3].use[3]!./src/components/paragraph/link-list/link-list.scss ***!
  \**************************************************************************************************************************************************************************************************************************************************************************/
.paragraph--link-list .paragraph__links {
  display: grid;
  gap: var(--grid-row-gap, 20px) var(--grid-column-gap, 40px);
  grid-template-columns: repeat(var(--grid-columns, 12), 1fr);
}

.paragraph--link-list a {
  background-image: linear-gradient(0deg, var(--animate-underline-gradient-color, currentColor) 0%, var(--animate-underline-gradient-color-2, var(--animate-underline-gradient-color, currentColor)) 100%);
  background-size: var(--underline-animate-background-size-width, 100%) var(--underline-animate-background-size-height, 2px);
  background-repeat: no-repeat;
  background-position: var(--animate-underline-background-position-x, left) bottom;
  transition: background-size 200ms ease-in-out;
}
.paragraph--link-list a:hover {
  --underline-animate-background-size-width: var(--underline-animate-background-size-width-hover, 0%);
}

.paragraph--link-list a {
  --cta-display: inline;
  --cta-text-decoration: none;
  --cta-color: #222;
  --cta-font-family: Mallory;
  --cta-font-weight: 700;
  --cta-text-transform: uppercase;
  --animate-underline-gradient-color: #63aaff;
  --animate-underline-background-position-x: right;
  --cta-font-size: 1rem;
}

.paragraph--link-list a {
  --a-display: var(--cta-display);
  --a-color: var(--cta-color);
  --a-text-decoration: var(--cta-text-decoration);
  --a-font-family: var(--cta-font-family);
  --a-font-weight: var(--cta-font-weight);
  --a-font-size: var(--cta-font-size);
  --a-text-transform: var(--cta-text-transform);
}

@media (max-width: 48em) {
  .layout .paragraph--link-list {
    width: 100%;
    max-width: calc(100vw - (2 * 20px));
    margin-left: auto;
    margin-right: auto;
  }
}

.paragraph--link-list a {
  --a-line-height: 1.2;
}
.paragraph--link-list .paragraph__links {
  --grid-columns: 1;
  justify-items: start;
  align-items: start;
}
@media (min-width: 48em) {
  .paragraph--link-list .paragraph__links {
    --grid-columns: var(--link-list-grid-columns);
  }
}