.feature-card {
  position: relative;
  min-height: 338px;
  padding: 28px 26px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.feature-card > span {
  color: var(--muted);
  font-size: 11px;
}

.feature-card h3 {
  max-width: 245px;
  margin-top: 110px;
  margin-bottom: 22px;
  font-size: 20px;
}

.feature-card p {
  margin-bottom: 0;
  color: #5f5f5f;
  font-size: 12px;
  line-height: 1.55;
}

.feature-card--blue {
  color: var(--white);
  background: var(--blue);
}

.feature-card--blue h3,
.feature-card--blue > span {
  color: var(--white);
}

.feature-card--blue p {
  color: rgba(255,255,255,.78);
}

.feature-card--booking .button {
  position: absolute;
  right: 24px;
  bottom: 24px;
  left: 24px;
  width: calc(100% - 48px);
  color: var(--blue);
  background: var(--white);
  border-color: var(--white);
}

.feature-card--visual {
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  overflow: hidden;
}

.feature-card--visual img {
  position: absolute;
  right: -10%;
  bottom: -10%;
  width: 72%;
  height: 76%;
  object-fit: contain;
}

@media (max-width: 767px) {
  .feature-card {
    min-height: 220px;
    padding: 22px 20px;
  }

  .feature-card h3 {
    margin-top: 56px;
    font-size: 18px;
  }
}

.feature-card--booking .button {
  --corner-color: #010f77;
  --corner-hover-color: #fff;
  --corner-inset: 10px;
}

@media (hover: hover) {
  .feature-card--booking .button:hover {
    --corner-color: #010f77;
    color: #010f77;
    background: #fff;
    border-color: #fff;
  }
}
.feature-card--booking .button:focus-visible {
  --corner-color: #010f77;
  color: #010f77;
  background: #fff;
  border-color: #fff;
}

.home-feature-grid .feature-card {
  min-height: 0;
  padding: 40px 30px 30px;
  border: 0;
  background: #fafafa;
  overflow: hidden;
}

.home-feature-grid .feature-card--professional {
  grid-column: 2;
  grid-row: 1;
}

.home-feature-grid .feature-card--technology {
  grid-column: 3;
  grid-row: 1;
}

.home-feature-grid .feature-card--personal {
  grid-column: 1;
  grid-row: 2;
}

.home-feature-grid .feature-card--family {
  grid-column: 2;
  grid-row: 2;
}

.home-feature-grid .feature-card--booking {
  grid-column: 3;
  grid-row: 2;
}

.home-feature-grid .feature-card__thumb {
  position: absolute;
  top: 0;
  right: 0;
  width: 90px;
  height: 90px;
  object-fit: cover;
}

.home-feature-grid .feature-card:not(.feature-card--booking)::after {
  position: absolute;
  z-index: 1;
  top: 0;
  right: 2px;
  width: 100px;
  height: 100px;
  background: linear-gradient(#fff, #fff) left top / 10px 100% no-repeat,
    linear-gradient(#fff, #fff) left bottom / 100% 10px no-repeat;
  content: "";
  pointer-events: none;
}

.home-feature-grid .feature-card h3 {
  max-width: 305px;
  margin: 0;
  color: #010f77;
  font-size: 20px;
  line-height: 1;
  letter-spacing: -.02em;
}

.home-feature-grid .feature-card--professional h3 {
  width: 258px;
}

.home-feature-grid .feature-card--technology h3 {
  width: 305px;
}

.home-feature-grid .feature-card--personal h3 {
  width: 272px;
}

.home-feature-grid .feature-card--family h3 {
  width: 185px;
}

.home-feature-grid .feature-card:not(.feature-card--booking)::before {
  position: absolute;
  right: 102px;
  top: 102px;
  width: 10px;
  height: 10px;
  border-bottom: 2px solid #c4c4c1;
  content: "";
}

.home-feature-grid .feature-card:not(.feature-card--booking)::before {
  border-right: 0;
  border-left: 2px solid #c4c4c1;
}

.home-feature-grid .feature-card p {
  position: absolute;
  right: 30px;
  bottom: 50px;
  left: 30px;
  margin: 0;
  color: #7c7c7c;
  font-size: 14px;
  line-height: 1;
}

.home-feature-grid .feature-card--booking {
  color: #fff;
  background: #010f77;
  border-color: #010f77;
}

.feature-card__star {
  display: grid;
  width: 66px;
  height: 66px;
  place-items: center;
  color: #010f77;
  background: #fff;
  font-size: 0;
}

.feature-card__star img {
  width: 36px;
  height: 36px;
}

.home-feature-grid .feature-card--booking h3 {
  position: absolute;
  top: 39px;
  left: 116px;
  color: #fff;
  font-size: 24px;
}

.home-feature-grid .feature-card--booking p {
  top: 126px;
  bottom: auto;
  color: #fff;
}

.home-feature-grid .feature-card--booking .button {
  position: absolute;
  right: 30px;
  bottom: 40px;
  left: 30px;
  width: auto;
  height: 60px;
  color: #303030;
  background: #fff;
  border-color: #fff;
  font-size: 16px;
}

@media (max-width: 1359px) and (min-width: 768px) {
  .home-feature-grid .feature-card {
    grid-column: auto;
    grid-row: auto;
  }

  .home-feature-grid .feature-card {
    padding: 30px 24px 24px;
  }

  .home-feature-grid .feature-card h3 {
    max-width: calc(100% - 80px);
  }

  .home-feature-grid .feature-card p {
    right: 24px;
    bottom: 24px;
    left: 24px;
  }

  .home-feature-grid .feature-card--booking {
    grid-column: 1 / -1;
  }

  .home-feature-grid .feature-card--booking p {
    top: 105px;
  }

  .home-feature-grid .feature-card--booking .button {
    right: 24px;
    bottom: 24px;
    left: auto;
    width: 310px;
  }

  @media (min-width: 1100px) {
    .home-feature-grid .feature-card--professional {
      grid-column: 2;
      grid-row: 1;
    }

    .home-feature-grid .feature-card--technology {
      grid-column: 3;
      grid-row: 1;
    }

    .home-feature-grid .feature-card--personal {
      grid-column: 1;
      grid-row: 2;
    }

    .home-feature-grid .feature-card--family {
      grid-column: 2;
      grid-row: 2;
    }

    .home-feature-grid .feature-card--booking {
      grid-column: 3;
      grid-row: 2;
    }

    .home-feature-grid .feature-card--booking .button {
      right: 24px;
      left: 24px;
      width: auto;
    }
  }
}

@media (max-width: 767px) {
  .home-feature-grid .feature-card {
    grid-column: 1;
    grid-row: auto;
  }

  .home-feature-grid .feature-card {
    padding: 20px;
  }

  .home-feature-grid .feature-card__thumb {
    width: 85px;
    height: 85px;
  }

  .home-feature-grid .feature-card:not(.feature-card--booking)::after {
    right: 0;
    width: 91px;
    height: 91px;
    background-position: left top, left bottom;
    background-size: 6px 85px, 91px 6px;
  }

  .home-feature-grid .feature-card h3 {
    width: 285px;
    max-width: calc(100% - 60px);
    font-size: 20px;
  }

  .home-feature-grid .feature-card:is(.feature-card--professional, .feature-card--personal) h3 {
    width: 251px;
  }

  .home-feature-grid .feature-card:is(.feature-card--technology, .feature-card--family) h3 {
    width: 278px;
  }

  .home-feature-grid .feature-card p {
    right: 20px;
    bottom: 20px;
    left: 20px;
    font-size: 14px;
  }

  .home-feature-grid .feature-card:not(.feature-card--booking)::before {
    top: 88px;
    right: 87px;
  }

  .home-feature-grid .feature-card:is(.feature-card--technology, .feature-card--family) p {
    width: 325px;
  }

  .home-feature-grid .feature-card--technology .feature-card__thumb {
    object-position: 81.6% 50%;
  }

  .home-feature-grid .feature-card--family .feature-card__thumb {
    object-fit: fill;
  }

  .feature-card__star {
    width: 66px;
    height: 66px;
  }

  .home-feature-grid .feature-card--booking h3 {
    top: 29px;
    left: 106px;
    width: 234px;
    font-size: 24px;
  }

  .home-feature-grid .feature-card--booking p {
    top: 125px;
  }

  .home-feature-grid .feature-card--booking .button {
    right: 20px;
    bottom: 20px;
    left: 20px;
    height: 60px;
  }
}

@media (max-width: 410px) {
  .home-feature-grid .feature-card h3 {
    max-width: calc(100% - 80px);
  }
}

@media (max-width: 340px) {
  .home-feature-grid .feature-card:is(.feature-card--technology, .feature-card--family) p {
    width: auto;
  }
}

@media (min-width: 768px) {
  .home-feature-grid .feature-card__thumb {
    right: 2px;
  }

  .home-feature-grid .feature-card--technology .feature-card__thumb {
    top: 0;
    right: -6.22px;
    width: 134.97px;
    height: 90px;
    object-fit: fill;
    clip-path: inset(0 8.22px 0 36.75px);
  }

  .home-feature-grid .feature-card--family .feature-card__thumb {
    object-fit: fill;
  }
}

@media (max-width: 767px) {
  .home-feature-grid .feature-card {
    min-height: 227px;
  }

  .home-feature-grid .feature-card--booking {
    min-height: 273px;
  }
}

@media (min-width: 1360px) {
  .home-feature-grid .feature-card__thumb {
    right: 2px;
  }

  .home-feature-grid .feature-card--booking .feature-card__star {
    position: absolute;
    top: 30px;
    left: 30px;
  }

  .home-feature-grid .feature-card--booking h3 {
    width: 234px;
    max-width: none;
  }

  .home-feature-grid .feature-card--technology .feature-card__thumb {
    top: 0;
    right: -6.22px;
    width: 134.97px;
    height: 90px;
    object-fit: fill;
    clip-path: inset(0 8.22px 0 36.75px);
  }

  .home-feature-grid .feature-card--family .feature-card__thumb {
    object-fit: fill;
  }
}

.home-feature-grid .feature-card:not(.feature-card--booking) {
  display: flex;
  flex-direction: column;
}

.home-feature-grid .feature-card:not(.feature-card--booking) > p {
  position: relative;
  inset: auto;
  width: auto;
  margin-top: auto;
}

.home-feature-grid .feature-card {
  grid-column: auto;
  grid-row: auto;
}

@media (max-width: 390px) {
  .home-feature-grid .feature-card:is(.feature-card--technology, .feature-card--family) p {
    width: auto;
    max-width: 100%;
  }

  .home-feature-grid .feature-card--booking h3 {
    right: 20px;
    width: auto;
    max-width: calc(100% - 126px);
  }
}

.service-feature-grid .feature-card {
  position: relative;
  padding: 30px;
  background: #fafafa;
  border: 0;
  overflow: hidden;
}

.service-feature-grid .feature-card picture {
  position: absolute;
  top: 0;
  right: 0;
  display: block;
  width: 90px;
  height: 90px;
  overflow: hidden;
}

.service-feature-grid .feature-card__thumb {
  position: absolute;
  inset: 0;
  width: 100%;
  max-width: none;
  height: 100%;
  object-fit: cover;
}

.service-feature-grid .feature-card--family .feature-card__thumb {
  object-fit: fill;
}

.service-feature-grid .feature-card::after {
  position: absolute;
  z-index: 1;
  top: 0;
  right: 2px;
  width: 100px;
  height: 100px;
  background: linear-gradient(#fff, #fff) left top / 10px 100% no-repeat,
    linear-gradient(#fff, #fff) left bottom / 100% 10px no-repeat;
  content: "";
  pointer-events: none;
}

.service-feature-grid .feature-card::before {
  position: absolute;
  z-index: 2;
  top: 102px;
  right: 102px;
  width: 10px;
  height: 10px;
  border-bottom: 2px solid #c4c4c1;
  border-left: 2px solid #c4c4c1;
  content: "";
}

.service-feature-grid .feature-card h3 {
  max-width: calc(100% - 70px);
  margin: 0;
  color: var(--blue);
  line-height: 1;
}

.service-feature-grid .feature-card p {
  right: 30px;
  bottom: 50px;
  left: 30px;
  width: auto;
  margin: 0;
  color: #7c7c7c;
  font-size: 14px;
  line-height: 1;
}

@media (min-width: 1360px) {
  .service-feature-grid .feature-card {
    min-height: 300px;
    padding: 40px 30px 30px;
    color: #303030;
    background: #fafafa;
    border: 0;
  }

  .service-feature-grid .feature-card h3 {
    width: 272px;
    max-width: calc(100% - 70px);
    margin: 0;
    font-size: 20px;
  }

  .service-feature-grid .feature-card--family h3 {
    width: 185px;
  }

  .service-feature-grid .feature-card--technology h3 {
    width: 305px;
  }

  .service-feature-grid .feature-card p {
    right: 30px;
    bottom: 50px;
    left: 30px;
    width: auto;
  }

  .service-feature-grid .feature-card picture {
    right: 2px;
  }
}

@media (max-width: 1359px) {
  .service-feature-grid .feature-card {
    min-height: 300px;
  }
}

@media (min-width: 768px) and (max-width: 1359px) {
  .service-feature-grid .feature-card {
    min-height: 250px;
    padding: 30px 24px 24px;
  }

  .service-feature-grid .feature-card h3 {
    max-width: calc(100% - 80px);
  }

  .service-feature-grid .feature-card--personal h3 {
    width: 272px;
  }

  .service-feature-grid .feature-card--family h3 {
    width: 185px;
  }

  .service-feature-grid .feature-card--technology h3 {
    width: 305px;
  }

  .service-feature-grid .feature-card p {
    right: 24px;
    bottom: 24px;
    left: 24px;
  }
}

@media (min-width: 768px) and (max-width: 991px) {
  .service-feature-grid .feature-card--technology {
    grid-column: 1 / -1;
  }
}

@media (max-width: 767px) {
  .service-feature-grid .feature-card {
    min-height: 227px;
    padding: 20px;
    background: #fafafa;
  }

  .service-feature-grid .feature-card picture {
    right: 0;
    width: 85px;
    height: 85px;
  }

  .service-feature-grid .feature-card::after {
    right: 0;
    width: 91px;
    height: 91px;
    background-position: left top, left bottom;
    background-size: 6px 85px, 91px 6px;
  }

  .service-feature-grid .feature-card::before {
    top: 88px;
    right: 87px;
  }

  .service-feature-grid .feature-card h3 {
    width: 278px;
    max-width: calc(100% - 65px);
    font-size: 20px;
  }

  .service-feature-grid .feature-card--personal h3 {
    width: 251px;
  }

  .service-feature-grid .feature-card p {
    top: auto;
    right: 20px;
    bottom: 20px;
    left: 20px;
    font-size: 14px;
  }

  .service-feature-grid .feature-card--technology .feature-card__thumb {
    inset: 0;
    width: 100%;
    object-fit: cover;
    object-position: 81.6% 50%;
  }
}

@media (min-width: 600px) and (max-width: 767px) {
  .service-feature-grid .feature-card--technology {
    grid-column: 1 / -1;
  }
}

@media (min-width: 768px) {
  .service-feature-grid .feature-card--technology .feature-card__thumb {
    top: 0;
    right: -6.22px;
    left: auto;
    width: 134.97px;
    height: 90px;
    object-fit: fill;
    clip-path: inset(0 8.22px 0 36.75px);
  }
}

@media (min-width: 1360px) {
  .service-feature-grid .feature-card {
    height: auto;
  }
}

.service-feature-grid .feature-card {
  height: auto;
  min-height: 0;
}

.service-feature-grid .feature-card p {
  position: relative;
  inset: auto;
}

@media (min-width: 1360px) {
  .service-feature-grid .feature-card {
    padding-bottom: 50px;
  }

  .service-feature-grid .feature-card p {
    margin: 128px 0 0;
  }
}

@media (min-width: 768px) and (max-width: 1359px) {
  .service-feature-grid .feature-card {
    padding-bottom: 24px;
  }

  .service-feature-grid .feature-card p {
    margin: 114px 0 0;
  }
}

@media (max-width: 767px) {
  .service-feature-grid .feature-card {
    padding-bottom: 20px;
  }

  .service-feature-grid .feature-card--family {
    padding-bottom: 34px;
  }

  .service-feature-grid .feature-card p {
    margin: 105px 0 0;
  }
}

@media (min-width: 768px) and (max-width: 1359px) {
  .about-values .feature-card--technology {
    grid-column: 1 / -1;
  }
}

@media (max-width: 767px) {
  .about-values .feature-card--technology {
    grid-column: auto;
  }
}
