/* Supplied photos, recordings and catalogues share the existing navy palette. */
#uygulamalar, #kataloglar { scroll-margin-top: 7rem; }
.medya-bolum, .katalog-bolum { padding: clamp(3rem, 7vw, 7rem) clamp(1rem, 4vw, 4rem); }
.medya-bolum { background: #e9eff6; }
.medya-bolum__bas { max-width: 88rem; margin: 0 auto 2.5rem; display: grid; grid-template-columns: 1fr .65fr; gap: 2rem; align-items: end; }
.medya-bolum__bas h2 { font-size: clamp(2rem, 4vw, 4rem); line-height: 1.12; max-width: 18ch; }
.medya-bolum__bas p { color: #526174; font-size: 1rem; line-height: 1.7; }
.medya-izgara { max-width: 88rem; margin-inline: auto; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; }
.medya-kart { min-width: 0; display: block; overflow: hidden; border-radius: 16px; text-decoration: none; background: #fff; }
.medya-kart__gorsel { position: relative; overflow: hidden; background: #0b203c; }
.medya-kart img { width: 100%; height: auto; aspect-ratio: 4/3; object-fit: cover; transition: transform .3s; }
.medya-kart:hover img { transform: scale(1.025); }
.medya-kart__oynat, .medya-kart__buyut { position: absolute; inset-inline-end: .8rem; bottom: .8rem; padding: .35rem .75rem; border-radius: 30px; background: #08182be6; color: #fff; font-size: .9rem; }
.medya-kart__bilgi { padding: 1rem 1.2rem 1.2rem; }
.medya-kart__bilgi > span { color: #536782; font-size: .875rem; }
.medya-kart h3 { margin-top: .35rem; font-size: 1rem; line-height: 1.5; text-transform: none; letter-spacing: 0; }
.medya-devami { max-width: 88rem; margin: 2rem auto 0; }
.medya-devami > summary { width: fit-content; padding: .9rem 1.3rem; border: 1px solid #60738d; border-radius: 8px; cursor: pointer; font-size: 1rem; font-weight: 650; }
.medya-devami[open] > summary { margin-bottom: 1.5rem; }
.katalog-bolum { background: #fff; }
.katalog-izgara { max-width: 88rem; margin-inline: auto; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 23rem), 1fr)); gap: 1rem; }
.katalog-kart { display: grid; grid-template-columns: 100px 1fr; align-items: center; gap: 1.2rem; padding: 1.3rem; border: 1px solid #d4dce6; border-radius: 16px; background: #f6f8fb; }
.katalog-kart img { width: 100%; height: auto; aspect-ratio: 210/297; object-fit: contain; }
.katalog-kart h3 { font-size: 1.05rem; line-height: 1.45; text-transform: none; }
.katalog-kart p { margin-top: .5rem; color: #536782; font-size: .875rem; }
.katalog-kart__baglar { display: flex; flex-wrap: wrap; gap: .25rem 1rem; margin-top: .65rem; }
.katalog-kart__baglar a { padding-block: .6rem; font-size: .9rem; font-weight: 700; text-underline-offset: .25em; }
.medya-dialog { width: min(1100px, 96vw); max-height: 96dvh; margin: auto; border: 1px solid #334b69; border-radius: 14px; background: #08172b; color: #fff; padding: 1rem; }
.medya-dialog::backdrop { background: #030912ed; }
.medya-dialog [hidden] { display: none !important; }
.medya-dialog__ust, .medya-dialog__alt { display: flex; align-items: center; gap: .7rem; }
.medya-dialog__ust { justify-content: space-between; margin-bottom: .8rem; }
.medya-dialog__ust p { font-size: 1rem; line-height: 1.45; }
.medya-dialog button { min-width: 44px; min-height: 44px; border: 1px solid #7387a1; border-radius: 7px; padding: .5rem .8rem; background: #152e4d; color: #fff; font: inherit; cursor: pointer; }
.medya-dialog button:disabled { opacity: .4; cursor: default; }
#medyaKapat { font-size: 1.5rem; flex-shrink: 0; }
.medya-dialog__sahne img, .medya-dialog__sahne video { display: block; width: 100%; height: min(70dvh, 760px); object-fit: contain; background: #040b14; }
.medya-dialog__alt { flex-wrap: wrap; margin-top: .8rem; font-size: .9rem; }
#medyaDosya { margin-inline-start: auto; padding: .5rem; }
#medyaHata { padding-top: .8rem; }
.medya-kart:focus-visible, .medya-devami summary:focus-visible, .medya-dialog :focus-visible, .katalog-kart a:focus-visible, [data-medya]:focus-visible { outline: 3px solid #679eee; outline-offset: 4px; }
[data-medya="image"] { cursor: zoom-in; }
.sistem-hero__gorsel[data-medya] { display: block; }
@media (max-width: 900px) {
  .medya-bolum__bas { grid-template-columns: 1fr; gap: 1rem; }
  .medya-izgara { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; }
  .medya-kart__bilgi { padding: .85rem; }
}
@media (max-width: 540px) {
  .medya-izgara { grid-template-columns: 1fr; }
  .medya-dialog { padding: .65rem; }
  .medya-dialog__sahne img, .medya-dialog__sahne video { height: 62dvh; }
  .katalog-kart { grid-template-columns: 78px 1fr; padding: 1rem; gap: 1rem; }
}
@media (prefers-reduced-motion: reduce) { .medya-kart img { transition: none; } }