/* =====================================================================
   HighPur Water Express — trust, map & contact upgrades
   Real embedded map · credentials/proof strip · honest testimonial flags
   No fabricated data — placeholder slots are clearly marked for real input.
   ===================================================================== */

/* ---- real embedded map -------------------------------------------- */
.map-embed{
  position:relative; margin-top:22px; height:240px;
  border-radius:18px; overflow:hidden;
  border:1px solid var(--glass-line-2);
  box-shadow:0 24px 60px rgba(2,12,18,.45), inset 0 1px 0 rgba(127,246,234,.08);
}
.map-embed iframe{
  width:100%; height:100%; border:0; display:block;
  /* dark-mode the map so it sits in the palette; clears on hover for clarity */
  filter:invert(.91) hue-rotate(178deg) brightness(.96) contrast(.92) saturate(.7);
  transition:filter .5s var(--ease);
}
.map-embed:hover iframe{ filter:none; }
.map-embed::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  box-shadow:inset 0 0 0 1px rgba(127,246,234,.10);
  border-radius:18px;
}
.map-embed .mtick{ position:absolute; z-index:2; width:13px; height:13px; border:1px solid var(--glass-line-2); pointer-events:none; }
.map-embed .mtick.tl{ left:10px; top:10px; border-right:0; border-bottom:0; }
.map-embed .mtick.br{ right:10px; bottom:10px; border-left:0; border-top:0; }
.map-directions{
  display:inline-flex; align-items:center; gap:7px; margin-top:14px;
  font-family:var(--font-mono); font-size:.72rem; letter-spacing:.12em; text-transform:uppercase;
  color:var(--cyan-hi); transition:color .2s ease, gap .2s ease;
}
.map-directions:hover{ color:var(--white); gap:11px; }

/* ---- credentials / proof strip ------------------------------------ */
.proof-strip{
  max-width:var(--maxw); margin:0 auto 40px; padding:0 var(--pad);
  display:grid; grid-template-columns:repeat(4,1fr); gap:14px;
}
.proof-item{
  position:relative;
  background:var(--glass); border:1px solid var(--glass-line); border-radius:16px;
  padding:20px 18px; display:flex; flex-direction:column; gap:7px;
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
}
.proof-stars{ color:var(--aqua); letter-spacing:2px; font-size:1rem; text-shadow:0 0 12px rgba(51,232,214,.5); }
.proof-big{ font-family:var(--font-display); font-weight:700; font-size:1.7rem; line-height:1; letter-spacing:-.01em; color:var(--white); }
.proof-big small{ font-size:.9rem; font-weight:600; color:var(--mist); }
.proof-label{ font-family:var(--font-mono); font-size:.66rem; letter-spacing:.1em; text-transform:uppercase; color:var(--mist); }
.proof-sub{ font-size:.82rem; color:var(--mist-dim); line-height:1.4; }
.proof-ico{ width:24px; height:24px; stroke:var(--cyan-hi); fill:none; stroke-width:1.6; }

/* placeholder flag — reuses the yellow ph-flag language already on the stats */
.need{ display:inline-block; font-family:var(--font-mono); font-size:.56rem; letter-spacing:.08em; text-transform:uppercase;
  color:#ffd166; border:1px solid rgba(255,209,102,.35); background:rgba(255,209,102,.08);
  padding:2px 7px; border-radius:5px; }
.proof-item.pending{ border-style:dashed; border-color:rgba(255,209,102,.3); }

/* ---- honest testimonial flag -------------------------------------- */
.quotes-note{
  max-width:var(--maxw); margin:-28px auto 30px; padding:0 var(--pad);
  font-family:var(--font-mono); font-size:.66rem; letter-spacing:.08em; text-transform:uppercase; color:var(--mist-dim);
  display:flex; align-items:center; gap:10px;
}
.quote-flag{
  position:absolute; top:18px; right:18px;
  font-family:var(--font-mono); font-size:.54rem; letter-spacing:.08em; text-transform:uppercase;
  color:#ffd166; border:1px solid rgba(255,209,102,.35); background:rgba(255,209,102,.08);
  padding:2px 7px; border-radius:5px;
}
.quote-card{ position:relative; }

@media (max-width:860px){
  .proof-strip{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:520px){
  .proof-strip{ grid-template-columns:1fr; }
}