/* ─────── SERVICES ─────── */
.services{
  background:var(--white);
  padding-top:140px; /* hero'dan sonra gelen section: yuvarlatılmış bindirme (-48px) nedeniyle ekstra üst boşluk */
  position:relative;
  z-index:2;
  border-radius:48px 48px 0 0;
  margin-top:-48px;
}
.svc-bento{
  display:grid;
  grid-template-columns:1.55fr 1fr 1fr;
  grid-template-rows:360px 280px;
  gap:22px;
}
.svc-item{
  position:relative;
  border-radius:24px;
  overflow:hidden;
  background:#010f27;
  cursor:pointer;
  isolation:isolate;
  display:block;
  text-decoration:none;
  color:inherit;
}
.svc-item:nth-child(1){grid-column:1;grid-row:1/3}
.svc-item:nth-child(2){grid-column:2;grid-row:1}
.svc-item:nth-child(3){grid-column:3;grid-row:1;background:#f9f6f4}
.svc-item:nth-child(4){grid-column:2/4;grid-row:2}
.svc-item img{
  position:absolute;inset:0;
  width:100%;height:100%;
  object-fit:cover;
  filter:brightness(0.62) saturate(0.88);
  transition:filter .55s cubic-bezier(.2,.65,.3,1),transform .9s cubic-bezier(.2,.65,.3,1);
  z-index:1;
}
.svc-item:hover img{
  filter:brightness(0.38) saturate(0.72);
  transform:scale(1.06);
}
.svc-item:hover .svc-icon img{
  filter:none;
  transform:none;
}
.svc-item::before{
  content:"";
  position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(18,18,18,0.08) 0%,rgba(18,18,18,0) 30%,rgba(18,18,18,0.65) 100%);
  z-index:2;pointer-events:none;
  transition:background .4s ease;
}
.svc-item:nth-child(3)::before{display:none}
.svc-item:hover::before{background:rgba(18,18,18,0.5)}
.svc-item:nth-child(3):hover{background:#f9f6f4}
.svc-item-inner{
  position:absolute;inset:0;z-index:3;
  padding:36px 38px;
  display:flex;flex-direction:column;
  justify-content:flex-end;
}
.svc-icon{
  margin-bottom:16px;
}
.svc-icon img{
  position:static;
  inset:auto;
  width:52px;
  height:52px;
  object-fit:contain;
  filter:none;
  transition:none;
  z-index:auto;
  display:block;
}
.svc-text{display:flex;flex-direction:column;gap:0}
.svc-item h3{
  font-family:var(--sans);font-weight:600;
  font-size:32px;
  line-height:1.1;
  color:var(--white);margin:0;
}
.svc-item:nth-child(3) h3{color:var(--ink)}
.svc-item p{
  font-size:16px;line-height:1.6;
  color:var(--white);
  opacity:0;
  max-height:0;overflow:hidden;
  padding-top:0;
  transform:translateY(6px);
  transition:opacity .35s ease .05s, transform .35s ease .05s, max-height .35s ease, padding-top .35s ease;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  text-overflow:ellipsis;
}
.svc-item:nth-child(3) p{color:var(--ink-soft)}
.svc-item:hover p{opacity:1;max-height:200px;padding-top:12px;transform:translateY(0)}
.svc-cta{
  display:inline-flex;align-items:center;gap:8px;
  font-size:12px;font-weight:600;
  color:rgba(255,255,255,0.6);
  opacity:0;
  max-height:0;overflow:hidden;
  padding-top:0;
  transform:translateY(6px);
  transition:opacity .35s ease .12s, transform .35s ease .12s, max-height .35s ease .05s, padding-top .35s ease .05s;
}
.svc-item:hover .svc-cta{opacity:1;max-height:60px;padding-top:16px;transform:translateY(0)}
.svc-item:nth-child(3) .svc-cta{color:rgba(18,18,18,0.5)}
.svc-cta-arr{
  width:24px;height:24px;border-radius:99px;
  border:1px solid rgba(255,255,255,0.28);
  display:inline-flex;align-items:center;justify-content:center;
  transition:transform .25s ease,border-color .22s ease;
  flex-shrink:0;
}
.svc-item:nth-child(3) .svc-cta-arr{border-color:rgba(18,18,18,0.2)}
.svc-item:hover .svc-cta-arr{transform:rotate(45deg);border-color:rgba(255,255,255,0.5)}
.svc-item:nth-child(3):hover .svc-cta-arr{border-color:rgba(18,18,18,0.35);transform:rotate(45deg)}