/* CONTACT CARD CONTAINER */
.contact-card {
  background: #ffffff; /* clean white background */
  border-radius: 16px;
  padding: 30px 25px;
  margin: 20px 0;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  border-left: 6px solid #0275d8; /* vertical accent border */
  position: relative;
  overflow: hidden;
}

/* subtle hover effect */
.contact-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.15);
}

/* CARD HEADING */
.contact-card h3 {
  font-family: 'Poppins', Arial, sans-serif;
  font-weight: 700;
  font-size: 1.6rem;
  color: #0275d8;
  margin-bottom: 20px;
  position: relative;
}

/* optional heading underline */
.contact-card h3::after {
  content: '';
  display: block;
  width: 60px;
  height: 3px;
  background-color: #000000;
  border-radius: 2px;
  margin-top: 5px;
  transition: width 0.3s ease;
}

.contact-card h3:hover::after {
  width: 100px;
}

/* TEXT INSIDE CARD */
.contact-card p {
  font-family: 'Poppins', Arial, sans-serif;
  font-size: 1rem;
  color: #555555;
  line-height: 1.6;
  margin-bottom: 10px;
}

/* FORM DESIGN */
.contact-card form {
  display: flex;
  flex-direction: column;
}

.contact-card label {
  font-weight: 600;
  margin-bottom: 5px;
  color: #0275d8;
}

.contact-card input, 
.contact-card textarea {
  padding: 10px 12px;
  margin-bottom: 15px;
  border: 2px solid #ddd;
  border-radius: 8px;
  font-size: 1rem;
  transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.contact-card input:focus, 
.contact-card textarea:focus {
  outline: none;
  border-color: #0275d8;
  box-shadow: 0 0 10px rgba(2, 117, 216, 0.2);
}

/* SUBMIT BUTTON */
.contact-card button {
  background: linear-gradient(135deg, #0275d8, #3c0fd3);
  border: none;
  border-radius: 8px;
  color: #fff;
  padding: 12px 20px;
  font-size: 1rem;
  font-weight: 600;
  cursor: pointer;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.contact-card button:hover {
  transform: scale(1.05);
  box-shadow: 0 8px 20px rgba(0, 123, 255, 0.3);
}

/* RESPONSIVE */
@media (max-width: 768px) {
  .contact-card {
    padding: 20px 15px;
  }
}
/* LOCATION SECTION CONTAINER */
.location-section {
  background: #f0f8ff; /* light blueish professional background */
  padding: 20px 25px;
  border-radius: 16px;
  box-shadow: 0 8px 20px rgba(0,0,0,0.1);
  max-width: 500px;
  margin: 20px auto;
  text-align: center;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* Hover effect for the container */
.location-section:hover {
  transform: translateY(-5px);
  box-shadow: 0 15px 30px rgba(0,0,0,0.15);
}

/* HEADING */
.location-section h3 {
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
  font-size: 1.4rem;
  color: #0275d8;
  margin-bottom: 15px;
  position: relative;
}

/* Optional underline for heading */
.location-section h3::after {
  content: '';
  display: block;
  width: 60px;
  height: 3px;
  background: #9497ef;
  border-radius: 2px;
  margin: 8px auto 0;
  transition: width 0.3s ease;
}

.location-section h3:hover::after {
  width: 100px;
}

/* LINK STYLING */
.location-section a {
  font-family: 'Poppins', sans-serif;
  text-decoration: none;
  color: #ffffff;
  background: linear-gradient(135deg, #0275d8, #8aa7e5);
  padding: 10px 20px;
  border-radius: 12px;
  font-weight: 600;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  display: inline-block;
  margin-top: 10px;
}

/* LINK HOVER EFFECT */
.location-section a:hover {
  transform: scale(1.05);
  box-shadow: 0 8px 20px rgba(0, 123, 255, 0.4);
  filter: brightness(1.1);
}
/* SIMPLE PROFESSIONAL BORDER FOR H3 */
h3.google {
  font-family: 'Poppins', sans-serif; /* clean modern font */
  font-size: 1.8rem;
  font-weight: 700;
  color: #0275d8; /* professional blue */
  text-align: center; /* center text */
  padding: 12px 25px; /* spacing inside border */
  margin: 25px auto; /* space above/below */
  display: inline-block; /* shrink to fit content */
  border: 2px solid #0275d8; /* simple solid border */
  border-radius: 8px; /* slightly rounded corners */
  box-shadow: 0 4px 10px rgba(0,0,0,0.1); /* subtle shadow for depth */
}
/* CONTACT SECTION HEADING */
h2.contact-text {
  font-family: 'Poppins', sans-serif; /* modern, clean font */
  font-size: 2rem;
  font-weight: 700;
  color: #0275d8; /* professional blue */
  text-align: center; /* center the text */
  display: inline-block; /* shrink to fit content */
  padding: 10px 25px; /* spacing inside border */
  margin: 30px auto; /* vertical spacing */
  border: 2px solid #0275d8; /* simple professional border */
  border-radius: 8px; /* slightly rounded corners */
  box-shadow: 0 4px 12px rgba(0,0,0,0.1); /* subtle depth */
  background-color: #f9f9f9; /* light neutral background */
  transition: transform 0.3s ease, box-shadow 0.3s ease; /* smooth hover */
}

/* Hover effect */
h2.contact-text:hover {
  transform: translateY(-3px); /* slight lift */
  box-shadow: 0 8px 20px rgba(0,0,0,0.15); /* stronger shadow */
}
/* MAIN CONTAINER WITH PROFESSIONAL BORDER */
.main {
  max-width: 1000px;          /* limit width for readability */
  margin: 30px auto;          /* center horizontally with spacing */
  padding: 25px 30px;         /* inner spacing */
  border: 2px solid #0275d8;  /* professional solid border */
  border-radius: 12px;        /* slightly rounded corners */
  background-color: #ffffff;  /* clean white background */
  box-shadow: 0 6px 20px rgba(0,0,0,0.08); /* subtle depth shadow */
  transition: transform 0.3s ease, box-shadow 0.3s ease; /* smooth hover */
}

/* Hover effect (optional, subtle) */
.main:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 30px rgba(0,0,0,0.12);
}
/* CONTACT CARD STYLING */
.contact-card {
  background-color: #ffffff;
  border: 2px solid #0275d8;
  border-radius: 10px;
  padding: 20px;
  margin: 20px 0;
  box-shadow: 0 6px 15px rgba(0,0,0,0.08);
  
  /* INITIAL STATE */
  opacity: 0;
  transform: translateY(30px);

  /* ANIMATION */
  animation: slideUpFade 0.8s ease-out forwards;
  animation-delay: 0.3s; /* optional delay for staggered effect */
}

/* OPTIONAL: stagger multiple cards */
.contact-card:nth-child(2) { animation-delay: 0.5s; }
.contact-card:nth-child(3) { animation-delay: 0.7s; }
.contact-card:nth-child(4) { animation-delay: 0.9s; }

/* KEYFRAMES */
@keyframes slideUpFade {
  0% {
    opacity: 0;
    transform: translateY(30px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}