/* ===========================================================
   BlackRidge — City investment pages (loaded after styles.css)
   Reuses brand tokens from styles.css (--navy, --sand, etc.)
   =========================================================== */

/* ── Government / major investment project tiles ── */
.projects{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:10px}
.proj{position:relative;background:transparent;border:none;border-top:2px solid var(--sand);border-radius:0;padding:22px 26px 22px 0;transition:transform .18s ease}
.proj:hover{transform:translateY(-2px)}
.proj .amt{display:block;font-family:'Fraunces',serif;font-weight:600;font-size:clamp(24px,3vw,31px);color:var(--navy2);
  line-height:1;font-variant-numeric:tabular-nums}
.proj .dist{display:block;margin-top:14px;font-size:11px;text-transform:uppercase;letter-spacing:.11em;color:var(--bronze);font-weight:700}
.proj h4{font-family:'Fraunces',serif;font-weight:500;font-size:18px;color:var(--navy);margin:5px 0 0}
.proj p{font-size:13.5px;color:var(--slate);margin-top:9px;line-height:1.55}
.proj .st{display:inline-block;margin-top:12px;font-size:11px;font-weight:700;letter-spacing:.04em;padding:3px 9px;border-radius:6px;
  background:var(--paper2);color:var(--slate)}
@media(max-width:860px){.projects{grid-template-columns:1fr 1fr}}
@media(max-width:540px){.projects{grid-template-columns:1fr}}

/* ── Predicted-growth forecast band (bold, exciting) ── */
.forecast{position:relative;overflow:hidden;background:linear-gradient(145deg,#1E4636 0%,#16362A 60%,#0F2A20 100%);
  border-radius:20px;padding:clamp(30px,5vw,56px);color:#fff;display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(30px,4vw,52px);align-items:center}
.forecast .fc-copy .eyebrow{color:var(--sand)}
.forecast h2{color:#fff;font-size:clamp(25px,3.4vw,36px);margin-top:12px;text-wrap:balance}
.forecast .fc-copy p{color:#C4D3C8;margin-top:14px;font-size:15.5px;line-height:1.6;max-width:44ch}
.forecast .fc-figs{display:grid;grid-template-columns:1fr 1fr;gap:26px 30px}
.forecast .fc .big{display:block;font-family:'Fraunces',serif;font-weight:600;font-size:clamp(36px,5.5vw,58px);color:var(--sand);
  line-height:.95;font-variant-numeric:tabular-nums}
.forecast .fc .lbl{display:block;margin-top:10px;font-size:13px;color:#B7C8BC;line-height:1.4}
.forecast .fc .src{display:block;margin-top:4px;font-size:11px;color:#8AA093}
@media(max-width:780px){.forecast{grid-template-columns:1fr;gap:30px}}
@media(max-width:420px){.forecast .fc-figs{grid-template-columns:1fr 1fr;gap:22px}}

/* ── Data tiles (education / economy headline stats) ── */
.datatiles{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.dt{padding:26px 26px 26px 28px;border-left:1px solid var(--line)}
.dt:first-child{border-left:none;padding-left:0}
.dt .big{display:block;font-family:'Fraunces',serif;font-weight:600;font-size:clamp(27px,3.2vw,37px);color:var(--navy2);
  line-height:1;font-variant-numeric:tabular-nums}
.dt .lbl{display:block;margin-top:11px;font-size:13.5px;color:var(--slate);line-height:1.45}
@media(max-width:860px){.datatiles{grid-template-columns:1fr 1fr}.dt:nth-child(odd){border-left:none;padding-left:0}.dt:nth-child(n+3){border-top:1px solid var(--line)}}
@media(max-width:460px){.datatiles{grid-template-columns:1fr}.dt{border-left:none;padding-left:0;border-top:1px solid var(--line)}.dt:first-child{border-top:none}}

/* ── Major employers / sector chips ── */
.employers{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px}
.emp{border:1px solid var(--line);border-radius:999px;padding:10px 18px;font-size:14.5px;font-weight:600;color:var(--navy);
  background:var(--white);white-space:nowrap}
.emp.sand{background:#F4E7D6;border-color:#EAD4BC;color:#7A5230}

/* ── Connectivity table (journey times) ── */
.connect{display:grid;grid-template-columns:1fr 1fr;gap:2px 44px;margin-top:8px}
.cx{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:13px 0;border-bottom:1px solid var(--line)}
.cx .to{color:var(--slate);font-size:15px}
.cx .t{font-weight:600;color:var(--navy);font-size:15px;font-variant-numeric:tabular-nums;white-space:nowrap}
@media(max-width:640px){.connect{grid-template-columns:1fr;gap:0 0}}

/* ── City intro "at a glance" mini list ── */
.glance{list-style:none;display:grid;gap:12px;margin-top:20px}
.glance li{display:flex;gap:11px;align-items:flex-start;font-size:15.5px;color:var(--ink);line-height:1.5}
.glance li svg{flex:none;width:19px;height:19px;color:var(--bronze);margin-top:2px}

/* ── Section lead paragraph ── */
.sec-lead{max-width:70ch;color:var(--slate);font-size:16.5px;line-height:1.7;margin:-14px 0 26px}

/* ── City cross-links (explore other cities) ── */
.citylinks{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px}
.citylinks a{border:1px solid var(--line);border-radius:10px;padding:11px 16px;font-weight:600;color:var(--navy);
  background:var(--white);font-size:14.5px;transition:.15s}
.citylinks a:hover{border-color:var(--bronze);color:var(--bronze)}
.citylinks a[aria-current="page"]{background:var(--navy);color:#fff;border-color:var(--navy)}