/*!********************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./frontend/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./frontend/node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].use[2]!./frontend/node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[1].use[3]!./web/app/themes/codekrakers/components/cards/card-custom/src/card-custom.scss ***!
  \********************************************************************************************************************************************************************************************************************************************************************************************************************************/
.twz-card--custom {
  --card-cut: 3rem;
  --card-cut-inline: 3.05rem;
  --card-bg: var(--white, #faf7f2);
  --card-title-color: var(--grey-900, #151312);
  --card-text-color: var(--grey-700, #1d1b19);
  --card-image-height: 27rem;
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  overflow: clip;
  background-color: var(--card-bg);
  color: var(--card-text-color);
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - var(--card-cut)), calc(100% - var(--card-cut-inline)) 100%, 0 100%);
  container-type: inline-size;
  container-name: twz_card_custom;
}
.twz-card--custom:not(.twz-card--custom-has-image)::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background: url("../src/card-surface.svg") center/100% 100% no-repeat;
  scale: 1 -1;
  pointer-events: none;
}
.twz-card--custom .twz-card__media {
  width: 100%;
  block-size: var(--card-image-height);
  overflow: clip;
  flex-shrink: 0;
}
.twz-card--custom .twz-card__image {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.twz-card--custom .twz-card__media,
.twz-card--custom .twz-card__body {
  position: relative;
  z-index: 1;
}
.twz-card--custom .twz-card__body {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  padding: 1.8rem 3.1rem 1.8rem 2.2rem;
}
.twz-card--custom .twz-card__info {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  width: 100%;
}
.twz-card--custom .twz-card__info > :where(h1, h2, h3, h4, h5, h6) {
  margin: 0;
  color: var(--card-title-color);
}
.twz-card--custom .twz-card__info > :where(p) {
  margin: 0;
  color: var(--card-text-color);
}
.twz-card--custom .twz-card__info > :where(p):empty,
.twz-card--custom .twz-card__info > :where(p):has(> br:only-child) {
  display: none;
}
.twz-card--custom .twz-card__corner {
  position: absolute;
  z-index: 2;
  inset-block-end: -0.1rem;
  inset-inline-end: -0.1rem;
  width: 3.0502rem;
  height: 3rem;
  pointer-events: none;
}
.twz-card--custom .twz-card__corner img {
  display: block;
  width: 3.0502rem;
  height: 3rem;
}