@media (max-width: 1400px) {
  .page-header {
    margin-left:  7px;
  }

  .pdf-section h3 {
    margin: 20px;
  }
}

@media (max-width: 1080px) {
  .compact-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .video-layout {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-areas:
      "player"
      "playlist"
      "pdf";
  }

  .main-player-card {
    grid-area: player;
  }

  .playlist-card {
    grid-area: playlist;
  }

  .pdf-section {
    grid-area: pdf;
  }

   .maincard-pdf {
    display: contents;
  }

  .training-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 720px) {
  .nav-links {
    display: none;
  }

  .nav-toggle {
    display: flex;
  }

  /* ===== MOBILE MENU ===== */
  .mobile-menu {
    position: fixed;
    height: max-content;
    max-width: min(540px, 85%);

    inset: 0;

    background: #1a2722;

    display: flex;
    justify-content: center;
    align-items: center;

    transform: translateX(-100%);
    transition: transform 0.3s ease;
  }

  .mobile-menu.open {
    transform: translateX(0);
  }

  .mobile-menu-content {
    width: 100%;
    height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 18px 24px 40px;
  }

  .mobile-menu-content-top {
    display: flex;
    flex-direction: column;
    align-items: left;
    gap: 40px;
  }
  /* ======================= */

  .whole-page {
    padding: calc(28px + var(--navbar-height)) 14px 40px;
  }

  .training-group {
    padding: 16px;
  }

  .compact-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .page-header {
    margin-left:  3px;
  }

  .training-group,
  .main-player-card,
  .playlist-card {
    border-radius: var(--radius-sm);
  }

  .mini-card,
  .video-frame-wrap {
    border-radius: var(--radius-xs);
  }

  .main-player-card {
    padding: 14px;
  }

  .playlist-card {
    padding: 14px;
  }


  .btn-text {
    display: none;
  }

  .btn-icon {
    display: block;
  }

  .download-btn {
    padding: 3px 8px 2.5px;
    font-size: 15px ;
  }

  .video-thumb {
    grid-template-columns: 1fr;
  }

  .pdf-frame-wrap {
    border-radius: var(--radius-sm);
    padding: 10px;
  }

  .pdf-frame-wrap iframe {
    border-radius: var(--radius-xs);
  }

  body::before {
    background:
      radial-gradient(600px circle at 20% -10%, rgba(15, 209, 164, 0.18), transparent 75%),
      radial-gradient(400px circle at 50% 10%, rgba(255, 255, 255, 0.03), transparent 70%);
  }

  body::after {
    background:
      radial-gradient(700px circle at 85% 0%, rgba(74, 118, 103, 0.18), transparent 75%),
      radial-gradient(900px circle at 50% 0%, rgba(255, 255, 255, 0.02), transparent 80%),
      url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' width='100%' height='100%'>\
<filter id='n'>\
<feTurbulence type='fractalNoise' baseFrequency='1.2' numOctaves='2' stitchTiles='stitch'/>\
</filter>\
<rect width='100%' height='100%' filter='url(%23n)' opacity='0.03'/>\
</svg>");
  }
}

@media (max-width: 520px) {
  .compact-grid {
    grid-template-columns: 1fr;
  }
}
