/* =========================================================
   CONTACT (matches Alliances/Admin system)
   File: /assets/css/contact.css
   ========================================================= */

:root{
  --ct-bg: #ffffff;
  --ct-soft: #f6f7fb;
  --ct-text: #0f172a;
  --ct-muted: #64748b;
  --ct-border: rgba(15, 23, 42, .10);
  --ct-shadow: 0 18px 45px rgba(15, 23, 42, .08);
  --ct-radius: 18px;
  --ct-red: #ef4444;
}

/* Header overlap fix */
.ct.page-hero{
  background: var(--ct-bg);
  padding-top: calc(var(--site-header-offset, 110px) + 34px);
  padding-bottom: 18px;
}
.ct.page-section{
  background: var(--ct-bg);
  padding: 22px 0 70px;
}

/* Breadcrumb */
.breadcrumb{
  font-size: 13px;
  color: var(--ct-muted);
  font-weight: 700;
  display:flex;
  align-items:center;
  gap: 8px;
  margin: 6px 0 18px;
}
.breadcrumb a{ color: var(--ct-muted); text-decoration:none; }
.breadcrumb a:hover{ color: var(--ct-text); }
.crumb-sep{ opacity: .6; }

/* Hero layout */
.ct-heroGrid{
  display:grid;
  grid-template-columns: 1.15fr .85fr;
  gap: 18px;
  align-items: start;
}

/* Kicker pills */
.ct-kicker{
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 10px;
}
.ct-pill{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid rgba(239,68,68,.25);
  background: rgba(239,68,68,.08);
  color: var(--ct-text);
  font-weight: 600;
  font-size: 12px;
}
.ct-pill--soft{
  border-color: rgba(15,23,42,.10);
  background: rgba(2,6,23,.03);
}
.ct-ico{
  width: 26px;
  height: 26px;
  border-radius: 10px;
  border: 1px solid rgba(15,23,42,.10);
  background:#fff;
  display:grid;
  place-items:center;
  color: var(--ct-red);
}

/* Headings (simple, professional) */
.ct-title{
  margin: 0 0 8px;
  font-size: 28px;
  line-height: 1.18;
  font-weight: 600;
  letter-spacing: -0.02em;
  color: var(--ct-text);
}
.ct-h2{
  margin: 0;
  font-size: 16px;
  font-weight: 600;
  color: var(--ct-text);
  letter-spacing: -0.01em;
}

/* Paragraph rule */
.ct-p,
.ct-lead{
  margin: 0 0 12px;
  color: var(--ct-muted);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.75;
}
.ct-lead{ margin-bottom: 14px; }

/* Actions */
.ct-actions{
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
  margin: 10px 0 14px;
}
.ct-btn{
  display:inline-flex;
  align-items:center;
  gap: 10px;
  height: 40px;
  padding: 0 14px;
  border-radius: 999px;
  text-decoration:none;
  font-weight: 700;
  font-size: 13px;
  border: 1px solid transparent;
}
.ct-btn--primary{
  background: var(--ct-red);
  color:#fff;
  box-shadow: 0 16px 32px rgba(239,68,68,.22);
}
.ct-btn--primary:hover{ filter: brightness(.98); }
.ct-btn--ghost{
  background:#fff;
  color: var(--ct-text);
  border-color: rgba(15,23,42,.12);
}
.ct-btn--ghost:hover{ background: rgba(2,6,23,.02); }

/* =========================================================
   INFO CARDS (fixed layout)
   icon+title in one row, text below
   ========================================================= */

.ct-cards{
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 14px;
  margin-top: 12px;
  align-items: stretch;
}

