.contact-section {text-align: center;background: linear-gradient(135deg, #7d9ee0 0%, #333333 100%);
      width: 100%;position: relative;overflow: hidden;}
.contact-section::before {
  content: "";
  top: 0;
  left: 0;
  position: absolute;
  width: 100%;
  height: 100%;
  background: radial-gradient(
      circle at 20% 30%,
      rgba(255, 255, 255, 0.1) 0%,
      transparent 50%
    ),
    repeating-conic-gradient(
      from 0deg at 50% 50%,
      rgba(255, 255, 255, 0.05) 0deg,
      rgba(255, 255, 255, 0.05) 10deg,
      transparent 10deg,
      transparent 30deg
    );
  box-shadow:
    50px 50px 2px rgba(255, 255, 255, 0.7),
    250px 300px 1px rgba(255, 255, 255, 0.8),
    450px 150px 3px rgba(255, 255, 255, 0.6),
    650px 400px 2px rgba(255, 255, 255, 0.9),
    850px 600px 1px rgba(255, 255, 255, 0.7),
    150px 450px 3px rgba(255, 255, 255, 0.8);
}

.contact-section::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background: radial-gradient(
      circle at 80% 70%,
      rgba(255, 255, 255, 0.08) 0%,
      transparent 40%
    ),
    repeating-linear-gradient(
      0deg,
      transparent,
      transparent 50px,
      rgba(255, 255, 255, 0.03) 50px,
      rgba(255, 255, 255, 0.03) 52px,
      transparent 52px,
      transparent 60px
    ),
    repeating-linear-gradient(
      90deg,
      transparent,
      transparent 50px,
      rgba(255, 255, 255, 0.03) 50px,
      rgba(255, 255, 255, 0.03) 52px,
      transparent 52px,
      transparent 60px
    );
  box-shadow:
    75px 125px 1px rgba(255, 255, 255, 0.6),
    275px 225px 2px rgba(255, 255, 255, 0.8),
    475px 325px 3px rgba(255, 255, 255, 0.7),
    675px 175px 1px rgba(255, 255, 255, 0.9),
    875px 275px 2px rgba(255, 255, 255, 0.6),
    125px 375px 3px rgba(255, 255, 255, 0.8);
}
.contact-section h2 {font-size: 28px;font-weight: bold;margin-bottom: 10px;}
.location-line {font-size: 14px;margin-bottom: 30px;color: #666;}
.contact_container { display: flex;justify-content: center;align-items: center;flex-wrap: wrap;padding: 2rem;min-height: 70vh;}
.contact-graphic { min-width: 300px;text-align: center;}
.contact-graphic img {width: 100%; max-width: 350px;}

    .contact-form {
      background: #fff;
      padding: 1.5rem;
      border-radius: 8px;
      max-width: 500px;
      width: 100%;
      box-shadow: 0 0 10px rgba(0,0,0,0.1);
      text-align: left;
      position: relative;
       z-index: 100;
    }

    .form-group {
      margin-bottom: 15px;
      position: relative;
    }
    label {
        position: absolute;
        top: -0.8rem;
        left: 0.6rem;
        padding: 0.2rem;
        background-color: #fff;
    }
    input:checked {
        outline: #4a00e0;
    }

    input, textarea {
      width: 100%;
      padding: 1rem;
      border: 1px solid #ccc;
      border-radius: 5px;
      outline: none;
    }
    input:focus,textarea:focus {border-color: #360598;      }
    button {
      background: linear-gradient(to right, #8e2de2, #4a00e0);
      color: #fff;
      border: none;
      padding: 12px 20px;
      border-radius: 25px;
      font-size: 16px;
      cursor: pointer;
      width: 100%;
    }

    button:hover {opacity: 0.9;}
    @media (max-width: 768px) {
      .contact-container {
        flex-direction: column;
        align-items: center;
      }
      .contact-graphic{
        display: none;
      }
    }
     @media screen and (orientation: portrait) {
      .contact-container {
        flex-direction: column;
        align-items: start;
      }
  
    .contact-graphic {
        min-width: 1000px;
    }
     .contact-form {
      padding: 2rem;
      max-width: 800px;
    }
    .contact-section h2 {
        margin-bottom: 2rem;
    }
    .form-group {
        margin-bottom: 3.5rem;
    }
     }
.dropdown {
  position: relative;
  width: 100%;
  user-select: none;
}

.selected {
  display: flex;
  align-items: center;
  padding: 10px;
  border: 1px solid #ccc;
  cursor: pointer;
  border-radius: 5px;
}.selected img {
  width: 20px;
  margin-right: 10px;
}

.dropdown-content {
  display: none;
  position: absolute;
  top: 100%;
  width: 100%;
  max-height: 300px;
  overflow-y: auto;
  background: white;
  border: 1px solid #ccc;
  border-radius: 5px;
  z-index: 10;
}
#search-box {
  width: 100%;
  padding: 8px;
  box-sizing: border-box;
  border: none;
  border-bottom: 1px solid #ccc;
}
ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.flags {
  padding: 0.6rem;
  display: flex;
  align-items: center;
  cursor: pointer;
  gap: 0.4rem;
}
.flags:hover {
  background-color: #f0f0f0;
}
.flags img {
  width: 20px;
  margin-right: 10px;
}
@media (min-width:1950px) {
     .contact_container {
       min-height: 79vh;
    }
    .contact-graphic {
        min-width: 1100px;
    }
     .contact-form {
      padding: 2rem;
      max-width: 800px;
    }
    .contact-section h2 {
        margin-bottom: 2rem;
    }
    .form-group {
        margin-bottom: 4.5rem;
    }
}