:root {
        --primary-color: #032d55;
        --primarycolor: #0459a5;
        --secondary-color: #ff4d4d;
        --thirdcolor: #ffd967;
      }

    html, body {
  overflow-x: hidden;
  width: 100%;
}

      /* ===== Headline Style (same as Gallery) ===== */
      .contact-section h2 {
        color: var(--primary-color);
        font-size: 2.2rem;
        position: relative;
        font-weight: 700;
        text-align: center;
      }
  .headline {
        color: var(--secondary-color);
      }
      .contact-section h2::after {
        content: "";
        width: 80px;
        height: 4px;
        background-color: var(--thirdcolor);
        display: block;
        margin: 0.5rem auto 0;
        border-radius: 2px;
      }

      .contact-section {
        padding: 80px 0;
      }

      .contact-card {
        border: none;
        border-radius: 10px;
        padding: 40px 30px;
        background-color: #fff;
        height: 100%;
      }

      .contact-left-card {
        background-color: var(--primary-color);
        color: white;
      }

      /* fixed unique class names for icons */
      .contact-info-item {
        display: flex;
        align-items: flex-start;
        margin-bottom: 20px;
      }

      .contact-info-item i {
        color: var(--thirdcolor);
        font-size: 24px;
        margin-right: 15px;
        margin-top: 3px;
      }

      .contact-info-text {
        line-height: 1.6;
        font-size: 0.95rem;
      }

      .form-label {
        font-weight: 500;
        color: var(--primary-color);
      }

      .btn-custom {
        background-color: var(--secondary-color);
        color: white;
        border: none;
        transition: all 0.3s ease;
      }

      .btn-custom:hover {
        background-color: var(--primarycolor);
        transform: translateY(-2px);
      }

      @media (max-width: 767px) {
        .contact-card {
          margin-bottom: 20px;
        }
      }