/* =========================================================
   SEO MAKİNESİ 2027 - INDEX DESKTOP + FULL MOBİL + HIZ FINAL
   Dosya: /index.php
========================================================= */
:root{
  --ks27-index-bg:<?= ks27_idx_e($siteBg) ?>;
  --ks27-index-card:<?= ks27_idx_e($cardBg) ?>;
  --ks27-index-title:<?= ks27_idx_e($cardTitle) ?>;
  --ks27-index-text:<?= ks27_idx_e($cardText) ?>;
  --ks27-index-button:<?= ks27_idx_e($buttonColor) ?>;
  --ks27-index-button-text:<?= ks27_idx_e($buttonTextColor) ?>;
  --ks27-index-link:<?= ks27_idx_e($linkColor) ?>;
  --ks27-index-soft:<?= ks27_idx_e($linkSoft) ?>;
  --ks27-index-glow:<?= ks27_idx_e($buttonGlow) ?>;
  --ks27-index-service-bg:<?= ks27_idx_e($serviceBannerBg) ?>;
  --ks27-index-about-bg:<?= ks27_idx_e($aboutBannerBg) ?>;
  --ks27-index-review-bg:<?= ks27_idx_e($reviewSectionBg) ?>;
}

*,
*::before,
*::after{
  box-sizing:border-box;
}

html,
body{
  width:100%;
  max-width:100%;
  overflow-x:hidden;
}

body{
  background:var(--ks27-index-bg);
}

img{
  max-width:100%;
}

.ks27-main{
  width:100%;
  max-width:100%;
  overflow:hidden;
  background:
    radial-gradient(circle at top left,var(--ks27-index-soft),transparent 34%),
    var(--ks27-index-bg);
}

.ks27-container{
  width:min(1320px, calc(100% - 32px));
  margin:0 auto;
}

.ks27-section{
  position:relative;
  width:100%;
  padding:78px 0;
  content-visibility:auto;
  contain-intrinsic-size:1px 760px;
}

.ks27-section-head{
  max-width:850px;
  margin:0 auto 34px;
  text-align:center;
}

