* { box-sizing: border-box; }
body { margin: 0; font-family: -apple-system, "Segoe UI", Roboto, sans-serif; background: #f0f1ec; color: #23262b; }

/* Pages that load Bootstrap (facilities, housing, etc.) get their navbar
   sized/faced by Bootstrap's own body{font:14px/1.42857143 "Helvetica
   Neue",...} reset, since w3.css's nav classes don't set their own
   typography — they just inherit. Profile pages have no Bootstrap, so
   body falls back to w3.css's own Verdana default and the nav would
   otherwise look larger and in a different typeface than every other
   page. All three properties pinned to match exactly. */
.w3-bar-item { font-size: 14px; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; line-height: 1.42857143; }

.page { max-width: 760px; margin: 20px auto 40px; background: #eaece6; border: 1px solid #c7cbbf; border-radius: 8px; overflow: hidden; }
.breadcrumb { padding: 12px 24px 0; font-size: 12px; color: #565a52; }
.breadcrumb a { color: #565a52; }

.p-header { padding: 22px 24px 20px; border-bottom: 2px solid #1b2a3d; }
.p-header h1 { font-family: Georgia, "Iowan Old Style", "Times New Roman", serif; font-size: 30px; color: #1b2a3d; margin: 0 0 6px; }
.p-header .thesis { font-size: 14px; color: #565a52; max-width: 56ch; line-height: 1.5; margin: 0 0 16px; }
.p-stats { display: flex; gap: 18px; flex-wrap: wrap; }
.p-stat { font-size: 12px; color: #565a52; }
.p-stat b { color: #23262b; font-size: 14px; display: block; }

.p-note { margin: 18px 24px 0; background: #fff; border: 1px solid #c7cbbf; border-radius: 6px; padding: 12px 16px; font-size: 12px; color: #565a52; line-height: 1.6; }

.p-section { padding: 26px 24px 4px; }
.p-section h2 { font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: #b34a1f; font-weight: 700; margin: 0 0 14px; }

.ev-card { background: #f5f6f1; border: 1px solid #c7cbbf; border-radius: 8px; padding: 16px 18px; margin-bottom: 14px; }
.ev-top { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; flex-wrap: wrap; margin-bottom: 8px; }
.ev-title { font-size: 14px; font-weight: 600; color: #23262b; }
.ev-title a { color: #1b2a3d; text-decoration: none; }
.ev-title a:hover { text-decoration: underline; }
.ev-date { font-size: 12px; color: #565a52; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ev-tags { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 8px; }
.ev-tag { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; padding: 3px 8px; border-radius: 999px; background: #f1ddd2; color: #b34a1f; }
.ev-tag.source-doc { background: #dde7de; color: #3f6b52; }
.ev-desc { font-size: 13px; line-height: 1.65; color: #23262b; }
.ev-desc blockquote { margin: 8px 0 0; padding-left: 12px; border-left: 3px solid #c7cbbf; font-style: italic; color: #565a52; }
.ev-source { margin-top: 10px; font-size: 12px; }
.ev-source a { color: #b34a1f; font-weight: 600; text-decoration: none; }

.as-reported { display: inline-block; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: #565a52; border: 1px solid #c7cbbf; padding: 2px 7px; border-radius: 999px; margin-left: 6px; }

.media-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; }
.media-card { background: #f5f6f1; border: 1px solid #c7cbbf; border-radius: 8px; overflow: hidden; }
.media-thumb { aspect-ratio: 4/3; background: #d7dad0; display: block; overflow: hidden; }
.media-thumb img { width: 100%; height: 100%; object-fit: cover; object-position: top; display: block; }
.media-thumb a { display: block; width: 100%; height: 100%; }
.media-caption { padding: 8px 10px; font-size: 11px; color: #23262b; line-height: 1.4; }
.media-caption .who { font-weight: 600; }
.media-summary { color: #565a52; display: block; margin-top: 3px; }

.doc-card { display: flex; align-items: center; gap: 12px; background: #fff; border: 1px solid #c7cbbf; border-radius: 6px; padding: 10px 14px; margin-bottom: 10px; }
.doc-card a { text-decoration: none; }
.doc-icon { width: 32px; height: 32px; border-radius: 4px; background: #dde7de; color: #3f6b52; display: flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 700; flex-shrink: 0; }
.doc-name { font-size: 13px; font-weight: 600; color: #23262b; }
.doc-meta { font-size: 11px; color: #565a52; }

.p-links { list-style: none; padding: 0; margin: 0; }
.p-links li { padding: 8px 0; border-top: 1px solid #c7cbbf; font-size: 13px; }
.p-links li:first-child { border-top: none; }
.p-links a { color: #b34a1f; text-decoration: none; }

.p-cta-wrap { margin: 30px 24px 26px; }
.p-cta-toggle { width: 100%; background: #1b2a3d; color: #f5f6f1; border: none; padding: 14px 20px; border-radius: 8px; font-size: 13px; font-weight: 600; cursor: pointer; display: flex; justify-content: space-between; align-items: center; text-align: left; }
.p-cta-toggle .icon { transition: transform 0.15s ease; }
.p-cta-toggle[aria-expanded="true"] .icon { transform: rotate(45deg); }
.p-cta-form { background: #fff; border: 1px solid #c7cbbf; border-top: none; border-radius: 0 0 8px 8px; padding: 20px 22px 22px; display: none; }
.p-cta-form.open { display: block; }
.p-cta-form .hint { font-size: 12px; color: #565a52; margin: 0 0 16px; line-height: 1.55; }
.p-cta-form .field { margin-bottom: 13px; }
.p-cta-form label { display: block; font-size: 11px; text-transform: uppercase; letter-spacing: 0.04em; color: #565a52; margin-bottom: 4px; }
.p-cta-form input[type=text], .p-cta-form input[type=email], .p-cta-form input[type=url], .p-cta-form select, .p-cta-form textarea { width: 100%; padding: 8px 10px; border: 1px solid #c7cbbf; border-radius: 4px; font-size: 13px; font-family: inherit; box-sizing: border-box; }
.p-cta-form input.locked { background: #f5f6f1; color: #565a52; }
.p-cta-form textarea { min-height: 80px; resize: vertical; }
.p-cta-form .optional-tag { color: #565a52; font-weight: 400; text-transform: none; letter-spacing: 0; }
.p-cta-form input[type=file] { width: 100%; font-size: 12px; }
.p-cta-form button.submit { background: #b34a1f; color: #fff; border: none; padding: 10px 22px; border-radius: 6px; font-size: 13px; font-weight: 600; cursor: pointer; }
.p-cta-form .privacy-note { font-size: 11px; color: #565a52; margin-top: 10px; line-height: 1.5; }
.hp-field { position: absolute; left: -9999px; }

.p-banner { margin: 18px 24px 0; background: #dde7de; color: #3f6b52; border: 1px solid #b9cdbd; border-radius: 6px; padding: 12px 16px; font-size: 13px; }
.p-banner.error { background: #f1ddd2; color: #b34a1f; border-color: #e0bba4; }

/* Profiles index page */
.idx-wrap { max-width: 900px; margin: 0 auto; padding: 0 20px; }

.profiles-hero { background: #1b2a3d; padding: 40px 0 34px; margin-bottom: 28px; }
.profiles-hero h1 { font-family: Georgia, "Iowan Old Style", "Times New Roman", serif; font-size: 34px; color: #f5f6f1; margin: 0 0 10px; }
.profiles-hero .lede { font-size: 15px; line-height: 1.6; color: #c7cfda; max-width: 62ch; margin: 0; }

.idx-note { background: #f5f6f1; border: 1px solid #c7cbbf; border-radius: 8px; padding: 16px 20px; font-size: 13px; line-height: 1.65; color: #565a52; margin: 0 0 32px; }
.idx-note b { color: #23262b; }

.idx-label { font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: #b34a1f; font-weight: 700; margin: 0 0 16px; }

.profile-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 16px; margin-bottom: 40px; }

.p-card { background: #f5f6f1; border: 1px solid #c7cbbf; border-radius: 10px; padding: 20px 20px 18px; text-decoration: none; color: inherit; display: flex; flex-direction: column; transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease; }
.p-card:hover { background: #fff; transform: translateY(-2px); box-shadow: 0 8px 20px rgba(27,42,61,0.12); }

.p-kind { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: #3f6b52; background: #dde7de; align-self: flex-start; padding: 3px 9px; border-radius: 999px; margin-bottom: 12px; }

.p-card h3 { font-family: Georgia, "Iowan Old Style", "Times New Roman", serif; font-size: 21px; color: #1b2a3d; margin: 0 0 8px; }
.p-card .desc { font-size: 13px; line-height: 1.6; color: #565a52; margin: 0 0 16px; flex-grow: 1; }

.p-card .stats { display: flex; gap: 16px; margin-bottom: 14px; }
.p-card .stat { font-size: 11px; color: #565a52; }
.p-card .stat b { display: block; font-size: 15px; color: #23262b; font-variant-numeric: tabular-nums; }

.p-card .tags { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 16px; }

.p-card .view { font-size: 12px; font-weight: 600; color: #b34a1f; margin-top: auto; }
.p-card .view .arrow { display: inline-block; transition: transform 0.15s ease; }
.p-card:hover .view .arrow { transform: translateX(3px); }

.p-card.pending { border-style: dashed; align-items: flex-start; justify-content: center; min-height: 190px; cursor: default; }
.p-card.pending:hover { transform: none; box-shadow: none; background: #f5f6f1; }
.p-card.pending .p-kind { background: transparent; color: #565a52; border: 1px dashed #c7cbbf; }
.p-card.pending h3 { color: #565a52; font-size: 17px; }
.p-card.pending .desc { margin-bottom: 0; }

/* Grid-card entry point into the general "blow the whistle" tip form below */
.p-card.whistle { background: #1b2a3d; border-color: #1b2a3d; cursor: pointer; justify-content: center; min-height: 190px; }
.p-card.whistle:hover { background: #24334a; }
.p-card.whistle .p-kind { background: rgba(255,255,255,0.12); color: #f5f6f1; }
.p-card.whistle h3 { color: #f5f6f1; }
.p-card.whistle .desc { color: #c7cfda; margin-bottom: 16px; }
.p-card.whistle .view { color: #f0a374; }
