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

.hero.section{
  text-align: center;
  margin-inline: auto;
  max-width: min(1100px, 100%);
}

/* Main two-column grid */
.case-grid{
  width: min(1180px, 100%);
  margin-inline: auto;
  margin-top: 18px;
  display: grid;
  grid-template-columns: 1fr 1.25fr;
  gap: 14px;
  align-items: stretch; /* equal-height cards */
}

/* Cards */
.case-grid .card{
  border-radius: 26px;
  padding: clamp(14px, 2vw, 20px);
  display: flex;
  flex-direction: column;
  gap: 14px;
}

/* Remove underline */
.case-grid a{
  text-decoration: none;
}

/* Address row with icon */
.contact-row{
  display: grid;
  grid-template-columns: 34px 1fr;
  gap: 10px;
  align-items: start;
}

.contact-ico{
  width: 34px;
  height: 34px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.03);
  display: grid;
  place-items: center;
  color: var(--gold);
}

.contact-address{
  line-height: 1.7;
  margin: 0;
}

/* Pills side-by-side */
.contact-links{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-top: 4px;
}

.contact-pill{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 12px 12px;
  color: var(--text);
  font-weight: 850;
  letter-spacing: -0.01em;
  transition: transform .18s ease, border-color .18s ease, background .18s ease;
  font-size: 1.05rem;
}

.contact-pill i{
  color: var(--gold);
  width: 18px;
  display: inline-grid;
  place-items: center;
}

.contact-pill:hover{
  transform: translateY(-1px);
  border-color: rgba(212,175,55,.35);
  background: rgba(0,0,0,.18);
  border-radius: 22px;
}

/* Form */
.form-grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-top: 10px;
}

.field{
  display: grid;
  gap: 8px;
}

.field label{
  font-weight: 900;
  color: rgba(255,255,255,.86);
  letter-spacing: -0.01em;
}

:root[data-theme="light"] .field label{
  color: rgba(0,0,0,.75);
}

.input{
  width: 100%;
  border-radius: 16px;
  border: 1px solid var(--stroke);
  background: rgba(0,0,0,.25);
  color: var(--text);
  padding: 12px 12px;
  outline: none;
  transition: border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}

:root[data-theme="light"] .input{
  background: rgba(255,255,255,.55);
}

.input:focus{
  border-color: rgba(212,175,55,.45);
  box-shadow: 0 0 0 4px rgba(212,175,55,.12);
}

textarea.input{
  resize: vertical;
  min-height: 160px;
}


/* make it full-width inside the grid */
.contact-actions{
  justify-self: center;   /* centers the block within the grid cell */
  display: flex;
  justify-content: center; /* centers the button inside */
  width: 100%;
}
.contact-actions .btn{
  width: auto;
}

/* Success / error */
.success, .error{
  border-radius: 18px;
  padding: 12px 12px;
  border: 1px solid var(--stroke);
  background: rgba(255,255,255,.03);
}

.success{ border-color: rgba(212,175,55,.25); }
.error{ border-color: rgba(255,80,80,.35); }

.success-title, .error-title{
  font-weight: 950;
  letter-spacing: -0.02em;
  margin-bottom: 6px;
}

/* Map section at bottom aligned to same width */
.contact-map.section{
  width: min(1180px, 100%);
  margin-inline: auto;
  margin-top: 14px;
}

.map-card{
  border-radius: 22px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.02);
}

.map-iframe{
  display: block;
  width: 100%;
  height: 340px;
  border: 0;
}

.map-actions{
  padding: 10px;
  display: flex;
  justify-content: center;
}

/* Mobile */
@media (max-width: 980px){
  .case-grid{
    grid-template-columns: 1fr;
  }
  .form-grid{
    grid-template-columns: 1fr;
  }
  .map-iframe{
    height: 260px;
  }
}