
/* ── RESET & KAPSAM ─────────────────────────────────────── */
.inci-about *, .inci-about *::before, .inci-about *::after {
  box-sizing: border-box;
}
.inci-about {
  --ab1: #07174A;
  --ab2: #1547E8;
  --ab3: #4A7FFF;
  --ab4: #C8DAFF;
  --gold: #F5C842;
  --gold2: #D4A520;
  --gold3: rgba(245,200,66,.12);
  --txt1: #0B1D4F;
  --txt2: #4A5C8A;
  --txt3: #8899BB;
  --bg:   #F2F6FF;
  --white: #FFFFFF;
  --border: rgba(20,71,232,.10);
  --sh: rgba(20,71,232,.12);
  --sh-gold: rgba(245,200,66,.25);
  --ease: cubic-bezier(.22,1,.36,1);
  font-family: 'Plus Jakarta Sans', 'Inter', sans-serif;
  position: relative;
  min-height: 100vh;
  display: flex;
  align-items: center;
  overflow: hidden;
  padding: 80px 0;
  /* background BURADAN CIKARILDI - artik include'den gelir */
}
@media(max-width:1023px){ .inci-about{ padding:60px 0 } }
@media(max-width:767px){  .inci-about{ padding:48px 0 } }

/* ⚠️ TÜM ARKAPLAN CSS BLOKLARI ÇIKARILDI:
   .ab-bg, .ab-bg-panel, .ab-bg-grid, .ab-line-top, .ab-line-bot,
   .ab-blob, .ab-dc, .ab-ring ve ilgili @keyframes (abDrift1/2, abRingPulse)
   Bunlarin hepsi artik ARKAPLAN BLADE icinde tanimli */

/* ── KONTEYNER ──────────────────────────────────────────── */
.ab-wrap {
  position:relative;z-index:10;
  width:100%;max-width:1280px;
  margin:0 auto;
  padding:0 32px;
}
@media(max-width:767px){ .ab-wrap{ padding:0 20px } }

/* ── GRID ───────────────────────────────────────────────── */
.ab-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:center;
  gap:64px;
}
@media(max-width:1023px){ .ab-grid{ gap:48px } }
@media(max-width:767px){
  .ab-grid{
    grid-template-columns:1fr;
    gap:36px;
  }
  .ab-img-col{ order:1 }
  .ab-txt-col{ order:2 }
}

/* ══════════════════════════════════════════════════════════
   GÖRSEL TARAF
══════════════════════════════════════════════════════════ */
.ab-img-col { position:relative }

.ab-img-group {
  position:relative;
  display:inline-block;
  width:100%;
}

/* Arkadaki yüzen çerçeve */
.ab-img-frame {
  position:absolute;
  top:-14px;right:-14px;
  width:100%;height:100%;
  border:2px solid rgba(20,71,232,.14);
  border-radius:20px;
  z-index:0;
  transition:border-color .5s var(--ease);
}
.ab-img-group:hover .ab-img-frame {
  border-color:rgba(20,71,232,.30);
}

/* Köşe süs çizgileri */
.ab-corner {
  position:absolute;z-index:20;
  width:52px;height:52px;
  transition:all .6s var(--ease);
  pointer-events:none;
}
.ab-corner-tl {
  top:-10px;left:-10px;
  border-top:2.5px solid var(--gold);
  border-left:2.5px solid var(--gold);
  border-radius:12px 0 0 0;
}
.ab-corner-br {
  bottom:-10px;right:-10px;
  border-bottom:2.5px solid var(--gold);
  border-right:2.5px solid var(--gold);
  border-radius:0 0 12px 0;
}
.ab-img-group:hover .ab-corner { width:64px;height:64px }

/* Ana resim kutusu */
.ab-img-box {
  position:relative;z-index:5;
  overflow:hidden;
  border-radius:18px;
  border:1.5px solid rgba(20,71,232,.12);
  box-shadow:0 24px 56px var(--sh),0 8px 20px rgba(0,0,0,.06);
  transition:box-shadow .5s var(--ease),border-color .5s var(--ease);
}
.ab-img-group:hover .ab-img-box {
  box-shadow:0 32px 72px rgba(20,71,232,.18),0 10px 24px rgba(0,0,0,.08);
  border-color:rgba(20,71,232,.24);
}

/* Resim oranı */
.ab-img-ratio {
  position:relative;
  aspect-ratio:4/3;
  background:var(--ab4);
  overflow:hidden;
}
@media(max-width:767px){ .ab-img-ratio{ aspect-ratio:16/9 } }

.ab-img-ratio img {
  width:100%;height:100%;
  object-fit:cover;
  transition:transform 1.1s var(--ease);
}
.ab-img-group:hover .ab-img-ratio img { transform:scale(1.06) }

/* Resim üstü hafif overlay */
.ab-img-ov {
  position:absolute;inset:0;
  background:linear-gradient(to top,rgba(7,23,74,.18) 0%,transparent 50%);
  opacity:0;
  transition:opacity .5s ease;
}
.ab-img-group:hover .ab-img-ov { opacity:1 }

