/* =====================================================================
   Air-Gap, Ortam Ayrımı ve Harici Saklama — sayfaya özel ölçüler
   Orijinal 1440 px (sayfalar/kopie-von-s3-objekt-storage.json + ekran): 1. bölüm 1061 px
   (başlık 36/51,5 iki satır y=180, görsel 980×396 y=307, metin 17/22 y=742, üç etiket 227×67
   y=1018 x=321/606/888 + 15 px açıklama y=1096); 2. bölüm 1176 px iki sütun (720 + 720):
   sol #FAFAFA metin x=116 y=1240 g=597, sağ mavi metin x=787 y=1251 g=632.
   Erişilebilir renkler: mavi zemin --c-blue-panel (beyaz ve siyah metin ≥4,5:1), kırmızı etiket
   --c-red; orijinaldeki #2F2E2E metin mavi zeminde siyaha çekildi.
   ===================================================================== */
.ag-top { padding: 36px 0 55px; color: var(--c-text); }
.ag-title { font-size: 36px; line-height: 51.5px; font-weight: 400; color: var(--c-text); }
.ag-title__red { color: var(--c-red); }
.ag-media { margin-top: 24px; background: #070b16; }
.ag-media img { width: 100%; height: auto; aspect-ratio: 980 / 396; }
.ag-intro { margin-top: 39px; font-size: 17px; line-height: 22px; }
.ag-intro > * + * { margin-top: 26px; }

.ag-pills { display: grid; grid-template-columns: repeat(3, 227px); column-gap: 58px; justify-content: center; margin: 62px 0 0; padding: 0; list-style: none; }
.ag-pill__label {
  display: flex; align-items: center; justify-content: center; height: 67px; padding: 0 12px;
  font-size: 15px; font-weight: 400; letter-spacing: .1em; color: #fff; text-align: center;
}
.ag-pill--1 .ag-pill__label { background: var(--c-text); }
.ag-pill--2 .ag-pill__label { background: var(--c-blue-panel); }
.ag-pill--3 .ag-pill__label { background: var(--c-red); }
.ag-pill__text { display: block; margin-top: 13px; font-size: 15px; line-height: 18px; color: var(--c-text); }

.ag-cols { display: grid; grid-template-columns: 1fr 1fr; min-height: 1176px; }
.ag-col { font-size: 17px; line-height: 23.8px; }
.ag-col > * + * { margin-top: 23.8px; }
.ag-col--light { padding: 35px 7px 60px clamp(24px, 16.11%, 116px); background: var(--c-light); color: var(--c-text); }
.ag-col--blue { padding: 46px 21px 60px clamp(24px, 9.3%, 67px); background: var(--c-blue-panel); color: #fff; }
.ag-h2 { font-size: 33px; line-height: 1.4; font-weight: 400; color: var(--c-text); }
.ag-col > .ag-h2 { margin-top: 36px; }
.ag-col > .ag-h2--white { margin-top: 0; font-size: 34px; color: #fff; }
.ag-h3 { font-size: 17px; line-height: 23.8px; font-weight: 400; color: var(--c-blue-sm); }
.ag-col > .ag-h2 + .ag-h3, .ag-col > .ag-h3 + * { margin-top: 0; }
.ag-h3--white { color: #fff; }
.ag-steps { margin: 0; padding: 0; list-style: none; }
.ag-col > .ag-h2 + .ag-steps { margin-top: 4px; }
.ag-steps li + li { margin-top: 23.8px; }
.ag-steps strong { display: block; font-weight: 700; color: #000; }
.ag-dark { color: #000; }
.ag-list { padding: 0 0 0 23px; list-style: disc; }

@media (max-width: 999px) {
  .ag-cols { grid-template-columns: 1fr; min-height: 0; }
  .ag-col--light, .ag-col--blue { padding: 44px 32px 56px; }
  .ag-pills { grid-template-columns: repeat(3, minmax(0, 227px)); column-gap: 24px; }
}
@media (max-width: 750px) {
  .ag-top { padding: 30px 0 48px; }
  .ag-top .container { width: auto; max-width: none; }
  .ag-title, .ag-intro, .ag-pills { padding: 0 24px; }
  .ag-title { font-size: 25px; line-height: 1.4; text-align: center; text-wrap: balance; }
  .ag-media { margin-top: 20px; }
  .ag-intro { margin-top: 28px; font-size: 16px; line-height: 1.5; }
  .ag-intro > * + * { margin-top: 18px; }
  .ag-pills { grid-template-columns: 1fr; row-gap: 24px; margin-top: 36px; justify-items: center; text-align: center; }
  .ag-pill { width: 100%; max-width: 300px; }
  .ag-pill__label { height: 52px; font-size: 17px; }
  .ag-pill__text { margin-top: 10px; font-size: 16px; line-height: 1.4; }
  .ag-col--light, .ag-col--blue { padding: 36px 24px 48px; }
  .ag-col { font-size: 16px; line-height: 1.5; }
  .ag-col > * + *, .ag-steps li + li { margin-top: 20px; }
  .ag-h2 { font-size: 27px; line-height: 1.35; }
  .ag-col > .ag-h2--white { font-size: 27px; }
  .ag-h3 { font-size: 17px; line-height: 1.45; }
}