/* ==========================================================
   ABOUT-US — FINAL (tekilleştirilmiş / çakışmasız)
   - Typed text: “Mirai” sabit, sağ taraf değişir
   - Listeler: sol hizalı + ikonlu
   - DNA Callout: border’sız premium glass
   - Logo effect: tek bir sürüm (responsive)
   ========================================================== */


/* Typed text: HEPSİ BÜYÜK HARF ve HİZALI */
#about-us [data-typed-text] {
  display: inline-block;
  transform: none !important; /* Hiza sorununu çözer (aşağı kaymayı iptal eder) */
  font-weight: 700; /* Example dosyasındaki gibi kalınlık ekler */
  font-family: inherit; /* Font ailesinin "MİRAİ" yazısı ile aynı olmasını garantiler */
}

/* Kapsayıcı ayarı: Baseline (taban çizgisi) hizalaması */
#about-us .mirai-typed-title {
  display: inline-flex;
  align-items: baseline; /* İki metni de taban çizgisine oturtur */
  justify-content: center;
  gap: 0.35rem; /* MİRAİ ile değişen yazı arasındaki boşluk */
  flex-wrap: wrap; /* Mobilde taşmayı önler */
}





/* ABOUT-US — Typed title (Mirai sabit kalsın) */
#about-us .mirai-typed-title{
  display: inline-flex;
  align-items: baseline;
  justify-content: center;
  gap: .35rem;
}

#about-us .mirai-word{
  flex: 0 0 auto;
}

#about-us .mirai-typed{
  display: inline-block;
  min-width: 22ch;          /* en uzun ifadeyi karşılar, Mirai oynamaz */
  text-align: left;
  white-space: nowrap;
}

#about-us .mirai-typed .typed-cursor{
  display: inline-block;
  margin-left: .08em;
}

/* Mobilde daha dar */
@media (max-width: 575.98px){
  #about-us .mirai-typed{ min-width: 17ch; }
}

/* ==========================================================
   Layout hizaları
   ========================================================== */
/* Sol ve sağ kolonlar soldan; orta logo ortada */
#about-us .row.align-items-center > .col-md-4:first-child,
#about-us .row.align-items-center > .col-md-4:last-child{
  text-align: left;
}

#about-us .row.align-items-center > .col-md-4:nth-child(2){
  text-align: center;
}

/* ==========================================================
   Listeler (tek kural seti)
   ========================================================== */
#about-us .about-list{
  padding-left: 0;
  margin: 0;
  text-align: left;
}

#about-us .about-list li{
  list-style: none;
  margin-bottom: 12px;
  padding-left: 28px;
  position: relative;
  line-height: 1.55;
  font-size: 15px;
}

#about-us .about-list li::before{
  content: "\f058"; /* check-circle */
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  position: absolute;
  left: 0;
  top: 2px;
  font-size: 16px;
  color: #3e5781;
  display: block;
}

/* ==========================================================
   Alt özet
   ========================================================== */
#about-us .about-summary{
  max-width: 920px;
  margin: 1.25rem auto 0;
  line-height: 1.65;
  color: #56606b;
}

/* ==========================================================
   Premium DNA Callout (border’sız soft glass)
   ========================================================== */
#about-us .mirai-dna-callout{
  max-width: 920px;
  margin: 1.75rem auto 0;
  padding: 1.05rem 1.25rem;
  border-radius: 18px;

  background: linear-gradient(135deg, rgba(62,87,129,.10), rgba(255,255,255,.86));
  box-shadow: 0 18px 45px rgba(0,0,0,.08);

  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

#about-us .mirai-dna-title{
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  font-size: .78rem;
  color: rgba(62,87,129,.95);
  margin-bottom: .35rem;
}

#about-us .mirai-dna-text{
  font-style: italic;
  color: #56606b;
  line-height: 1.65;
}

/* ==========================================================
   About görsel yardımcı sınıf (korundu)
   ========================================================== */
.about-circle-img{
  width: 100%;
  aspect-ratio: 1/1;
  object-fit: contain;
  border-radius: 50%;
  padding: 20px;
  border: 1px solid #e5e7eb;
  background: #fff;
}

