/* Mühendislik — süreç haritası (masaüstü) */
#muhendislik.eng-process {
  padding: 0 !important;
  margin: 0;
  overflow: visible;
  clip-path: none;
  -webkit-clip-path: none;
  background: transparent;
}

#muhendislik .eng-process__section {
  --eng-pad-y: var(--pad);
  --eng-stage-top: calc(var(--eng-pad-y) + 14.5rem);
  position: relative;
  width: 100%;
  min-width: 0;
  min-height: calc(2 * var(--eng-pad-y) + 46rem);
  height: auto;
  padding-top: var(--eng-pad-y);
  padding-bottom: var(--eng-pad-y);
  overflow: visible;
  isolation: isolate;
  background: transparent;
}

#muhendislik .eng-process__intro {
  position: relative;
  z-index: 10;
}

#muhendislik .eng-process__intro .section-intro {
  margin-bottom: 2.5rem;
}

#muhendislik .eng-process__stage {
  position: absolute;
  top: 0;
  right: 0;
  bottom: var(--eng-pad-y);
  left: 0;
  z-index: 8;
  max-width: 1920px;
  margin: 0 auto;
  pointer-events: none;
  perspective: 1100px;
}

#muhendislik .eng-process__orbit-svg {
  position: absolute;
  left: 50%;
  top: var(--eng-stage-top);
  width: 1920px;
  height: 560px;
  transform: translateX(-50%);
  overflow: visible;
  pointer-events: none;
  opacity: .96;
}

#muhendislik .eng-process__orbit-glow {
  fill: none;
  stroke: rgba(69, 156, 235, .34);
  stroke-width: 8;
  filter: blur(13px);
  opacity: .45;
}

#muhendislik .eng-process__orbit-main {
  fill: none;
  stroke: url(#engPathGradient);
  stroke-width: 3;
  stroke-linecap: round;
  opacity: .88;
}

#muhendislik .eng-process__orbit-dash {
  fill: none;
  stroke: rgba(14, 71, 116, .12);
  stroke-width: 1.4;
  stroke-dasharray: 7 12;
  opacity: .75;
}

#muhendislik .eng-process__node {
  fill: #ffffff;
  stroke: rgba(63, 147, 226, .48);
  stroke-width: 2;
  filter: drop-shadow(0 0 13px rgba(66, 154, 235, .55));
}

#muhendislik .eng-process__center-wrap {
  position: absolute;
  left: 50%;
  top: calc(var(--eng-stage-top) + 16rem);
  z-index: 9;
  width: 278px;
  height: 278px;
  transform: translate(-50%, -50%);
  transform-style: preserve-3d;
  will-change: transform;
  pointer-events: none;
}

#muhendislik .eng-process__center-wrap.is-flipping {
  animation: engProcessCenterSpinOnce 0.72s cubic-bezier(0.45, 0.05, 0.25, 1) forwards;
}

#muhendislik .eng-process__center {
  position: relative;
  width: 100%;
  height: 100%;
  border-radius: 999px;
  background:
    radial-gradient(circle at 38% 26%, rgba(255,255,255,1) 0 10%, rgba(255,255,255,.45) 24%, rgba(220, 239, 251, .4) 61%, rgba(255,255,255,.2) 100%),
    linear-gradient(145deg, rgba(255,255,255,.86), rgba(208,232,246,.36));
  border: 1px solid rgba(255,255,255,.95);
  box-shadow:
    inset 0 1px 2px rgba(255,255,255,.95),
    inset 0 -28px 56px rgba(76,136,184,.08),
    0 34px 100px rgba(65,120,164,.18);
  backdrop-filter: blur(24px);
}

#muhendislik .eng-process__center::before,
#muhendislik .eng-process__center::after {
  content: "";
  position: absolute;
  inset: 18px;
  border-radius: inherit;
  border: 1px solid rgba(84, 153, 216, .22);
  box-shadow: 0 0 28px rgba(79, 161, 238, .18);
}

