:root {
        --accent-color: #4a90e2; /* A modern, friendly blue. Change this to any color you like. */
        --text-color: #333;
        --bg-color: #f8f9fa;
        --card-bg: #ffffff;
      }
      body {
        background-color: var(--bg-color);
        color: var(--text-color);
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
          "Helvetica Neue", Arial, sans-serif;
      }
      .navbar {
        background-color: transparent !important;
        padding-top: 1rem;
        padding-bottom: 1rem;
      }
      .navbar-brand img {
        margin-right: 0.5rem;
      }
      .hero {
        padding: 6rem 0;
        text-align: center;
      }
      .hero h1 {
        font-size: 3.5rem;
        font-weight: 700;
      }
      .hero .lead {
        font-size: 1.25rem;
        color: #6c757d;
        max-width: 600px;
        margin: 1.5rem auto;
      }
      .btn-primary {
        background-color: var(--accent-color);
        border-color: var(--accent-color);
        font-weight: 600;
        padding: 0.75rem 1.5rem;
      }
      .btn-primary:hover {
        opacity: 0.9;
        background-color: var(--accent-color);
        border-color: var(--accent-color);
      }
      .btn-outline-secondary {
        font-weight: 600;
        padding: 0.75rem 1.5rem;
        color: var(--accent-color);
        border-color: var(--accent-color);
      }
      .btn-outline-secondary:hover {
        background-color: var(--accent-color);
        color: white;
      }
      .projects-section {
        padding: 4rem 0;
      }
      .project-card {
        background-color: var(--card-bg);
        border: 1px solid #e9ecef;
        border-radius: 0.75rem;
        padding: 2rem;
        text-align: center;
        transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
      }
      .project-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 8px 30px rgba(0, 0, 0, 0.08);
      }
      .project-card img {
        max-height: 50px;
        margin-bottom: 1.5rem;
      }
      .project-card h3 {
        font-weight: 600;
      }
      .project-card p {
        color: #6c757d;
      }
      .project-card .coming-soon {
        color: #adb5bd;
        font-style: italic;
      }