/* 4 Kas gece: hizmet sayfaları görsel turu. sahne.css'ten sonra yüklenir. */

/* hizmet sayfası başlığı: sağda konuya ait fotoğraf, lacivertle yumuşakça birleşir, yavaşça yaklaşır */
.hzd-bas { min-height: 520px; }
.hzd-bas .kap { z-index: 2; }
.hzd-bas .hzd-rakam { z-index: 2; }
.hzd-gorsel { position: absolute; right: 0; top: 0; width: 64%; height: 100%; object-fit: cover; z-index: 1; pointer-events: none;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.55) 30%, #000 60%); mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.55) 30%, #000 60%);
  filter: saturate(.92) contrast(1.02); animation: yaklas 24s ease-in-out infinite alternate; transform-origin: 70% 50%; }
@keyframes yaklas { from { transform: scale(1.02); } to { transform: scale(1.12) translateX(-1.5%); } }
.hzd-bas::before { z-index: 1; background: linear-gradient(90deg, rgba(11,23,54,.97) 0%, rgba(11,23,54,.88) 38%, rgba(11,23,54,.35) 70%, rgba(11,23,54,.55) 100%); }
.hzd-bas::after { z-index: 1; opacity: .18; }
.hzd-bas h1 { font-size: clamp(2.3rem, 4.4vw, 3.8rem); max-width: 640px; }
.hzd-bas p { max-width: 560px; }
.hzd-bas .kap::after { content: ""; display: block; width: 120px; height: 9px; margin-top: 34px;
  background: linear-gradient(var(--altin), var(--altin)) left center / 52px 1px no-repeat, linear-gradient(var(--altin), var(--altin)) right center / 52px 1px no-repeat,
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Crect x='2' y='2' width='6' height='6' transform='rotate(45 5 5)' fill='%23b8975a'/%3E%3C/svg%3E") center / 9px no-repeat; }

/* hizmetler listesi: fotoğraflı kartlar */
.hzk { padding-top: 0; }
.hzk-gorsel { display: block; position: relative; margin: 0 -36px 28px; height: 190px; overflow: hidden; z-index: 0; }
.hzk-gorsel img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.4s var(--hiz), filter .8s; filter: saturate(.9); }
.hzk-gorsel::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(11,23,54,.05) 40%, rgba(11,23,54,.55) 100%); }
.hzk:hover .hzk-gorsel img { transform: scale(1.08); filter: saturate(1.05); }
.hzk .no { top: 128px; right: 22px; z-index: 2; -webkit-text-stroke: 1px rgba(255,255,255,.85); font-size: 4.4rem; }
.hzk .hzk-ikon { position: relative; z-index: 2; margin-top: -54px; background: var(--zemin); box-shadow: 0 10px 24px -10px rgba(11,23,54,.45); transition: background .5s; }
.hzk:hover .hzk-ikon { background: var(--laci); }
.hzk::after { inset: 202px 12px 12px; }
.hzk:hover::after { inset: 206px 16px 16px; }

/* kimler için kutusu: pirinç gravür levha zemini */
.hzd-kimler { background: linear-gradient(100deg, rgba(11,23,54,.96) 0%, rgba(11,23,54,.86) 55%, rgba(11,23,54,.6) 100%), url("img/lux_levha_900.webp") center / cover; }
.hzd-kimler::after { display: none; }

/* kapsam maddeleri: üstüne gelince sıra numarası altın daireye dolar */
.hzd-kapsam .sira { width: 42px; height: 42px; border-radius: 50%; display: grid; place-items: center; font-size: 1.05rem; box-shadow: inset 0 0 0 1px rgba(184,151,90,.6); transition: background .4s, color .4s; }
.hzd-kapsam li:hover .sira { background: var(--altin); color: var(--laci-koyu); }

@media (max-width: 900px) {
  .hzd-bas { min-height: 440px; }
  .hzd-gorsel { width: 100%; opacity: .45; -webkit-mask-image: none; mask-image: none; }
  .hzd-bas::before { background: linear-gradient(180deg, rgba(11,23,54,.75), rgba(11,23,54,.92)); }
}
@media (prefers-reduced-motion: reduce) { .hzd-gorsel { animation: none; } }