#muhendislik .eng-process__center::after {
  inset: -26px;
  border-color: rgba(94, 165, 230, .16);
  background:
    conic-gradient(from 30deg, transparent 0deg, rgba(55,146,232,.22) 28deg, transparent 54deg, transparent 160deg, rgba(255,255,255,.72) 178deg, transparent 205deg, transparent 360deg);
  mask: radial-gradient(circle, transparent 0 72%, #000 73% 74%, transparent 75%);
}

#muhendislik .eng-process__center-glass {
  position: absolute;
  inset: 28px;
  border-radius: inherit;
  background: transparent;
  border: none;
  box-shadow: none;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: visible;
}

#muhendislik .eng-process__center-photo {
  width: clamp(9.5rem, 84%, 12.5rem);
  height: clamp(9.5rem, 84%, 12.5rem);
  max-width: none;
  max-height: none;
  object-fit: contain;
  object-position: center;
  background: transparent;
  filter: drop-shadow(0 10px 22px rgba(19, 50, 76, 0.16));
}

#muhendislik .eng-process__card {
  position: absolute;
  z-index: 12;
  width: 152px;
  height: 152px;
  overflow: visible;
  background: transparent;
  border: none;
  box-shadow: none;
  filter: none;
  backdrop-filter: none;
  clip-path: none;
  -webkit-clip-path: none;
  padding: 0;
  pointer-events: none;
  visibility: hidden;
  transform: translateY(36px) scale(0.84);
  opacity: 0;
  transition:
    visibility 0s linear 0.85s,
    opacity 0.85s cubic-bezier(.22, 1, .36, 1),
    transform 1s cubic-bezier(.22, 1, .36, 1);
}

#muhendislik .eng-process__card-face {
  position: relative;
  z-index: 2;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.55rem;
  padding: 1rem;
  text-align: center;
  clip-path: var(--clip-card-shape);
  -webkit-clip-path: var(--clip-card-shape);
  background:
    linear-gradient(145deg, rgba(255,255,255,.84), rgba(242,249,253,.50));
  border: 1px solid rgba(255,255,255,.94);
  box-shadow:
    inset 0 1px 1px rgba(255,255,255,.94),
    inset 0 -24px 44px rgba(104, 157, 198, .07);
  filter: drop-shadow(0 24px 70px rgba(41, 91, 130, .12));
  backdrop-filter: blur(22px);
}

#muhendislik .eng-process__card-face::before {
  content: "";
  position: absolute;
  inset: 0;
  clip-path: var(--clip-card-shape);
  -webkit-clip-path: var(--clip-card-shape);
  background:
    radial-gradient(circle at 50% 0%, rgba(255,255,255,.85), transparent 46%),
    linear-gradient(180deg, rgba(255,255,255,.34), rgba(255,255,255,0));
  pointer-events: none;
}

#muhendislik .eng-process__card.is-visible {
  visibility: visible;
  opacity: 1;
  transform: translateY(0) scale(1);
  transition:
    visibility 0s linear 0s,
    opacity 0.85s cubic-bezier(.22, 1, .36, 1),
    transform 1s cubic-bezier(.22, 1, .36, 1);
}

#muhendislik .eng-process__section.is-loaded .eng-process__card.is-visible {
  opacity: 1;
  transform: translateY(0) scale(1);
}

#muhendislik .eng-process__card::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -74px;
  width: 1px;
  height: 74px;
  background: linear-gradient(180deg, rgba(71,153,230,.28), rgba(71,153,230,0));
  border-left: 1px dashed rgba(71,153,230,.22);
  opacity: .8;
  transform: translateX(-50%);
}

#muhendislik .eng-process__card.top-connector::after {
  top: -74px;
  bottom: auto;
  background: linear-gradient(0deg, rgba(71,153,230,.28), rgba(71,153,230,0));
}

#muhendislik .eng-process__index {
  position: absolute;
  z-index: 1;
  left: -55px;
  bottom: 34px;
  color: rgba(58, 139, 215, .44);
  font-size: 27px;
  font-weight: 500;
  letter-spacing: .04em;
  pointer-events: none;
}

#muhendislik .eng-process__index.right {
  left: auto;
  right: -55px;
}

