/* ==========================================================================
   AIXION — Yapay Zekâ ve Akıllı Uygulama Platformu
   Tasarım ASVARIS sitesine native olarak gömülüdür (#dc-root).
   Bu dosya yalnızca duyarlı davranışı ve site ile çakışmaları giderir;
   renk ve tipografi tasarımın kendi stillerindedir.
   ========================================================================== */

.aixion-ai { display: block; width: 100%; margin: 0; padding: 0; }
#dc-root { display: block; width: 100%; }
#dc-root img { max-width: 100%; }

/* Sabit başlık altında kalan çapaları düzelt */
#dc-root section[id] { scroll-margin-top: 90px; }

/* --------------------------------------------------- 1200px ve altı ------ */
@media (max-width: 1200px) {
  #dc-root section { padding-left: 28px !important; padding-right: 28px !important; }
}

/* --------------------------------------------------- 1080px ve altı ------ */
@media (max-width: 1080px) {
  /* Beş kolonlu yürütüm modeli şeridi ikişerli iner */
  #dc-root .ax-5col { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 14px !important; }
}

/* --------------------------------------------------- 980px ve altı ------- */
@media (max-width: 980px) {
  #dc-root .ax-2col { grid-template-columns: minmax(0, 1fr) !important; }
  #dc-root .ax-3col { grid-template-columns: minmax(0, 1fr) !important; }

  /* VIXION/PIXION → AIXION → çıktılar akışı dikeye döner.
     Aradaki bağlantı sütunları (SVG eğrileri) dikeyde anlamsız kalır. */
  #dc-root .ax-akis { grid-template-columns: minmax(0, 1fr) !important; gap: 20px !important; }
  #dc-root .ax-akis > div:nth-child(2),
  #dc-root .ax-akis > div:nth-child(4) { display: none !important; }

  /* Geniş görseller sayfayı taşırmasın */
  #dc-root .ax-wrap { overflow-x: auto; overflow-y: visible; }

  #dc-root section { padding-top: 56px !important; padding-bottom: 56px !important; }
}

/* --------------------------------------------------- 760px ve altı ------- */
@media (max-width: 760px) {
  #dc-root section { padding-left: 20px !important; padding-right: 20px !important; }

  #dc-root h1 { font-size: clamp(28px, 8vw, 40px) !important; }
  #dc-root h2 { font-size: clamp(24px, 6.4vw, 34px) !important; }
  #dc-root h3 { font-size: clamp(18px, 5vw, 24px) !important; }

  #dc-root .ax-5col { grid-template-columns: minmax(0, 1fr) !important; }

  /* Hero: dairesel döngü görseli okunur bir listeye dönüşür */
  #dc-root .ax-hero-art {
    aspect-ratio: auto !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 12px !important;
  }
  #dc-root .ax-hero-art > span,
  #dc-root .ax-hero-art > svg { display: none !important; }
  #dc-root .ax-hero-art > div:last-child { width: 168px !important; order: -1; }
  #dc-root .ax-cyc {
    position: relative !important;
    width: 100% !important;
    transform: none !important;
    text-align: left !important;
    top: auto !important; left: auto !important;
    padding-left: 18px;
  }
  #dc-root .ax-cyc::before {
    content: ""; position: absolute; left: 0; top: 9px;
    width: 7px; height: 7px; border-radius: 50%; background: #6528E0;
  }
  #dc-root .ax-cyc span { color: #55506B !important; text-shadow: none !important; }
}

/* --------------------------------------------------- hareket tercihi ----- */
@media (prefers-reduced-motion: reduce) {
  #dc-root *,
  #dc-root *::before,
  #dc-root *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
  }
}
