.page-hero__shape--1 {
  right: clamp(0px, 4vw, 60px);
  top: clamp(10px, 3vw, 40px);
  width: clamp(120px, 20vw, 300px);
  aspect-ratio: 1/1;
  border-radius: 50%;
  background: #F6B93B;
  transform: translate3d(calc(var(--mx, 0) * 30px), calc(var(--my, 0) * 30px), 0);
}
.page-hero__shape--2 {
  right: clamp(90px, 17vw, 250px);
  top: clamp(90px, 14vw, 230px);
  width: clamp(70px, 10vw, 150px);
  aspect-ratio: 2/1;
  border-radius: 0 0 999px 999px;
  background: #E8542C;
  transform: translate3d(calc(var(--mx, 0) * -50px), calc(var(--my, 0) * -50px), 0);
}
.page-hero__shape--3 {
  right: clamp(10px, 3vw, 40px);
  top: clamp(150px, 19vw, 300px);
  width: clamp(40px, 5vw, 72px);
  aspect-ratio: 1/1;
  background: #1F4A38;
  transform: translate3d(calc(var(--mx, 0) * 70px), calc(var(--my, 0) * 70px), 0) rotate(calc(14deg + var(--sy, 0) * 0.2deg));
}

.portfolio {
  padding: 0 clamp(20px, 4vw, 56px) clamp(80px, 10vw, 150px);
  max-width: 1520px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 40px;
}
.portfolio__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 420px), 1fr));
  gap: 48px 24px;
}

.portfolio-card {
  display: flex;
  flex-direction: column;
  gap: 16px;
  color: #2B1610;
}
.portfolio-card:hover {
  color: #2B1610;
}
.portfolio-card__visual {
  position: relative;
  aspect-ratio: 3/2;
  overflow: hidden;
  background: #EBD8BF;
  transition: transform 0.45s cubic-bezier(0.3, 1.5, 0.5, 1);
}
.portfolio-card__visual img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.portfolio-card__visual--0, .portfolio-card__visual--3 {
  border-radius: 28px;
}
.portfolio-card__visual--1 {
  border-radius: 999px 999px 28px 28px;
}
.portfolio-card__visual--2 {
  border-radius: 28px 120px 28px 28px;
}
.portfolio-card:hover .portfolio-card__visual {
  transform: scale(1.02) rotate(-1deg);
}
.portfolio-card__dot {
  position: absolute;
  right: 18px;
  top: 18px;
  width: 44px;
  height: 44px;
  border-radius: 50%;
}
.portfolio-card__dot--0 {
  background: #F6B93B;
}
.portfolio-card__dot--1 {
  background: #E8542C;
}
.portfolio-card__dot--2 {
  background: #F4A6B7;
}
.portfolio-card__dot--3 {
  background: #1F4A38;
}
.portfolio-card__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.portfolio-card__title {
  margin: 0;
  font-size: clamp(28px, 2.6vw, 38px);
  line-height: 1.05;
  letter-spacing: -0.035em;
  font-weight: 800;
}
.portfolio-card__text {
  margin: 0;
  font-size: 17px;
  line-height: 1.55;
  max-width: 540px;
  text-wrap: pretty;
}
.portfolio-card__more {
  font-weight: 700;
  font-size: 16px;
}

/*# sourceMappingURL=realisations-23866ff3b3.output.css.map */