@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');

:root {
      --primary-color: #4a00e0;
      --secondary-color: #8e2de2;
      --bg-gradient: linear-gradient(135deg, #e0c3fc 0%, #8ec5fc 100%);
      --button-gradient: linear-gradient(135deg, #43cea2, #185a9d);
      --button-hover: linear-gradient(135deg, #185a9d, #43cea2);
    }

    * {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
    }

    body {
       font-family: "Montserrat", sans-serif;
      /* background: var(--bg-gradient); */
      background-image: linear-gradient(to top, #dfe9f3 0%, white 100%);
      color: #333;
      display: flex;
      justify-content: center;
      align-items: center;
      min-height: 100vh;
      padding: 1rem;
    }

    .card {
      /* background: #fff;
      border-radius: 20px;
      box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15); */
      max-width: 650px;
      width: 100%;
      text-align: center;
      padding: 2rem 1.5rem;
    }

    .bg-img {
      width: 600px;
      height: 200px;
      max-width: 80%;
      margin-bottom: 0.5rem;
    }

    h1 {
      font-size: 1.8rem;
      font-weight: 600;
      color: #3f3f3f;
      margin-top: 1rem;
      margin-bottom: 1rem;
      text-transform: capitalize;
    }

    p {
      font-size: 1rem;
      color: #555;
      margin-bottom: 0.8rem;
      line-height: 1.5;
    }

    .contacts {
      margin-top: 2rem;
      display: flex;
      justify-content: center;
      flex-wrap: wrap;
      gap: 1rem;
    }

    .phone {
      display: inline-flex;
      align-items: center;
      gap: 0.5rem;
      background: #fff;
      border: 2px solid #cac8c8;
      border-radius: 30px;
      padding: 0.6rem 1.2rem;
      text-decoration: none;
      color: #3f3f3f;
      font-weight: 600;
      transition: all 0.3s ease;
      /* box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); */
    }

    .phone:hover {
      background: #004aa6;
      color: #fff;
      border-color: transparent;
    }

    .active{
         background: #004aa6;
      color: #fff;
      border-color: transparent;
    }

    .phone svg {
      width: 18px;
      height: 18px;
      fill: currentColor;
    }

    @media (max-width: 600px) {
      h1 {
        font-size: 1.5rem;
      }
      p {
        font-size: 0.95rem;
      }
      .bg-img {
        width: 180px;
        height: 130px;
      }
    }