@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600;700&family=Poppins:wght@700&display=swap');

:root {
  --ink: #242322;
  --heading: #222222;
  --copy: #444444;
  --forest: #005576;
  --green: #45b644;
  --orange: #e59f26;
  --blue: #88caf0;
  --purple: #584a76;
  --yellow: #ffc400;
  --dark-green: #225921;
  --mint: #c3e8c3;
  --paper: #ffffff;
  --mist: #e4eef2;
  --line: #c8d4dc;
  --max-width: 1440px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--copy); background: var(--mist); font-family: "Open Sans", Arial, sans-serif; font-size: 17px; line-height: 1.65; }
a { color: var(--forest); }
a:hover, a:focus { color: var(--purple); }
.site-header { color: var(--paper); background: var(--ink); border-bottom: 5px solid var(--orange); }
.header-inner, .nav-inner, .page-width { width: min(100% - 2.5rem, var(--max-width)); margin: 0 auto; }
.header-inner { min-height: 150px; padding: 1.5rem 0; display: flex; justify-content: space-between; align-items: center; gap: 2rem; }
.brand-lockup { display: flex; align-items: center; gap: 1.2rem; }
.site-logo { width: 132px; height: auto; display: block; }
.eyebrow { margin: 0 0 .4rem; color: var(--blue) !important; font-size: .76rem; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
.site-title { margin: 0; color: var(--paper); font-family: "Poppins", Arial, sans-serif; font-size: clamp(2.1rem, 4.5vw, 4rem); font-weight: 700; line-height: .98; }
.site-subtitle { margin: .65rem 0 0; color: var(--blue); font-size: 1rem; }
.project-tag { margin: 0; max-width: 290px; color: var(--paper); font-size: .86rem; line-height: 1.5; text-align: right; }
.site-nav { position: sticky; top: 0; z-index: 20; background: var(--paper); box-shadow: 0 2px 12px rgb(39 53 45 / 13%); }
.nav-inner { display: flex; overflow-x: auto; }
.site-nav a { display: block; padding: .95rem 1rem .8rem; color: var(--ink); border-bottom: 4px solid transparent; font-size: .82rem; font-weight: 700; letter-spacing: .04em; text-decoration: none; white-space: nowrap; }
.site-nav a:hover, .site-nav a:focus, .site-nav a.active { color: var(--forest); border-bottom-color: var(--orange); }
main { padding: 3.5rem 0 4rem; }
.hero { display: grid; grid-template-columns: 1fr; background: var(--paper); box-shadow: 0 12px 36px rgb(39 53 45 / 12%); }
.hero-copy { padding: clamp(2rem, 5vw, 5rem); }
.hero-copy h1, .page-intro h1 { margin: .2rem 0 1.2rem; color: var(--heading); font-family: "Poppins", Arial, sans-serif; font-size: clamp(2.35rem, 4.5vw, 4.5rem); font-weight: 700; line-height: 1.03; }
.hero-copy p { max-width: 620px; }
.hero-art { display: grid; place-items: center; min-height: 300px; padding: 2rem; background: var(--forest); }
.hero-art img { width: 100%; height: auto; display: block; border: 8px solid var(--paper); box-shadow: 12px 12px 0 var(--blue); }
.button { display: inline-block; margin: .8rem .6rem .2rem 0; padding: .78rem 1.15rem; color: var(--ink); background: var(--orange); border: 2px solid var(--orange); font-size: .84rem; font-weight: 700; text-decoration: none; }
.hero-primary { padding: 1rem 1.5rem; color: var(--ink); background: var(--yellow); border-color: var(--yellow); font-size: 1rem; }
.hero > .hero-copy > .button { border-radius: 4px; }
.hero > .hero-copy > .button.alt { padding: 1rem 1.5rem; font-size: 1rem; }
.hero > .hero-copy > .button.hero-primary:hover, .hero > .hero-copy > .button.hero-primary:focus { color: var(--ink); background: var(--paper); border-color: var(--forest); }
.button.alt { color: var(--forest); background: transparent; border-color: var(--forest); }
.button:hover, .button:focus { color: var(--ink); background: var(--yellow); border-color: var(--yellow); }
.notice { margin: 2.2rem 0 0; padding: 1.3rem 1.5rem; background: var(--mint); border-left: 7px solid var(--green); }
.notice h2 { margin: 0 0 .3rem; color: var(--heading); font-family: "Poppins", Arial, sans-serif; font-size: 1.6rem; font-weight: 700; }
.notice p { margin: .35rem 0; }
.privacy-note { margin: 1rem 0 0; color: #b22222; }
.privacy-note strong { color: #b22222; font-weight: 800; }
.privacy-note span { font-weight: 900; }
.content-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2rem; margin-top: 2.5rem; }
.content-grid + .wide-panel { margin-top: 1rem; }
.content-panel { padding: 2rem; background: var(--paper); border-top: 6px solid var(--blue); }
.content-panel h2, .section-heading { margin-top: 0; color: var(--heading); font-family: "Poppins", Arial, sans-serif; font-size: 1.85rem; font-weight: 700; line-height: 1.15; }
.page-intro { max-width: 800px; margin-bottom: 2.5rem; }
.page-intro p { font-size: 1.12rem; }
.wide-panel { padding: clamp(1.5rem, 4vw, 3rem); background: var(--paper); }
.wide-panel + .wide-panel { margin-top: 2rem; }
.wide-panel h2 { color: var(--heading); font-family: "Poppins", Arial, sans-serif; font-size: 2rem; font-weight: 700; line-height: 1.15; }
.engagement-calendar { margin-top: 2rem; }
.engagement-calendar > p { margin: -.5rem 0 1.2rem; font-size: .9rem; }
.calendar-table-wrap { overflow-x: auto; border: 1px solid var(--line); }
.calendar-table { width: 100%; min-width: 760px; border-collapse: collapse; background: var(--paper); font-size: .9rem; line-height: 1.4; }
.calendar-table th, .calendar-table td { padding: .8rem .9rem; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.workshop-star { margin-right: .35rem; color: var(--yellow); font-size: .9em; }
.calendar-table thead th { color: var(--paper); background: var(--forest); font-weight: 700; }
.calendar-table tbody th { color: var(--ink); font-weight: 700; white-space: nowrap; }
.calendar-table tbody tr:nth-child(even) { background: #f2f7f8; }
.calendar-table tbody tr:last-child th, .calendar-table tbody tr:last-child td { border-bottom: 0; }
.feature-image { width: 100%; display: block; border: 1px solid var(--line); }
.caption { margin: .7rem 0 0; color: #657269; font-size: .84rem; }
.key-facts { margin: 1.5rem 0 0; padding: 0; list-style: none; }
.key-facts li { padding: .8rem 0; border-top: 1px solid var(--line); }
.key-facts strong { color: var(--ink); }
.timeline { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; margin-top: 1.5rem; }
.timeline-step { position: relative; min-height: 165px; padding: 1.3rem; background: var(--blue); border-right: 1px solid var(--paper); }
.timeline-step:nth-child(even) { background: var(--mint); }
.timeline-step strong { display: block; color: var(--heading); font-family: "Poppins", Arial, sans-serif; font-size: 1.35rem; font-weight: 700; }
.timeline-step span { display: block; margin-top: .5rem; font-size: .9rem; line-height: 1.4; }
.process-layout { display: grid; grid-template-columns: minmax(0, 2.1fr) minmax(260px, 0.9fr); align-items: start; gap: 2rem; }
.project-status h2 { margin: 0 0 1.25rem; color: var(--heading); font-family: "Poppins", Arial, sans-serif; font-size: 2rem; font-weight: 700; line-height: 1.15; }
.status-list { list-style: none; padding: 0; margin: 0; border-left: 4px solid var(--line); }
.status-list li { position: relative; margin: 0 0 1rem; padding: 1rem 1rem 1rem 1.25rem; background: #f4f8f9; border: 1px solid var(--line); border-left: 0; color: var(--copy); }
.status-list li::before { content: ""; position: absolute; left: -2.2rem; top: 1.2rem; width: 12px; height: 12px; background: var(--blue); border-radius: 50%; border: 3px solid var(--paper); box-shadow: 0 0 0 2px var(--line); }
.status-list li.current { background: var(--forest); border-color: var(--forest); color: var(--paper); }
.status-list li.current::before { background: var(--orange); box-shadow: 0 0 0 2px rgba(255,255,255,.3); }
.status-list li.current small { display: block; margin-top: .3rem; color: var(--blue); font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.status-label { display: block; font-weight: 700; line-height: 1.35; }
.project-resources { padding: 1.5rem; background: #edf6f8; border-top: 6px solid var(--orange); }
.project-resources h3 { margin: 0 0 .9rem; color: var(--heading); font-family: "Poppins", Arial, sans-serif; font-size: 1.4rem; font-weight: 700; }
.project-resources ul { margin: 0; padding-left: 1.15rem; }
.project-resources li + li { margin-top: .7rem; }
.project-resources a { color: var(--forest); font-weight: 700; }
.project-resources a:hover, .project-resources a:focus { color: var(--purple); }
.check-list { padding-left: 1.25rem; }
@media (max-width: 720px) { .process-layout { grid-template-columns: 1fr; } .project-resources { padding: 1.2rem; } }
.check-list li { margin: .55rem 0; }
.faq-list { background: var(--paper); }
.faq-list details { padding: 1.25rem 1.5rem; border-bottom: 1px solid var(--line); }
.faq-list summary { color: var(--heading); cursor: pointer; font-family: "Poppins", Arial, sans-serif; font-size: 1.25rem; font-weight: 700; }
.faq-list p { max-width: 800px; margin: 1rem 0 .2rem; }
.form-note { padding: 1.2rem 1.35rem; background: var(--mint); border-left: 5px solid var(--forest); }
.form-note p { margin: 0; }
.survey-form { max-width: 720px; margin-top: 1.5rem; }
.form-field { margin-bottom: 1.4rem; }
.form-label { display: block; margin-bottom: .45rem; color: var(--heading); font-weight: 700; }
.form-input { width: 100%; padding: .65rem .75rem; color: var(--copy); background: var(--paper); border: 1px solid var(--line); font-family: inherit; font-size: 1rem; }
.form-input:focus { outline: 3px solid var(--blue); outline-offset: 1px; }
textarea.form-input { resize: vertical; }
.interest-fieldset { min-width: 0; padding: 0; border: 0; }
.interest-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .55rem 1.25rem; }
.interest-option { display: flex; align-items: start; gap: .55rem; }
.interest-option input { flex: 0 0 auto; width: 1.15rem; height: 1.15rem; margin: .25rem 0 0; accent-color: var(--forest); }
.other-interest-field { margin-top: 1rem; }
.results-page .wide-panel + .wide-panel { margin-top: 2rem; }
.results-table-wrap { overflow-x: auto; border: 1px solid var(--line); }
.results-table { width: 100%; min-width: 900px; border-collapse: collapse; background: var(--paper); font-size: .88rem; line-height: 1.45; }
.results-table th, .results-table td { padding: .75rem; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.results-table thead th { color: var(--paper); background: var(--forest); }
.results-table tbody tr:nth-child(even) { background: #f2f7f8; }
.results-table tbody tr:last-child td { border-bottom: 0; }
.results-table td:last-child { min-width: 180px; white-space: pre-wrap; }
.required-flag { color: var(--purple); }
.site-footer { color: var(--paper); background: var(--ink); border-top: 5px solid var(--purple); }
.footer-inner { width: min(100% - 2.5rem, var(--max-width)); margin: 0 auto; padding: 2rem 0; font-size: .82rem; }
.footer-inner p { margin: 0; }
@media (max-width: 720px) { body { font-size: 16px; } .header-inner { min-height: 0; align-items: start; flex-direction: column; gap: .8rem; } .brand-lockup { align-items: start; } .site-logo { width: 108px; } .project-tag { text-align: left; } .hero, .content-grid { grid-template-columns: 1fr; } .hero-art { min-height: 250px; grid-row: 1; } .timeline { grid-template-columns: 1fr 1fr; } .interest-options { grid-template-columns: 1fr; } main { padding-top: 2rem; } }
@media (max-width: 460px) { .timeline { grid-template-columns: 1fr; } .timeline-step { min-height: 0; border-right: 0; border-bottom: 1px solid var(--paper); } }