.ks27-kicker{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  margin-bottom:12px;
  padding:8px 14px;
  border-radius:999px;
  color:var(--ks27-index-link);
  background:rgba(24,184,232,.10);
  border:1px solid rgba(24,184,232,.16);
  font-size:12px;
  font-weight:950;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.ks27-title{
  margin:0;
  color:var(--ks27-index-title);
  font-size:clamp(28px,3.2vw,44px);
  line-height:1.12;
  letter-spacing:-.55px;
  font-weight:950;
}

.ks27-desc{
  max-width:760px;
  margin:14px auto 0;
  color:#64748b;
  font-size:16px;
  line-height:1.75;
}

.ks27-btn{
  min-height:46px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:12px 20px;
  border-radius:15px;
  color:var(--ks27-index-button-text) !important;
  background:linear-gradient(135deg,var(--ks27-index-button),var(--ks27-index-link));
  box-shadow:0 14px 30px var(--ks27-index-glow);
  font-size:14px;
  font-weight:950;
  text-decoration:none !important;
  border:0;
  transition:transform .2s ease, box-shadow .2s ease;
}

.ks27-btn:hover{
  transform:translateY(-2px);
  box-shadow:0 18px 40px var(--ks27-index-glow);
}

.ks27-section-action{
  margin-top:28px;
  text-align:center;
}

/* ---------- Görsel bekleme ---------- */
.ks27-media-hidden{
  display:none !important;
}

.ks27-img-missing{
  position:relative;
  overflow:hidden;
}

.ks27-media-waiting{
  position:absolute;
  inset:0;
  min-height:180px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:12px;
  text-align:center;
  color:#ffffff;
  background:
    radial-gradient(circle at 20% 20%,rgba(24,184,232,.26),transparent 34%),
    radial-gradient(circle at 80% 0%,rgba(139,92,246,.22),transparent 32%),
    linear-gradient(135deg,#07111f 0%,#0b2f57 52%,#08223f 100%);
  border:1px solid rgba(255,255,255,.12);
}

.ks27-media-waiting::before{
  content:"";
  position:absolute;
  inset:14px;
  border-radius:24px;
  border:1px dashed rgba(255,255,255,.22);
  pointer-events:none;
}

.ks27-media-waiting-icon{
  width:54px;
  height:54px;
  border-radius:18px;
  display:block;
  position:relative;
  background:linear-gradient(135deg,var(--ks27-index-button),var(--ks27-index-link));
  box-shadow:0 18px 36px var(--ks27-index-glow);
}

.ks27-media-waiting-icon::before,
.ks27-media-waiting-icon::after{
  content:"";
  position:absolute;
  border-radius:999px;
  background:rgba(255,255,255,.92);
}

.ks27-media-waiting-icon::before{
  width:22px;
  height:14px;
  left:16px;
  top:15px;
}

.ks27-media-waiting-icon::after{
  width:28px;
  height:4px;
  left:13px;
  bottom:15px;
}

.ks27-media-waiting strong{
  position:relative;
  z-index:2;
  font-size:15px;
  font-weight:900;
  letter-spacing:.02em;
}

/* =========================================================
   HERO SLIDER - HIZLI IMG TABANLI
========================================================= */
.hs27-hero{
  position:relative;
  width:100%;
  height:clamp(500px,44vw,780px);
  min-height:500px;
  max-height:780px;
  overflow:hidden;
  background:
    radial-gradient(circle at 18% 24%,rgba(24,184,232,.16),transparent 32%),
    linear-gradient(135deg,#07111f 0%,#08233a 54%,#05101d 100%);
  --hs-accent:var(--ks27-index-button);
  --hs-accent2:var(--ks27-index-link);
  --hs-dur:5600ms;
  isolation:isolate;
}

.hs27-hero.is-image-only{
  height:clamp(340px,42vw,720px);
  min-height:340px;
}

.hs27-track{
  display:flex;
  height:100%;
  will-change:transform;
  transition:transform .72s cubic-bezier(.77,0,.175,1);
}

.hs27-slide{
  position:relative;
  flex:0 0 100%;
  width:100%;
  height:100%;
  overflow:hidden;
  background:#061626;
}

.hs27-slide-img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center center;
  display:block;
  background:
    radial-gradient(circle at 50% 50%,rgba(255,255,255,.05),transparent 38%),
    #061626;
}

.hs27-slide.is-active .hs27-slide-img{
  animation:hs27SoftIn .42s ease both;
}

@keyframes hs27SoftIn{
  from{opacity:.92}
  to{opacity:1}
}

.hs27-overlay{
  position:absolute;
  inset:0;
  z-index:1;
  background:linear-gradient(90deg,rgba(4,12,30,.62) 0%,rgba(7,17,31,.30) 38%,rgba(4,12,30,.08) 72%,rgba(4,12,30,.04) 100%);
}

.hs27-slide.no-content .hs27-overlay{
  background:linear-gradient(180deg,rgba(2,8,23,.10) 0%,rgba(2,8,23,.04) 100%);
}

.hs27-ambient{
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  background:
    radial-gradient(ellipse 60% 40% at 15% 80%,rgba(24,184,232,.22),transparent 60%),
    radial-gradient(ellipse 40% 30% at 85% 20%,rgba(10,102,194,.16),transparent 55%);
}

.hs27-slide.no-content .hs27-ambient{
  display:none;
}

.hs27-waiting{
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:14px;
  color:#fff;
  z-index:1;
  background:
    radial-gradient(circle at 20% 20%,rgba(24,184,232,.22),transparent 40%),
    radial-gradient(circle at 80% 80%,rgba(10,102,194,.18),transparent 38%),
    linear-gradient(135deg,#07111f 0%,#0b2f57 55%,#08223f 100%);
}

.hs27-waiting::before{
  content:"";
  position:absolute;
  inset:22px;
  border:1.5px dashed rgba(255,255,255,.18);
  border-radius:28px;
  pointer-events:none;
}

.hs27-wait-icon{
  width:60px;
  height:60px;
  border-radius:20px;
  flex-shrink:0;
  position:relative;
  background:linear-gradient(135deg,var(--hs-accent),var(--hs-accent2));
  box-shadow:0 20px 40px var(--ks27-index-glow);
}

.hs27-wait-icon::before,
.hs27-wait-icon::after{
  content:"";
  position:absolute;
  background:rgba(255,255,255,.92);
  border-radius:999px;
}

.hs27-wait-icon::before{
  width:24px;
  height:15px;
  left:18px;
  top:17px;
}

.hs27-wait-icon::after{
  width:30px;
  height:4px;
  left:15px;
  bottom:17px;
}

.hs27-content{
  position:absolute;
  inset:0;
  z-index:10;
  display:flex;
  align-items:center;
  padding:0 clamp(20px,6vw,96px);
}

.hs27-content-inner{
  max-width:780px;
  width:100%;
}

.hs27-kicker{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:var(--hs-accent);
  font-size:clamp(12px,1.2vw,14px);
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
  margin:0 0 18px;
  opacity:0;
  transform:translateY(18px);
  transition:opacity .45s .10s ease, transform .45s .10s ease;
}

.hs27-kicker::before{
  content:"";
  width:28px;
  height:2px;
  background:var(--hs-accent);
  border-radius:2px;
  display:inline-block;
}

.hs27-heading{
  margin:0 0 20px;
  font-size:clamp(28px,5.4vw,72px);
  font-weight:950;
  line-height:1.08;
  letter-spacing:-.025em;
  color:#fff;
  text-shadow:0 4px 28px rgba(0,0,0,.38);
  opacity:0;
  transform:translateY(24px);
  transition:opacity .5s .18s ease, transform .5s .18s ease;
}

.hs27-desc{
  margin:0 0 34px;
  font-size:clamp(15px,1.6vw,19px);
  line-height:1.65;
  color:rgba(255,255,255,.82);
  max-width:560px;
  opacity:0;
  transform:translateY(20px);
  transition:opacity .5s .28s ease, transform .5s .28s ease;
}

.hs27-actions{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  opacity:0;
  transform:translateY(18px);
  transition:opacity .5s .38s ease, transform .5s .38s ease;
}

.hs27-btn-primary{
  min-height:52px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:14px 32px;
  border-radius:15px;
  font-size:clamp(14px,1.1vw,16px);
  font-weight:950;
  text-decoration:none;
  white-space:nowrap;
  background:var(--hs-accent);
  color:<?= ks27_idx_e($buttonTextColor) ?> !important;
  box-shadow:0 8px 28px var(--ks27-index-glow);
  border:2px solid transparent;
  transition:transform .2s, box-shadow .2s, background .2s;
}

.hs27-btn-primary:hover{
  transform:translateY(-2px);
  background:var(--hs-accent2);
  box-shadow:0 14px 38px var(--ks27-index-glow);
}

.hs27-slide.is-active .hs27-kicker,
.hs27-slide.is-active .hs27-heading,
.hs27-slide.is-active .hs27-desc,
.hs27-slide.is-active .hs27-actions{
  opacity:1;
  transform:translateY(0);
}

.hs27-arrow{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  z-index:20;
  width:52px;
  height:52px;
  border-radius:999px;
  border:2px solid rgba(255,255,255,.28);
  background:rgba(255,255,255,.08);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  color:#fff;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:border-color .2s, background .2s, transform .2s;
  -webkit-appearance:none;
  appearance:none;
}

.hs27-arrow:hover{
  border-color:var(--hs-accent);
  background:rgba(255,255,255,.18);
  transform:translateY(-50%) scale(1.07);
}

.hs27-arrow-prev{
  left:clamp(12px,3vw,40px);
}

.hs27-arrow-next{
  right:clamp(12px,3vw,40px);
}

.hs27-arrow svg{
  width:22px;
  height:22px;
  stroke:currentColor;
  stroke-width:2.2;
  fill:none;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.hs27-dots{
  position:absolute;
  bottom:clamp(36px,5vw,72px);
  left:clamp(20px,6vw,96px);
  z-index:20;
  display:flex;
  align-items:center;
  gap:10px;
}

.hs27-dot{
  width:10px;
  height:10px;
  border-radius:999px;
  border:none;
  cursor:pointer;
  padding:0;
  background:rgba(255,255,255,.38);
  -webkit-appearance:none;
  appearance:none;
  transition:background .25s,width .35s cubic-bezier(.34,1.56,.64,1),transform .2s;
}

.hs27-dot.is-active{
  background:var(--hs-accent);
  width:32px;
}

.hs27-progress{
  position:absolute;
  bottom:0;
  left:0;
  width:0%;
  height:3px;
  background:linear-gradient(90deg,var(--hs-accent),var(--hs-accent2));
  z-index:30;
  border-radius:0 2px 0 0;
}

.hs27-progress.is-running{
  transition:width var(--hs-dur) linear;
  width:100%;
}

.hs27-counter{
  position:absolute;
  bottom:clamp(36px,5vw,72px);
  right:clamp(20px,3vw,48px);
  z-index:20;
  color:rgba(255,255,255,.55);
  font-size:13px;
  font-weight:800;
  letter-spacing:.06em;
  font-variant-numeric:tabular-nums;
}

.hs27-counter strong{
  color:#fff;
  font-size:19px;
}

/* =========================================================
   STATS
========================================================= */
.ks27-stats{
  padding:34px 0 24px;
  background:#fff;
}

.ks27-stats-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:18px;
}

.ks27-stat-card{
  background:var(--ks27-index-card);
  border:1px solid rgba(15,23,42,.08);
  border-radius:24px;
  overflow:hidden;
  box-shadow:0 16px 36px rgba(15,23,42,.08);
}

.ks27-stat-img{
  position:relative;
  height:150px;
  background:#f1f5f9;
  overflow:hidden;
}

.ks27-stat-img img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.ks27-stat-content{
  padding:18px;
}

.ks27-stat-content h3{
  margin:0 0 8px;
  color:var(--ks27-index-title);
  font-size:18px;
  font-weight:950;
}

.ks27-stat-content p{
  margin:0;
  color:#64748b;
  font-size:14px;
  line-height:1.65;
}

/* =========================================================
   SERVICES / NEWS CARDS
========================================================= */
.ks27-services{
  background:
    radial-gradient(circle at top left,rgba(24,184,232,.12),transparent 36%),
    linear-gradient(180deg,#f8fbff,#eef7ff);
}

.ks27-service-grid,
.ks27-news-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:22px;
}

.ks27-service-card,
.ks27-news-card{
  display:flex;
  flex-direction:column;
  min-width:0;
  background:var(--ks27-index-card);
  border:1px solid rgba(15,23,42,.08);
  border-radius:26px;
  overflow:hidden;
  box-shadow:0 18px 42px rgba(15,23,42,.09);
  transition:transform .2s ease, box-shadow .2s ease;
}

.ks27-service-card:hover,
.ks27-news-card:hover{
  transform:translateY(-4px);
  box-shadow:0 24px 56px rgba(15,23,42,.13);
}

.ks27-service-image,
.ks27-news-image{
  position:relative;
  display:block;
  height:230px;
  background:#07111f;
  overflow:hidden;
  text-decoration:none;
}

.ks27-service-image img,
.ks27-news-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform .35s ease;
}

.ks27-service-card:hover img,
.ks27-news-card:hover img{
  transform:scale(1.04);
}

.ks27-ribbon,
.ks27-news-badge{
  position:absolute;
  right:14px;
  bottom:14px;
  z-index:2;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:32px;
  padding:0 12px;
  border-radius:999px;
  color:#fff;
  background:rgba(7,17,31,.86);
  backdrop-filter:blur(10px);
  font-size:12px;
  font-weight:950;
  box-shadow:0 12px 24px rgba(0,0,0,.18);
}

.ks27-service-body,
.ks27-news-body{
  display:flex;
  flex-direction:column;
  flex:1;
  padding:22px;
}

.ks27-date{
  margin:0 0 8px;
  color:#64748b;
  font-size:12px;
  font-weight:800;
}

.ks27-service-body h3,
.ks27-news-body h3{
  margin:0 0 12px;
  color:var(--ks27-index-title);
  font-size:20px;
  line-height:1.28;
  font-weight:950;
}

.ks27-service-body h3 a,
.ks27-news-body h3 a{
  color:inherit;
  text-decoration:none;
}

.ks27-service-body p,
.ks27-news-body p{
  margin:0 0 18px;
  color:#64748b;
  font-size:15px;
  line-height:1.72;
}

.ks27-card-footer{
  margin-top:auto;
}

/* =========================================================
   ABOUT
========================================================= */
.ks27-about{
  background:
    radial-gradient(circle at 80% 20%,rgba(24,184,232,.20),transparent 34%),
    linear-gradient(135deg,#07111f,#0b2f57);
  color:#fff;
}

.ks27-about-grid{
  display:grid;
  grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr);
  gap:36px;
  align-items:center;
}

.ks27-about-kicker{
  display:inline-flex;
  margin-bottom:14px;
  padding:8px 14px;
  border-radius:999px;
  color:#fff;
  background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.14);
  font-size:12px;
  font-weight:950;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.ks27-about-title{
  margin:0 0 16px;
  color:#fff;
  font-size:clamp(30px,3.6vw,48px);
  line-height:1.12;
  font-weight:950;
  letter-spacing:-.7px;
}

.ks27-about-desc{
  max-width:760px;
  margin:0 0 22px;
  color:rgba(255,255,255,.78);
  font-size:16px;
  line-height:1.75;
}

.ks27-about-features{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  margin:0 0 24px;
}

.ks27-about-feature{
  display:block;
  padding:16px;
  border-radius:18px;
  color:#fff;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.12);
  text-decoration:none;
  transition:.2s ease;
}

.ks27-about-feature:hover{
  transform:translateY(-2px);
  background:rgba(255,255,255,.12);
  color:#fff;
}

.ks27-about-feature strong{
  display:block;
  margin-bottom:6px;
  font-size:15px;
  font-weight:950;
}

.ks27-about-feature span{
  display:block;
  color:rgba(255,255,255,.72);
  font-size:13px;
  line-height:1.55;
}

.ks27-about-visual{
  position:relative;
}

.ks27-about-image{
  position:relative;
  min-height:420px;
  border-radius:30px;
  overflow:hidden;
  background:#061626;
  border:1px solid rgba(255,255,255,.16);
  box-shadow:0 30px 80px rgba(0,0,0,.30);
}

.ks27-about-image img{
  width:100%;
  height:100%;
  min-height:420px;
  object-fit:cover;
  display:block;
}

.ks27-about-counter{
  position:absolute;
  left:22px;
  bottom:22px;
  display:grid;
  gap:3px;
  min-width:210px;
  padding:16px 18px;
  border-radius:22px;
  background:rgba(255,255,255,.92);
  color:#07111f;
  box-shadow:0 18px 42px rgba(0,0,0,.20);
}

.ks27-about-counter strong{
  font-size:28px;
  line-height:1;
  font-weight:950;
}

.ks27-about-counter span{
  font-size:13px;
  font-weight:850;
  color:#475569;
}

/* =========================================================
   REVIEWS
========================================================= */
.ks27-reviews{
  background:var(--ks27-index-review-bg);
}

.ks27-reviews .ks27-title{
  color:<?= ks27_idx_e($reviewSectionTitle) ?>;
}

.ks27-reviews .ks27-desc{
  color:<?= ks27_idx_e($reviewSectionDesc) ?>;
}

.ks27-review-track{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
}

.ks27-review-card{
  min-width:0;
  padding:22px;
  border-radius:24px;
  background:#fff;
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 18px 42px rgba(15,23,42,.09);
}

.ks27-review-top{
  display:flex;
  align-items:center;
  gap:13px;
  margin-bottom:15px;
}

.ks27-avatar{
  width:48px;
  height:48px;
  border-radius:18px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  font-size:20px;
  font-weight:950;
  background:var(--ks27-avatar-color,#18b8e8);
  box-shadow:0 12px 24px rgba(15,23,42,.14);
}

.ks27-review-meta strong{
  display:block;
  color:#07111f;
  font-size:15px;
  font-weight:950;
}

.ks27-google{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:7px;
  margin-top:3px;
  color:#64748b;
  font-size:12px;
  font-weight:800;
}

.ks27-stars{
  color:#f59e0b;
  letter-spacing:.04em;
}

.ks27-review-text{
  color:#475569;
  font-size:15px;
  line-height:1.75;
}

/* =========================================================
   REFERENCES
========================================================= */
.ks27-references{
  background:
    radial-gradient(circle at top right,rgba(0,166,180,.12),transparent 36%),
    linear-gradient(180deg,#f8fbff,#ffffff);
}

.ks27-ref-track{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:16px;
}

.ks27-ref-card{
  position:relative;
  min-height:138px;
  border-radius:24px;
  background:
    radial-gradient(circle at top left,rgba(0,166,180,.18),transparent 42%),
    linear-gradient(135deg,#07111f 0%,#09263b 58%,#061626 100%);
  border:1px solid rgba(0,166,180,.18);
  overflow:hidden;
  box-shadow:0 18px 42px rgba(2,8,23,.14);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:22px 18px 32px;
  isolation:isolate;
}

.ks27-ref-card::before{
  content:"";
  position:absolute;
  left:18px;
  right:18px;
  top:0;
  height:3px;
  border-radius:999px;
  background:linear-gradient(90deg,transparent,#00a6b4,transparent);
  opacity:.88;
}

.ks27-ref-card img{
  width:100%;
  height:82px;
  max-height:82px;
  object-fit:contain;
  display:block;
  filter:drop-shadow(0 10px 20px rgba(0,0,0,.22));
  position:relative;
  z-index:2;
}

.ks27-ref-card-no-img{
  background:
    radial-gradient(circle at center,rgba(0,166,180,.22),transparent 48%),
    linear-gradient(135deg,#07111f,#09263b)!important;
}

.ks27-ref-fallback{
  width:58px;
  height:58px;
  border-radius:22px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#ffffff;
  background:linear-gradient(135deg,#00a6b4,#18b8e8);
  font-size:24px;
  font-weight:950;
  box-shadow:0 18px 38px rgba(0,166,180,.22);
  position:relative;
  z-index:3;
}

.ks27-ref-name{
  position:absolute;
  left:10px;
  right:10px;
  bottom:10px;
  z-index:3;
  display:block;
  color:rgba(255,255,255,.78);
  font-size:11px;
  font-weight:900;
  line-height:1.25;
  text-align:center;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

/* =========================================================
   BLOG
========================================================= */
.ks27-news{
  background:
    radial-gradient(circle at top right,rgba(24,184,232,.12),transparent 35%),
    linear-gradient(180deg,#eef7ff,#f8fbff);
}

/* =========================================================
   DARK/LIGHT UYUM
========================================================= */
body.dark-mode .ks27-main,
body[data-theme="dark"] .ks27-main,
html[data-theme="dark"] .ks27-main{
  background:
    radial-gradient(circle at top left,rgba(24,184,232,.12),transparent 34%),
    #07111f;
}

body.dark-mode .ks27-services,
body.dark-mode .ks27-news,
body[data-theme="dark"] .ks27-services,
body[data-theme="dark"] .ks27-news,
html[data-theme="dark"] .ks27-services,
html[data-theme="dark"] .ks27-news{
  background:#071c2e;
}

body.dark-mode .ks27-stats,
body.dark-mode .ks27-references,
body[data-theme="dark"] .ks27-stats,
body[data-theme="dark"] .ks27-references,
html[data-theme="dark"] .ks27-stats,
html[data-theme="dark"] .ks27-references{
  background:#09263b;
}

body.dark-mode .ks27-service-card,
body.dark-mode .ks27-news-card,
body.dark-mode .ks27-stat-card,
body.dark-mode .ks27-review-card,
body.dark-mode .ks27-ref-card,
body[data-theme="dark"] .ks27-service-card,
body[data-theme="dark"] .ks27-news-card,
body[data-theme="dark"] .ks27-stat-card,
body[data-theme="dark"] .ks27-review-card,
body[data-theme="dark"] .ks27-ref-card,
html[data-theme="dark"] .ks27-service-card,
html[data-theme="dark"] .ks27-news-card,
html[data-theme="dark"] .ks27-stat-card,
html[data-theme="dark"] .ks27-review-card,
html[data-theme="dark"] .ks27-ref-card{
  background:rgba(9,38,59,.92);
  border-color:rgba(111,218,255,.14);
}

body.dark-mode .ks27-title,
body.dark-mode .ks27-service-body h3,
body.dark-mode .ks27-news-body h3,
body.dark-mode .ks27-stat-content h3,
body.dark-mode .ks27-review-meta strong,
body[data-theme="dark"] .ks27-title,
body[data-theme="dark"] .ks27-service-body h3,
body[data-theme="dark"] .ks27-news-body h3,
body[data-theme="dark"] .ks27-stat-content h3,
body[data-theme="dark"] .ks27-review-meta strong,
html[data-theme="dark"] .ks27-title,
html[data-theme="dark"] .ks27-service-body h3,
html[data-theme="dark"] .ks27-news-body h3,
html[data-theme="dark"] .ks27-stat-content h3,
html[data-theme="dark"] .ks27-review-meta strong{
  color:#eaf8ff;
}

body.dark-mode .ks27-desc,
body.dark-mode .ks27-service-body p,
body.dark-mode .ks27-news-body p,
body.dark-mode .ks27-stat-content p,
body.dark-mode .ks27-review-text,
body[data-theme="dark"] .ks27-desc,
body[data-theme="dark"] .ks27-service-body p,
body[data-theme="dark"] .ks27-news-body p,
body[data-theme="dark"] .ks27-stat-content p,
body[data-theme="dark"] .ks27-review-text,
html[data-theme="dark"] .ks27-desc,
html[data-theme="dark"] .ks27-service-body p,
html[data-theme="dark"] .ks27-news-body p,
html[data-theme="dark"] .ks27-stat-content p,
html[data-theme="dark"] .ks27-review-text{
  color:#b7d2df;
}

/* =========================================================
   RESPONSIVE
========================================================= */
@media(max-width:1180px){
  .ks27-service-grid,
  .ks27-news-grid,
  .ks27-review-track{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .ks27-stats-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .ks27-ref-track{
    grid-template-columns:repeat(4,minmax(0,1fr));
  }

  .ks27-about-grid{
    grid-template-columns:1fr;
  }
}

@media(max-width:767px){
  .ks27-main{
    width:100vw;
    margin-left:calc(50% - 50vw);
  }

  .ks27-container{
    width:100%;
    padding-left:12px;
    padding-right:12px;
  }

  .ks27-section{
    padding:52px 0;
    contain-intrinsic-size:1px 680px;
  }

  .ks27-section-head{
    margin-bottom:22px;
    padding:0 2px;
  }

  .ks27-title{
    font-size:clamp(25px,7vw,34px);
  }

  .ks27-desc{
    font-size:14.5px;
    line-height:1.65;
  }

  .hs27-hero{
    width:100vw;
    margin-left:calc(50% - 50vw);
    height:min(70svh,600px);
    min-height:440px;
    max-height:600px;
  }

  .hs27-hero.is-image-only{
    height:clamp(230px,58vw,390px);
    min-height:230px;
    max-height:390px;
  }

  .hs27-content{
    align-items:flex-end;
    padding:0 18px 84px;
  }

  .hs27-content-inner{
    max-width:100%;
  }

  .hs27-heading{
    font-size:clamp(24px,7.5vw,36px);
  }

  .hs27-desc{
    font-size:14px;
    max-width:100%;
    margin-bottom:22px;
  }

  .hs27-arrow{
    width:42px;
    height:42px;
  }

  .hs27-arrow-prev{
    left:10px;
  }

  .hs27-arrow-next{
    right:10px;
  }

  .hs27-dots{
    bottom:25px;
    left:50%;
    transform:translateX(-50%);
  }

  .hs27-counter{
    display:none;
  }

  .hs27-actions{
    flex-direction:column;
    align-items:stretch;
  }

  .hs27-btn-primary{
    width:100%;
  }

  .ks27-stats-grid,
  .ks27-service-grid,
  .ks27-news-grid,
  .ks27-review-track,
  .ks27-ref-track{
    display:flex;
    gap:14px;
    overflow-x:auto;
    overflow-y:hidden;
    scroll-snap-type:x mandatory;
    scroll-behavior:smooth;
    -webkit-overflow-scrolling:touch;
    padding:4px 12px 16px;
    margin-left:-12px;
    margin-right:-12px;
    scrollbar-width:none;
  }

  .ks27-stats-grid::-webkit-scrollbar,
  .ks27-service-grid::-webkit-scrollbar,
  .ks27-news-grid::-webkit-scrollbar,
  .ks27-review-track::-webkit-scrollbar,
  .ks27-ref-track::-webkit-scrollbar{
    display:none;
  }

  .ks27-stat-card,
  .ks27-service-card,
  .ks27-news-card,
  .ks27-review-card{
    flex:0 0 min(86vw, 360px);
    scroll-snap-align:start;
  }

  .ks27-ref-card{
    flex:0 0 160px;
    min-height:110px;
    scroll-snap-align:start;
  }

  .ks27-service-image,
  .ks27-news-image{
    height:205px;
  }

  .ks27-service-body,
  .ks27-news-body{
    padding:18px;
  }

  .ks27-service-body h3,
  .ks27-news-body h3{
    font-size:18px;
  }

  .ks27-about{
    width:100vw;
    margin-left:calc(50% - 50vw);
  }

  .ks27-about-grid{
    gap:22px;
  }

  .ks27-about-features{
    grid-template-columns:1fr;
  }

  .ks27-about-image,
  .ks27-about-image img{
    min-height:300px;
  }

  .ks27-about-counter{
    left:14px;
    bottom:14px;
    right:14px;
    min-width:0;
  }

  .ks27-section-action{
    margin-top:18px;
  }
}

@media(max-width:420px){
  .ks27-container{
    padding-left:8px;
    padding-right:8px;
  }

  .ks27-section{
    padding:44px 0;
  }

  .hs27-hero{
    min-height:400px;
  }

  .hs27-hero.is-image-only{
    min-height:215px;
  }

  .ks27-stat-card,
  .ks27-service-card,
  .ks27-news-card,
  .ks27-review-card{
    flex-basis:88vw;
  }

  .ks27-service-image,
  .ks27-news-image{
    height:190px;
  }
}

@media(prefers-reduced-motion:reduce){
  .hs27-track,
  .hs27-slide-img,
  .hs27-kicker,
  .hs27-heading,
  .hs27-desc,
  .hs27-actions,
  .ks27-service-card,
  .ks27-news-card{
    animation:none !important;
    transition:none !important;
  }
}


/* =========================================================
   FINAL MOBİL FULL KART + DESKTOP PERFORMANS RÖTUŞU
   Dosya: /index.php
   Amaç:
   - Hizmet ve blog kartları mobilde tam ekran genişliğinde olsun
   - Mobilde yan boşluk/kırpılma olmasın
   - Masaüstünde grid bozulmadan kalsın
   - Kart görselleri daha stabil yüklensin
========================================================= */
.ks27-service-card,
.ks27-news-card{
  contain:layout paint;
  backface-visibility:hidden;
  transform:translateZ(0);
}

.ks27-service-image,
.ks27-news-image{
  aspect-ratio:16 / 10;
}

.ks27-service-image img,
.ks27-news-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

@media(min-width:768px){
  .ks27-service-grid,
  .ks27-news-grid{
    width:100%;
    max-width:100%;
    overflow:visible;
  }

  .ks27-service-card,
  .ks27-news-card{
    width:100%;
    max-width:100%;
  }
}

@media(max-width:767px){
  .ks27-services,
  .ks27-news{
    width:100vw!important;
    max-width:100vw!important;
    margin-left:calc(50% - 50vw)!important;
    margin-right:calc(50% - 50vw)!important;
    overflow:hidden!important;
  }

  .ks27-services .ks27-container,
  .ks27-news .ks27-container{
    width:100%!important;
    max-width:100%!important;
    padding-left:0!important;
    padding-right:0!important;
  }

  .ks27-services .ks27-section-head,
  .ks27-news .ks27-section-head{
    padding-left:14px!important;
    padding-right:14px!important;
  }

  .ks27-service-grid,
  .ks27-news-grid{
    width:100vw!important;
    max-width:100vw!important;
    margin-left:0!important;
    margin-right:0!important;
    padding:4px 10px 18px!important;
    gap:12px!important;
    scroll-padding-left:10px!important;
    scroll-padding-right:10px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
  }

  .ks27-service-card,
  .ks27-news-card{
    flex:0 0 calc(100vw - 20px)!important;
    width:calc(100vw - 20px)!important;
    max-width:calc(100vw - 20px)!important;
    min-width:calc(100vw - 20px)!important;
    scroll-snap-align:center!important;
    border-radius:24px!important;
  }

  .ks27-service-image,
  .ks27-news-image{
    width:100%!important;
    height:auto!important;
    min-height:220px!important;
    aspect-ratio:16 / 10!important;
  }

  .ks27-service-image img,
  .ks27-news-image img{
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
  }

  .ks27-service-body,
  .ks27-news-body{
    padding:20px 18px 18px!important;
  }

  .ks27-service-body h3,
  .ks27-news-body h3{
    font-size:19px!important;
    line-height:1.28!important;
  }

  .ks27-service-body p,
  .ks27-news-body p{
    font-size:14.5px!important;
    line-height:1.65!important;
  }

  .ks27-service-body .ks27-btn,
  .ks27-news-body .ks27-btn,
  .ks27-card-footer .ks27-btn{
    width:100%!important;
    justify-content:center!important;
  }

  .ks27-services .ks27-section-action,
  .ks27-news .ks27-section-action{
    padding-left:10px!important;
    padding-right:10px!important;
  }

  .ks27-services .ks27-section-action .ks27-btn,
  .ks27-news .ks27-section-action .ks27-btn{
    width:100%!important;
    justify-content:center!important;
  }
}

@media(max-width:420px){
  .ks27-service-grid,
  .ks27-news-grid{
    padding-left:8px!important;
    padding-right:8px!important;
    scroll-padding-left:8px!important;
    scroll-padding-right:8px!important;
  }

  .ks27-service-card,
  .ks27-news-card{
    flex-basis:calc(100vw - 16px)!important;
    width:calc(100vw - 16px)!important;
    max-width:calc(100vw - 16px)!important;
    min-width:calc(100vw - 16px)!important;
  }

  .ks27-service-image,
  .ks27-news-image{
    min-height:205px!important;
  }
}


/* =========================================================
   FINAL FIX - HERO FULL DESKTOP/MOBİL + İSTATİSTİK FULL KART
   Dosya: /index.php
   Amaç:
   - Hero slider desktop ve mobilde 100vw tam genişlikte çalışır
   - Hero görseli taşma/boşluk üretmez, slider kontrolleri kırılmaz
   - İstatistik kartları desktopta yan yana 3 kart olur
   - Mobilde istatistikler tek kart full ekran ve sola kayan yapı olur
========================================================= */
html,
body,
.ks27-main{
  width:100%!important;
  max-width:100%!important;
  overflow-x:hidden!important;
}

.hs27-hero{
  width:100vw!important;
  max-width:100vw!important;
  margin-left:calc(50% - 50vw)!important;
  margin-right:calc(50% - 50vw)!important;
  height:clamp(520px,46vw,820px)!important;
  min-height:520px!important;
  max-height:820px!important;
  border-radius:0!important;
  overflow:hidden!important;
  background:#061626!important;
}

.hs27-hero.is-image-only{
  height:clamp(380px,44vw,780px)!important;
  min-height:380px!important;
  max-height:780px!important;
}

.hs27-track,
.hs27-slide{
  width:100%!important;
  height:100%!important;
}

.hs27-slide-img{
  width:100%!important;
  height:100%!important;
  min-width:100%!important;
  min-height:100%!important;
  display:block!important;
  object-position:center center!important;
  background:#061626!important;
}

.hs27-hero.has-slider-content .hs27-slide-img{
  object-fit:cover!important;
}

.hs27-hero.is-image-only .hs27-slide-img,
.hs27-slide.no-content .hs27-slide-img{
  object-fit:contain!important;
}

.hs27-content{
  width:100%!important;
  max-width:100%!important;
}

.hs27-content-inner{
  max-width:min(760px, calc(100vw - 120px))!important;
}

/* İstatistik alanı: desktop 3 kart */
.ks27-stats{
  width:100vw!important;
  max-width:100vw!important;
  margin-left:calc(50% - 50vw)!important;
  margin-right:calc(50% - 50vw)!important;
  overflow:hidden!important;
}

@media(min-width:768px){
  .ks27-stats .ks27-container{
    width:min(1320px, calc(100% - 32px))!important;
    max-width:1320px!important;
    margin-left:auto!important;
    margin-right:auto!important;
    padding-left:0!important;
    padding-right:0!important;
  }

  .ks27-stats-grid{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:22px!important;
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    padding:0!important;
    overflow:visible!important;
    scroll-snap-type:none!important;
  }

  .ks27-stat-card{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:100%!important;
    display:flex!important;
    flex-direction:column!important;
  }

  .ks27-stat-img{
    height:clamp(155px,15vw,210px)!important;
    flex:0 0 auto!important;
  }

  .ks27-stat-content{
    flex:1 1 auto!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:flex-start!important;
  }
}

@media(max-width:767px){
  .hs27-hero{
    width:100vw!important;
    max-width:100vw!important;
    margin-left:calc(50% - 50vw)!important;
    margin-right:calc(50% - 50vw)!important;
    height:clamp(430px,72svh,620px)!important;
    min-height:430px!important;
    max-height:620px!important;
  }

  .hs27-hero.is-image-only{
    height:clamp(245px,64vw,430px)!important;
    min-height:245px!important;
    max-height:430px!important;
  }

  .hs27-hero.has-slider-content .hs27-slide-img{
    object-fit:cover!important;
  }

  .hs27-hero.is-image-only .hs27-slide-img,
  .hs27-slide.no-content .hs27-slide-img{
    object-fit:contain!important;
  }

  .hs27-content{
    align-items:flex-end!important;
    padding:0 16px 86px!important;
  }

  .hs27-content-inner{
    width:100%!important;
    max-width:100%!important;
  }

  .hs27-heading{
    font-size:clamp(24px,7.2vw,36px)!important;
    line-height:1.08!important;
  }

  .hs27-desc{
    font-size:14px!important;
    line-height:1.58!important;
  }

  .hs27-arrow{
    width:40px!important;
    height:40px!important;
  }

  .hs27-arrow-prev{
    left:8px!important;
  }

  .hs27-arrow-next{
    right:8px!important;
  }

  .hs27-dots{
    bottom:24px!important;
    left:50%!important;
    transform:translateX(-50%)!important;
  }

  .ks27-stats{
    width:100vw!important;
    max-width:100vw!important;
    margin-left:calc(50% - 50vw)!important;
    margin-right:calc(50% - 50vw)!important;
    padding:34px 0 28px!important;
    overflow:hidden!important;
  }

  .ks27-stats .ks27-container{
    width:100%!important;
    max-width:100%!important;
    padding-left:0!important;
    padding-right:0!important;
  }

  .ks27-stats-grid{
    display:flex!important;
    width:100vw!important;
    max-width:100vw!important;
    gap:12px!important;
    margin:0!important;
    padding:4px 10px 18px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    scroll-snap-type:x mandatory!important;
    scroll-padding-left:10px!important;
    scroll-padding-right:10px!important;
    -webkit-overflow-scrolling:touch!important;
    scrollbar-width:none!important;
  }

  .ks27-stats-grid::-webkit-scrollbar{
    display:none!important;
  }

  .ks27-stat-card{
    flex:0 0 calc(100vw - 20px)!important;
    width:calc(100vw - 20px)!important;
    min-width:calc(100vw - 20px)!important;
    max-width:calc(100vw - 20px)!important;
    scroll-snap-align:start!important;
    border-radius:24px!important;
  }

  .ks27-stat-img{
    height:clamp(190px,54vw,250px)!important;
  }

  .ks27-stat-content{
    padding:20px 18px!important;
  }

  .ks27-stat-content h3{
    font-size:20px!important;
    line-height:1.25!important;
  }

  .ks27-stat-content p{
    font-size:14.5px!important;
    line-height:1.65!important;
  }
}

@media(max-width:420px){
  .hs27-hero{
    min-height:405px!important;
  }

  .hs27-hero.is-image-only{
    min-height:228px!important;
  }

  .ks27-stats-grid{
    padding-left:8px!important;
    padding-right:8px!important;
    scroll-padding-left:8px!important;
    scroll-padding-right:8px!important;
  }

  .ks27-stat-card{
    flex-basis:calc(100vw - 16px)!important;
    width:calc(100vw - 16px)!important;
    min-width:calc(100vw - 16px)!important;
    max-width:calc(100vw - 16px)!important;
  }

  .ks27-stat-img{
    height:clamp(180px,56vw,230px)!important;
  }
}


/* =========================================================
   FINAL FIX - HERO TEMİZ BANNER + VIDEO SLIDER
   Dosya: /index.php
   - Görseli yazılı sliderlarda sistem yazısı bindirilmez.
   - Hero desktop ve mobilde tam genişlik çalışır.
   - İstatistik alanı yerine video carousel gelir.
========================================================= */
.hs27-hero{
  width:100vw!important;
  max-width:100vw!important;
  margin-left:calc(50% - 50vw)!important;
  margin-right:calc(50% - 50vw)!important;
  height:clamp(520px,42vw,720px)!important;
  min-height:520px!important;
  max-height:720px!important;
  border-radius:0!important;
  overflow:hidden!important;
  background:#061626!important;
}

.hs27-hero.is-image-only{
  height:clamp(500px,40vw,690px)!important;
  min-height:500px!important;
  max-height:690px!important;
}

.hs27-slide.no-content .hs27-overlay,
.hs27-hero.is-image-only .hs27-overlay{
  background:linear-gradient(180deg,rgba(2,8,23,.02),rgba(2,8,23,.04))!important;
}

.hs27-slide.no-content .hs27-ambient,
.hs27-hero.is-image-only .hs27-ambient{
  display:none!important;
}

.hs27-slide-img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center center!important;
  background:#061626!important;
}

.hs27-hero.is-image-only .hs27-slide-img,
.hs27-slide.no-content .hs27-slide-img{
  object-fit:cover!important;
}

.hs27-slide.no-content .hs27-content{
  display:none!important;
}

.hs27-dots{
  bottom:24px!important;
}

.hs27-counter{
  bottom:24px!important;
}

.ks27-videos{
  width:100vw!important;
  max-width:100vw!important;
  margin-left:calc(50% - 50vw)!important;
  margin-right:calc(50% - 50vw)!important;
  padding:56px 0 54px!important;
  overflow:hidden!important;
  background:
    radial-gradient(circle at top left,rgba(24,184,232,.13),transparent 34%),
    linear-gradient(180deg,#ffffff,#eef9ff)!important;
}

.ks27-videos .ks27-container{
  width:min(1320px, calc(100% - 32px))!important;
  max-width:1320px!important;
  margin-left:auto!important;
  margin-right:auto!important;
}


.ks27-video-head-row{
  display:flex!important;
  align-items:flex-end!important;
  justify-content:space-between!important;
  gap:18px!important;
  width:100%!important;
}

.ks27-video-head-row .ks27-section-head{
  flex:1 1 auto!important;
  min-width:0!important;
  margin-bottom:22px!important;
}

.ks27-video-manual-panel{
  flex:0 0 auto!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  margin-bottom:26px!important;
  padding:8px!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.92)!important;
  border:1px solid rgba(0,166,180,.18)!important;
  box-shadow:0 18px 44px rgba(6,59,116,.11)!important;
  color:#063b74!important;
  user-select:none!important;
}

.ks27-video-manual-panel::before{
  content:"";
  width:9px!important;
  height:9px!important;
  border-radius:999px!important;
  background:linear-gradient(135deg,var(--ks27-index-button),var(--ks27-index-link))!important;
  box-shadow:0 0 0 5px rgba(0,166,180,.10)!important;
  flex:0 0 auto!important;
}

.ks27-video-manual-text{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  padding:0 6px!important;
  color:#063b74!important;
  font-size:12px!important;
  font-weight:950!important;
  letter-spacing:.035em!important;
  text-transform:uppercase!important;
  white-space:nowrap!important;
}

.ks27-video-manual-icon{
  width:30px!important;
  height:30px!important;
  border-radius:999px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  color:#fff!important;
  background:linear-gradient(135deg,var(--ks27-index-button),var(--ks27-index-link))!important;
  box-shadow:0 10px 24px var(--ks27-index-glow)!important;
  font-size:16px!important;
  font-weight:950!important;
  animation:ks27VideoSwipePulse 1.65s ease-in-out infinite!important;
}

.ks27-video-manual-btn{
  width:38px!important;
  height:38px!important;
  min-width:38px!important;
  border:0!important;
  border-radius:999px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  cursor:pointer!important;
  color:#fff!important;
  background:linear-gradient(135deg,#07111f,#0b2f57)!important;
  box-shadow:0 12px 28px rgba(6,59,116,.18)!important;
  font-size:25px!important;
  font-weight:950!important;
  line-height:1!important;
  transition:transform .18s ease, filter .18s ease!important;
}

.ks27-video-manual-btn:hover,
.ks27-video-manual-btn:focus{
  transform:translateY(-1px)!important;
  filter:saturate(1.18)!important;
  outline:none!important;
}

@keyframes ks27VideoSwipePulse{
  0%,100%{transform:translateX(-2px);opacity:.88}
  50%{transform:translateX(2px);opacity:1}
}

body.dark-mode .ks27-video-manual-panel,
body[data-theme="dark"] .ks27-video-manual-panel,
html[data-theme="dark"] .ks27-video-manual-panel{
  background:rgba(9,38,59,.92)!important;
  border-color:rgba(111,218,255,.18)!important;
  color:#eaf8ff!important;
}

body.dark-mode .ks27-video-manual-text,
body[data-theme="dark"] .ks27-video-manual-text,
html[data-theme="dark"] .ks27-video-manual-text{
  color:#eaf8ff!important;
}

.ks27-video-track{
  display:flex!important;
  gap:22px!important;
  width:100%!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  scroll-snap-type:x mandatory!important;
  scroll-padding-left:0!important;
  -webkit-overflow-scrolling:touch!important;
  scrollbar-width:none!important;
  padding:4px 0 18px!important;
}

.ks27-video-track::-webkit-scrollbar{
  display:none!important;
}

.ks27-video-card{
  flex:0 0 calc((100% - 44px) / 3)!important;
  width:calc((100% - 44px) / 3)!important;
  min-width:0!important;
  scroll-snap-align:start!important;
  background:rgba(255,255,255,.98)!important;
  border:1px solid rgba(15,23,42,.08)!important;
  border-radius:28px!important;
  overflow:hidden!important;
  box-shadow:0 22px 54px rgba(15,23,42,.10)!important;
}

.ks27-video-media{
  position:relative!important;
  width:100%!important;
  aspect-ratio:16 / 9!important;
  min-height:220px!important;
  background:#07111f!important;
  overflow:hidden!important;
}

.ks27-video-media iframe,
.ks27-video-media img{
  width:100%!important;
  height:100%!important;
  display:block!important;
  border:0!important;
  object-fit:cover!important;
}

.ks27-video-media a{
  position:absolute!important;
  inset:0!important;
  display:block!important;
  color:inherit!important;
  text-decoration:none!important;
}

.ks27-video-play{
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  width:62px!important;
  height:62px!important;
  transform:translate(-50%,-50%)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:999px!important;
  color:#fff!important;
  background:linear-gradient(135deg,var(--ks27-index-button),var(--ks27-index-link))!important;
  box-shadow:0 18px 40px var(--ks27-index-glow)!important;
  font-size:24px!important;
  line-height:1!important;
}

.ks27-video-body{
  padding:21px 20px 22px!important;
}

.ks27-video-tag{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:28px!important;
  padding:0 11px!important;
  margin:0 0 12px!important;
  border-radius:999px!important;
  background:rgba(24,184,232,.12)!important;
  color:#0079a8!important;
  font-size:12px!important;
  font-weight:950!important;
}

.ks27-video-body h3{
  margin:0 0 9px!important;
  color:var(--ks27-index-title)!important;
  font-size:19px!important;
  line-height:1.28!important;
  font-weight:950!important;
}

.ks27-video-body p{
  margin:0!important;
  color:#64748b!important;
  font-size:14px!important;
  line-height:1.65!important;
}

body.dark-mode .ks27-videos,
body[data-theme="dark"] .ks27-videos,
html[data-theme="dark"] .ks27-videos{
  background:linear-gradient(180deg,#07111f,#09263b)!important;
}

body.dark-mode .ks27-video-card,
body[data-theme="dark"] .ks27-video-card,
html[data-theme="dark"] .ks27-video-card{
  background:rgba(9,38,59,.94)!important;
  border-color:rgba(111,218,255,.14)!important;
}

body.dark-mode .ks27-video-body h3,
body[data-theme="dark"] .ks27-video-body h3,
html[data-theme="dark"] .ks27-video-body h3{
  color:#eaf8ff!important;
}

body.dark-mode .ks27-video-body p,
body[data-theme="dark"] .ks27-video-body p,
html[data-theme="dark"] .ks27-video-body p{
  color:#b7d2df!important;
}

@media(max-width:991px){
  .ks27-video-card{
    flex-basis:calc((100% - 22px) / 2)!important;
    width:calc((100% - 22px) / 2)!important;
  }
}

@media(max-width:767px){
  .hs27-hero,
  .hs27-hero.is-image-only{
    width:100vw!important;
    max-width:100vw!important;
    margin-left:calc(50% - 50vw)!important;
    margin-right:calc(50% - 50vw)!important;
    height:clamp(260px,62vw,420px)!important;
    min-height:260px!important;
    max-height:420px!important;
  }

  .hs27-slide-img,
  .hs27-hero.is-image-only .hs27-slide-img,
  .hs27-slide.no-content .hs27-slide-img{
    object-fit:cover!important;
    object-position:center center!important;
  }

  .hs27-arrow{
    width:40px!important;
    height:40px!important;
  }

  .hs27-dots{
    bottom:14px!important;
    left:50%!important;
    transform:translateX(-50%)!important;
  }

  .ks27-videos{
    padding:42px 0 42px!important;
  }

  .ks27-videos .ks27-container{
    width:100%!important;
    max-width:100%!important;
    padding-left:0!important;
    padding-right:0!important;
  }

  .ks27-videos .ks27-section-head{
    padding-left:14px!important;
    padding-right:14px!important;
  }


  .ks27-video-head-row{
    display:block!important;
  }

  .ks27-video-manual-panel{
    width:calc(100% - 28px)!important;
    margin:0 14px 16px!important;
    justify-content:space-between!important;
    padding:8px 9px!important;
  }

  .ks27-video-manual-text{
    flex:1!important;
    font-size:11px!important;
    letter-spacing:.02em!important;
  }

  .ks27-video-manual-btn{
    width:40px!important;
    height:40px!important;
    min-width:40px!important;
  }

  .ks27-video-track{
    width:100vw!important;
    max-width:100vw!important;
    gap:12px!important;
    padding:4px 10px 18px!important;
    scroll-padding-left:10px!important;
    scroll-padding-right:10px!important;
  }

  .ks27-video-card{
    flex:0 0 calc(100vw - 20px)!important;
    width:calc(100vw - 20px)!important;
    min-width:calc(100vw - 20px)!important;
    max-width:calc(100vw - 20px)!important;
    border-radius:24px!important;
  }

  .ks27-video-media{
    min-height:210px!important;
  }

  .ks27-video-body{
    padding:19px 18px 20px!important;
  }
}

@media(max-width:420px){
  .hs27-hero,
  .hs27-hero.is-image-only{
    height:clamp(235px,66vw,360px)!important;
    min-height:235px!important;
  }

  .ks27-video-media{
    min-height:190px!important;
  }
}



/* =========================================================
   FINAL FIX - SADECE DESKTOP HERO SON HAL
   Dosya: /index.php
   Amaç:
   - Desktopta sabit header hero görselinin üstünü kapatmasın.
   - Yazılı slider görseli kullanıldığında sistem yazısı bindirilmesin.
   - Hero desktopta tam genişlik, kontrollü yükseklik ve premium görünümde kalsın.
   - Mobil ayarlara dokunulmadı.
========================================================= */
@media (min-width:1200px){
  html{
    scroll-padding-top:154px!important;
  }

  body{
    padding-top:154px!important;
  }

  .ks27-main{
    width:100vw!important;
    max-width:100vw!important;
    margin-left:calc(50% - 50vw)!important;
    margin-right:calc(50% - 50vw)!important;
    overflow:hidden!important;
  }

  .hs27-hero,
  .hs27-hero.is-image-only,
  .hs27-hero.has-slider-content{
    width:100vw!important;
    max-width:100vw!important;
    margin-left:calc(50% - 50vw)!important;
    margin-right:calc(50% - 50vw)!important;
    margin-top:0!important;
    height:clamp(620px, calc(100vh - 154px), 780px)!important;
    min-height:620px!important;
    max-height:780px!important;
    border-radius:0!important;
    overflow:hidden!important;
    background:#061626!important;
    box-shadow:none!important;
  }

  .hs27-track,
  .hs27-slide{
    height:100%!important;
    min-height:100%!important;
  }

  .hs27-slide-img,
  .hs27-hero.is-image-only .hs27-slide-img,
  .hs27-slide.no-content .hs27-slide-img,
  .hs27-hero.has-slider-content .hs27-slide-img{
    width:100%!important;
    height:100%!important;
    display:block!important;
    object-fit:cover!important;
    object-position:center center!important;
    background:#061626!important;
  }

  /* Slider görselinin içinde başlık/buton varsa sistem metni bindirme. */
  .hs27-hero .hs27-content,
  .hs27-hero .hs27-kicker,
  .hs27-hero .hs27-heading,
  .hs27-hero .hs27-desc,
  .hs27-hero .hs27-actions{
    display:none!important;
  }

  .hs27-hero .hs27-overlay,
  .hs27-slide.no-content .hs27-overlay,
  .hs27-hero.is-image-only .hs27-overlay{
    background:linear-gradient(180deg,rgba(2,8,23,.02) 0%,rgba(2,8,23,.03) 100%)!important;
  }

  .hs27-hero .hs27-ambient,
  .hs27-slide.no-content .hs27-ambient,
  .hs27-hero.is-image-only .hs27-ambient{
    display:none!important;
  }

  .hs27-arrow{
    width:50px!important;
    height:50px!important;
    background:rgba(6,22,38,.46)!important;
    border:1px solid rgba(255,255,255,.24)!important;
    backdrop-filter:blur(10px)!important;
    -webkit-backdrop-filter:blur(10px)!important;
  }

  .hs27-arrow-prev{
    left:34px!important;
  }

  .hs27-arrow-next{
    right:34px!important;
  }

  .hs27-dots{
    left:50%!important;
    bottom:26px!important;
    transform:translateX(-50%)!important;
  }

  .hs27-counter{
    right:38px!important;
    bottom:24px!important;
  }
}

@media (min-width:1600px){
  .hs27-hero,
  .hs27-hero.is-image-only,
  .hs27-hero.has-slider-content{
    height:clamp(680px, calc(100vh - 154px), 820px)!important;
    min-height:680px!important;
    max-height:820px!important;
  }
}


/* =========================================================
   FINAL FIX - DESKTOP HERO NET BANNER MODU
   Dosya: /index.php
   Amaç:
   - Masaüstünde slider görseli kırpılmadan görünür.
   - Görselin boş kalan alanları bulanık arka planla full ekran dolar.
   - Sabit header altında beyaz boşluk/üstten kesilme görüntüsü engellenir.
   - Mobil hero ayarlarına dokunulmaz.
========================================================= */
@media (min-width:1200px){
  body{
    padding-top:154px!important;
  }

  .ks27-main{
    width:100vw!important;
    max-width:100vw!important;
    margin-left:calc(50% - 50vw)!important;
    margin-right:calc(50% - 50vw)!important;
    overflow:hidden!important;
    background:#061626!important;
  }

  .hs27-hero,
  .hs27-hero.is-image-only,
  .hs27-hero.has-slider-content{
    width:100vw!important;
    max-width:100vw!important;
    margin-left:calc(50% - 50vw)!important;
    margin-right:calc(50% - 50vw)!important;
    margin-top:0!important;
    height:clamp(540px, 34vw, 620px)!important;
    min-height:540px!important;
    max-height:620px!important;
    border-radius:0!important;
    overflow:hidden!important;
    background:#061626!important;
    box-shadow:none!important;
    isolation:isolate!important;
  }

  .hs27-track,
  .hs27-slide{
    height:100%!important;
    min-height:100%!important;
  }

  .hs27-slide{
    position:relative!important;
    background:#061626!important;
    display:block!important;
    overflow:hidden!important;
  }

  .hs27-slide::before{
    content:""!important;
    position:absolute!important;
    inset:-32px!important;
    z-index:0!important;
    background-image:var(--hs27-slide-bg)!important;
    background-size:cover!important;
    background-position:center center!important;
    background-repeat:no-repeat!important;
    filter:blur(20px) brightness(.54) saturate(1.18)!important;
    transform:scale(1.08)!important;
    opacity:.94!important;
    pointer-events:none!important;
  }

  .hs27-slide::after{
    content:""!important;
    position:absolute!important;
    inset:0!important;
    z-index:1!important;
    background:
      linear-gradient(90deg,rgba(2,8,23,.36) 0%,rgba(2,8,23,.05) 16%,rgba(2,8,23,.04) 84%,rgba(2,8,23,.36) 100%),
      linear-gradient(180deg,rgba(2,8,23,.04) 0%,rgba(2,8,23,.10) 100%)!important;
    pointer-events:none!important;
  }

  .hs27-slide-img,
  .hs27-hero.is-image-only .hs27-slide-img,
  .hs27-slide.no-content .hs27-slide-img,
  .hs27-hero.has-slider-content .hs27-slide-img{
    position:relative!important;
    z-index:2!important;
    width:100%!important;
    height:100%!important;
    max-width:100%!important;
    max-height:100%!important;
    display:block!important;
    object-fit:contain!important;
    object-position:center center!important;
    background:transparent!important;
    padding:0!important;
    margin:0 auto!important;
    filter:saturate(1.04) contrast(1.02)!important;
  }

  /* Görselde yazı olduğu için sistem yazıları bindirilmez. */
  .hs27-hero .hs27-content,
  .hs27-hero .hs27-kicker,
  .hs27-hero .hs27-heading,
  .hs27-hero .hs27-desc,
  .hs27-hero .hs27-actions{
    display:none!important;
  }

  .hs27-hero .hs27-overlay,
  .hs27-slide.no-content .hs27-overlay,
  .hs27-hero.is-image-only .hs27-overlay{
    z-index:3!important;
    background:transparent!important;
    pointer-events:none!important;
  }

  .hs27-hero .hs27-ambient,
  .hs27-slide.no-content .hs27-ambient,
  .hs27-hero.is-image-only .hs27-ambient{
    display:none!important;
  }

  .hs27-arrow{
    z-index:8!important;
    width:48px!important;
    height:48px!important;
    background:rgba(6,22,38,.52)!important;
    border:1px solid rgba(255,255,255,.28)!important;
    backdrop-filter:blur(10px)!important;
    -webkit-backdrop-filter:blur(10px)!important;
    box-shadow:0 14px 34px rgba(2,8,23,.22)!important;
  }

  .hs27-arrow-prev{
    left:32px!important;
  }

  .hs27-arrow-next{
    right:32px!important;
  }

  .hs27-dots{
    z-index:8!important;
    left:50%!important;
    bottom:22px!important;
    transform:translateX(-50%)!important;
  }

  .hs27-counter{
    z-index:8!important;
    right:36px!important;
    bottom:20px!important;
  }

  .hs27-progress{
    z-index:9!important;
  }
}

@media (min-width:1600px){
  .hs27-hero,
  .hs27-hero.is-image-only,
  .hs27-hero.has-slider-content{
    height:clamp(570px, 33.5vw, 660px)!important;
    min-height:570px!important;
    max-height:660px!important;
  }
}



/* =========================================================
   FINAL FIX - HEADER / HERO ARASI BEYAZ BOŞLUK KALDIRMA
   Dosya: /index.php
   Amaç:
   - Public header altındaki boş/beyaz page-banner alanını ana sayfada gizler.
   - Slider hero header biter bitmez başlar.
   - Sadece desktop düzenini hedefler, mobil hero yapısına dokunmaz.
========================================================= */
@media (min-width:1200px){
  .ks27ph-page-banner,
  .ks27ph-page-banner-inner,
  .ks27ph-page-breadcrumb{
    display:none!important;
    height:0!important;
    min-height:0!important;
    max-height:0!important;
    padding:0!important;
    margin:0!important;
    border:0!important;
    overflow:hidden!important;
    opacity:0!important;
    visibility:hidden!important;
  }

  .ks27-main{
    margin-top:0!important;
    padding-top:0!important;
    background:#061626!important;
  }

  .hs27-hero,
  .hs27-hero.is-image-only,
  .hs27-hero.has-slider-content{
    margin-top:0!important;
    border-top:0!important;
  }

  /* Header gölgesinden kaynaklı açık çizgi görünürse hero üstüne koyu geçiş verir. */
  .hs27-hero::before{
    content:""!important;
    position:absolute!important;
    left:0!important;
    right:0!important;
    top:0!important;
    height:1px!important;
    z-index:10!important;
    background:#061626!important;
    pointer-events:none!important;
  }
}


/* =========================================================
   FINAL PERFORMANS + HEADER/HERO GAP FIX
   Dosya: /index.php
   - Header ile hero arasındaki beyaz boşluğu masaüstünde sıfırlar.
   - Video kartlarında iframe yerine tıklandığında yüklenen hafif yapı kullanılır.
   - İlk ekran dışı bölümlerde tarayıcı yükünü azaltır.
========================================================= */
@media(min-width:1200px){
  body .ks27-main{
    margin-top:-30px!important;
    padding-top:0!important;
    background:#061626!important;
  }

  body .ks27-main > .hs27-hero:first-child,
  body .ks27-main > section.hs27-hero:first-child{
    margin-top:0!important;
    border-top:0!important;
  }

  body .ks27ph-page-banner,
  body .ks27ph-page-banner-inner,
  body .ks27ph-page-breadcrumb,
  body .page-title-area,
  body .breadcrumb-area{
    display:none!important;
    height:0!important;
    min-height:0!important;
    max-height:0!important;
    padding:0!important;
    margin:0!important;
    border:0!important;
    overflow:hidden!important;
  }

  .hs27-hero,
  .hs27-hero.is-image-only,
  .hs27-hero.has-slider-content{
    height:clamp(560px,34vw,650px)!important;
    min-height:560px!important;
    max-height:650px!important;
  }
}

@media(min-width:768px){
  .ks27-services,
  .ks27-about,
  .ks27-reviews,
  .ks27-references,
  .ks27-news{
    content-visibility:auto;
    contain-intrinsic-size:720px;
  }
}

.ks27-video-lazy{
  position:relative;
  width:100%;
  height:100%;
  display:block;
  padding:0;
  margin:0;
  border:0;
  background:#07111f;
  cursor:pointer;
  overflow:hidden;
}

.ks27-video-lazy img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}


/* =========================================================
   PAGE SPEED 95-100 HEDEF MODU
   - Mobile LCP yükünü azaltır.
   - Video kapak görsellerini idle sonrası yükler.
   - Header/hero arasındaki beyaz çizgiyi kesin kapatır.
========================================================= */
.ks27ph-page-banner,
.ks27ph-page-banner-inner,
.ks27ph-page-breadcrumb,
.page-title-area,
.breadcrumb-area{
  display:none!important;
  height:0!important;
  min-height:0!important;
  max-height:0!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  overflow:hidden!important;
}

.ks27-main{
  margin-top:0!important;
  padding-top:0!important;
}

.ks27-lazy-img{
  filter:saturate(1.04) contrast(1.02);
}

@media(max-width:767px){
  .hs27-hero,
  .hs27-hero.is-image-only,
  .hs27-hero.has-slider-content{
    height:clamp(420px,76vw,560px)!important;
    min-height:420px!important;
    max-height:560px!important;
  }

  .hs27-slide-img,
  .hs27-hero.is-image-only .hs27-slide-img,
  .hs27-slide.no-content .hs27-slide-img,
  .hs27-hero.has-slider-content .hs27-slide-img{
    object-fit:cover!important;
    object-position:center center!important;
  }

  .ks27-videos{
    padding-top:28px!important;
  }

  .ks27-videos .ks27-section-head{
    margin-bottom:16px!important;
  }

  .ks27-video-media{
    min-height:178px!important;
  }
}

@media(min-width:768px){
  .ks27-videos,
  .ks27-services,
  .ks27-about,
  .ks27-reviews,
  .ks27-references,
  .ks27-news{
    content-visibility:auto;
    contain-intrinsic-size:650px;
  }
}

@media(max-width:767px){
  .ks27-ref-card{
    flex:0 0 calc(50vw - 18px)!important;
    min-width:calc(50vw - 18px)!important;
    max-width:calc(50vw - 18px)!important;
    min-height:118px!important;
    padding:18px 12px 30px!important;
  }
  .ks27-ref-card img{height:64px!important;max-height:64px!important;}
}


/* =========================================================
   MOBİL PAGESPEED FINAL
   İlk ekranda hero hızlı yüklensin, alt bloklar görünene kadar tarayıcıyı yormasın.
========================================================= */
@media(max-width:767px){
  .ks27-videos,
  .ks27-services,
  .ks27-about,
  .ks27-reviews,
  .ks27-references,
  .ks27-news{
    content-visibility:auto;
    contain-intrinsic-size:620px;
  }

  .ks27-video-media,
  .ks27-service-image,
  .ks27-news-image,
  .ks27-about-image{
    contain:layout paint;
  }
}



/* =========================================================
   FINAL FIX - HİZMET 9 KART + BLOG SOLA KAYAR + REFERANS LOGO + SSS
   Dosya: /index.php
   PageSpeed notu: Yeni harici kütüphane yoktur; native CSS scroll + mevcut hafif JS kullanılır.
========================================================= */
@media(min-width:768px){
  .ks27-service-grid{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:22px!important;
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    padding:0!important;
    overflow:visible!important;
    scroll-snap-type:none!important;
  }

  .ks27-service-card{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    flex:none!important;
  }

  .ks27-news-grid{
    display:flex!important;
    gap:22px!important;
    width:100%!important;
    max-width:100%!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    scroll-snap-type:x mandatory!important;
    scroll-padding-left:0!important;
    -webkit-overflow-scrolling:touch!important;
    scrollbar-width:none!important;
    padding:4px 0 18px!important;
    margin:0!important;
  }

  .ks27-news-grid::-webkit-scrollbar{
    display:none!important;
  }

  .ks27-news-card{
    flex:0 0 calc((100% - 44px) / 3)!important;
    width:calc((100% - 44px) / 3)!important;
    min-width:calc((100% - 44px) / 3)!important;
    max-width:calc((100% - 44px) / 3)!important;
    scroll-snap-align:start!important;
  }
}

.ks27-ref-track{
  align-items:stretch!important;
}

.ks27-ref-card{
  min-height:150px!important;
  padding:24px 18px 34px!important;
}

.ks27-ref-card img{
  width:auto!important;
  max-width:86%!important;
  height:auto!important;
  max-height:86px!important;
  object-fit:contain!important;
  opacity:1!important;
  visibility:visible!important;
  display:block!important;
  position:relative!important;
  z-index:3!important;
}

.ks27-faq{
  background:
    radial-gradient(circle at top left,rgba(24,184,232,.11),transparent 36%),
    linear-gradient(180deg,#ffffff,#f1f9ff);
}

.ks27-faq-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
}

.ks27-faq-card{
  min-width:0;
  padding:24px 24px 22px;
  border-radius:24px;
  background:var(--ks27-index-card);
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 18px 42px rgba(15,23,42,.08);
  contain:layout paint;
}

.ks27-faq-card h3{
  margin:0 0 10px;
  color:var(--ks27-index-title);
  font-size:18px;
  line-height:1.35;
  font-weight:950;
}

.ks27-faq-card p{
  margin:0;
  color:#64748b;
  font-size:15px;
  line-height:1.72;
}

.ks27-faq-no{
  width:34px;
  height:34px;
  margin-bottom:14px;
  border-radius:13px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:var(--ks27-index-button-text);
  background:linear-gradient(135deg,var(--ks27-index-button),var(--ks27-index-link));
  font-size:14px;
  font-weight:950;
  box-shadow:0 12px 26px var(--ks27-index-glow);
}

body.dark-mode .ks27-faq,
body[data-theme="dark"] .ks27-faq,
html[data-theme="dark"] .ks27-faq{
  background:linear-gradient(180deg,#07111f,#0b1628)!important;
}

body.dark-mode .ks27-faq-card,
body[data-theme="dark"] .ks27-faq-card,
html[data-theme="dark"] .ks27-faq-card{
  background:#0f1f33!important;
  border-color:rgba(255,255,255,.10)!important;
}

body.dark-mode .ks27-faq-card h3,
body[data-theme="dark"] .ks27-faq-card h3,
html[data-theme="dark"] .ks27-faq-card h3{
  color:#f8fbff!important;
}

body.dark-mode .ks27-faq-card p,
body[data-theme="dark"] .ks27-faq-card p,
html[data-theme="dark"] .ks27-faq-card p{
  color:#cbd5e1!important;
}

@media(max-width:767px){
  .ks27-news-grid{
    display:flex!important;
    width:100vw!important;
    max-width:100vw!important;
    gap:12px!important;
    margin-left:0!important;
    margin-right:0!important;
    padding:4px 10px 18px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    scroll-snap-type:x mandatory!important;
    scroll-padding-left:10px!important;
    scroll-padding-right:10px!important;
    -webkit-overflow-scrolling:touch!important;
    scrollbar-width:none!important;
  }

  .ks27-news-card{
    flex:0 0 calc(100vw - 20px)!important;
    width:calc(100vw - 20px)!important;
    max-width:calc(100vw - 20px)!important;
    min-width:calc(100vw - 20px)!important;
    scroll-snap-align:center!important;
  }

  .ks27-ref-card{
    flex:0 0 172px!important;
    min-height:128px!important;
    padding:20px 14px 31px!important;
  }

  .ks27-ref-card img{
    max-width:88%!important;
    max-height:72px!important;
  }

  .ks27-faq{
    width:100vw!important;
    max-width:100vw!important;
    margin-left:calc(50% - 50vw)!important;
    margin-right:calc(50% - 50vw)!important;
    overflow:hidden!important;
  }

  .ks27-faq .ks27-container{
    width:100%!important;
    max-width:100%!important;
    padding-left:12px!important;
    padding-right:12px!important;
  }

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

  .ks27-faq-card{
    border-radius:22px!important;
    padding:22px 18px 20px!important;
  }
}



/* =========================================================
   FINAL FIX 21.05.2026 - HERO TAM GÖRÜNÜR + REFERANS KART STABİL
   Dosya: /index.php
   Not: PageSpeed için yeni JS/kütüphane yoktur; sadece CSS son katman düzeltmesi.
========================================================= */
.ks27-references{
  content-visibility:visible!important;
  contain-intrinsic-size:auto!important;
  overflow:hidden!important;
  background:
    radial-gradient(circle at 12% 18%,rgba(0,166,180,.12),transparent 34%),
    radial-gradient(circle at 88% 14%,rgba(24,184,232,.10),transparent 30%),
    linear-gradient(180deg,#f7fcff 0%,#ffffff 100%)!important;
}

@media(min-width:768px){
  .ks27-references .ks27-section-head{
    margin-bottom:30px!important;
  }

  .ks27-ref-track{
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:18px!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin:0!important;
    padding:0!important;
    overflow:visible!important;
    scroll-snap-type:none!important;
    transform:none!important;
    align-items:stretch!important;
  }

  .ks27-ref-card{
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    height:172px!important;
    min-height:172px!important;
    max-height:172px!important;
    flex:none!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    padding:20px 18px 36px!important;
    border-radius:26px!important;
    overflow:hidden!important;
    background:
      radial-gradient(circle at 18% 18%,rgba(0,166,180,.10),transparent 38%),
      linear-gradient(180deg,#ffffff 0%,#eef9fd 100%)!important;
    border:1px solid rgba(0,166,180,.18)!important;
    box-shadow:0 18px 42px rgba(6,59,116,.10)!important;
    isolation:isolate!important;
    transform:none!important;
  }

  .ks27-ref-card::before{
    left:18px!important;
    right:18px!important;
    top:0!important;
    height:3px!important;
    background:linear-gradient(90deg,transparent,#00a6b4,transparent)!important;
    opacity:1!important;
  }

  .ks27-ref-card img{
    width:100%!important;
    max-width:196px!important;
    height:86px!important;
    max-height:86px!important;
    min-height:0!important;
    object-fit:contain!important;
    object-position:center center!important;
    display:block!important;
    opacity:1!important;
    visibility:visible!important;
    position:relative!important;
    z-index:3!important;
    margin:0 auto!important;
    filter:drop-shadow(0 12px 20px rgba(6,59,116,.14)) saturate(1.06) contrast(1.04)!important;
  }

  .ks27-ref-fallback{
    display:flex!important;
    width:64px!important;
    height:64px!important;
    border-radius:22px!important;
  }

  .ks27-ref-card:not(.ks27-ref-card-no-img) .ks27-ref-fallback{
    display:none!important;
  }

  .ks27-ref-name{
    left:12px!important;
    right:12px!important;
    bottom:13px!important;
    color:#063b74!important;
    font-size:12px!important;
    font-weight:950!important;
    line-height:1.25!important;
    text-shadow:none!important;
    opacity:1!important;
  }
}

@media(min-width:1200px){
  .ks27-ref-track{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
  }
}

@media(max-width:767px){
  .hs27-hero,
  .hs27-hero.is-image-only,
  .hs27-hero.has-slider-content{
    width:100vw!important;
    max-width:100vw!important;
    margin-left:calc(50% - 50vw)!important;
    margin-right:calc(50% - 50vw)!important;
    height:clamp(340px,64vw,460px)!important;
    min-height:340px!important;
    max-height:460px!important;
    overflow:hidden!important;
    background:#061626!important;
    border-radius:0!important;
    isolation:isolate!important;
  }

  .hs27-track,
  .hs27-slide{
    height:100%!important;
    min-height:100%!important;
  }

  .hs27-slide{
    position:relative!important;
    background:#061626!important;
  }

  .hs27-slide::before{
    content:""!important;
    position:absolute!important;
    inset:-24px!important;
    z-index:0!important;
    background-image:var(--hs27-slide-bg)!important;
    background-size:cover!important;
    background-position:center center!important;
    background-repeat:no-repeat!important;
    filter:blur(18px) brightness(.50) saturate(1.14)!important;
    transform:scale(1.09)!important;
    opacity:.95!important;
    pointer-events:none!important;
  }

  .hs27-slide-img,
  .hs27-hero.is-image-only .hs27-slide-img,
  .hs27-slide.no-content .hs27-slide-img,
  .hs27-hero.has-slider-content .hs27-slide-img{
    position:relative!important;
    z-index:2!important;
    width:100%!important;
    height:100%!important;
    max-width:100%!important;
    max-height:100%!important;
    object-fit:contain!important;
    object-position:center center!important;
    background:transparent!important;
    padding:0!important;
    margin:0 auto!important;
    filter:saturate(1.04) contrast(1.02)!important;
  }

  .hs27-hero .hs27-overlay,
  .hs27-slide.no-content .hs27-overlay,
  .hs27-hero.is-image-only .hs27-overlay{
    z-index:3!important;
    background:linear-gradient(180deg,rgba(2,8,23,.02) 0%,rgba(2,8,23,.10) 100%)!important;
    pointer-events:none!important;
  }

  .hs27-hero .hs27-ambient,
  .hs27-slide.no-content .hs27-ambient,
  .hs27-hero.is-image-only .hs27-ambient{
    display:none!important;
  }

  .hs27-arrow{
    z-index:8!important;
    width:42px!important;
    height:42px!important;
    background:rgba(6,22,38,.56)!important;
    border:1px solid rgba(255,255,255,.24)!important;
  }

  .hs27-dots{
    z-index:8!important;
    bottom:18px!important;
    left:50%!important;
    transform:translateX(-50%)!important;
  }

  .ks27-references{
    width:100vw!important;
    max-width:100vw!important;
    margin-left:calc(50% - 50vw)!important;
    margin-right:calc(50% - 50vw)!important;
    padding-top:46px!important;
    padding-bottom:44px!important;
  }

  .ks27-references .ks27-container{
    width:100%!important;
    max-width:100%!important;
    padding-left:12px!important;
    padding-right:12px!important;
  }

  .ks27-references .ks27-section-head{
    margin-bottom:22px!important;
    padding-left:8px!important;
    padding-right:8px!important;
  }

  .ks27-ref-track{
    display:flex!important;
    width:100vw!important;
    max-width:100vw!important;
    gap:14px!important;
    margin-left:-12px!important;
    margin-right:-12px!important;
    padding:6px 12px 18px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    scroll-snap-type:x mandatory!important;
    scroll-padding-left:12px!important;
    -webkit-overflow-scrolling:touch!important;
    scrollbar-width:none!important;
    transform:none!important;
  }

  .ks27-ref-track::-webkit-scrollbar{
    display:none!important;
  }

  .ks27-ref-card{
    flex:0 0 calc(100vw - 34px)!important;
    width:calc(100vw - 34px)!important;
    min-width:calc(100vw - 34px)!important;
    max-width:calc(100vw - 34px)!important;
    height:150px!important;
    min-height:150px!important;
    max-height:150px!important;
    scroll-snap-align:center!important;
    border-radius:24px!important;
    padding:20px 18px 36px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    background:
      radial-gradient(circle at 18% 18%,rgba(0,166,180,.11),transparent 38%),
      linear-gradient(180deg,#ffffff 0%,#eef9fd 100%)!important;
    border:1px solid rgba(0,166,180,.18)!important;
    box-shadow:0 16px 36px rgba(6,59,116,.10)!important;
    overflow:hidden!important;
  }

  .ks27-ref-card img{
    width:100%!important;
    max-width:188px!important;
    height:78px!important;
    max-height:78px!important;
    min-height:0!important;
    object-fit:contain!important;
    display:block!important;
    opacity:1!important;
    visibility:visible!important;
    margin:0 auto!important;
    filter:drop-shadow(0 10px 18px rgba(6,59,116,.14)) saturate(1.08) contrast(1.04)!important;
  }

  .ks27-ref-card:not(.ks27-ref-card-no-img) .ks27-ref-fallback{
    display:none!important;
  }

  .ks27-ref-name{
    left:12px!important;
    right:12px!important;
    bottom:12px!important;
    color:#063b74!important;
    font-size:12px!important;
    font-weight:950!important;
    line-height:1.25!important;
    text-shadow:none!important;
    opacity:1!important;
  }
}

@media(max-width:420px){
  .hs27-hero,
  .hs27-hero.is-image-only,
  .hs27-hero.has-slider-content{
    height:clamp(320px,78vw,390px)!important;
    min-height:320px!important;
    max-height:390px!important;
  }
}



/* =========================================================
   FINAL: HİZMETLER + ÜRÜNLER 4'LÜ GRID / MOBİL FULL SCREEN SLIDER
   - Desktop: aynı satırda 4 kart
   - Tablet: aynı satırda 2 kart
   - Mobil: her kart tam ekran genişliğinde, sola kaydırmalı
========================================================= */
@media (min-width:1181px){
  .ks27-services .ks27-service-grid{
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:18px!important;
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    padding:0!important;
    overflow:visible!important;
    scroll-snap-type:none!important;
  }

  .ks27-services .ks27-service-card{
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    flex:none!important;
  }

  .ks27-services .ks27-service-image{
    height:auto!important;
    min-height:190px!important;
    aspect-ratio:16 / 10!important;
  }

  .ks27-services .ks27-service-body{
    padding:18px!important;
  }

  .ks27-services .ks27-service-body h3{
    font-size:18px!important;
  }
}

@media (min-width:768px) and (max-width:1180px){
  .ks27-services .ks27-service-grid{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:18px!important;
    width:100%!important;
    margin:0!important;
    padding:0!important;
    overflow:visible!important;
    scroll-snap-type:none!important;
  }

  .ks27-services .ks27-service-card{
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    flex:none!important;
  }
}

@media (max-width:767px){
  .ks27-services{
    width:100vw!important;
    max-width:100vw!important;
    margin-left:calc(50% - 50vw)!important;
    margin-right:calc(50% - 50vw)!important;
    overflow:hidden!important;
  }

  .ks27-services .ks27-container{
    width:100vw!important;
    max-width:100vw!important;
    padding-left:0!important;
    padding-right:0!important;
  }

  .ks27-services .ks27-section-head{
    padding-left:16px!important;
    padding-right:16px!important;
  }

  .ks27-services .ks27-service-grid{
    display:flex!important;
    width:100vw!important;
    max-width:100vw!important;
    gap:0!important;
    margin:0!important;
    padding:0!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    scroll-snap-type:x mandatory!important;
    scroll-behavior:smooth!important;
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior-x:contain!important;
    scrollbar-width:none!important;
  }

  .ks27-services .ks27-service-grid::-webkit-scrollbar{
    display:none!important;
  }

  .ks27-services .ks27-service-card{
    flex:0 0 100vw!important;
    width:100vw!important;
    min-width:100vw!important;
    max-width:100vw!important;
    margin:0!important;
    border-radius:0!important;
    scroll-snap-align:start!important;
    scroll-snap-stop:always!important;
    box-shadow:none!important;
  }

  .ks27-services .ks27-service-image{
    width:100vw!important;
    height:auto!important;
    min-height:240px!important;
    aspect-ratio:16 / 10!important;
    border-radius:0!important;
  }

  .ks27-services .ks27-service-body{
    min-height:270px!important;
    padding:22px 18px 24px!important;
  }

  .ks27-services .ks27-card-footer .ks27-btn{
    width:100%!important;
  }

  .ks27-services .ks27-section-action{
    padding:0 16px!important;
  }

  .ks27-services .ks27-section-action .ks27-btn{
    width:100%!important;
  }
}

/* =========================================================
   MOBIL LCP OPTIMIZASYONU
   - Masaüstü görünümüne dokunmaz.
   - Mobilde pahalı blur arka plan kopyasını kapatır.
   - picture kaynağının hero ölçüsünü eksiksiz doldurmasını sağlar.
========================================================= */
@media (max-width:767px){
  .hs27-slide::before{
    display:none!important;
    content:none!important;
    background-image:none!important;
    filter:none!important;
  }

  .hs27-slide picture{
    position:relative!important;
    z-index:2!important;
    display:block!important;
    width:100%!important;
    height:100%!important;
  }

  .hs27-slide picture .hs27-slide-img{
    width:100%!important;
    height:100%!important;
    display:block!important;
    object-fit:cover!important;
    object-position:center center!important;
  }
}