/* Hizmetler sayfası: yalnız ortak kitte olmayan yerleşim. Sınıflar hz- ön ekiyle. */

/* ——— Süzgeç: alan etiketleri ve görünen sayı ——— */
.hz-suzgec { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .9rem 2rem; margin-bottom: clamp(1.25rem, 3vw, 2rem); }
.hz-suzgec .etiket { min-height: 2.75rem; padding: .4rem 1.1rem; font-size: .975rem; cursor: pointer; }
.hz-suzgec .etiket:hover { border-color: rgba(127, 214, 255, .6); }
.hz-suzgec .etiket[aria-pressed="true"]:hover { border-color: var(--altin); }
.bolum .hz-sayac { margin: 0; font-size: .95rem; color: var(--buz); }
/* JS yoksa süzgeç düğmeleri bir işe yaramaz: yalnız sayı satırı kalır, tüm kartlar görünür */
html:not(.js) .hz-suzgec .etiketler { display: none; }

/* ——— Kart ızgarası: ana sayfa kartının kendisi, yana kaydırma yerine ızgara ——— */
.hz-kartlar { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.hz-kartlar > [hidden] { display: none; }
.hz-taslak { align-self: flex-start; color: var(--sis); }
.hareket .hz-kartlar > .hz-gir { animation: hz-gir .55s var(--yay) both; }
@keyframes hz-gir { from { opacity: 0; translate: 0 14px; } }

/* ——— Emin değil misiniz + koçluk ne değildir ——— */
.hz-yon { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: clamp(1.75rem, 6vw, 5.5rem); align-items: center; }
.hz-yon .baslik { font-size: clamp(2.35rem, 1.6rem + 3.2vw, 4.4rem); }
.hz-yon__sol .baslik + p { margin-top: clamp(1.1rem, 2.4vw, 1.6rem); }
.hz-yon__sol p { font-size: clamp(1.0625rem, 1rem + .35vw, 1.2rem); line-height: 1.55; }
.hz-yon__eylem { display: flex; flex-wrap: wrap; gap: .8rem 1rem; margin-top: 1.6rem; }
.hz-uyari { padding: clamp(1.35rem, 2.6vw, 2.1rem); }
.hz-uyari .maddeler { margin-bottom: 1.2rem; }
.hz-uyari .maddeler strong { color: var(--metin); font-weight: 700; }
.hz-uyari p { margin-bottom: .9rem; }

@media (max-width: 75rem) {
  .hz-kartlar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 60rem) {
  .hz-yon { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 40rem) {
  .hz-kartlar { grid-template-columns: minmax(0, 1fr); gap: .8rem; }
  .hz-kartlar .kart { min-height: 0; }
  .hz-suzgec .etiketler { width: 100%; }
  .hz-yon__eylem .dugme { width: 100%; }
}