/* ============================================================================
   İNLANGU — DERS NOTLARI / DOSYALAR SAYFASI
   ----------------------------------------------------------------------------
   Hocanın özgün almanca-ders-notlari-pdf.aspx sayfasının kendi <style> bloğundan birebir alındı;
   sayfa içine gömülü olmaktan çıkarılıp tek dosyaya taşındı.
   ========================================================================== */


    /* ==== HERO STİLLERİ ==== */
    .hero {
      background: url('assets/img/downloads/downloads-000.jpg') center 40% / cover no-repeat;
      min-height: 360px;
      position: relative;
      color: white;
      overflow: hidden;
    }
    .hero::after {
      content: '';
      position: absolute;
      top:0; left:0;
      width:100%; height:100%;
      background: rgba(0,0,0,0.55);
      z-index:1;
    }
    .hero-content {
      position: absolute;
      bottom: 40px;
      left: 50%;
      transform: translateX(-50%);
      text-align: center;
      z-index:2;
      padding: 0 20px;
    }
    .hero-box {
      display: inline-block;
      max-width: 90vw;
      min-width: 300px;
      background: rgba(0,0,0,0.4);
      padding: 4px 12px;
      border-radius: 12px;
      backdrop-filter: blur(3px);
      box-shadow: 0 4px 12px rgba(0,0,0,0.3);
    }
    .hero-box h1 {
      font-size: 32px;
      color: #ff4e2e;
      margin: 0;
      text-shadow: 0 3px 8px rgba(0,0,0,0.4);
    }
    .hero-box p {
      font-size: 16px;
      margin-top: 8px;
      text-shadow: 0 2px 6px rgba(0,0,0,0.4);
    }
    @media (max-width:600px) {
      .hero-box h1 { font-size:24px; }
      .hero-box p  { font-size:14px; }
      .hero-content { bottom:20px; }
    }

    /* ==== GENEL SAYFA STİLLERİ ==== */
    .downloads-page {
      font-family: 'Segoe UI', sans-serif;
      background-color: #f9f9f9;
      color: #333;
    }

    .downloads-page .container {
      max-width: 1100px;
      margin: 40px auto;
      padding: 0 20px;
    }

    .downloads-page h1.section-title {
      text-align: center;
      color: #007acc;
      margin-bottom: 40px;
      font-size: 32px;
    }

    .downloads-page .file-grid {
      display: grid;
      grid-template-columns: repeat(1,1fr);
      gap: 24px;
    }
    @media (min-width:600px){
      .downloads-page .file-grid { grid-template-columns: repeat(2,1fr); }
    }
    @media (min-width:900px){
      .downloads-page .file-grid { grid-template-columns: repeat(3,1fr); }
    }

    /* ==== DOSYA KUTULARI ==== */
    .downloads-page .file-box {
      background:#fff;
      border-radius:16px;
      box-shadow:0 8px 24px rgba(0,0,0,0.08);
      padding:24px;
      text-align:center;
      transition: transform .3s, box-shadow .3s;
      display:flex;
      flex-direction:column;
      justify-content:space-between;
    }
    .downloads-page .file-box:hover {
      transform: translateY(-6px);
      box-shadow:0 12px 30px rgba(0,0,0,0.1);
    }
    .downloads-page .file-box i {
      font-size:40px;
      color:#000000;
      margin-bottom:16px;
    }
    .downloads-page .file-box h3 {
      font-size:18px;
      margin-bottom:10px;
      color:#003366;
    }
    .downloads-page .file-box p {
      font-size:14px;
      color:#000000;
      margin-bottom:20px;
    }
    .downloads-page .btn-download {
      background:#ffffff;
      color:#000000;
      padding:10px 18px;
      border-radius:8px;
      text-decoration:none;
      font-weight:600;
      transition: background .3s;
    }
    .downloads-page .btn-download:hover {
      background:#0077cc;
    }

    /* ==== SEVİYEYE GÖRE RENK ==== */
    .downloads-page .file-box.a1 {
      background-color: #47d1f4;
      border-left: 6px solid #1ca9c9;
      border-right: 6px solid #1ca9c9;
    }
    .downloads-page .file-box.a2 {
      background-color: #fe78d6;
      border-left: 6px solid #dc3592;
      border-right: 6px solid #dc3592;
    }
    .downloads-page .file-box.exam {
      background-color: #ffe39c;
      border-left: 6px solid #f5b300;
      border-right: 6px solid #f5b300;
    }
  