/* ============================================================
   CONTACT PAGE STYLES
   ============================================================ */

/* ---- Contact Grid ---- */
.contact-grid {
  display: grid;
  grid-template-columns: 1fr 380px;
  gap: 4rem;
  align-items: start;
}
@media (max-width: 1000px) { .contact-grid { grid-template-columns: 1fr; gap: 3rem; } }

/* ---- Enquiry Tabs ---- */
.enquiry-tabs {
  display: flex;
  gap: .5rem;
  flex-wrap: wrap;
  margin-bottom: 2rem;
}
.eq-tab {
  padding: .6rem 1.2rem;
  border-radius: 100px;
  border: 1.5px solid var(--clr-border);
  font-size: .82rem; font-weight: 600;
  color: var(--clr-text);
  background: var(--clr-card);
  cursor: pointer;
  transition: var(--transition);
}
.eq-tab.active, .eq-tab:hover {
  background: rgba(201,149,58,.12);
  border-color: var(--clr-gold);
  color: var(--clr-gold);
}

/* ---- Submit Button ---- */
.submit-btn { font-size: 1rem; padding: 1rem 2rem; margin-top: .5rem; }

/* ---- Success State ---- */
.form-success {
  text-align: center;
  padding: 4rem 2rem;
}
.form-success.hidden { display: none; }
.success-icon { font-size: 4rem; margin-bottom: 1rem; }
.form-success h3 { font-size: 1.8rem; margin-bottom: .75rem; color: var(--clr-cream); }
.form-success p { color: var(--clr-muted); margin-bottom: 2rem; }

/* ---- Contact Info Panel ---- */
.contact-info-panel { display: flex; flex-direction: column; gap: 2rem; }
.ci-cards { display: flex; flex-direction: column; gap: 1rem; }
.ci-card {
  display: flex;
  gap: 1rem;
  background: var(--clr-card);
  border: 1px solid var(--clr-border);
  border-radius: var(--radius-lg);
  padding: 1.3rem;
  transition: var(--transition);
}
.ci-card:hover { border-color: rgba(201,149,58,.3); transform: translateX(4px); }
.ci-icon { font-size: 1.5rem; flex-shrink: 0; }
.ci-card strong { display: block; font-size: .85rem; color: var(--clr-cream); margin-bottom: .3rem; }
.ci-card p { font-size: .83rem; color: var(--clr-muted); line-height: 1.6; }
.ci-card p a { color: var(--clr-text); }
.ci-card p a:hover { color: var(--clr-gold); }
.ci-social-links { display: flex; flex-wrap: wrap; gap: .6rem; }
.ci-soc-btn {
  padding: .5rem 1rem;
  border-radius: 100px;
  border: 1.5px solid var(--clr-border);
  font-size: .78rem; font-weight: 600;
  color: var(--clr-text);
  background: var(--clr-card);
  transition: var(--transition);
}
.ci-soc-btn:hover { border-color: var(--clr-gold); color: var(--clr-gold); background: rgba(201,149,58,.08); }

/* ---- Map ---- */
.map-wrapper { margin-top: 2.5rem; }
.map-embed {
  position: relative;
  height: 400px;
  background: var(--clr-card);
  border: 1px solid var(--clr-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  margin-bottom: 1.5rem;
}
.map-bg {
  position: absolute; inset: 0;
  background:
    linear-gradient(rgba(201,149,58,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(201,149,58,.04) 1px, transparent 1px);
  background-size: 40px 40px;
}
.map-grid {
  position: absolute; inset: 0;
  background:
    linear-gradient(rgba(201,149,58,.015) 1px, transparent 1px),
    linear-gradient(90deg, rgba(201,149,58,.015) 1px, transparent 1px);
  background-size: 8px 8px;
}
/* Simulated roads */
.map-embed::before {
  content: '';
  position: absolute;
  left: 0; right: 0; top: 50%;
  height: 12px;
  background: rgba(30,27,22,.9);
  border-top: 1px solid rgba(201,149,58,.15);
  border-bottom: 1px solid rgba(201,149,58,.15);
  z-index: 1;
}
.map-embed::after {
  content: '';
  position: absolute;
  top: 0; bottom: 0; left: 40%;
  width: 10px;
  background: rgba(30,27,22,.9);
  border-left: 1px solid rgba(201,149,58,.15);
  border-right: 1px solid rgba(201,149,58,.15);
  z-index: 1;
}
/* Map Pin */
.map-pin {
  position: absolute;
  top: 50%; left: 40%;
  transform: translate(-50%, -100%);
  z-index: 3;
}
.pin-dot {
  width: 18px; height: 18px;
  border-radius: 50% 50% 50% 0;
  background: var(--clr-gold);
  transform: rotate(-45deg);
  box-shadow: 0 0 20px rgba(201,149,58,.6);
  animation: pinBounce 2s ease-in-out infinite;
}
@keyframes pinBounce {
  0%,100%{ transform: rotate(-45deg) translateY(0); }
  50%{ transform: rotate(-45deg) translateY(-8px); }
}
.pin-pulse {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%,-50%);
  width: 40px; height: 40px;
  border-radius: 50%;
  background: rgba(201,149,58,.2);
  animation: pinPulse 2s ease infinite;
}
@keyframes pinPulse {
  0%{ transform: translate(-50%,-50%) scale(.5); opacity:1; }
  100%{ transform: translate(-50%,-50%) scale(2.5); opacity:0; }
}
.pin-label {
  position: absolute;
  top: -62px; left: 50%;
  transform: translateX(-50%);
  background: var(--clr-card);
  border: 1px solid var(--clr-border);
  border-radius: var(--radius);
  padding: .4rem .8rem;
  white-space: nowrap;
  font-size: .75rem;
  box-shadow: var(--shadow-card);
}
.pin-label strong { display: block; color: var(--clr-cream); }
.pin-label span { color: var(--clr-muted); }
.map-cta-overlay {
  position: absolute;
  bottom: 1.5rem; left: 50%;
  transform: translateX(-50%);
  z-index: 3;
}

/* Location Cards */
.location-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
}
.loc-card {
  background: var(--clr-card);
  border: 1px solid var(--clr-border);
  border-radius: var(--radius-lg);
  padding: 1.4rem;
  transition: var(--transition);
}
.loc-card:hover { border-color: rgba(201,149,58,.3); }
.loc-card h4 { font-size: .95rem; margin-bottom: .5rem; }
.loc-card p { font-size: .83rem; color: var(--clr-muted); }
@media (max-width: 640px) { .location-cards { grid-template-columns: 1fr; } }