.adim-liste{display:flex;flex-direction:column;gap:var(--b4);counter-reset:adim}
.adim{padding:var(--b5);display:grid;grid-template-columns:auto 1fr;gap:var(--b3) var(--b4);align-items:start}
@media (max-width:767px){
  .adim{grid-template-columns:1fr}
}
.adim-no{
  font-family:var(--aile-display);font-size:var(--t6);line-height:1;
  color:var(--soluk);min-inline-size:2ch;font-variant-numeric:tabular-nums;
}
.adim-govde{display:flex;flex-direction:column;gap:var(--b2)}
.adim-ad{font-size:var(--t7);line-height:var(--t7-s);font-weight:500}
.adim-govde .ekran{margin:var(--b2) 0 0}
/* 🔴 SIRA ÖNEMLİ: bu media bloğu yukarıdaki tabanla AYNI özgüllükte (0,2,0) ve
   `@media` özgüllük EKLEMEZ — tabandan ÖNCE yazıldığında margin 0px kalıyordu
   (ölçüldü). Telefonda kare KART KENARINA taşar: 390 px'lik ekranda kartın
   48 px'lik iki yanı gövde sütununu 252 px'e indiriyor, 408 px'lik kaynak 0,62
   ölçeğe düşüyor ve 14 px'lik arayüz yazısı ~8,7 px oluyor — OKUNMUYOR. Taşma
   payı `.adim`in KENDİ dolgusundan türüyor (`--b5`), literal yazılmıyor. */
@media (max-width:767px){
  .adim-govde .ekran{margin:var(--b2) calc(var(--b5) * -1) 0}
  .adim-govde .ekran figcaption{margin-inline:var(--b5)}
}
/* `.ekran` TEK YAZIM, `serit.css` içinde — burada yalnız adım kartının
   akışına oturtan boşluk ezilir. İkinci bir kopya yazmak aynı bileşenin
   iki yazımı olurdu ve biri bayatlardı. */
.adim-govde p{font-size:var(--t9);line-height:var(--t9-s);color:var(--soluk);max-inline-size:var(--olcu-orta)}
.adim-not{
  font-size:var(--tmicro);line-height:var(--t9-s);color:var(--soluk);
  padding-block-start:var(--b3);border-block-start:1px solid var(--cizgi);
}

.kur-not{display:flex;flex-direction:column;gap:var(--b3);margin-block-start:var(--b5)}
.kur-not p{font-size:var(--t9);line-height:var(--t9-s);color:var(--soluk);max-inline-size:var(--olcu-orta)}