/* ==========================================================
   Mirai Logo Effect (tek sürüm / responsive)
   ========================================================== */
#about-us .mirai-logo-effect{
  position: relative;
  width: 320px;
  height: 320px;
  max-width: 100%;
  margin: 0 auto;
}

#about-us .mirai-core-img{
  width: 100%;
  height: 100%;
  border-radius: 50%;
  position: relative;
  z-index: 10;
  box-shadow: 0 0 25px rgba(255, 255, 255, 0.4);
}

#about-us .mirai-glow{
  position: absolute;
  inset: -45px;
  border-radius: 50%;
  background: radial-gradient(rgba(62, 87, 129, 0.45), rgba(62, 87, 129, 0.0));
  animation: miraiGlow 8s ease-in-out infinite;
  z-index: 1;
}

#about-us .mirai-orbit{
  position: absolute;
  border-radius: 50%;
  border: 2px solid rgba(255, 255, 255, 0.55);
  z-index: 2;
}

#about-us .mirai-orbit.outer{
  inset: -35px;
  animation: orbitOuter 14s linear infinite;
}

#about-us .mirai-orbit.inner{
  inset: -15px;
  border-color: rgba(255, 255, 255, 0.25);
  animation: orbitInner 10s linear infinite reverse;
}

#about-us .mirai-particles{
  position: absolute;
  inset: -28px;
  border-radius: 50%;
  animation: particlesSpin 18s linear infinite;
  z-index: 3;
}

#about-us .mirai-particles span{
  position: absolute;
  width: 8px;
  height: 8px;
  background: #ffffff;
  border-radius: 50%;
  box-shadow: 0 0 14px rgba(255, 255, 255, 0.9);
}

#about-us .mirai-particles span:nth-child(1){ top: -4px; left: 50%; transform: translateX(-50%); }
#about-us .mirai-particles span:nth-child(2){ top: 20%; left: 100%; transform: translate(-50%, -50%); }
#about-us .mirai-particles span:nth-child(3){ top: 80%; left: 100%; transform: translate(-50%, -50%); }
#about-us .mirai-particles span:nth-child(4){ top: 100%; left: 50%; transform: translate(-50%, -50%); }
#about-us .mirai-particles span:nth-child(5){ top: 80%; left: 0%; transform: translate(-50%, -50%); }
#about-us .mirai-particles span:nth-child(6){ top: 20%; left: 0%; transform: translate(-50%, -50%); }
#about-us .mirai-particles span:nth-child(7){ top: 50%; left: 100%; transform: translate(-50%, -50%); }
#about-us .mirai-particles span:nth-child(8){ top: 50%; left: 0%; transform: translate(-50%, -50%); }

/* Logo responsive */
@media (max-width: 991.98px){
  #about-us .mirai-logo-effect{
    width: 280px;
    height: 280px;
  }
}
@media (max-width: 575.98px){
  #about-us .mirai-logo-effect{
    width: 250px;
    height: 250px;
  }
  #about-us .mirai-glow{ inset: -38px; }
  #about-us .mirai-orbit.outer{ inset: -30px; }
  #about-us .mirai-orbit.inner{ inset: -12px; }
  #about-us .mirai-particles{ inset: -24px; }
}

/* Animations */
@keyframes miraiGlow{
  0%, 100%{ transform: scale(0.9); opacity: 0.5; }
  50%{ transform: scale(1.05); opacity: 1; }
}

@keyframes orbitOuter{
  from{ transform: rotate(0deg); }
  to{ transform: rotate(360deg); }
}

@keyframes orbitInner{
  from{ transform: rotate(360deg); }
  to{ transform: rotate(0deg); }
}

@keyframes particlesSpin{
  from{ transform: rotate(0deg); }
  to{ transform: rotate(360deg); }
}

/* ==========================================================
   HR (korundu)
   ========================================================== */
.hr-short{
  height: 2px;
  width: 60px;
  border: none;
  background: linear-gradient(
    to right,
    rgba(0, 0, 0, 0),
    rgba(0, 0, 0, 0.75),
    rgba(0, 0, 0, 0)
  );
}