/* ============================================================
   KINETIC AGENTS — design tokens + base styles (single source)
   Theme: white / navy / gold. Fonts: Playfair Display + DM Sans.
   ============================================================ */
:root{
  --navy:#1e3a5f;
  --navy-dark:#152a45;
  --gold:#c9a84c;
  --green:#1D9E75;
  --grey:#6b7280;
  --border:#e5e7eb;
  --bg:#ffffff;
  --bg-soft:#f8fafc;
  --font:'DM Sans',system-ui,-apple-system,sans-serif;
  --font-head:'Playfair Display',Georgia,serif;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:var(--font);color:var(--navy);background:var(--bg);line-height:1.5}
h1,h2,h3{font-family:var(--font-head);font-weight:700;color:var(--navy);margin:0 0 .5em}
a{color:var(--navy);text-decoration:none}

/* layout */
.container{max-width:1100px;margin:0 auto;padding:0 20px}
.page{min-height:60vh}

/* nav */
#main-nav{background:var(--navy);color:#fff;padding:0}
#main-nav .nav-inner{display:flex;align-items:center;justify-content:space-between;max-width:1100px;margin:0 auto;padding:14px 20px}
#main-nav a{color:#fff;margin:0 12px;font-weight:500;font-size:15px;cursor:pointer}
#main-nav .brand{display:flex;align-items:center;gap:10px;font-family:var(--font-head);font-weight:700;font-size:20px}

/* buttons */
.btn{display:inline-block;padding:12px 24px;border-radius:8px;border:none;cursor:pointer;
  font-family:var(--font);font-size:14px;font-weight:600;transition:all .2s}
.btn-primary{background:var(--navy);color:#fff}
.btn-primary:hover{background:var(--navy-dark)}
.btn-gold{background:var(--gold);color:var(--navy)}
.btn-green{background:var(--green);color:#fff}
.btn-ghost{background:none;border:1.5px solid var(--border);color:var(--grey)}

/* forms */
.field{width:100%;padding:11px 14px;border:1.5px solid var(--border);border-radius:8px;
  font-family:var(--font);font-size:14px;margin-bottom:0}
.field:focus{outline:none;border-color:var(--gold)}
.form-group{margin-bottom:14px}
.form-group label{display:block;font-size:13px;font-weight:600;color:var(--navy);margin-bottom:5px}
.form-err{color:#dc2626;font-size:13px;background:#fef2f2;padding:8px 12px;border-radius:6px;
  display:none;margin-bottom:10px}

/* cards */
.card{background:#fff;border:1.5px solid var(--border);border-radius:16px;padding:24px}

/* modal */
.modal{display:none;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:9999;
  align-items:center;justify-content:center}
.modal-box{background:#fff;border-radius:16px;padding:28px;max-width:520px;width:90%;
  max-height:90vh;overflow-y:auto}

/* utility */
.text-center{text-align:center}
.muted{color:var(--grey)}
.hidden{display:none!important}