/* =====================================================================
   NILA Connect — look and feel redesign layer (v1)
   Loaded AFTER styles.css. CSS only. No functionality touched.
   Brand: navy 082142 | blue 154c8f | teal 0a5a4d | gold D4A832
   ===================================================================== */

:root{
  --r-ctl:11px; --r-card:16px; --r-lg:20px;
  --nila-soft:#eef5ff; --teal-soft:#e4f3ee; --gold-soft:#fbf2d8;
  --shadow-soft:0 8px 28px rgba(8,33,66,.08);
  --shadow-card:0 2px 10px rgba(8,33,66,.06);
}

/* ---- 1. Calm the typography: no more 900/950/1000 ---- */
h1,h2,h3,h4,h5,
.pd-card h3,.lead-name,.dir-card-name,.results-strip-head h3,
.ux-main-head h1,.ux-card h3,.ux-card-head h3,.section h2,.hero-copy h1,
.ops-nav button,.notice-live-card h3,.experience-preview h3{
  font-weight:800 !important; letter-spacing:-.01em;
}
.pd-tab,.dir-card-sub,.lead-row b,.trust-item,.nav-links a,
.btn,.ux-side button,.ux-kicker,.stat .lbl,.ux-stat-row span{
  font-weight:700 !important;
}
body{ -webkit-font-smoothing:antialiased; }

/* ---- 2. Soften shadows site-wide ---- */
.pd-card,.lead-card,.dir-card,.value-card,.ux-card,.ux-stat-row div,
.ux-metric-card,.ux-welcome,.notice-live-card,.experience-preview,
.premium-highlight,.provider-page-reviews,.ops-panel,.ops-nav,.card{
  box-shadow:var(--shadow-card) !important;
}
.pd-card:hover,.dir-card:hover{ box-shadow:var(--shadow-soft) !important; }

/* ---- 3. One radius rhythm ---- */
.pd-card,.lead-card,.dir-card,.ux-card,.ux-welcome,.notice-live-card{
  border-radius:var(--r-card) !important;
}
.btn,.export-btn,.lb,.ux-head-actions a,.ux-head-actions button,
.pf-input,.ops-input,.hs-submit{ border-radius:var(--r-ctl) !important; }
.status-pill,.ops-pill,.plan-badge,.notice-chip{ border-radius:999px !important; }

/* ---- 4. Buttons: brand, calmer shadow ---- */
.btn{ box-shadow:none !important; padding:11px 20px; }
.btn:hover{ transform:translateY(-1px); }
.btn-gold{ background:var(--gold) !important; color:#3a2c00 !important; box-shadow:none !important; }
.btn-gold:hover{ box-shadow:0 6px 18px rgba(212,168,50,.28) !important; }
.btn-primary{ background:var(--navy) !important; color:#fff !important; box-shadow:none !important; }
.btn-outline{ border:1px solid var(--border2) !important; }

/* ---- 5. Nav: lighter, brand active state ---- */
.nav{ backdrop-filter:none !important; background:#fff !important; }
.nav-links a:hover,.nav-links a.active{ background:var(--teal-soft) !important; color:var(--teal) !important; }

/* ---- 6. Cards & forms ---- */
.pd-card,.lead-card,.dir-card,.ux-card{ border:1px solid var(--border2) !important; }
.pf-input,.ops-input{ border:1px solid var(--border2) !important; font-weight:600 !important; }
.pf-input:focus,.ops-input:focus{ outline:0; border-color:var(--teal) !important; box-shadow:0 0 0 3px var(--teal-soft) !important; }

/* ---- 7. Status pills: brand semantic colours ---- */
.status-pill,.ops-pill{ font-weight:700 !important; }
.status-pill.accepted,.ops-pill.live{ background:var(--teal-soft) !important; color:#13573a !important; }
.status-pill.quoted,.ops-pill.pending{ background:var(--gold-soft) !important; color:#7a5b00 !important; }

/* =====================================================================
   8. PROVIDER DASHBOARD — align to approved mockup
   ===================================================================== */
.ux-provider-app{ background:#f4f6f9 !important; }
.ux-side{ background:#0c2444 !important; }            /* navy spine */
.ux-side.pro{ background:#0c2444 !important; }
.ux-side.power{ background:linear-gradient(180deg,#2a1364,#1c0b45) !important; }
.ux-side button{ border-radius:12px !important; font-weight:700 !important; }
.ux-side button.ux-side-active,.ux-side button:hover{ background:rgba(255,255,255,.14) !important; color:#fff !important; }
.ux-side-plan a{ color:var(--gold) !important; }
.ux-side button b{ background:var(--gold) !important; color:#3a2c00 !important; }
.ux-main-head h1{ color:var(--navy) !important; }
.ux-stat-row div,.ux-metric-card{ border-radius:var(--r-card) !important; }
.ux-stat-row b,.ux-metric-card b{ color:var(--navy) !important; font-weight:800 !important; }
.ux-stat-row em,.ux-metric-card em{ color:var(--teal) !important; }
.ux-chart i{ background:linear-gradient(180deg,#154c8f,#d4a832) !important; }
.ux-welcome a{ background:var(--gold) !important; color:#3a2c00 !important; }
.pd-tab.active{ color:var(--navy) !important; border-bottom-color:var(--gold) !important; }
.pd-hero.pro{ background:linear-gradient(135deg,#082142,#154c8f 55%,#0a5a4d) !important; }
.lb-primary{ background:var(--navy) !important; color:#fff !important; }
.lb-gold{ background:var(--gold) !important; color:#3a2c00 !important; }

/* =====================================================================
   9. DIRECTORY / FIND HELP cards — trust forward
   ===================================================================== */
.dir-card{ background:#fff !important; padding:18px !important; }
.dir-card-avatar{ background:var(--navy) !important; color:var(--gold) !important; border-radius:13px !important; }
.dir-card-rating{ color:var(--navy) !important; font-weight:800 !important; }
.dir-card-tag.avail{ background:var(--teal-soft) !important; color:#13573a !important; }
.dir-btn-primary{ background:var(--navy) !important; color:#fff !important; border-radius:var(--r-ctl) !important; font-weight:700 !important; }
.plan-badge{ background:var(--gold) !important; color:#3a2c00 !important; }

/* =====================================================================
   10. HOMEPAGE — pull the map off the front door, lead with trust
   ===================================================================== */
.hero-map-wrap,.map-prompt,.map-mode-bar{ display:none !important; }
.hero-copy h1{ font-size:clamp(32px,5vw,52px) !important; line-height:1.08 !important; }
.hero-cats{ margin-top:4px !important; }
.trust-item{ color:rgba(255,255,255,.9) !important; }
.trust-icon{ color:var(--gold) !important; }
.hs-submit{ background:var(--gold) !important; color:#3a2c00 !important; }
.results-strip-head h3{ color:var(--navy) !important; }
.results-strip-head a{ color:var(--teal) !important; }

/* =====================================================================
   11. Mobile polish
   ===================================================================== */
@media(max-width:680px){
  .pd-card,.lead-card,.dir-card,.ux-card{ border-radius:14px !important; }
  .btn{ padding:11px 16px; }
}
.mn-item.active,.mn-item:hover{ color:var(--teal) !important; }