.metin-sayfa {
  min-block-size: calc(100svh - var(--header-h));
  padding-block: var(--space-8) var(--space-16);
}
.metin-sayfa__yerlesim {
  display: grid;
  grid-template-columns: minmax(0, var(--container-narrow)) minmax(0, var(--fis-en));
  gap: var(--space-10);
  align-items: start;
}
.metin-sayfa--tek .metin-sayfa__yerlesim { grid-template-columns: minmax(0, var(--container-narrow)); }
.metin-sayfa__yerlesim > .metin { grid-column: 1; grid-row: 1; }
.metin__icindekiler {
  grid-column: 2;
  grid-row: 1;
  position: sticky;
  top: calc(var(--header-h) + var(--space-5));
  min-inline-size: 0;
}
.metin__icindekiler summary {
  min-block-size: var(--alan-h);
  padding: var(--space-3);
  border: var(--line-w) solid var(--line);
  cursor: pointer;
}
.js .metin__icindekiler[open] summary { display: none; }
.metin__icindekiler ol { margin: 0; padding-inline-start: var(--space-5); }
.metin__icindekiler a { display: inline-flex; min-block-size: var(--alan-h); align-items: center; color: var(--text-muted); }
.metin__icindekiler a:hover { color: var(--text-strong); }
.metin { min-inline-size: 0; max-inline-size: var(--container-narrow); }
.metin h1 { margin-block-end: var(--space-8); font-size: var(--text-2xl); }
.metin h2 {
  margin-block: var(--space-10) var(--space-4);
  font-size: var(--text-lg);
  scroll-margin-block-start: calc(var(--header-h) + var(--space-4));
}
.metin h3 {
  margin-block: var(--space-6) var(--space-3);
  font-family: var(--font-body);
  font-size: var(--text-base);
  font-weight: 500;
  scroll-margin-block-start: calc(var(--header-h) + var(--space-4));
}
.metin p { margin-block-end: var(--space-4); font-size: var(--text-base); line-height: var(--leading-body); overflow-wrap: anywhere; }
.metin a, .metin__aydinlatma a { text-decoration: underline; text-underline-offset: var(--space-1); }
.metin__aydinlatma { margin-block: 0 var(--space-5); color: var(--text-muted); font-size: var(--text-sm); }

dialog.metin-pencere {
  inline-size: 100%;
  max-inline-size: var(--container-narrow);
  block-size: 100dvh;
  max-block-size: none;
  inset-block: 0;
  margin-block: 0;
  margin-inline: auto calc(100% - 100dvw);
  padding: 0;
  border: 0;
  background: var(--surface);
  color: var(--text);
  opacity: 0;
  transition: opacity var(--dur-base) var(--ease-out),
    display var(--dur-base) allow-discrete, overlay var(--dur-base) allow-discrete;
}
dialog.metin-pencere[open] { display: grid; grid-template-rows: auto minmax(0, 1fr); opacity: 1; }
@starting-style { dialog.metin-pencere[open] { opacity: 0; } }
dialog.metin-pencere::backdrop {
  background: var(--scrim);
  opacity: 0;
  transition: opacity var(--dur-base) var(--ease-out),
    display var(--dur-base) allow-discrete, overlay var(--dur-base) allow-discrete;
}
dialog.metin-pencere[open]::backdrop { opacity: 1; }
@starting-style { dialog.metin-pencere[open]::backdrop { opacity: 0; } }
.metin-pencere__ust { display: flex; justify-content: flex-end; padding: var(--space-3) var(--space-5); border-bottom: var(--line-w) solid var(--line); }
.metin-pencere__kapat { min-block-size: var(--alan-h); min-inline-size: var(--alan-h); border: 0; background: transparent; color: var(--text-strong); font: inherit; cursor: pointer; }
.metin-pencere__govde { overflow: auto; padding: var(--space-5); }
@media (width < 70rem) {
  .metin-sayfa__yerlesim { display: flex; flex-direction: column; gap: var(--space-5); }
  .metin-sayfa__yerlesim > .metin { inline-size: 100%; margin-inline: auto; }
  .metin__icindekiler { position: static; inline-size: 100%; max-inline-size: var(--container-narrow); margin-inline: auto; }
  .js .metin__icindekiler[open] summary { display: list-item; }
}
@media (width < 48rem) {
  dialog.metin-pencere { inline-size: 100dvw; max-inline-size: none; margin-inline: 0; }
}
