/* Jones Lodges DD Portal — institutional dark green/gold (see ideas.md).
   Georgia serif display, Helvetica labels/data; gold reserved for figures. */
:root {
  --bg: #0d1f14;
  --surface: #132a1a;
  --surface2: #1a3522;
  --gold: #c9a84c;
  --gold-l: #f0d98a;
  --green-l: #b8dfc4;
  --muted: #7a9e88;
  --border: #2a5238;
  --softg: #cfe3d6;
  --line: #2a5238;
  --panel: #132a1a;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  background: var(--bg);
  color: var(--softg);
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 14px;
  line-height: 1.65;
}
/* Brand header */
.brand-bar {
  border-bottom: 1px solid var(--border);
  background: linear-gradient(180deg, #0f2417, #0d1f14);
  padding: 18px 32px 14px;
  display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 8px;
}
.brand-bar .wordmark {
  font-family: Georgia, serif;
  font-size: 15px; letter-spacing: 6px; color: var(--gold-l); text-decoration: none;
}
.brand-bar .conf {
  font-size: 9px; letter-spacing: 3px; text-transform: uppercase; color: var(--muted);
}
/* Site nav */
.site-nav {
  background: #0f2417; border-bottom: 1px solid var(--border);
  padding: 0 24px; display: flex; flex-wrap: wrap; gap: 2px;
}
.site-nav a {
  font-size: 10px; letter-spacing: 2px; text-transform: uppercase;
  color: var(--muted); text-decoration: none; padding: 11px 12px 9px;
  border-bottom: 2px solid transparent; transition: color .18s ease-out;
}
.site-nav a:hover { color: var(--gold-l); }
.site-nav a.active { color: var(--gold); border-bottom-color: var(--gold); }
/* Hero */
.hero { max-width: 1200px; margin: 0 auto; padding: 56px 32px 10px; }
.hero .kicker {
  font-size: 10px; letter-spacing: 4px; text-transform: uppercase;
  color: var(--gold); margin-bottom: 16px;
}
.hero h1 {
  font-family: Georgia, "Times New Roman", serif; font-weight: 400;
  font-size: 38px; line-height: 1.16; color: var(--gold-l); max-width: 820px;
}
.hero .sub { margin-top: 14px; max-width: 680px; color: var(--muted); font-size: 14px; }
/* Sections */
section.block { max-width: 1200px; margin: 0 auto; padding: 48px 32px 8px; }
section.block .sec-kicker {
  font-size: 10px; letter-spacing: 3px; text-transform: uppercase;
  color: var(--gold); margin-bottom: 10px;
  border-bottom: 1px solid var(--border); padding-bottom: 6px; max-width: 760px;
}
section.block h2 {
  font-family: Georgia, serif; font-weight: 400; font-size: 26px;
  color: var(--gold-l); margin-bottom: 14px;
}
section.block h3 {
  font-family: Georgia, serif; font-weight: 400; font-size: 18px;
  color: var(--green-l); margin: 22px 0 10px;
}
section.block p.lede { max-width: 760px; color: var(--softg); margin-bottom: 22px; }
section.block p.body { max-width: 760px; color: var(--muted); margin-bottom: 18px; }
section.block p.body strong { color: var(--gold); font-weight: 500; }
/* KPI grid — seamless 1px gap grid */
.kpi-grid {
  display: grid; gap: 1px; background: var(--border);
  border: 1px solid var(--border); margin: 20px 0 26px;
}
.kpi-grid.cols-5 { grid-template-columns: repeat(5, 1fr); }
.kpi-grid.cols-6 { grid-template-columns: repeat(6, 1fr); }
.kpi-grid.cols-4 { grid-template-columns: repeat(4, 1fr); }
.kpi { background: var(--surface); padding: 18px 16px 14px; }
.kpi.featured { border-top: 2px solid var(--gold); }
.kpi .v { font-family: Georgia, serif; font-size: 24px; color: var(--gold-l); }
.kpi .l {
  margin-top: 6px; font-size: 9.5px; letter-spacing: 1.5px;
  text-transform: uppercase; color: var(--muted); line-height: 1.5;
}
@media (max-width: 900px) {
  .kpi-grid.cols-5, .kpi-grid.cols-6, .kpi-grid.cols-4 { grid-template-columns: repeat(2, 1fr); }
  .hero h1 { font-size: 28px; }
}
/* Tables */
table.dd { width: 100%; border-collapse: collapse; margin: 18px 0 26px; font-size: 12.5px; }
table.dd th {
  text-align: left; font-size: 9.5px; letter-spacing: 1.5px; text-transform: uppercase;
  color: var(--gold); padding: 9px 10px; border-bottom: 1px solid var(--gold);
}
table.dd th.num, table.dd td.num { text-align: right; }
table.dd td { padding: 9px 10px; border-bottom: 1px solid var(--border); color: var(--softg); }
table.dd tr.total td {
  color: var(--gold-l); border-top: 1px solid var(--gold); border-bottom: none;
  font-weight: 500; background: var(--surface);
}
table.dd .dim { color: var(--muted); }
.pill {
  display: inline-block; font-size: 9px; letter-spacing: 1px; text-transform: uppercase;
  border: 1px solid var(--border); padding: 2px 8px; color: var(--green-l);
}
.pill.gold { color: var(--gold); border-color: var(--gold); }
.pill.red { color: #d98a7a; border-color: #6b3a2e; }
.pill.amber { color: #d9c07a; border-color: #6b5a2e; }
/* Cards for module directory */
.card-grid { display: grid; gap: 1px; background: var(--border); border: 1px solid var(--border); margin: 20px 0 26px; grid-template-columns: repeat(3, 1fr); }
@media (max-width: 900px) { .card-grid { grid-template-columns: 1fr; } }
a.mod-card { background: var(--surface); padding: 18px 16px 16px; text-decoration: none; display: block; transition: background .18s ease-out; }
a.mod-card:hover { background: var(--surface2); }
a.mod-card .n { font-size: 9px; letter-spacing: 2px; color: var(--muted); text-transform: uppercase; }
a.mod-card .t { font-family: Georgia, serif; font-size: 16px; color: var(--gold-l); margin: 6px 0 6px; }
a.mod-card .d { font-size: 12px; color: var(--muted); line-height: 1.55; }
/* Figure */
figure.plate { max-width: 1200px; margin: 0 auto; padding: 0 32px 24px; }
figure.plate img { width: 100%; border: 1px solid var(--border); }
figure.plate figcaption { font-size: 11px; color: var(--muted); margin-top: 8px; }
/* Footnote + footer */
.footnote { max-width: 1200px; margin: 0 auto; padding: 8px 32px 24px; font-size: 11px; color: var(--muted); opacity: .8; }
footer.site {
  border-top: 1px solid var(--border); margin-top: 40px; padding: 22px 32px 60px;
  font-size: 10px; letter-spacing: 2px; text-transform: uppercase; color: var(--muted);
  display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px;
}
/* Password gate */
#gate {
  position: fixed; inset: 0; z-index: 999; background: var(--bg);
  display: flex; align-items: center; justify-content: center;
}
#gate .panel { text-align: center; max-width: 380px; padding: 32px; }
#gate .wordmark { font-family: Georgia, serif; letter-spacing: 6px; font-size: 16px; color: var(--gold-l); margin-bottom: 8px; }
#gate .sub { font-size: 10px; letter-spacing: 3px; text-transform: uppercase; color: var(--muted); margin-bottom: 28px; }
#gate input {
  width: 100%; background: var(--surface); border: 1px solid var(--border);
  color: var(--gold-l); padding: 12px 14px; font-size: 14px; letter-spacing: 2px;
  text-align: center; outline: none;
}
#gate input:focus { border-color: var(--gold); }
#gate button {
  margin-top: 14px; width: 100%; background: var(--gold); color: #0d1f14;
  border: none; padding: 12px; font-size: 11px; letter-spacing: 3px;
  text-transform: uppercase; cursor: pointer; transition: transform .16s cubic-bezier(.23,1,.32,1);
}
#gate button:active { transform: scale(.97); }
#gate .err { color: #d98a7a; font-size: 11px; margin-top: 12px; min-height: 16px; }
#gate .hint { color: var(--muted); font-size: 10px; margin-top: 20px; }
@media print {
  .site-nav, .brand-bar .conf, #gate { display: none !important; }
  body { background: #fff; color: #222; }
}