/* ---------------------------------------------------------------------------
   Light theme — public pages only (homepage, directory, microsites, landing
   pages). Loaded AFTER theme.css, which stays dark for admin/dashboard/edit.

   Palette: white ground, indigo primary, slate text. Deliberately flat —
   no gradient headlines, no neon glow — because those read as templated.
   Every text colour below clears WCAG AA (4.5:1) on white.
--------------------------------------------------------------------------- */
:root{
  --bg:#ffffff;--bg-2:#fafbfc;--panel:#fafbfc;--panel-2:#f3f4f6;
  --border:#e5e7eb;--border-2:#d1d5db;
  --text:#1a202c;--muted:#4b5563;--muted-2:#6b7280;
  --brand:#4f46e5;--cyan:#0369a1;--violet:#4f46e5;--pink:#be185d;--amber:#b45309;--green:#047857;
  /* Kept as gradients so `background:var(--grad)` keeps working, but flat. */
  --grad:linear-gradient(120deg,#4f46e5 0%,#4f46e5 100%);
  --grad-2:linear-gradient(120deg,#4f46e5 0%,#4f46e5 100%);
  --shadow-sm:0 1px 3px rgba(0,0,0,.08);
  --shadow:0 2px 8px rgba(0,0,0,.06);
  --shadow-lg:0 12px 32px rgba(0,0,0,.08);
}

/* Kill the purple/teal ambient glow — the single biggest "AI template" tell. */
body{background:var(--bg)}
body::before{background:var(--bg);content:"";position:fixed;inset:0;z-index:-2}

/* top bar — clean professional look */
.topbar{background:#fff;border-bottom:1px solid #f0f0f0;backdrop-filter:none}
.logo .mark{background:none;box-shadow:none}
.nav-r a{font-weight:500}

/* buttons — refined and professional */
.btn-primary{background:var(--brand);color:#fff;box-shadow:none;border:none;font-weight:500}
.btn-primary:hover:not(:disabled){background:#4338ca;color:#fff;box-shadow:0 4px 12px rgba(79,70,229,.2);transform:translateY(-1px)}
.btn-primary:active:not(:disabled){transform:translateY(0);box-shadow:0 2px 6px rgba(79,70,229,.1)}
.btn-ghost{background:#fff;border:1px solid #e0e0e0;color:var(--text);font-weight:500}
.btn-ghost:hover:not(:disabled){border-color:var(--brand);color:var(--brand);background:#f9f5ff}

/* cards — modern minimal look */
.card,.kpi{background:#fff;border:1px solid #f0f0f0;box-shadow:var(--shadow-sm)}

/* pipeline */
.pipe-row .ico{background:#eef2ff}
.pipe-row.done .ico{background:#d1fae5}
.spin{border-color:var(--border-2);border-top-color:var(--brand)}

/* tables */
tr:hover td{background:var(--panel-2)}

/* badges/pills — subtle and refined */
.pill.hot{background:#fef2f4;color:#c5192d;border:none;font-weight:500}
.pill.warm{background:#fef7e8;color:#a16207;border:none;font-weight:500}
.pill.new{background:#ecf8f4;color:#0f7e7f;border:none;font-weight:500}
.pill.cold{background:#f3f4f6;color:var(--muted);border:none;font-weight:500}
.chip{background:#fff;border:1px solid #e5e7eb;color:var(--muted);font-weight:500}
.chip:hover{border-color:var(--brand);background:#f9f5ff}
.tag{background:#eef2ff;color:var(--brand);font-weight:600;border:none}

/* score ring — refined */
.ring{background:conic-gradient(var(--brand) calc(var(--p)*1%),#eff0f6 0)}
.ring::before{background:#fff}
.ring span{font-weight:700;color:var(--brand)}

/* forms — professional and accessible */
.field input,.field textarea{background:#fff;border:1px solid #d1d5db;padding:10px 12px;font-size:14px;line-height:1.5}
.field input::placeholder,.field textarea::placeholder{color:#9ca3af}
.field input:focus,.field textarea:focus{border-color:var(--brand);box-shadow:0 0 0 3px rgba(79,70,229,.08);outline:none}

.toast{background:#fff;border:1px solid #e5e7eb;box-shadow:0 16px 40px rgba(0,0,0,.1);color:var(--text);border-radius:10px}
.empty{color:var(--muted-2);font-size:14px}

/* Additional refinements for professional appearance */
.eyebrow{color:var(--brand);font-weight:600;letter-spacing:.1em}
h1,h2,h3,h4,h5,h6{color:var(--text);font-weight:700;letter-spacing:-.01em}
/* Generic link styling must never touch buttons/logo/chips — those set their own
   colours, and a bare `a:hover{color}` would repaint button labels invisible.

   :where() is load-bearing here. Written as `a:not(.btn):not(.logo)` this scores
   (0,2,1) — HIGHER than a component rule like `.sec-nav-link.on` (0,2,0) — so it
   silently overrode the active nav item's white text and left purple-on-purple.
   :where() contributes zero specificity, so the whole selector counts as plain
   `a` (0,0,1) and loses to every component rule, exactly as a base style should. */
a:where(:not(.btn):not(.logo)){color:var(--brand)}
a:where(:not(.btn):not(.logo)):hover{color:#4338ca;text-decoration:underline}
a.btn:hover{text-decoration:none}