.about-hero {
  position: relative;
  background-color: var(--color-dark);
  background-image: linear-gradient(rgba(47, 63, 73, 0.9), rgba(47, 63, 73, 0.8)), url('../img/solutions/dach-plaski.webp');
  background-size: cover;
  background-position: center;
  padding: 180px 0 100px;
  color: #fff;
  text-align: center;
}

.about-hero__content { max-width: 800px; margin: 0 auto; }
.about-hero__title { font-size: clamp(2.5rem, 5vw, 4rem); margin-bottom: 1.5rem; line-height: 1.1; }
.about-hero__desc { font-size: 1.2rem; line-height: 1.6; opacity: 0.9; font-weight: 300; }

.approach { background: #fff; }
.approach__grid { display: grid; grid-template-columns: 1.15fr 0.85fr; gap: 4rem; align-items: center; }
.approach__content { display: flex; flex-direction: column; justify-content: center; min-height: 100%; }
.approach__intro { font-size: 1.1rem; line-height: 1.7; margin: 0; color: var(--color-text); }
.approach__list-col { display: flex; justify-content: center; align-items: center; }
.approach__list { list-style: none; margin: 0; padding: 0; width: 100%; }
.approach__list li { display: flex; align-items: flex-start; gap: 1rem; margin-bottom: 1.5rem; }
.approach__list .icon { color: var(--color-primary); font-size: 2.2rem; margin-top: 2px; line-height: 1; }
.approach__list span { font-size: 1rem; color: var(--color-text); line-height: 1.55; }

.timeline-section { background: #f8fafc; position: relative; overflow: hidden; }
.timeline-wrap { position: relative; max-width: 1000px; margin: 3rem auto 0; padding: 2rem 0; }

.timeline-line {
  position: absolute; top: 0; bottom: 0; left: 50%; width: 2px;
  background: #cbd5e0; transform: translateX(-50%); z-index: 1;
}

.timeline-item {
  position: relative; width: 50%; padding: 0 2.5rem; margin-bottom: 3rem;
  box-sizing: border-box; z-index: 2;
}

.timeline-item:nth-child(even) { left: 0; text-align: right; }
.timeline-item:nth-child(odd) { left: 50%; text-align: left; }

.timeline-dot {
  position: absolute; top: 0; width: 16px; height: 16px;
  background: #fff; border: 3px solid var(--color-primary);
  border-radius: 50%; z-index: 3;
}
.timeline-item:nth-child(even) .timeline-dot { right: -8px; }
.timeline-item:nth-child(odd) .timeline-dot { left: -8px; }

.timeline-date {
  font-size: 1.5rem; font-weight: var(--w-bold); color: var(--color-primary);
  margin-bottom: 0.5rem; line-height: 1;
}

.timeline-content h3 { font-size: 1.1rem; margin-bottom: 0.5rem; color: var(--color-text-heading); font-weight: var(--w-semi); }
.timeline-content p { font-size: 0.95rem; color: var(--color-text); line-height: 1.5; }

.timeline-item.is-today .timeline-date { font-size: 2rem; color: var(--color-dark); text-transform: uppercase; }
.timeline-item.is-today .timeline-dot {
  width: 24px; height: 24px; background: var(--color-primary); border: 4px solid #fff;
  box-shadow: 0 0 0 3px var(--color-primary);
}
.timeline-item.is-today:nth-child(even) .timeline-dot { right: -12px; }
.timeline-item.is-today:nth-child(odd) .timeline-dot { left: -12px; }

.quality { background: var(--color-dark); color: #fff; position: relative; }
.quality::before {
  content: ""; position: absolute; inset: 0;
  background: url('../img/pattern.svg'); opacity: 0.05; pointer-events: none;
}

.quality__grid { position: relative; z-index: 1; display: grid; grid-template-columns: 1.2fr 0.8fr; gap: 4rem; align-items: start; }
.quality__left { text-align: left; justify-self: start; }
.quality__left .section-title--light { margin-bottom: 1rem; text-align: left; }
.quality__left p { font-size: 1.1rem; opacity: 0.9; line-height: 1.7; margin: 0; max-width: 65ch; text-align: left; }

.quality__right { display: flex; flex-direction: column; align-items: center; justify-self: start; }
.quality__list { list-style: none; margin: 0 0 2rem; padding: 0; width: 100%; }
.quality__list li { position: relative; padding-left: 2rem; margin-bottom: 1rem; font-size: 1.05rem; width: 100%; }
.quality__list li::before { content: "✔"; position: absolute; left: 0; color: var(--color-primary); font-weight: bold; }
.quality__actions { margin: 0; width: 100%; display: flex; justify-content: flex-start; }

.partners-text { background: #fff; }
.partners-grid { display: grid; grid-template-columns: 0.75fr 1.25fr; gap: 4rem; align-items: center; }
.partners-content { text-align: left; }
.partners-content p { margin: 0 0 2rem; line-height: 1.7; }
.partners-visual { display: flex; justify-content: center; align-items: center; }
.partners-icon { font-size: 9rem; color: var(--color-primary); line-height: 1; }

.mission { background: #a9b58a; color: #fff; padding: 5rem 0; }
.mission__grid { display: grid; grid-template-columns: 1.25fr 0.75fr; gap: 4rem; align-items: center; }
.mission__visual { display: flex; justify-content: center; align-items: center; }
.mission-icon { font-size: 9rem; color: #fff; line-height: 1; }
.mission__content { text-align: left; }
.mission__title { font-size: 2.5rem; margin-bottom: 1.25rem; }
.mission__text { font-size: 1.2rem; line-height: 1.7; font-weight: 300; margin: 0; max-width: 65ch; }

.cta-simple { background: #f8fafc; }
.cta-simple__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
  align-items: start;
}
.cta-simple__item { text-align: left; }
.cta-simple__item-inner { border-left: none; padding-left: 0; }
.cta-simple__item h3 { font-size: 1.5rem; margin: 0 0 0.75rem; color: var(--color-text-heading); }
.cta-simple__item p { margin: 0 0 1.25rem; color: var(--color-text); line-height: 1.7; max-width: 100%; }
.cta-simple__actions { display: flex; gap: 0.75rem; flex-wrap: wrap; }

/* FIX: ikony w przyciskach outline mają być pomarańczowe */
.btn--iconfix .material-symbols-outlined,
.btn--secondary.btn--outline .material-symbols-outlined,
.btn--outline .material-symbols-outlined{
  color: var(--color-primary) !important;
}

/* jeśli gdzieś globalnie masz fill -> też korygujemy */
.btn--iconfix svg,
.btn--secondary.btn--outline svg,
.btn--outline svg{
  fill: var(--color-primary) !important;
}

/* --- Media Queries --- */
@media (max-width: 992px) {
  .approach__grid { grid-template-columns: 1fr; gap: 2.5rem; }
  .quality__grid { grid-template-columns: 1fr; gap: 2.5rem; }
  .partners-grid { grid-template-columns: 1fr; gap: 2.5rem; }
  .mission__grid { grid-template-columns: 1fr; gap: 2.5rem; }
  .cta-simple__grid { grid-template-columns: 1fr; gap: 2rem; }
  .quality__right { align-items: flex-start; }
  .quality__actions { justify-content: flex-start; }
}

@media (max-width: 768px) {
  .timeline-line { left: 30px; }
  .timeline-item { width: 100%; padding-left: 70px; padding-right: 0; text-align: left !important; }
  .timeline-item:nth-child(even), .timeline-item:nth-child(odd) { left: 0; }
  .timeline-item:nth-child(even) .timeline-dot, .timeline-item:nth-child(odd) .timeline-dot { left: 22px; right: auto; }
  .timeline-item.is-today .timeline-dot { left: 18px; }
  .about-hero__title { font-size: 2.5rem; }
  .partners-icon { font-size: 7.5rem; }
  .mission-icon { font-size: 5rem; }
}
