/* ==========================================================================
   SEKCJA: O FIRMIE (polaroidy)
   ========================================================================== */
.systemo-o-firmie {
  background: var(--color-bg-cream);
  overflow: hidden;
  text-align: left;
}

.systemo-o-firmie__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 90px;
  align-items: center;
}

/* --- Polaroidy --- */
.systemo-o-firmie__polaroids {
  position: relative;
  width: 100%;
  max-width: 620px;
  margin: 0 auto;
  aspect-ratio: 1 / .95;
}

.systemo-polaroid {
  --r: 0deg;
  position: absolute;
  width: 58%;
  padding: 3.4% 3.4% 0;
  background: #fff;
  box-shadow: 0 18px 40px rgba(26, 37, 48, .2);
  transform: rotate(var(--r));
  transition: transform .5s var(--ease), box-shadow .5s var(--ease);
}
.systemo-polaroid img {
  width: 100%;
  aspect-ratio: 4 / 3.2;
  object-fit: cover;
  background: #d9dde1;
}
.systemo-polaroid figcaption {
  padding: 10px 0 12px;
  text-align: center;
  font-family: var(--font-hand);
  font-size: clamp(16px, 2vw, 24px);
  font-weight: 700;
  line-height: 1.1;
  color: var(--color-dark);
}
.systemo-polaroid:hover {
  transform: rotate(0deg) scale(1.06);
  box-shadow: 0 28px 55px rgba(26, 37, 48, .28);
  z-index: 6;
}

.systemo-polaroid--1 { --r: -6deg; top: 0; left: 0; z-index: 1; }
.systemo-polaroid--2 { --r: 5deg; top: 7%; right: 0; z-index: 2; }
.systemo-polaroid--3 { --r: 3deg; bottom: 2%; left: 6%; z-index: 3; }
.systemo-polaroid--4 { --r: -4deg; bottom: 0; right: 4%; z-index: 4; width: 52%; }

/* --- Kolumna tekstowa --- */
.systemo-o-firmie__eyebrow {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 20px;
  color: var(--color-primary);
}
.systemo-o-firmie__eyebrow .systemo-icon { width: 34px; height: 34px; stroke-width: 1.6; }
.systemo-o-firmie__eyebrow .systemo-pretitle { margin: 0; }

.systemo-o-firmie__title {
  font-size: clamp(28px, 3.2vw, 42px);
  margin-bottom: 22px;
  letter-spacing: -.01em;
  text-wrap: balance;
}

.systemo-o-firmie__copy p { margin-bottom: 20px; text-wrap: pretty; }

.systemo-o-firmie__list {
  display: grid;
  gap: 12px;
  margin: 26px 0 38px;
}
.systemo-o-firmie__list li {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  font-weight: 600;
  color: var(--color-dark);
  line-height: 1.5;
}
.systemo-o-firmie__list .systemo-icon {
  width: 22px;
  height: 22px;
  margin-top: 1px;
  padding: 3px;
  background: var(--color-primary);
  color: #fff;
  border-radius: 50%;
  stroke-width: 3;
}

@media (max-width: 1200px) {
  .systemo-o-firmie__inner { gap: 60px; }
}

@media (max-width: 992px) {
  .systemo-o-firmie__inner { grid-template-columns: 1fr; gap: 56px; }
  .systemo-o-firmie__polaroids { max-width: 540px; }
}

@media (max-width: 480px) {
  .systemo-polaroid figcaption { padding: 6px 0 8px; }
  .systemo-o-firmie__copy .systemo-btn { width: 100%; }
}