:root {
  --c-inds-bg: var(--c-gray);
  --c-hero-tx: var(--c-navy);
  --c-left-cr: var(--c-orange);
  --c-right-cr: var(--c-navy);
  --c-card-tx: var(--c-navy);
  --c-card-ln: rgba(11,20,44,0.18);
}

/* dark mode */
body.dark {
  --c-inds-bg: var(--c-navy);
  --c-hero-tx: var(--c-gray);
  --c-left-cr: var(--c-orange);
  --c-right-cr: var(--c-hero-panel);
  --c-card-tx: var(--c-gray);
  --c-card-ln: rgba(168, 170, 176, 0.18);
}

:root{
  --wrap: 1100px;

  /* Kare görsel blok ölçüsü */
  --media-size: 200px;

  /* boşluklar */
  --card-gap: 54px;
  --row-gap: 90px;

  /* yazının resme yaklaşması */
  --panel-pull: 30px;    /* 40-80 arası deneyebilirsin */
  --panel-pad: 30px;     /* sağa/sola yapışmayı engeller */
}

body{ background: var(--header-bg); }
.industry-page{ background: var(--c-inds-bg); }

/* üst başlık */
.industry-title{
  padding: 80px 0 0;
  margin: 0 0 30px;
  text-align: center;
  color: var(--c-hero-tx);
  font-weight: 900;
  font-size: 44px;
}
.industry-lead{
  max-width: 860px;
  margin: 10px auto 30px;
  text-align: center;
  color: var(--c-hero-tx);
  font-size: 13px;
  line-height: 1.7;
}
.industry-divider{
  width: 75%;
  height: 2px;
  background: var(--c-hero-tx);
  margin: 18px auto 28px;
}

/* grid */
.industry-grid{
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--row-gap);
  padding-bottom: 40px;
  padding-top: 40px;
}

/* kart */
.industry-card{
  display: grid;
  grid-template-columns: var(--media-size) 1fr;
  column-gap: var(--card-gap);
  align-items: center;
  margin: 30px auto;
  width: 75%;
}

/* sağ/sol tersleme */
.industry-card.is-rightText{
  grid-template-columns: 1fr var(--media-size);
}
.industry-card.is-rightText .industry-media{ order: 2; }
.industry-card.is-rightText .industry-panel{ order: 1; }

/* görsel blok (arka plaka) */
.industry-media{
  width: var(--media-size);
  height: var(--media-size);
  position: relative;
  overflow: visible; /* resim taşabilsin */
  border-radius: 0;
}

/* 1,3,5... turuncu | 2,4,6... lacivert */
.industry-card:nth-child(odd) .industry-media{ background: var(--c-left-cr); }
.industry-card:nth-child(even) .industry-media{ background: var(--c-right-cr); }

/* resim katmanı: gerçek hizalama */
.industry-media-inner{
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;   /* ✅ dikey merkez */
}

/* resim boyutu + taşma */
.industry-img{
  width: calc(100% * var(--img-scale));
  height: auto;
  object-fit: contain;
  display: block;
  max-width: none;
}

/* Yazı solda (resim sağda) -> resim SAĞA */
.industry-card.is-leftText .industry-media-inner{
  justify-content: flex-end;
}
.industry-card.is-leftText .industry-img{
  transform: translateX(var(--img-shift) * -1);
}

/* Yazı sağda (resim solda) -> resim SOLA */
.industry-card.is-rightText .industry-media-inner{
  justify-content: flex-start;
}
.industry-card.is-rightText .industry-img{
  transform: translateX(calc(var(--img-shift)));
}

/* metin alanı */
.industry-panel{
  padding: 0 12px;

}

.industry-card-title{
  margin: 0;
  color: var(--c-card-tx);
  font-weight: 900;
  font-size: 34px;
  letter-spacing: -0.2px;
}

.industry-card-line{
  width: 60%;
  height: 2px;
  background: var(--c-card-ln);
  margin: 12px 0 14px;
}

.industry-card-text{
  margin: 0;
  color: var(--c-card-tx);
  font-size: 14.5px;
  line-height: 1.75;
  max-width: 720px;
}

/* ✅ Yazı turuncu kutudan değil resmin yanından başlasın + sağa yapışmasın */
.industry-card.is-leftText .industry-panel{
  margin-left: 0px;
  padding-right: var(--panel-pad);
}
.industry-card.is-rightText .industry-panel{
  margin-right: 0px;
  padding-left: var(--panel-pad);
}

/* Kart başına varsayılanlar (her kart override edebilir) */
.industry-card{
  --img-scale: 1.30;   /* default */
  --img-shift: 20px;   /* default dışa kayma */
  --img-shift-y: 0px;  /* default dikey */
}

/* media: inline --media-size gelirse otomatik değişir */
.industry-media{
  position: relative;
  overflow: visible;
}

/* inner gerçekten hizalama yapsın */
.industry-media-inner{
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center; /* dikey merkez */
}

/* resim boyut + konum */
.industry-img{
  height: calc(100% * var(--img-scale));
  width: auto;
  object-fit: contain;
  display: block;
  max-width: none;
}

/* yön: leftText'te dışa sağ, rightText'te dışa sol */
.industry-card.is-leftText .industry-media-inner{ justify-content: flex-end; }
.industry-card.is-leftText .industry-img{
  transform: translate(var(--img-shift), var(--img-shift-y));
}

.industry-card.is-rightText .industry-media-inner{ justify-content: flex-start; }
.industry-card.is-rightText .industry-img{
  transform: translate(calc(var(--img-shift) * -1), var(--img-shift-y));
}

/* responsive */
@media (max-width: 980px){
  :root{
    --media-size: 260px;
    --card-gap: 22px;
    --panel-pull: 0px;
    --panel-pad: 16px;
    --img-shift: 0px;
    --img-scale: 1.05;
  }

  .industry-card-text{
    max-width: 100%;
    line-height: 1.55;
  }

  .industry-card,
  .industry-card.is-rightText{
    grid-template-columns: 1fr;
    row-gap: 18px;
    width: 100% !important;     /* <-- en kritik satır */
    margin: 0 !important;       /* istersen 0 6px de olur */
  }

  .industry-panel{
    padding: 0 6px;             /* yazıyı kenara yaklaştırır */
  }

  .industry-card.is-rightText .industry-media,
  .industry-card.is-rightText .industry-panel{
    order: initial;
  }

  .industry-media{
    width: 100%;
    height: clamp(180px, 40vw, 240px);
    overflow: hidden;
    margin: 0 6px;
  }

  .industry-media-inner{
    position: static;
    width: 100%;
    height: 100%;
    justify-content: center;
  }

  .industry-img{
    height: 100%;
    width: 100%;
    object-fit: contain;
    transform: none !important;
  }

  .industry-card-title{ font-size: 28px; }
  .industry-card-line{ width: 90%; }

  .industry-title{
    margin: 40px 0 20px;
    font-size: clamp(28px, 6vw, 36px);
  }

  .industry-lead{
    font-size: 14px;
    padding: 0 16px;
  }

  .industry-divider{
    width: 90%;
  }
}