* {
    box-sizing: border-box; /* 保證所有元素的寬度包含padding和border */
  }
  

  
  .contact-form {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    align-items: center; /* 將表單元素置中 */
    width: 100%;
  }
  
  .form-group {
    position: relative; /* 為懸浮效果做準備 */
    width: 100%; /* 控制表單組件的寬度 */
  }
  
  .form-group input,
  .form-group textarea {
    width: 100%;
    padding: 0.875rem 1rem;
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    font-size: 1rem;
    transition: all 0.3s ease;
    background: #f8f9fa;
  }
  
  .form-group input:focus,
  .form-group textarea:focus {
    outline: none;
    border-color: #4a90e2; /* 主題色 */
    background: white;
    box-shadow: 0 0 0 3px rgba(74, 144, 226, 0.1); /* 聚焦時的光暈效果 */
  }
  
  .form-group textarea {
    height: 150px;
    resize: vertical;
    min-height: 100px;
    max-height: 300px;
  }
  
  /* 懸浮效果 */
  .form-group input:hover,
  .form-group textarea:hover {
    border-color: #4a90e2;
  }
  
  /* 按鈕樣式 */
  .btn {
    padding: 0.75rem 1.5rem;
    border: none;
    border-radius: 6px;
    font-size: 1rem;
    cursor: pointer;
    transition: all 0.3s ease;
  }
  
  .btn.primary {
    background-color: #4a90e2;
    color: white;
  }
  
  .btn.primary:hover {
    background-color: #3a7bc8;
    transform: translateY(-2px);
  }
  
  .btn.primary:active {
    transform: translateY(0);
  }