/* =========================
   CONTACT INTRO
========================= */
.contact-intro-card{
  border-radius: 22px;
  background:#fff;
  border: 1px solid rgba(231,235,241,.95);
  box-shadow: 0 10px 26px rgba(2,8,23,.05);
  padding: 18px;
}

.contact-quick-actions{
  margin-top: 14px;
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
}

.contact-mini-grid{
  margin-top: 14px;
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}

.mini-info-card{
  border-radius: 18px;
  background:#fff;
  border: 1px solid rgba(231,235,241,.95);
  box-shadow: 0 10px 26px rgba(2,8,23,.05);
  padding: 14px;
}

.mic-title{
  font-weight: 950;
  margin-bottom: 6px;
}

.mic-link{
  display:inline-flex;
  margin-top: 10px;
  font-weight: 900;
  color: rgba(20,184,166,.95);
  text-decoration: none;
}
.mic-link:hover{ text-decoration: underline; }

/* alerts */
.contact-alert{
  border-radius: 18px;
  border: 1px solid rgba(231,235,241,.95);
  box-shadow: 0 10px 26px rgba(2,8,23,.05);
  background:#fff;
  padding: 14px;
  display:flex;
  gap: 12px;
  align-items:flex-start;
  margin-bottom: 12px;
}
.ca-dot{
  width: 10px;
  height: 10px;
  border-radius: 999px;
  margin-top: 6px;
}
.contact-alert.success .ca-dot{ background: rgba(20,184,166,.95); }
.contact-alert.error .ca-dot{ background: rgba(239,68,68,.92); }
.ca-title{ font-weight: 950; }

/* =========================
   CONTACT CARDS
========================= */
.contact-card-grid{
  margin-top: 14px;
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}

.contact-card{
  border-radius: 22px;
  background:#fff;
  border: 1px solid rgba(231,235,241,.95);
  box-shadow: 0 10px 26px rgba(2,8,23,.05);
  padding: 18px;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  position:relative;
  overflow:hidden;
}

.contact-card::before{
  content:"";
  position:absolute;
  inset:-2px;
  background: radial-gradient(circle at 20% 10%, rgb(221 83 86 / 24%), transparent 55%);
  opacity:0;
  transition: opacity .18s ease;
  pointer-events:none;
}

.contact-card:hover{
  transform: translateY(-3px);
  box-shadow: 0 18px 48px rgba(2,8,23,.10);
  border-color: rgba(20,184,166,.32);
}
.contact-card:hover::before{ opacity:1; }

.cc-icon{
  width: 40px;
  height: 40px;
  border-radius: 999px;
  display:grid;
  place-items:center;
  background: rgb(244 200 201);
  border: 1px solid rgb(192 42 48);
  color: rgba(11,18,32,.90);
  font-weight: 950;
  margin-bottom: 12px;
}

.cc-title{
  font-weight: 950;
  margin: 0 0 6px;
}

.cc-value{
  color: rgba(11,18,32,.78);
  line-height: 1.6;
}

.cc-actions{
  margin-top: 12px;
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
}

.btn-sm{
  padding: 10px 12px;
  border-radius: 12px;
  font-size: 14px;
}

.contact-tip{
  margin-top: 12px;
}

/* =========================
   FORM + MAP
========================= */
.fm-grid{
  display:grid;
  grid-template-columns: 1.05fr .95fr;
  gap: clamp(18px, 3vw, 34px);
  align-items:start;
}

.fm-note{
  margin-top: 14px;
  border-radius: 18px;
  background:#fff;
  border: 1px solid rgba(231,235,241,.95);
  box-shadow: 0 10px 26px rgba(2,8,23,.05);
  padding: 14px;
}
.fm-note-title{
  font-weight: 950;
  margin-bottom: 6px;
}

.contact-form{
  margin-top: 14px;
  border-radius: 22px;
  background:#fff;
  border: 1px solid rgba(231,235,241,.95);
  box-shadow: 0 10px 26px rgba(2,8,23,.05);
  padding: 18px;
}

.hp-field{
  position:absolute;
  left:-9999px;
  opacity:0;
  height:0;
  width:0;
}

.cf-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}

.cf-field label{
  display:block;
  font-size: 13px;
  font-weight: 800;
  color: rgba(11,18,32,.70);
  margin-bottom: 6px;
}

.cf-field input,
.cf-field textarea,
.cf-field select{
  width:100%;
  border-radius: 14px;
  border: 1px solid rgba(231,235,241,.95);
  padding: 12px 12px;
  font-size: 14px;
  outline:none;
  background:#fff;
}

.cf-field input:focus,
.cf-field textarea:focus,
.cf-field select:focus{
  border-color: rgba(20,184,166,.40);
  box-shadow: 0 0 0 4px rgba(20,184,166,.10);
}

.cf-full{ grid-column: 1 / -1; }

.cf-actions{
  margin-top: 14px;
  display:flex;
  flex-wrap:wrap;
  gap: 10px;
}

.cf-foot{
  margin-top: 10px;
}

.map-card{
  border-radius: 22px;
  background:#fff;
  border: 1px solid rgba(231,235,241,.95);
  box-shadow: 0 10px 26px rgba(2,8,23,.05);
  overflow:hidden;
}

.map-head{
  padding: 14px 14px 10px;
}
.map-title{ font-weight: 950; }
.map-sub{ margin-top: 6px; }

