/* Archive: Hizmetler – tek kolon, alt alta */

.site-content{display: grid !important ;}
.maki-archive--services #svcGrid{
  display: grid;
  grid-template-columns: 1fr; /* tek kolon */
  gap: 24px;
 
}

/* Kartı tam genişlikte “section” gibi göster */
.maki-archive--services .svc-card{
  grid-column: 1 / -1;       /* her zaman tüm satırı kapla */
  border: 1px solid #eef0f3;
  border-radius: 16px;
  background: #fff;
  overflow: hidden;
  padding: 0;                 /* istersen 0; section hissi */
}

/* Üst görsel tam genişlik */
.maki-archive--services .svc-media{
  aspect-ratio: 16/9;         /* daha ferah görünüm */
  background: #f6f7f8;
}

/* İç boşluklar */
.maki-archive--services .svc-body{
  padding: 18px 18px 20px;
}

/* Daha okunur başlık ve metin */
.maki-archive--services .svc-ttl{ font-size: clamp(20px,2.2vw,26px); margin: 0 0 8px; }
.maki-archive--services .svc-excerpt{ color:#444; margin:0 0 10px; }

.maki-grid{ display:grid; grid-template-columns: 1fr; gap:24px; }
.svc-card{ grid-column: 1 / -1; }

/* === Hizmetler Hero – full-bleed, kaymasız === */
.maki-hero-full--services{
  position: relative;

  /* 100vw + translate yerine margin-calc tekniği */
  width: auto;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);

  min-height: clamp(240px, 34vw, 420px);
  background: linear-gradient(135deg, #0b1224, #0f1a38);
  background-image: var(--hero-bg, linear-gradient(135deg, #0b1224, #0f1a38));
  background-size: cover;
  background-position: center;
  color: #fff;

  display: grid;
  place-items: center;
  text-align: center;
  overflow: hidden;
}

.maki-hero-full--services::after{
  content:""; position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(0,0,0,.22), rgba(0,0,0,.34));
}

.maki-hero-inner{
  position: relative; z-index: 2;
  max-width: 980px;
  padding: 24px clamp(16px, 3vw, 32px);
}

.maki-hero-title{ margin:0 0 8px; line-height:1.1; font-weight:800; font-size:clamp(28px,4vw,52px); letter-spacing:-.015em; }
.maki-hero-desc{  margin:0 auto; max-width:70ch; opacity:.95; font-size:clamp(14px,1.6vw,18px); }

/* İçerik başlangıcına nefes payı */
.maki-archive--services .container:first-of-type{ padding-top: 22px; }

/* Yatay taşma ihtimaline karşı son kilit */
html, body { overflow-x: clip; }


/* Ortak ayarlar */
.maki-archive--services .maki-grid{
  display:grid;
  gap:24px;
}

/* === ÖNERİLEN: GRID MODU (mobil 1, tablet 2, masaüstü 3) === */
.services--grid .maki-grid{
  grid-template-columns: 1fr;                 /* mobil */
}
@media (min-width: 640px){
  .services--grid .maki-grid{ grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1024px){
  .services--grid .maki-grid{ grid-template-columns: repeat(3, 1fr); }
}
.services--grid .svc-card{ border-radius:16px; overflow:hidden; }

/* === LİSTE MODU (tek tek, “section” gibi) === */
.services--list .maki-grid{ grid-template-columns: 1fr; }
.services--list .svc-card{
  grid-column: 1 / -1;
  border-radius:16px;
  overflow:hidden;
}

/* Kart içi ufak düzen: görsel oranı sabitle */
.svc-media{ aspect-ratio: 16/9; background:#f6f7f8; }
.svc-thumb{ width:100%; height:100%; object-fit:cover; display:block; }
.svc-body{ padding:18px; }
.svc-ttl{ font-size:20px; margin:0 0 8px; line-height:1.25; }
.svc-excerpt{ color:#444; margin:0 0 10px; }

/* Kart iskeletini eşit yükseklik + alt hizada buton için düzenle */
.svc-card{ display:flex; height:100%; }               /* kart yüksekliği eşitlensin */
.svc-link{ display:flex; flex-direction:column; flex:1; }

/* Görsel üstte sabit, içerik esnesin */
.svc-media{ flex: 0 0 auto; }

/* Gövde kolon; "Detaylar" en alta itilsin */
.svc-body{
  display:flex;
  flex-direction:column;
  flex:1 1 auto;
  gap: 8px;
  padding:16px 18px 18px;
}

/* Başlık/özet ayarı – tutarlı yükseklik için min-height hafif artırılabilir */
.svc-ttl{ font-size:20px; margin:0 0 4px; line-height:1.25; }
.svc-excerpt{ color:#444; margin:0; }

/* Detay butonunu modernleştir ve en alta sabitle */
.svc-more{
  margin-top:auto;                           /* ALT HİZA: tüm kartlarda aynı çizgi */
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-weight:600;
  font-size:14px;
  letter-spacing:.2px;
  color:#0a58ca;
  text-decoration:none;
}

/* Ok ikon efekti */
.svc-more::after{
  content:"→";
  transform: translateX(0);
  transition: transform .18s ease, opacity .18s ease;
  opacity:.9;
}

/* Hover/focus etkileri – modern dokunuş */
.svc-link:hover .svc-more::after,
.svc-link:focus-visible .svc-more::after{
  transform: translateX(4px);
  opacity: 1;
}

/* Kart hover’ını bir tık daha modern yapalım */
.svc-card{
  border:1px solid #e9edf3;
  border-radius:16px;
  background:#fff;
  transition: box-shadow .18s ease, transform .18s ease, border-color .18s ease;
}
.svc-card:hover{
  transform: translateY(-2px);
  box-shadow: 0 10px 28px rgba(10,20,50,.08);
  border-color:#dfe6f1;
}

/* Klavye erişilebilirliği (focus halkası) */
.svc-link:focus-visible{
  outline: none;
  box-shadow: 0 0 0 3px rgba(20,115,230,.25);
  border-radius:16px;
}

/* Görsel oranını bir tık sinematik yap (isteğe bağlı) */
.svc-media{ aspect-ratio: 16/9; }