/* PAGE HERO */
    .projects-hero {
      background: var(--primary);
      color: white;
      text-align: center;
      padding: var(--space-4) 0;
    }

    .projects-hero h1 {
      font-size: clamp(2rem, 4vw, 3rem);
      margin: 0;
    }

    /* SECTION SPACING */
    .projects-section {
      padding: var(--space-4) 0;
    }

    /* UPCOMING PROJECT CARD */
    .upcoming-card {
      background: #f8fafc;
      padding: var(--space-3);
      border-radius: var(--radius);
      border-left: 6px solid var(--accent);
      max-width: 800px;
      margin: auto;
      box-shadow: 0 10px 30px rgba(0,0,0,0.05);
    }

    .upcoming-card h3 {
      color: var(--primary);
      margin-bottom: var(--space-2);
    }

    /* YOUTUBE GRID */
    .youtube-grid {
      display: grid;
      gap: var(--space-3);
      grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    }

    .youtube-grid iframe {
      width: 100%;
      height: 250px;
      border-radius: var(--radius);
    }

    /* UPCOMING PROJECT CARD */
    .upcoming-project {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    }

    .upcoming-project img {
    height: 350px;
    object-fit: cover;
    border-radius: var(--radius);
    }

    .upcoming-project:hover {
    transform: translateY(-10px);
    box-shadow: 0 20px 40px rgba(0,0,0,0.1);
    }

    /* ========================= */
    /* PROJECTS HERO MOBILE FIX */
    /* ========================= */

    @media (max-width: 768px) {

      .projects-hero {
        padding: 50px 20px;
      }

      .projects-hero h1 {
        font-size: 1.8rem;
      }
    }

    @media (max-width: 768px) {

      .upcoming-project img {
        height: 220px;
      }

      .upcoming-project {
        padding: 20px;
      }

    }