.ct-card{
  background:#fff;
  border: 1px solid var(--ct-border);
  border-radius: 18px;
  box-shadow: 0 14px 35px rgba(15,23,42,.07);
  padding: 14px;
  height: 100%;
  display: flex;
  flex-direction: column;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.ct-card:hover{
  transform: translateY(-2px);
  box-shadow: 0 22px 55px rgba(15,23,42,.10);
  border-color: rgba(239,68,68,.22);
}

.ct-cardTop{
  display:flex;
  align-items:center;
  gap: 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(15,23,42,.06);
  margin-bottom: 10px;
}

.ct-cardIcon{
  width: 40px;
  height: 40px;
  border-radius: 14px;
  border: 1px solid rgba(239,68,68,.25);
  background: rgba(239,68,68,.08);
  display:grid;
  place-items:center;
  color: var(--ct-red);
  flex: 0 0 auto;
}

.ct-cardTitle{
  font-size: 13px;
  font-weight: 600;
  color: var(--ct-text);
  margin: 0;
}

.ct-cardBody{
  display:flex;
  flex-direction: column;
  height: 100%;
  min-width: 0;
}

.ct-cardBody p{
  margin: 0 0 10px;
  color: var(--ct-muted);
  font-size: 12px;
  font-weight: 400;
  line-height: 1.7;
}

.ct-link{
  margin-top: auto;
  padding-top: 10px;
  display:inline-flex;
  gap: 8px;
  align-items:center;
  font-size: 13px;
  font-weight: 700;
  color: var(--ct-text);
  text-decoration:none;
}
.ct-link:hover{ text-decoration: underline; }

.ct-inlineLink{
  color: var(--ct-text);
  text-decoration: underline;
  font-weight: 600;
  font-size:12px;
}

.ct-miniRow{
  margin-top: auto;
  padding-top: 10px;
  display:flex;
  flex-wrap: wrap;
  gap: 8px;
}

.ct-chip{
  display:inline-flex;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(15,23,42,.10);
  background: rgba(2,6,23,.03);
  color: var(--ct-text);
  font-weight: 600;
  font-size: 12px;
}

/* Office hours rows */
.ct-hoursRow{
  display:flex;
  justify-content: space-between;
  gap: 10px;
  padding: 6px 0;
  border-bottom: 1px solid rgba(15,23,42,.06);
}
.ct-hoursRow:last-child{ border-bottom: 0; }
.ct-hoursRow strong{
  font-size: 12px;
  font-weight: 700;
  color: var(--ct-text);
}

/* -------------------------
   Right form card
------------------------- */
.ct-heroSide{ align-self: start; }
.ct-sideCard{
  background:#fff;
  border: 1px solid rgba(15,23,42,.10);
  border-radius: 22px;
  box-shadow: var(--ct-shadow);
  overflow: hidden;
  position: sticky;
  top: calc(var(--site-header-offset, 110px) + 18px);
}
.ct-sideHead{
  padding: 14px;
  border-bottom: 1px solid rgba(15,23,42,.08);
  display:flex;
  gap: 10px;
  align-items:center;
}
.ct-sideIcon{
  width: 40px;
  height: 40px;
  border-radius: 16px;
  border: 1px solid rgba(15,23,42,.10);
  background: rgba(2,6,23,.03);
  display:grid;
  place-items:center;
  color: var(--ct-text);
}
.ct-sideHead b{
  display:block;
  font-size: 13px;
  font-weight: 700;
  color: var(--ct-text);
}
.ct-sideHead span{
  display:block;
  margin-top: 2px;
  font-size: 12px;
  font-weight: 600;
  color: var(--ct-muted);
}

.ct-form{ padding: 14px; }
.ct-row{ margin-bottom: 12px; }
.ct-row--two{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.ct-label{
  display:block;
  font-size: 12px;
  font-weight: 700;
  color: var(--ct-text);
  margin-bottom: 6px;
}
.ct-input{
  width: 100%;
  height: 42px;
  border-radius: 14px;
  border: 1px solid rgba(15,23,42,.12);
  padding: 0 12px;
  outline: none;
  background:#fff;
  font-size: 13px;
  font-weight: 400;
}
.ct-input:focus{
  border-color: rgba(239,68,68,.35);
  box-shadow: 0 0 0 3px rgba(239,68,68,.10);
}
.ct-textarea{
  height: auto;
  padding: 10px 12px;
  resize: vertical;
}
.ct-submit{
  width: 100%;
  height: 44px;
  border: 0;
  border-radius: 999px;
  background: linear-gradient(135deg, #ff445e, #ff6a2a);
  color: #fff;
  font-weight: 800;
  cursor: pointer;
  box-shadow: 0 18px 40px rgba(250,57,74,0.28);
}
.ct-submit:hover{ filter: brightness(.98); }
.ct-formNote{
  margin: 10px 0 0;
  font-size: 12px;
  font-weight: 400;
  color: var(--ct-muted);
  line-height: 1.55;
}

/* Map section */
.ct-mapGrid{
  display:grid;
  grid-template-columns: 1.4fr .6fr;
  gap: 18px;
  align-items: start;
}
.ct-mapCard{
  background:#fff;
  border: 1px solid rgba(15,23,42,.10);
  border-radius: 22px;
  box-shadow: var(--ct-shadow);
  overflow: hidden;
}
.ct-mapHead{
  padding: 14px;
  border-bottom: 1px solid rgba(15,23,42,.08);
}
.ct-map{ width: 100%; }

.ct-visitCard{
  background:#fff;
  border: 1px solid rgba(15,23,42,.10);
  border-radius: 22px;
  box-shadow: var(--ct-shadow);
  padding: 14px;
  position: sticky;
  top: calc(var(--site-header-offset, 110px) + 18px);
}
.ct-visitList{
  display:grid;
  gap: 10px;
  margin-top: 10px;
}
.ct-visitItem{
  display:flex;
  gap: 10px;
  align-items:flex-start;
  padding: 12px;
  border-radius: 18px;
  border: 1px solid rgba(15,23,42,.10);
  background: rgba(2,6,23,.02);
}
.ct-visitIco{ width: 28px; display:inline-flex; justify-content:center; }
.ct-visitItem b{
  display:block;
  font-size: 13px;
  font-weight: 700;
  color: var(--ct-text);
  margin-bottom: 4px;
}
.ct-cta{
  margin-top: 12px;
  display:inline-flex;
  width: 100%;
  justify-content:center;
  align-items:center;
  gap: 10px;
  height: 44px;
  border-radius: 999px;
  background: rgba(239,68,68,.10);
  border: 1px solid rgba(239,68,68,.25);
  color: var(--ct-text);
  font-weight: 800;
  text-decoration:none;
}
.ct-cta:hover{ filter: brightness(.98); }

/* Responsive */
@media (max-width: 980px){
  .ct-heroGrid{ grid-template-columns: 1fr; }
  .ct-cards{ grid-template-columns: 1fr; }
  .ct-sideCard{ position: static; }
  .ct-mapGrid{ grid-template-columns: 1fr; }
  .ct-visitCard{ position: static; }
}
@media (max-width: 560px){
  .ct-title{ font-size: 24px; }
  .ct-row--two{ grid-template-columns: 1fr; }
  .ct-btn{ width: 100%; justify-content:center; }
}


/* =========================================================
   Contact – Inline Alerts (Success / Error)
   ========================================================= */

.ct-inlineSuccess,
.ct-inlineError{
  margin-top: 12px;
  padding: 12px 14px;
  border-radius: 12px;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.5;
  animation: ctFadeIn .35s ease;
}

.ct-inlineSuccess{
  background: linear-gradient(135deg, rgba(34,197,94,.10), rgba(16,185,129,.06));
  border: 1px solid rgba(34,197,94,.25);
  color: #166534;
}

.ct-inlineError{
  background: linear-gradient(135deg, rgba(239,68,68,.10), rgba(220,38,38,.06));
  border: 1px solid rgba(239,68,68,.25);
  color: #991b1b;
}

@keyframes ctFadeIn{
  from{ opacity: 0; transform: translateY(6px); }
  to{ opacity: 1; transform: translateY(0); }
}