:root {
  color-scheme: light;
  --ink: #17212b;
  --muted: #5b6874;
  --line: #d6dde3;
  --surface: #f4f6f7;
  --accent: #1e5368;
  --accent-soft: #e8f0f3;
  --max: 1060px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: #fff; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; line-height: 1.55; }
a { color: var(--accent); text-underline-offset: 3px; }
a:hover, a:focus-visible { color: #0f3442; }
a:focus-visible { outline: 3px solid #b9d7e3; outline-offset: 3px; }
.shell { width: min(var(--max), calc(100% - 3rem)); margin: 0 auto; }
.site-header { background: var(--surface); border-bottom: 1px solid var(--line); }
.hero { padding: 5.5rem 0 4.5rem; }
.eyebrow, .section-kicker { color: var(--accent); font-size: .76rem; font-weight: 750; letter-spacing: .13em; margin: 0 0 .9rem; text-transform: uppercase; }
h1, h2, h3 { line-height: 1.15; margin: 0; }
h1 { font-size: clamp(2.5rem, 6vw, 4.7rem); letter-spacing: -.055em; max-width: 780px; }
.headline { color: var(--accent); font-size: clamp(1.2rem, 2.4vw, 1.7rem); font-weight: 650; letter-spacing: -.02em; margin: 1.2rem 0 1.4rem; max-width: 800px; }
.intro { font-size: clamp(1.05rem, 1.8vw, 1.25rem); max-width: 760px; margin: 0; }
.hero-meta { display: flex; flex-wrap: wrap; gap: .55rem 1.5rem; margin-top: 1.6rem; color: var(--muted); font-weight: 600; }
.links { display: flex; flex-wrap: wrap; gap: .8rem 1.25rem; margin-top: 1.2rem; font-weight: 700; }
.section { padding: 4.6rem 0; }
.commercial { background: #fff; }
.projects { background: var(--surface); border-block: 1px solid var(--line); }
.development { background: #fff; }
h2 { font-size: clamp(1.65rem, 3.1vw, 2.35rem); letter-spacing: -.035em; max-width: 720px; }
.progression { border-left: 4px solid var(--accent); margin: 2rem 0 2.4rem; padding: .15rem 0 .15rem 1.1rem; font-size: 1.08rem; }
.progression span { color: var(--muted); }
.progression .arrow { color: var(--accent); padding: 0 .4rem; }
.evidence-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.evidence-item, .project { border-top: 2px solid var(--ink); padding-top: 1rem; }
.evidence-item h3, .project h3 { font-size: 1.06rem; }
.evidence-item p, .project p { color: #3d4a55; margin: .65rem 0 0; }
.project-list { display: grid; gap: 2rem; margin-top: 2rem; max-width: 820px; }
.project { border-top-color: var(--accent); }
.project-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; }
.project-heading span { color: var(--muted); font-size: .9rem; text-align: right; }
.compact-section p { max-width: 700px; color: #3d4a55; font-size: 1.05rem; }
.site-footer { background: var(--ink); color: #fff; padding: 3.6rem 0; }
.site-footer .section-kicker { color: #a9d5e2; }
.site-footer h2 { max-width: 500px; }
.footer-inner { display: flex; align-items: end; justify-content: space-between; gap: 2rem; }
.footer-links { display: flex; flex-wrap: wrap; gap: .7rem 1.2rem; justify-content: end; }
.footer-links a { color: #fff; }
@media (max-width: 720px) {
  .shell { width: min(var(--max), calc(100% - 2rem)); }
  .hero { padding: 3.5rem 0 3rem; }
  .section { padding: 3.4rem 0; }
  .evidence-grid { grid-template-columns: 1fr; gap: 1.7rem; }
  .project-heading, .footer-inner { align-items: flex-start; flex-direction: column; }
  .project-heading span { text-align: left; }
  .footer-links { justify-content: flex-start; }
}
