@charset "UTF-8";

/* =========================================================
   DOSYA: /assets/hakkimizda.css
   ANTALYA TEMİZ ELLER - HAKKIMIZDA FINAL
   Yapı:
   Sol: Başlık + Açıklama + Hizmet Kartları + Buton
   Sağ: Görsel + 7/24 Destek Kartı
========================================================= */

:root{
  --ks27-about-primary:var(--ks27ph-button,#0057b8);
  --ks27-about-secondary:var(--ks27ph-link,#18b8e8);
  --ks27-about-glow:var(--ks27ph-button-glow,rgba(0,87,184,.30));
  --ks27-about-deep:#020817;
  --ks27-about-dark:#06111f;
  --ks27-about-text:#07111f;
  --ks27-about-muted:#5f7088;
  --ks27-about-white:#ffffff;
  --ks27-about-soft:#f5f9ff;
  --ks27-about-border:rgba(15,23,42,.10);
}

/* =========================================================
   ANA ALAN
========================================================= */

.ks27-about{
  position:relative!important;
  width:100%!important;
  margin:0!important;
  padding:82px 0 96px!important;
  overflow:hidden!important;
  isolation:isolate!important;
  background:
    radial-gradient(circle at 14% 18%,rgba(24,184,232,.12),transparent 34%),
    radial-gradient(circle at 86% 22%,rgba(0,87,184,.16),transparent 34%),
    linear-gradient(120deg,#f7fbff 0%,#ffffff 46%,#06111f 46.15%,#06111f 100%)!important;
  font-family:Arial, Helvetica, sans-serif!important;
}

.ks27-about::before{
  content:"";
  position:absolute;
  left:-18%;
  top:-14%;
  width:48%;
  height:58%;
  z-index:-1;
  pointer-events:none;
  background:radial-gradient(circle,rgba(24,184,232,.18),transparent 68%);
}

.ks27-about::after{
  content:"";
  position:absolute;
  right:-18%;
  bottom:-20%;
  width:52%;
  height:62%;
  z-index:-1;
  pointer-events:none;
  background:radial-gradient(circle,rgba(0,87,184,.16),transparent 68%);
}

.ks27-about .ks27-container{
  position:relative!important;
  z-index:2!important;
  width:min(1540px,calc(100% - 72px))!important;
  margin:0 auto!important;
  padding:0!important;
}

/* =========================================================
   GRID
========================================================= */

.ks27-about-grid{
  position:relative!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(500px,.94fr)!important;
  align-items:center!important;
  gap:58px!important;
  width:100%!important;
}

/* =========================================================
   SOL ALAN
========================================================= */

.ks27-about-left{
  position:relative!important;
  z-index:3!important;
  width:100%!important;
  max-width:790px!important;
}

/* Küçük Hakkımızda etiketi */
.ks27-about .ks27-about-badge{
  position:relative!important;
  inset:auto!important;
  right:auto!important;
  bottom:auto!important;
  width:auto!important;
  min-width:0!important;
  max-width:max-content!important;
  min-height:34px!important;
  margin:0!important;
  padding:8px 18px!important;
  border-radius:999px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  color:var(--ks27-about-primary)!important;
  background:
    linear-gradient(135deg,rgba(0,87,184,.08),rgba(24,184,232,.10))!important;
  border:1px solid rgba(0,87,184,.17)!important;
  box-shadow:0 12px 28px rgba(0,87,184,.08)!important;
  font-size:12px!important;
  line-height:1!important;
  font-weight:950!important;
  letter-spacing:.13em!important;
  text-transform:uppercase!important;
  text-decoration:none!important;
  transform:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}

/* Başlık */
.ks27-about-left h2{
  margin:18px 0 0!important;
  color:var(--ks27-about-primary)!important;
  font-size:clamp(42px,4.15vw,76px)!important;
  line-height:1.02!important;
  font-weight:950!important;
  letter-spacing:-.067em!important;
  text-shadow:0 14px 32px rgba(0,87,184,.10)!important;
}

/* Açıklama */
.ks27-about-text{
  width:min(760px,100%)!important;
  margin:20px 0 0!important;
  color:var(--ks27-about-text)!important;
  font-size:17px!important;
  line-height:1.76!important;
  font-weight:760!important;
}

/* =========================================================
   SOLDAKİ HİZMET / ÖZELLİK KARTLARI
========================================================= */

.ks27-about-features{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:16px!important;
  margin:30px 0 0!important;
  padding:0!important;
}

.ks27-about-feature{
  position:relative!important;
  min-height:114px!important;
  padding:21px 22px 19px!important;
  border-radius:24px!important;
  overflow:hidden!important;
  background:
    radial-gradient(circle at top left,rgba(24,184,232,.10),transparent 42%),
    linear-gradient(180deg,#ffffff 0%,#f7fbff 100%)!important;
  border:1px solid var(--ks27-about-border)!important;
  box-shadow:
    0 18px 42px rgba(15,23,42,.075),
    inset 0 1px 0 rgba(255,255,255,.90)!important;
}

.ks27-about-feature::before{
  content:""!important;
  position:absolute!important;
  left:22px!important;
  top:0!important;
  width:72px!important;
  height:3px!important;
  border-radius:999px!important;
  background:linear-gradient(90deg,var(--ks27-about-primary),var(--ks27-about-secondary))!important;
}

.ks27-about-feature strong{
  display:block!important;
  margin:0!important;
  color:var(--ks27-about-primary)!important;
  font-size:17px!important;
  line-height:1.25!important;
  font-weight:950!important;
  letter-spacing:-.02em!important;
}

.ks27-about-feature span{
  display:block!important;
  margin:9px 0 0!important;
  color:var(--ks27-about-text)!important;
  font-size:13.7px!important;
  line-height:1.56!important;
  font-weight:720!important;
}

/* Buton */
.ks27-about-action{
  margin:28px 0 0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
}

.ks27-about-action .ks27-btn{
  min-height:50px!important;
  padding:0 28px!important;
  border-radius:16px!important;
  color:#ffffff!important;
  background:linear-gradient(135deg,var(--ks27-about-primary),var(--ks27-about-secondary))!important;
  box-shadow:
    0 16px 34px var(--ks27-about-glow),
    0 0 24px rgba(24,184,232,.18)!important;
  font-size:14px!important;
  font-weight:950!important;
  text-decoration:none!important;
}

/* =========================================================
   SAĞ GÖRSEL ALANI
========================================================= */

.ks27-about-right{
  position:relative!important;
  z-index:3!important;
  width:100%!important;
  min-width:0!important;
}

.ks27-about-image{
  position:relative!important;
  width:100%!important;
  min-height:430px!important;
  border-radius:34px!important;
  overflow:hidden!important;
  background:#ffffff!important;
  border:1px solid rgba(255,255,255,.22)!important;
  box-shadow:
    0 34px 90px rgba(0,0,0,.26),
    0 0 38px rgba(24,184,232,.13)!important;
}

.ks27-about-image::before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  z-index:2!important;
  pointer-events:none!important;
  background:
    linear-gradient(to top,rgba(2,8,23,.22),transparent 52%),
    radial-gradient(circle at top right,rgba(24,184,232,.15),transparent 42%)!important;
}

.ks27-about-image img{
  display:block!important;
  width:100%!important;
  height:430px!important;
  min-height:430px!important;
  object-fit:cover!important;
  object-position:center center!important;
  filter:contrast(1.09) saturate(1.15) brightness(1.06)!important;
}

/* =========================================================
   7/24 DESTEK KARTI
========================================================= */

.ks27-about-support{
  position:absolute!important;
  right:28px!important;
  bottom:-30px!important;
  z-index:6!important;
  width:min(320px,72%)!important;
  padding:24px 28px!important;
  border-radius:24px!important;
  color:#ffffff!important;
  background:
    radial-gradient(circle at top left,rgba(24,184,232,.20),transparent 42%),
    linear-gradient(135deg,rgba(2,8,23,.94),rgba(7,17,31,.86))!important;
  border:1px solid rgba(255,255,255,.16)!important;
  box-shadow:
    0 24px 58px rgba(0,0,0,.32),
    inset 0 1px 0 rgba(255,255,255,.14)!important;
  backdrop-filter:blur(16px) saturate(1.18)!important;
  -webkit-backdrop-filter:blur(16px) saturate(1.18)!important;
}

.ks27-about-support strong{
  display:block!important;
  margin:0!important;
  color:var(--ks27-about-secondary)!important;
  font-size:42px!important;
  line-height:1!important;
  font-weight:950!important;
  letter-spacing:-.045em!important;
}

.ks27-about-support span{
  display:block!important;
  margin:8px 0 0!important;
  color:rgba(255,255,255,.92)!important;
  font-size:14px!important;
  line-height:1.45!important;
  font-weight:850!important;
}

/* =========================================================
   DESKTOP ORTA
========================================================= */

@media(max-width:1500px){
  .ks27-about{
    padding:74px 0 90px!important;
  }

  .ks27-about .ks27-container{
    width:calc(100% - 52px)!important;
  }

  .ks27-about-grid{
    grid-template-columns:minmax(0,1fr) minmax(450px,.92fr)!important;
    gap:44px!important;
  }

  .ks27-about-image,
  .ks27-about-image img{
    height:400px!important;
    min-height:400px!important;
  }

  .ks27-about-left h2{
    font-size:clamp(40px,4vw,68px)!important;
  }
}

/* =========================================================
   TABLET
========================================================= */

@media(max-width:1199px){
  .ks27-about{
    padding:64px 0 82px!important;
    background:
      radial-gradient(circle at top left,rgba(24,184,232,.11),transparent 36%),
      linear-gradient(180deg,#ffffff 0%,#f7fbff 53%,#06111f 53.2%,#06111f 100%)!important;
  }

  .ks27-about .ks27-container{
    width:100%!important;
    max-width:100%!important;
    padding:0 18px!important;
  }

  .ks27-about-grid{
    grid-template-columns:1fr!important;
    gap:34px!important;
  }

  .ks27-about-left{
    max-width:100%!important;
  }

  .ks27-about-features{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  .ks27-about-image,
  .ks27-about-image img{
    height:390px!important;
    min-height:390px!important;
  }
}

/* =========================================================
   MOBİL FULL RESPONSIVE
========================================================= */

@media(max-width:767px){
  .ks27-about{
    padding:48px 0 66px!important;
    background:
      radial-gradient(circle at top left,rgba(24,184,232,.10),transparent 38%),
      linear-gradient(180deg,#ffffff 0%,#f7fbff 60%,#06111f 60.2%,#06111f 100%)!important;
  }

  .ks27-about .ks27-container{
    width:100%!important;
    max-width:100%!important;
    padding:0!important;
    margin:0!important;
  }

  .ks27-about-grid{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:28px!important;
    width:100%!important;
  }

  .ks27-about-left{
    width:100%!important;
    max-width:100%!important;
    padding:0 16px!important;
  }

  .ks27-about .ks27-about-badge{
    min-height:30px!important;
    padding:7px 14px!important;
    font-size:10.5px!important;
    letter-spacing:.11em!important;
  }

  .ks27-about-left h2{
    margin-top:14px!important;
    font-size:36px!important;
    line-height:1.08!important;
    letter-spacing:-.052em!important;
  }

  .ks27-about-text{
    margin-top:14px!important;
    font-size:15px!important;
    line-height:1.62!important;
  }

  .ks27-about-features{
    grid-template-columns:1fr!important;
    gap:12px!important;
    margin-top:22px!important;
  }

  .ks27-about-feature{
    min-height:auto!important;
    padding:18px 18px 16px!important;
    border-radius:20px!important;
  }

  .ks27-about-feature strong{
    font-size:16px!important;
  }

  .ks27-about-feature span{
    font-size:13.4px!important;
  }

  .ks27-about-action{
    margin-top:20px!important;
  }

  .ks27-about-action .ks27-btn{
    width:100%!important;
    min-height:48px!important;
  }

  .ks27-about-right{
    width:100vw!important;
    max-width:100vw!important;
    margin:0!important;
    padding:0!important;
  }

  .ks27-about-image{
    width:100vw!important;
    max-width:100vw!important;
    height:310px!important;
    min-height:310px!important;
    border-radius:0!important;
    border-left:0!important;
    border-right:0!important;
    box-shadow:
      0 24px 60px rgba(0,0,0,.22),
      0 0 28px rgba(24,184,232,.10)!important;
  }

  .ks27-about-image img{
    width:100%!important;
    height:310px!important;
    min-height:310px!important;
    object-fit:cover!important;
    object-position:center center!important;
  }

  .ks27-about-support{
    position:relative!important;
    right:auto!important;
    bottom:auto!important;
    width:calc(100% - 28px)!important;
    margin:-36px auto 0!important;
    padding:18px 20px!important;
    border-radius:20px!important;
  }

  .ks27-about-support strong{
    font-size:34px!important;
  }

  .ks27-about-support span{
    font-size:13px!important;
  }
}

/* =========================================================
   KÜÇÜK MOBİL
========================================================= */

@media(max-width:420px){
  .ks27-about-left{
    padding:0 14px!important;
  }

  .ks27-about-left h2{
    font-size:33px!important;
  }

  .ks27-about-text{
    font-size:14.4px!important;
  }

  .ks27-about-image,
  .ks27-about-image img{
    height:280px!important;
    min-height:280px!important;
  }

  .ks27-about-support{
    width:calc(100% - 24px)!important;
    padding:16px 18px!important;
  }
}