@layer components {
  .features {
    position: relative;
    isolation: isolate;
    block-size: 379.25cqi;
    margin-block-start: -9.75cqi;
    overflow: hidden;
    background-color: transparent;
    color: var(--color-text-primary);
    font-family: var(--font-hero);
  }

  .features::before {
    content: "";
    position: absolute;
    z-index: 0;
    inset-block-start: 9.5cqi;
    inset-inline-start: 0;
    inline-size: 100cqi;
    block-size: 369.75cqi;
    background-color: oklch(97.015% 0 0);
  }

  .features__label {
    position: absolute;
    z-index: 2;
    inset-block-start: 0;
    inset-inline-start: 7.5cqi;
    inline-size: 85cqi;
    block-size: 25.5cqi;
  }

  .features__label-bg {
    position: absolute;
    inset: 0;
    inline-size: 85cqi;
    block-size: 25.5cqi;
    max-inline-size: none;
  }

  .features__label-small,
  .features__label-title {
    position: absolute;
    z-index: 1;
    inset-inline-start: 0;
    inline-size: 100%;
    font-weight: 900;
    line-height: 1.4;
    text-align: center;
    white-space: nowrap;
  }

  .features__label-small {
    inset-block-start: 2.5cqi;
    color: oklch(100% 0 0);
    font-size: 5cqi;
    letter-spacing: 0.25cqi;
  }

  .features__label-title {
    inset-block-start: 9.5cqi;
    color: oklch(97.015% 0 0);
    font-size: 6.5cqi;
    letter-spacing: 0.325cqi;
  }

  .feature-card {
    position: absolute;
    z-index: 1;
    inset-inline-start: 3.75cqi;
    inline-size: 92.5cqi;
    overflow: hidden;
    border-radius: 1cqi;
    background-color: oklch(93.1% 0 0);
  }

  .feature-card::after {
    content: "";
    position: absolute;
    z-index: 4;
    inset: 0;
    border: 1cqi solid oklch(100% 0 0);
    border-radius: inherit;
    pointer-events: none;
  }

  .feature-card--one {
    inset-block-start: 31.25cqi;
    block-size: 83.5cqi;
  }

  .feature-card--two {
    inset-block-start: 116.75cqi;
    block-size: 45.5cqi;
  }

  .feature-card--three {
    inset-block-start: 164.25cqi;
    block-size: 50.5cqi;
  }

  .feature-card--four {
    inset-block-start: 216.75cqi;
    block-size: 93.5cqi;
  }

  .feature-card--five {
    inset-block-start: 312.25cqi;
    block-size: 55cqi;
  }

  .feature-card__media {
    position: absolute;
    inset-block-start: 0;
    inset-inline-start: 0;
    inline-size: 100%;
    overflow: hidden;
  }

  .feature-card__media--one {
    block-size: 46.5cqi;
  }

  .feature-card__media--one::after {
    content: "";
    position: absolute;
    inset-block-start: 0.52cqi;
    inset-inline-start: 0.29cqi;
    inline-size: 91.63cqi;
    block-size: 56.32cqi;
    background-color: oklch(69.553% 0.0555 251.22 / 0.9);
    mix-blend-mode: soft-light;
    pointer-events: none;
  }

  .feature-card__media--four {
    block-size: 54cqi;
  }

  .feature-card__photo {
    position: absolute;
    display: block;
    max-inline-size: none;
    object-fit: cover;
  }

  .feature-card__photo--one {
    inset-block-start: -1.5cqi;
    inset-inline-start: -0.5cqi;
    inline-size: 93.5cqi;
    block-size: 62.5cqi;
  }

  .feature-card__photo-slot {
    position: absolute;
    inset-block-start: 0;
    overflow: hidden;
    block-size: 54cqi;
  }

  .feature-card__photo-slot::after {
    content: "";
    position: absolute;
    pointer-events: none;
    mix-blend-mode: soft-light;
  }

  .feature-card__photo-slot--four-a {
    inset-inline-start: 0;
    inline-size: 30.75cqi;
  }

  .feature-card__photo-slot--four-a::after {
    inset-block-start: 0.58cqi;
    inset-inline-start: 0;
    inline-size: 34.25cqi;
    block-size: 65.32cqi;
    background-color: oklch(69.553% 0.0555 251.22 / 0.9);
  }

  .feature-card__photo-slot--four-b {
    inset-inline-start: 30.75cqi;
    inline-size: 30.75cqi;
  }

  .feature-card__photo-slot--four-b::after {
    inset-block-start: 0.58cqi;
    inset-inline-start: -3.5cqi;
    inline-size: 37.25cqi;
    block-size: 65.32cqi;
    background-color: oklch(45.568% 0.0571 251.78 / 0.9);
  }

  .feature-card__photo-slot--four-c {
    inset-inline-start: 61.5cqi;
    inline-size: 31cqi;
  }

  .feature-card__photo--four-a {
    inset-block-start: -1cqi;
    inset-inline-start: 0;
    inline-size: 30.75cqi;
    block-size: 55cqi;
  }

  .feature-card__photo--four-b {
    inset-block-start: 0;
    inset-inline-start: 0;
    inline-size: 30.75cqi;
    block-size: 55.25cqi;
  }

  .feature-card__photo--four-c {
    inset-block-start: 0;
    inset-inline-start: -3cqi;
    inline-size: 37cqi;
    block-size: 57.25cqi;
  }

  .feature-card__content {
    position: absolute;
    inset: 0;
  }

  .feature-card__number {
    position: absolute;
    color: oklch(69.007% 0.1367 49.09);
    font-size: 13.5cqi;
    font-weight: 900;
    line-height: 1;
    letter-spacing: -0.675cqi;
    text-shadow:
      0.6cqi 0 0 oklch(93.1% 0 0),
      -0.6cqi 0 0 oklch(93.1% 0 0),
      0 0.6cqi 0 oklch(93.1% 0 0),
      0 -0.6cqi 0 oklch(93.1% 0 0),
      0.6cqi 0.6cqi 0 oklch(93.1% 0 0),
      -0.6cqi 0.6cqi 0 oklch(93.1% 0 0),
      0.6cqi -0.6cqi 0 oklch(93.1% 0 0),
      -0.6cqi -0.6cqi 0 oklch(93.1% 0 0);
    white-space: nowrap;
  }

  .feature-card__title {
    position: absolute;
    color: oklch(69.007% 0.1367 49.09);
    font-size: 6cqi;
    font-weight: 900;
    line-height: 1.3;
    letter-spacing: 0.3cqi;
    text-shadow:
      0.6cqi 0 0 oklch(93.1% 0 0),
      -0.6cqi 0 0 oklch(93.1% 0 0),
      0 0.6cqi 0 oklch(93.1% 0 0),
      0 -0.6cqi 0 oklch(93.1% 0 0),
      0.6cqi 0.6cqi 0 oklch(93.1% 0 0),
      -0.6cqi 0.6cqi 0 oklch(93.1% 0 0),
      0.6cqi -0.6cqi 0 oklch(93.1% 0 0),
      -0.6cqi -0.6cqi 0 oklch(93.1% 0 0);
    white-space: nowrap;
  }

  .feature-card__title span {
    display: block;
  }

  .feature-card__rule {
    position: absolute;
    inset-inline-start: 6cqi;
    inline-size: 80.5cqi;
    block-size: 0.5cqi;
    background-color: oklch(100% 0 0);
  }

  .feature-card__text {
    position: absolute;
    inset-inline-start: 6cqi;
    inline-size: 80.5cqi;
    color: oklch(31.714% 0 0);
    font-size: 4cqi;
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: 0.2cqi;
    text-align: justify;
  }

  .feature-card--one .feature-card__number {
    inset-block-start: 36.5cqi;
    inset-inline-start: 6cqi;
    letter-spacing: 0;
  }

  .feature-card--one .feature-card__title {
    inset-block-start: 42.25cqi;
    inset-inline-start: 25.75cqi;
  }

  .feature-card--one .feature-card__rule {
    inset-block-start: 52cqi;
  }

  .feature-card--one .feature-card__text {
    inset-block-start: 55.5cqi;
  }

  .feature-card--two .feature-card__number {
    inset-block-start: 4cqi;
    inset-inline-start: 4.5cqi;
  }

  .feature-card--three .feature-card__number {
    inset-block-start: 3.25cqi;
    inset-inline-start: 4.5cqi;
  }

  .feature-card--two .feature-card__title {
    inset-block-start: 9.75cqi;
    inset-inline-start: 26cqi;
  }

  .feature-card--two .feature-card__rule {
    inset-block-start: 19.5cqi;
  }

  .feature-card--two .feature-card__text {
    inset-block-start: 23cqi;
  }

  .feature-card--three .feature-card__title {
    inset-block-start: 9cqi;
    inset-inline-start: 26.25cqi;
  }

  .feature-card--three .feature-card__rule {
    inset-block-start: 18.75cqi;
  }

  .feature-card--three .feature-card__text {
    inset-block-start: 22.25cqi;
  }

  .feature-card--four .feature-card__number {
    inset-block-start: 46.5cqi;
    inset-inline-start: 4.5cqi;
    letter-spacing: -0.27cqi;
  }

  .feature-card--four .feature-card__title {
    inset-block-start: 44.5cqi;
    inset-inline-start: 25.75cqi;
  }

  .feature-card--four .feature-card__title span:nth-child(2) {
    letter-spacing: -0.2cqi;
  }

  .feature-card--four .feature-card__rule {
    inset-block-start: 62cqi;
  }

  .feature-card--four .feature-card__text {
    inset-block-start: 65.5cqi;
  }

  .feature-card--five .feature-card__number {
    inset-block-start: 8cqi;
    inset-inline-start: 4.5cqi;
  }

  .feature-card--five .feature-card__title {
    inset-block-start: 6cqi;
    inset-inline-start: 26.25cqi;
  }

  .feature-card--five .feature-card__rule {
    inset-block-start: 23.5cqi;
  }

  .feature-card--five .feature-card__text {
    inset-block-start: 27cqi;
  }
}