/* Kurumsal rozeti */
.ab-badge {
  position:absolute;top:14px;right:14px;z-index:10;
  display:inline-flex;align-items:center;gap:6px;
  padding:6px 14px;
  background:linear-gradient(135deg,var(--gold) 0%,var(--gold2) 100%);
  border-radius:10px;
  box-shadow:0 6px 18px var(--sh-gold);
  transform:rotate(2deg);
  transition:transform .45s var(--ease),box-shadow .45s var(--ease);
}
.ab-img-group:hover .ab-badge {
  transform:rotate(0deg) scale(1.06);
  box-shadow:0 10px 26px rgba(245,200,66,.40);
}
.ab-badge span {
  font-size:9.5px;font-weight:800;
  letter-spacing:.18em;text-transform:uppercase;color:var(--ab1);
}

/* Sağ kenar vurgu çizgisi */
.ab-side-line {
  position:absolute;
  right:-10px;top:50%;transform:translateY(-50%);
  width:3px;height:0;border-radius:2px;
  background:linear-gradient(to bottom,var(--ab2),var(--gold),var(--ab2));
  transition:height .7s var(--ease);
  z-index:6;
}
.ab-img-group:hover .ab-side-line { height:120px }

/* İstatistik kartı — resmin üstüne oturur */
.ab-stat-card {
  position:absolute;
  bottom:-22px;left:-22px;z-index:20;
  display:flex;align-items:center;gap:12px;
  padding:12px 18px;
  background:rgba(255,255,255,.94);
  backdrop-filter:blur(20px);
  border:1px solid var(--border);
  border-radius:14px;
  box-shadow:0 12px 32px var(--sh),0 2px 8px rgba(0,0,0,.04);
  transition:transform .35s var(--ease),box-shadow .35s var(--ease);
}
.ab-stat-card:hover {
  transform:translateY(-3px);
  box-shadow:0 18px 40px rgba(20,71,232,.16);
}
.ab-stat-ic {
  width:40px;height:40px;border-radius:10px;flex-shrink:0;
  background:linear-gradient(135deg,var(--ab2),var(--ab3));
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 4px 12px var(--sh);
}
.ab-stat-ic svg { width:18px;height:18px;stroke:#fff;stroke-width:2;fill:none }
.ab-stat-num {
  font-size:1.35rem;font-weight:900;
  background:linear-gradient(135deg,var(--ab2),var(--ab1));
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;
  background-clip:text;
  line-height:1;
}
.ab-stat-lbl { font-size:10.5px;font-weight:600;color:var(--txt2);margin-top:2px }

/* ══════════════════════════════════════════════════════════
   METİN TARAF
══════════════════════════════════════════════════════════ */
.ab-txt-col {
  display:flex;flex-direction:column;gap:22px;
}
@media(max-width:767px){ .ab-txt-col{ text-align:center;align-items:center } }

/* Eyebrow rozeti */
.ab-eyebrow {
  display:inline-flex;align-items:center;gap:8px;
  padding:6px 16px 6px 10px;
  background:rgba(20,71,232,.07);
  border:1px solid rgba(20,71,232,.16);
  border-radius:999px;
  transition:background .25s ease,border-color .25s ease;
  cursor:default;
}
.ab-eyebrow:hover {
  background:rgba(20,71,232,.12);
  border-color:rgba(20,71,232,.28);
}
.ab-ew-dot {
  width:6px;height:6px;border-radius:50%;
  background:var(--ab2);flex-shrink:0;
  animation:abDotPulse 2s ease-in-out infinite;
}
@keyframes abDotPulse{
  0%,100%{ box-shadow:0 0 0 0 rgba(20,71,232,.40) }
  50%    { box-shadow:0 0 0 5px rgba(20,71,232,.0) }
}
.ab-ew-ic { color:var(--ab2) }
.ab-ew-ic svg { width:14px;height:14px;stroke:currentColor;stroke-width:2;fill:none }
.ab-eyebrow span {
  font-size:9.5px;font-weight:800;
  letter-spacing:.16em;text-transform:uppercase;color:var(--ab2);
}

/* Başlık */
.ab-title {
  font-size:clamp(2rem,4.5vw,3.6rem);
  font-weight:900;
  line-height:1.04;
  letter-spacing:-.025em;
  color:var(--txt1);
}

/* Altın ayraç */
.ab-divider {
  display:flex;align-items:center;gap:10px;
}
@media(max-width:767px){ .ab-divider{ justify-content:center } }
.ab-div-line {
  height:3px;width:56px;border-radius:2px;
  background:linear-gradient(to right,var(--gold),var(--gold2));
}
.ab-div-line2 {
  height:3px;width:36px;border-radius:2px;
  background:linear-gradient(to right,var(--gold2),transparent);
}
.ab-div-diamond {
  width:10px;height:10px;
  background:linear-gradient(135deg,var(--gold),var(--gold2));
  transform:rotate(45deg);
  box-shadow:0 2px 8px var(--sh-gold);
  flex-shrink:0;
}

/* Açıklama */
.ab-desc {
  font-size:1.04rem;line-height:1.82;
  color:var(--txt2);font-weight:400;
  max-width:500px;
  text-align:justify;
}
@media(max-width:767px){ .ab-desc{ text-align:center;max-width:100% } }

/* İstatistik satırı */
.ab-stats {
  display:flex;flex-wrap:wrap;gap:16px;
}
@media(max-width:767px){ .ab-stats{ justify-content:center } }

.ab-stat {
  display:flex;align-items:center;gap:12px;
  padding:14px 18px;
  background:rgba(255,255,255,.85);
  border:1px solid var(--border);
  border-radius:14px;
  box-shadow:0 2px 10px var(--sh),inset 0 1px 0 rgba(255,255,255,.9);
  transition:transform .25s var(--ease),box-shadow .25s var(--ease),border-color .25s var(--ease);
  cursor:default;
}
.ab-stat:hover {
  transform:translateY(-3px);
  box-shadow:0 10px 28px rgba(20,71,232,.12);
  border-color:rgba(20,71,232,.20);
}
.ab-stat-icon {
  width:46px;height:46px;border-radius:12px;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 4px 14px rgba(0,0,0,.12);
  transition:transform .25s var(--ease);
}
.ab-stat:hover .ab-stat-icon { transform:scale(1.08) }
.ab-stat-icon svg { width:20px;height:20px;stroke:#fff;stroke-width:2;fill:none }
.ab-stat-val {
  font-size:1.55rem;font-weight:900;line-height:1;
  background:linear-gradient(135deg,var(--ab2),var(--ab1));
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;
  background-clip:text;
}
.ab-stat-name { font-size:11px;font-weight:600;color:var(--txt2);margin-top:2px }

/* CTA Buton */
.ab-cta {
  display:inline-flex;align-items:center;gap:10px;
  padding:14px 28px;
  background:linear-gradient(135deg,var(--ab2) 0%,var(--ab3) 100%);
  color:#fff;font-size:13.5px;font-weight:800;
  border-radius:12px;text-decoration:none;
  letter-spacing:.02em;
  box-shadow:0 10px 28px rgba(20,71,232,.28),inset 0 1px 0 rgba(255,255,255,.18);
  transition:transform .22s var(--ease),box-shadow .22s var(--ease);
  position:relative;overflow:hidden;
  align-self:flex-start;
}
@media(max-width:767px){ .ab-cta{ align-self:center } }
.ab-cta::before {
  content:'';position:absolute;inset:0;
  background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.22) 50%,transparent 70%);
  transform:translateX(-100%);transition:transform .5s ease;
}
.ab-cta:hover { transform:translateY(-3px);box-shadow:0 16px 38px rgba(20,71,232,.34) }
.ab-cta:hover::before { transform:translateX(100%) }
.ab-cta svg { width:16px;height:16px;stroke:#fff;stroke-width:2.5;fill:none;flex-shrink:0;transition:transform .22s var(--ease) }
.ab-cta:hover .ab-cta-arrow { transform:translateX(4px) }

/* Güven şeridi */
.ab-trust {
  display:flex;align-items:center;gap:14px;
  padding:12px 16px;
  background:rgba(255,255,255,.80);
  border:1px solid var(--border);
  border-radius:12px;
  width:fit-content;
  box-shadow:0 2px 8px var(--sh);
}
@media(max-width:767px){ .ab-trust{ align-self:center } }
.ab-avatars { display:flex }
.ab-avatar {
  width:36px;height:36px;border-radius:50%;
  border:2px solid #fff;
  margin-left:-10px;
  box-shadow:0 2px 6px rgba(0,0,0,.10);
}
.ab-avatar:first-child { margin-left:0 }
.ab-trust-txt { line-height:1 }
.ab-trust-title { font-size:12px;font-weight:800;color:var(--txt1) }
.ab-trust-stars { display:flex;align-items:center;gap:2px;margin-top:3px }
.ab-trust-stars svg { width:11px;height:11px;fill:var(--gold) }
.ab-trust-score { font-size:10px;font-weight:700;color:var(--txt2);margin-left:3px }

/* ── ALT SÜSLEME ÇIZGISI ────────────────────────────────── */
.ab-foot {
  position:relative;z-index:10;
  width:100%;max-width:1280px;
  margin:56px auto 0;
  padding:0 32px;
  display:flex;align-items:center;justify-content:center;gap:10px;
}
@media(max-width:767px){ .ab-foot{ margin-top:40px;padding:0 20px } }
.ab-foot-line {
  height:1.5px;border-radius:1px;
  background:linear-gradient(to right,transparent,rgba(20,71,232,.25));
}
.ab-foot-line.rev {
  background:linear-gradient(to left,transparent,rgba(20,71,232,.25));
}
.ab-foot-d {
  width:8px;height:8px;flex-shrink:0;
  transform:rotate(45deg);
  background:linear-gradient(135deg,var(--ab2),var(--gold));
  box-shadow:0 2px 8px var(--sh-gold);
}
