/* ==========================================================================
   Mühendislik & Üretim Gücümüz — yatay, numaralı süreç (scroll-snap).
   Şerit sağ kenara taşar; sol hizası container ile aynıdır.
   ========================================================================== */
.engineering { overflow: hidden; }

.engineering__head-side { display: grid; gap: var(--space-5); }
.engineering__controls { display: flex; gap: var(--space-2); }
.engineering__arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border: 1px solid var(--color-line-strong);
  border-radius: var(--radius-pill);
  background: transparent;
  color: var(--color-text);
  cursor: pointer;
  transition: background-color var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease);
}
.engineering__arrow svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.6; }
.engineering__arrow:hover:not(:disabled) { background: var(--color-dark); border-color: var(--color-dark); color: var(--color-white); }
.engineering__arrow:disabled { opacity: .35; cursor: default; }

.engineering__viewport { position: relative; }

.engineering__track {
  --edge: max(var(--gutter), calc((100vw - var(--container-max)) / 2 + var(--gutter)));
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: min(82vw, 420px);
  gap: var(--space-6);
  padding-inline: var(--edge);
  scroll-padding-inline: var(--edge);
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  overscroll-behavior-x: contain;
  scrollbar-width: none;
}
.engineering__track::-webkit-scrollbar { display: none; }
.engineering__track:focus-visible { outline-offset: -2px; }

.step {
  position: relative;
  scroll-snap-align: start;
  display: flex;
  flex-direction: column;
}
.step__media {
  aspect-ratio: 16 / 10;
  border-radius: var(--radius);
}
.step__media img { transition: transform 1.2s var(--ease-out); }
.step:hover .step__media img { transform: scale(1.04); }

/* Zaman çizgisi */
.step__rail {
  position: relative;
  height: 1px;
  margin: var(--space-5) calc(var(--space-6) * -1) var(--space-4) 0;
  background: var(--color-line-strong);
}
.step:last-child .step__rail { margin-right: 0; }
.step__dot {
  position: absolute;
  left: 0;
  top: 50%;
  width: 11px;
  height: 10px;
  background: var(--color-primary);
  clip-path: polygon(50% 0, 100% 100%, 0 100%);
  transform: translateY(-60%);
}

.step__no {
  font-size: var(--fs-number);
  line-height: .9;
  font-weight: 700;
  letter-spacing: -.05em;
  color: transparent;
  -webkit-text-stroke: 1.2px var(--color-muted);
  opacity: .55;
  transition: -webkit-text-stroke-color var(--dur) var(--ease), color var(--dur) var(--ease);
}
.step:hover .step__no { -webkit-text-stroke-color: var(--color-primary-deep); opacity: 1; }

.step__title {
  margin-top: var(--space-3);
  font-size: var(--fs-h3);
  font-weight: 600;
}
.step__text {
  margin-top: var(--space-2);
  color: var(--color-muted);
  font-size: var(--fs-small);
  max-width: 40ch;
}

@media (min-width: 992px) {
  .engineering__track { grid-auto-columns: calc((min(100vw, var(--container-max)) - var(--gutter) * 2 - var(--space-6) * 3) / 3.6); }
}

/* İlerleme çubuğu */
.engineering__progress {
  position: relative;
  height: 2px;
  margin-top: var(--space-6);
  background: var(--color-line);
  overflow: hidden;
  border-radius: 2px;
}
.engineering__progress span {
  position: absolute;
  inset: 0;
  background: var(--gradient-gold);
  transform-origin: left;
  transform: scaleX(.2);
  transition: transform var(--dur-fast) linear;
}