#muhendislik .eng-process__glyph {
  position: relative;
  z-index: 2;
  width: 36px;
  height: 36px;
  margin: 0;
  flex-shrink: 0;
  color: #0b2b4a;
  stroke: currentColor;
  stroke-width: 2.25;
  stroke-linecap: round;
  stroke-linejoin: round;
  fill: none;
}

#muhendislik .eng-process__card-title {
  position: relative;
  z-index: 2;
  width: 100%;
  margin: 0;
  color: #0b2b4a;
  font-size: 13px;
  line-height: 1.15;
  font-weight: var(--display-weight, 400);
  text-align: center;
  letter-spacing: -.01em;
  font-family: var(--font-display);
  text-transform: uppercase;
}

#muhendislik .eng-process__card-num {
  position: relative;
  z-index: 2;
  display: block;
  width: 100%;
  margin: 0;
  color: rgba(10, 49, 82, .46);
  font-size: 15px;
  line-height: 1;
  font-weight: 700;
  text-align: center;
}

#muhendislik .eng-process__card--1 { left: 6.5%; top: calc(var(--eng-stage-top) + 3rem); }
#muhendislik .eng-process__card--2 { left: 20.4%; top: calc(var(--eng-stage-top) + 9rem); }
#muhendislik .eng-process__card--3 { left: 33.1%; top: calc(var(--eng-stage-top) + 15rem); }
#muhendislik .eng-process__card--4 { right: 33.4%; top: calc(var(--eng-stage-top) + 15rem); }
#muhendislik .eng-process__card--5 { right: 20.5%; top: calc(var(--eng-stage-top) + 9rem); }
#muhendislik .eng-process__card--6 { right: 6.5%; top: calc(var(--eng-stage-top) + 3rem); }

#muhendislik .eng-process__clouds {
  position: absolute;
  inset: auto -10% calc(var(--eng-pad-y) - 210px) -10%;
  z-index: 3;
  height: 420px;
  pointer-events: none;
  filter: blur(.2px);
}

#muhendislik .eng-process__clouds::before,
#muhendislik .eng-process__clouds::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse at 6% 70%, rgba(255,255,255,.98) 0 13%, transparent 28%),
    radial-gradient(ellipse at 16% 52%, rgba(255,255,255,.96) 0 12%, transparent 30%),
    radial-gradient(ellipse at 30% 76%, rgba(255,255,255,.92) 0 15%, transparent 33%),
    radial-gradient(ellipse at 48% 55%, rgba(255,255,255,.78) 0 18%, transparent 42%),
    radial-gradient(ellipse at 65% 75%, rgba(255,255,255,.90) 0 17%, transparent 36%),
    radial-gradient(ellipse at 82% 54%, rgba(255,255,255,.94) 0 14%, transparent 34%),
    radial-gradient(ellipse at 96% 74%, rgba(255,255,255,.97) 0 15%, transparent 34%);
  opacity: .96;
}

#muhendislik .eng-process__clouds::after {
  transform: translateY(-78px) scale(1.04);
  opacity: .52;
  filter: blur(18px);
}

#muhendislik .eng-process__side-cloud {
  position: absolute;
  z-index: 2;
  pointer-events: none;
  width: 520px;
  height: 420px;
  border-radius: 999px;
  background:
    radial-gradient(ellipse at 24% 54%, rgba(255,255,255,.88) 0 16%, transparent 38%),
    radial-gradient(ellipse at 52% 42%, rgba(255,255,255,.74) 0 16%, transparent 42%),
    radial-gradient(ellipse at 72% 58%, rgba(255,255,255,.82) 0 14%, transparent 40%);
  filter: blur(5px);
  opacity: .72;
}

#muhendislik .eng-process__side-cloud.left { left: -180px; top: calc(var(--eng-stage-top) - 0.5rem); }
#muhendislik .eng-process__side-cloud.right { right: -190px; top: calc(var(--eng-stage-top) + 3.5rem); }

#muhendislik .eng-process__blue-mist {
  position: absolute;
  z-index: 1;
  width: 420px;
  height: 420px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(80, 161, 235, .18), transparent 66%);
  filter: blur(44px);
  opacity: .42;
  pointer-events: none;
}