.map-frame{
  border-top: 1px solid rgba(231,235,241,.95);
  border-bottom: 1px solid rgba(231,235,241,.95);
  height: 340px;
  background: rgba(231,235,241,.30);
}
.map-frame iframe{
  width: 100%;
  height: 100%;
  border: 0;
  display:block;
}

.map-actions{
  padding: 12px 14px 14px;
  display:flex;
  flex-wrap:wrap;
  gap: 10px;
}

/* =========================
   SECTION DIVIDER (HR)
========================= */
.section-divider{
  padding: 0;
}

.section-divider .container{
  position: relative;
}

.section-divider span{
  display:block;
  height:1px;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(231,235,241,.95),
    transparent
  );
  position: relative;
}

.section-divider span::before{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  transform: translate(-50%, -50%);
  width: 90px;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, transparent, rgb(192 42 48), transparent);
}

.section-divider span::after{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  transform: translate(-50%, -50%);
  width: 12px;
  height: 12px;
  border-radius: 999px;
  background:#fff;
 border: 1px solid rgb(192 42 48);
  box-shadow: 0 10px 26px rgba(2,8,23,.06);
}

/* =========================
   ORNAMENTS (SVG DECOR)
   Use assets/img/decor/*.svg (same as careers)
========================= */
.with-ornaments{
  position: relative;
  overflow: hidden;
}

.with-ornaments .container{
  position: relative;
  z-index: 2;
}

.with-ornaments::before,
.with-ornaments::after{
  content:"";
  position:absolute;
  pointer-events:none;
  z-index: 1;
  opacity: .9;
  filter: drop-shadow(0 14px 26px rgba(2,8,23,.06));
  background-repeat: no-repeat;
  background-size: contain;
}

/* Intro */
.contact-intro.with-ornaments::before{
  width: 260px;
  height: 260px;
  top: -90px;
  right: -90px;
  background-image: url("assets/img/decor/ring.svg");
  opacity: .50;
}
.contact-intro.with-ornaments::after{
  width: 240px;
  height: 240px;
  bottom: -120px;
  left: -120px;
  background-image: url("assets/img/decor/dots-grid.svg");
  opacity: .45;
}

/* Cards */
.contact-cards.with-ornaments::before{
  width: 320px;
  height: 220px;
  top: -90px;
  left: -120px;
  background-image: url("assets/img/decor/wave.svg");
  opacity: .55;
}
.contact-cards.with-ornaments::after{
  width: 220px;
  height: 220px;
  bottom: -90px;
  right: -80px;
  background-image: url("assets/img/decor/dots-grid.svg");
  opacity: .40;
}

/* Form */
.contact-form-map.with-ornaments::before{
  width: 280px;
  height: 280px;
  top: -120px;
  right: -120px;
  background-image: url("assets/img/decor/ring.svg");
  opacity: .45;
}
.contact-form-map.with-ornaments::after{
  width: 230px;
  height: 230px;
  bottom: -90px;
  left: -80px;
  background-image: url("assets/img/decor/dots-grid.svg");
  opacity: .40;
}

/* Final CTA subtle */
.final-cta-bg.with-ornaments::before{
  width: 320px;
  height: 320px;
  top: -140px;
  right: -140px;
  background-image: url("assets/img/decor/ring.svg");
  opacity: .22;
  z-index: 0;
}
.final-cta-bg.with-ornaments::after{
  width: 260px;
  height: 260px;
  bottom: -120px;
  left: -120px;
  background-image: url("assets/img/decor/dots-grid.svg");
  opacity: .18;
  z-index: 0;
}

/* keep overlay stacking */
.final-cta-bg .final-cta-overlay{
  position:absolute;
  inset:0;
  z-index:1;
}
.final-cta-bg .final-cta-content{
  position: relative;
  z-index:2;
}

/* copy toast */
.copy-toast{
  position: fixed;
  left: 50%;
  bottom: 18px;
  transform: translateX(-50%) translateY(12px);
  opacity: 0;
  padding: 10px 12px;
  border-radius: 999px;
  background: rgba(11,18,32,.92);
  color: #fff;
  font-weight: 800;
  font-size: 13px;
  box-shadow: 0 12px 30px rgba(2,8,23,.20);
  transition: opacity .18s ease, transform .18s ease;
  z-index: 9999;
}
.copy-toast.show{
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}

/* responsive */
@media (max-width: 1100px){
  .contact-mini-grid{ grid-template-columns: 1fr; }
  .contact-card-grid{ grid-template-columns: repeat(2, 1fr); }
  .fm-grid{ grid-template-columns: 1fr; }
  .cf-grid{ grid-template-columns: 1fr; }
  .map-frame{ height: 320px; }
}

@media (max-width: 640px){
  .contact-card-grid{ grid-template-columns: 1fr; }
  .with-ornaments::before,
  .with-ornaments::after{
    opacity: .32;
    filter: none;
  }
}

.alert{border:1px solid rgba(0,0,0,.08);border-radius:14px;padding:14px 16px;margin:0 0 16px;background:#fff}
.alert--success{border-color:rgba(16,185,129,.35);background:rgba(16,185,129,.08)}
.alert--error{border-color:rgba(239,68,68,.35);background:rgba(239,68,68,.08)}
.alert-ref{margin-top:6px;font-size:.92rem;opacity:.85}