* { box-sizing: border-box; margin: 0; padding: 0; font-family: Arial, Helvetica, sans-serif; }

    h1, h2 { font-weight: 700; }

    /* Layout */
    .container-content {
      display: flex;
      min-height: 100vh;
      padding: 3rem;
      gap: 3rem;
      margin-top: 4vw;
    }

    /* Right section (info) */
    .info {
      flex: 1;
    }

    .info h1 {
      font-size: 3rem;
      margin-bottom: 1.5rem;
    }

    .info p {
      font-size: 0.8rem;
      line-height: 1.2;
      max-width: 600px;
    }

    .video-wrapper {
      margin-top: 2rem;
    }

    .video-wrapper iframe {
      width: 100%;
      height: 315px;
      border-radius: 12px;
      border: none;
    }

    /* Left section (resources) */
    .resources {
      flex: 1;
    }

    .resources h2 {
      font-size: 1.8rem;
      margin-bottom: 1.5rem;
    }

    .grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 1.5rem;
    }

    .card {
      background: #ffffff;
      border-radius: 16px;
      overflow: hidden;
      cursor: pointer;
      box-shadow: 0 10px 25px rgba(0,0,0,0.08);
      transition: transform 0.25s ease;
      height: 24vw;
    }

    .card:hover {
      transform: translateY(-4px);
    }

    .card img {
        width: 100%;
        transform:translateY(-8%);
        justify-content: center;
        align-items: center;  
    }

    .card span {
      display: block;
      font-weight: 600;
      background: #ffffff;
    }

    /* Responsive */
    @media (max-width: 750px) {
      .container-content {
        flex-direction: column;
        padding: 2rem 1.5rem;
      }

      /* Info goes first on mobile */
      .info {
        order: 1;
      }

      /* Grid goes below on mobile */
      .resources {
        order: 2;
      }

      .info h1 {
        font-size: 2.4rem;
      }

      .sidebar {
        width: 100%;
      }
      .card {
        height: 52vw;
      }
      .card img {
        width: 100%;
      }
    }

      .info h1 {
        font-size: 2.4rem;
      }

      .sidebar {
        width: 80%;
        right: -500px
      }