#muhendislik .eng-process__blue-mist.m1 { left: 5%; top: calc(var(--eng-stage-top) + 1.5rem); }
#muhendislik .eng-process__blue-mist.m2 { right: 9%; top: calc(var(--eng-stage-top) + 5.5rem); }
#muhendislik .eng-process__blue-mist.m3 { left: 43%; top: calc(var(--eng-stage-top) + 7.5rem); opacity: .30; }

@keyframes engProcessCenterSpinOnce {
  from {
    transform: translate(-50%, -50%) rotateY(0deg);
  }
  to {
    transform: translate(-50%, -50%) rotateY(360deg);
  }
}

@keyframes engProcessPulse {
  0%, 100% { opacity: .55; transform: scale(1); }
  50% { opacity: 1; transform: scale(1.08); }
}

#muhendislik .eng-process__node-pulse {
  transform-box: fill-box;
  transform-origin: center;
  animation: engProcessPulse 3.4s ease-in-out infinite;
}

#muhendislik .eng-process__node-pulse:nth-of-type(2) { animation-delay: .35s; }
#muhendislik .eng-process__node-pulse:nth-of-type(3) { animation-delay: .70s; }
#muhendislik .eng-process__node-pulse:nth-of-type(4) { animation-delay: 1.05s; }
#muhendislik .eng-process__node-pulse:nth-of-type(5) { animation-delay: 1.40s; }
#muhendislik .eng-process__node-pulse:nth-of-type(6) { animation-delay: 1.75s; }

html.is-low-power #muhendislik .eng-process__center::after,
html.is-reduced-motion #muhendislik .eng-process__center::after,
html.is-low-power #muhendislik .eng-process__center-wrap,
html.is-reduced-motion #muhendislik .eng-process__center-wrap,
html.is-low-power #muhendislik .eng-process__node-pulse,
html.is-reduced-motion #muhendislik .eng-process__node-pulse {
  animation: none;
}

html.is-low-power #muhendislik .eng-process__card,
html.is-reduced-motion #muhendislik .eng-process__card {
  opacity: 1;
  transform: none;
  transition: none;
}

@media (min-width: 1280px) {
  #muhendislik .eng-process__section {
    min-width: 1280px;
  }
}

@media (max-width: 1279px) {
  @keyframes engProcessCenterSpinOnceMobile {
    from { transform: rotateY(0deg); }
    to { transform: rotateY(360deg); }
  }

  #muhendislik .eng-process__section {
    height: auto;
    min-height: auto;
    padding-top: var(--pad);
    padding-bottom: var(--pad);
  }

  #muhendislik .eng-process__intro .section-intro {
    margin-bottom: clamp(2rem, 5vw, 3rem);
  }

  #muhendislik .eng-process__heading-bg,
  #muhendislik .eng-process__orbit-svg,
  #muhendislik .eng-process__clouds,
  #muhendislik .eng-process__side-cloud,
  #muhendislik .eng-process__blue-mist,
  #muhendislik .eng-process__sky-glow {
    display: none;
  }

  #muhendislik .eng-process__stage {
    position: relative;
    inset: auto;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    padding: 0 1.25rem 1rem;
    pointer-events: auto;
  }

  #muhendislik .eng-process__center-wrap {
    position: relative;
    left: auto;
    top: auto;
    transform: none;
    grid-column: 1 / -1;
    margin: 0 auto 1rem;
    width: min(100%, 16rem);
    height: 16rem;
  }

  #muhendislik .eng-process__center-wrap.is-flipping {
    animation-name: engProcessCenterSpinOnceMobile;
  }

  #muhendislik .eng-process__card {
    position: relative;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    width: 100%;
    max-width: 9.5rem;
    height: auto;
    aspect-ratio: 1;
    margin-inline: auto;
    visibility: visible;
    opacity: 1;
    transform: none;
  }

  #muhendislik .eng-process__card-face {
    gap: 0.45rem;
    padding: 0.9rem;
  }

  #muhendislik .eng-process__card.is-visible {
    opacity: 1;
    transform: none;
  }

  #muhendislik .eng-process__card::after,
  #muhendislik .eng-process__index {
    display: none;
  }
}

@media (max-width: 520px) {
  #muhendislik .eng-process__stage {
    grid-template-columns: 1fr;
  }
}