/* Plain CSS. The content and forms work without JavaScript. */
:root { color-scheme: light; --paper: #f8f7f0; --ink: #253d35; --muted: #59625b; --line: #c9cdc1; --green: #285543; --wash: #e9eddf; --error: #9a3029; }
* { box-sizing: border-box; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-size: 1.1875rem; line-height: 1.6; }
a { color: var(--green); text-underline-offset: .22em; text-decoration-thickness: 1px; }
a:hover { text-decoration-thickness: 2px; }
a, button, input, textarea, select { touch-action: manipulation; }
:focus-visible { outline: 3px solid #ad4c25; outline-offset: 5px; }
.wrap { width: min(1120px, calc(100% - 96px)); margin-inline: auto; }
.narrow { max-width: 720px; margin-inline: auto; }
p { margin: 0 0 1.2em; }
h1, h2, h3 { font-weight: 400; line-height: 1.12; margin: 0 0 .6em; text-wrap: balance; }
h1, h2 { font-family: Georgia, "Times New Roman", serif; letter-spacing: -.045em; }
h1 { font-size: clamp(3rem, 6.6vw, 5.4rem); }
h1 em { font-weight: 400; }
h2 { font-size: clamp(2.2rem, 3.6vw, 3.25rem); }
h3 { font-size: 1.3rem; line-height: 1.35; font-weight: 600; letter-spacing: -.02em; }
.site-header { min-height: 120px; display: flex; gap: 24px; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); }
.wordmark { display: inline-flex; align-items: center; gap: 14px; color: var(--ink); text-decoration: none; font-size: 1.1rem; font-weight: 600; letter-spacing: -.025em; }
.brand-mark { display: inline-flex; width: 44px; height: 44px; border-radius: 50%; background: var(--green); color: var(--paper); align-items: center; justify-content: center; font-family: Georgia, serif; font-size: 1.6rem; font-weight: 400; padding-bottom: 4px; }
.pilot-label, .eyebrow, .small-note, .hint { color: var(--muted); font-size: 1rem; }
.pilot-label { text-align: right; }
.eyebrow { letter-spacing: .09em; text-transform: uppercase; font-size: .875rem; font-weight: 600; margin-bottom: 22px; }
.intro { font-size: 1.5rem; line-height: 1.5; max-width: 720px; }
.actions { display: flex; flex-wrap: wrap; gap: 16px 28px; align-items: center; margin: 30px 0 20px; }
.button { display: inline-block; font: inherit; font-weight: 500; text-decoration: none; text-align: center; padding: 14px 24px; min-height: 54px; border: 1px solid var(--green); border-radius: 4px; background: var(--green); color: #fff; cursor: pointer; }
.button:hover { background: #193b2d; text-decoration: none; }
.button.secondary { color: var(--green); background: transparent; }
.button.secondary:hover { background: var(--wash); }
.prose p { max-width: 65ch; }
.prose h2 { font-size: 2rem; margin-top: 1.5em; }
.how-section { padding: 64px 0 72px; border-top: 1px solid var(--line); }
.steps { margin: 45px 0 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(3, 1fr); gap: 36px; counter-reset: steps; }
.steps li { counter-increment: steps; }
.steps li::before { content: "0" counter(steps); display: block; color: var(--muted); font-family: Georgia, serif; font-size: 1.75rem; margin-bottom: 22px; }
.steps p { margin: 0; }
.closing { padding: 48px; background: var(--wash); border-radius: 4px; margin-bottom: 72px; }
.closing p { max-width: 720px; }
.closing .actions { margin-bottom: 0; }
.site-footer { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 16px; padding: 30px 0 40px; border-top: 1px solid var(--line); font-size: 1rem; color: var(--muted); }
.site-footer p { margin: 0; }
.page-intro { padding: 70px 0; }
.page-intro.compact { padding: 35px 0; }
.form-page { padding-bottom: 72px; }
.back-link { font-size: 1rem; margin: 32px 0 0; }
fieldset { border: 0; border-top: 1px solid var(--line); padding: 32px 0 12px; margin: 28px 0 0; min-width: 0; }
legend { font-size: 1.35rem; font-weight: 600; padding: 0 18px 0 0; }
.section-number { font-weight: 400; color: var(--muted); margin-right: 12px; font-family: Georgia, serif; }
.field { margin-bottom: 30px; }
label { display: block; font-weight: 500; margin-bottom: 8px; }
.hint { margin-bottom: 10px; line-height: 1.5; }
input:not([type=submit], [type=checkbox], [type=radio]), textarea, select { display: block; width: 100%; font: inherit; color: var(--ink); background: #fffef9; border: 1px solid #7b877a; border-radius: 3px; padding: 12px 14px; min-height: 54px; }
textarea { resize: vertical; }
select { white-space: normal; }
[aria-invalid=true] { border-color: var(--error) !important; border-width: 2px !important; }
.consent { display: grid; grid-template-columns: 25px 1fr; gap: 8px 14px; margin: 18px 0; }
.consent input { width: 23px; height: 23px; margin: 5px 0 0; accent-color: var(--green); }
.consent label { font-weight: 400; }
.consent .field-error { grid-column: 2; }
.honeypot { display: none; }
.field-error { font-size: 1rem; color: var(--error); margin: 8px 0 0; }
.error-summary { border: 2px solid var(--error); padding: 24px; margin-bottom: 30px; }
.error-summary h2 { font-size: 2rem; }
.error-summary a { color: var(--error); }
.notice { margin-top: 24px; padding: 18px; background: var(--wash); }
.skip-link { position: absolute; left: 16px; top: -200px; background: white; padding: 12px; z-index: 10; }
.skip-link:focus { top: 16px; }
.filters { display: flex; flex-wrap: wrap; gap: 20px; align-items: end; margin-bottom: 28px; }
.filters > div { flex: 1; min-width: 220px; }
.application-list { padding: 0; list-style: none; }
.application-list li { border-top: 1px solid var(--line); padding: 28px 0; display: flex; justify-content: space-between; align-items: start; gap: 24px; }
.application-list .eyebrow { margin-bottom: 10px; }
.application-list h2 { font-size: 2rem; overflow-wrap: anywhere; }
.application-list p { margin-bottom: 0; }
.status { display: inline-block; background: var(--wash); font-size: 1rem; padding: 5px 12px; border-radius: 4px; white-space: nowrap; }
.answers { margin: 0 0 48px; }
.answers dt { font-weight: 600; border-top: 1px solid var(--line); padding-top: 22px; margin-top: 22px; }
.answers dd { margin: 8px 0 0; overflow-wrap: anywhere; }
.answers p { margin-bottom: .7em; }
.review { padding: 30px 0 60px; border-top: 1px solid var(--line); }
.empty-state { padding: 40px 0; border-block: 1px solid var(--line); }
@media (max-width: 760px) {
  .wrap { width: calc(100% - 40px); }
  .site-header { min-height: 90px; }
  .pilot-label { max-width: 145px; font-size: .875rem; }
  .wordmark { font-size: 1rem; gap: 8px; }
  .brand-mark { width: 36px; height: 36px; font-size: 1.35rem; flex-shrink: 0; }
  .intro { font-size: 1.3rem; }
  .steps { grid-template-columns: 1fr; gap: 32px; }
  .steps li::before { margin-bottom: 10px; }
  .how-section { padding: 40px 0; }
  .closing { padding: 28px 24px; margin-bottom: 40px; }
  .application-list li { flex-direction: column; gap: 12px; }
  .page-intro { padding: 44px 0; }
}
@media (max-width: 380px) {
  .pilot-label { display: none; }
  h1 { font-size: 2.65rem; }
  .actions .button { width: 100%; }
}

/* The home page opens like a practical invitation, with two equal ways in. */
.home-header { min-height: 102px; border-bottom: 2px solid #28312f; }
.home-header .wordmark { color: #28312f; font-size: 1.5rem; font-weight: 700; letter-spacing: -.055em; }
.home-header .brand-mark { display: none; }
.home-header .pilot-label { color: #515b56; }
.home-opening { color: #28312f; display: grid; grid-template-columns: 1fr 1.15fr; gap: 100px; padding: 52px 0 64px; }
.opening-label { font-size: 1rem; margin-bottom: 24px; color: #515b56; }
.home-opening h1 { font-family: inherit; font-size: clamp(2rem, 3.2vw, 2.75rem); font-weight: 650; letter-spacing: -.045em; line-height: 1.12; text-wrap: initial; margin-bottom: 28px; }
.opening-context > p:not(.opening-label) { max-width: 38ch; }
.opening-note { font-size: 1rem; color: #515b56; padding-top: 20px; margin-bottom: 0; }
.opening-invitation { padding-top: 46px; }
.opening-questions { font-size: clamp(1.75rem, 2.8vw, 2.3rem); line-height: 1.25; letter-spacing: -.035em; margin-bottom: 38px; }
.opening-questions span { display: block; margin-bottom: 12px; }
.opening-links { border-top: 1px solid #87918a; }
.opening-links a { color: #2347a0; display: flex; align-items: baseline; justify-content: space-between; gap: 20px; padding: 18px 0; border-bottom: 1px solid #87918a; text-decoration: none; font-size: 1.25rem; }
.opening-links a:hover span:first-child { text-decoration: underline; text-underline-offset: .22em; }
.opening-links a > span:last-child { font-size: 1.5rem; }
.home-purpose { display: grid; grid-template-columns: 1fr 1.15fr; gap: 100px; color: #28312f; padding: 44px 0 52px; border-top: 2px solid #28312f; }
.home-purpose h2 { font-family: inherit; font-size: clamp(1.75rem, 2.8vw, 2.3rem); font-weight: 650; letter-spacing: -.04em; line-height: 1.15; }
.home-purpose .prose { padding-top: 46px; }
@media (max-width: 900px) {
  .home-opening, .home-purpose { gap: 48px; }
}
@media (max-width: 650px) {
  .home-header { min-height: 90px; gap: 20px; }
  .home-header .wordmark { font-size: 1.25rem; letter-spacing: -.045em; }
  .home-header .pilot-label { max-width: 130px; }
  .home-opening, .home-purpose { grid-template-columns: 1fr; gap: 34px; }
  .home-opening { padding: 32px 0 42px; }
  .home-opening h1 { font-size: 2.1rem; }
  .opening-label { margin-bottom: 20px; }
  .opening-note { padding-top: 0; }
  .opening-invitation, .home-purpose .prose { padding-top: 0; }
  .opening-questions { font-size: 1.75rem; margin-bottom: 28px; }
  .home-purpose { padding: 32px 0; gap: 12px; }
}

.about-page { padding: 52px 0 72px; }
.about-page h1 { font-family: inherit; font-size: clamp(2rem, 4vw, 3rem); font-weight: 650; margin-bottom: 36px; }
.about-page p { max-width: 65ch; }
.about-page .opening-links { margin-top: 36px; }
.campaign-opening { padding-top: 64px; }
.campaign-opening .opening-invitation { padding-top: 0; }
.campaign-opening .opening-questions { font-size: clamp(1.4rem, 2.2vw, 1.85rem); margin-top: 36px; }
.join-heading { font-family: inherit; font-size: 1.3rem; font-weight: 600; letter-spacing: -.02em; line-height: 1.4; margin: 32px 0 20px; }
@media (max-width: 650px) {
  .campaign-opening { padding-top: 32px; gap: 12px; }
}

/* Profile choices stay readable and usable without JavaScript. */
.check-choice { display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: 12px; padding: 10px 0; }
.check-choice input { width: 22px; height: 22px; margin: 5px 0 0; accent-color: var(--green); }
.check-choice label { font-weight: 400; margin: 0; overflow-wrap: anywhere; }
summary { cursor: pointer; padding: 16px 0; font-weight: 600; }
.sdg-goal, .optional-section { border-bottom: 1px solid var(--line); }
.sdg-goal .check-choice { padding: 14px 0; }
.repeat-entry { border-left: 2px solid var(--line); padding: 20px; margin-bottom: 24px; }
.repeat-entry legend { font-size: 1.1rem; }
.add-hint { margin-top: 12px; }
.feeling-choices { display: flex; flex-wrap: wrap; gap: 12px; }
.feeling-choices label { display: inline-flex; align-items: center; gap: 10px; padding: 12px; border: 1px solid var(--line); border-radius: 24px; }
input[type=radio] { width: 22px; height: 22px; accent-color: var(--green); }
.answers ul { padding-left: 24px; }
.feeling-choice { display: flex; align-items: center; gap: 8px; }
.feeling-choice label { margin: 0; }
.optional-sections { margin: 40px 0; }

.public-profile { padding: 60px 0 72px; overflow-wrap: anywhere; }
.profile-opening { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; padding-bottom: 52px; border-bottom: 2px solid var(--ink); }
.profile-opening h1 { font-size: clamp(3rem, 5.5vw, 4.7rem); }
.profile-location { color: var(--muted); font-size: 1rem; margin-bottom: 12px; }
.profile-website { font-size: 1rem; }
.profile-purpose { background: var(--wash); padding: 30px; align-self: start; }
.public-profile h2 { font-family: inherit; font-size: 1.25rem; font-weight: 600; letter-spacing: -.025em; line-height: 1.3; }
.profile-purpose p { font-family: Georgia, serif; font-size: 1.9rem; line-height: 1.3; margin-bottom: 0; }
.profile-body { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 72px; padding-top: 36px; }
.profile-section { margin-bottom: 36px; }
.profile-section p:last-child { margin-bottom: 0; }
.profile-evidence { padding: 24px; border: 1px solid var(--line); margin-top: 16px; }
.profile-evidence h4 { font-size: 1rem; font-weight: 600; margin: 24px 0 8px; }
.portfolio-figure { margin: 20px 0; }
.portfolio-image { display: block; width: 100%; max-height: 480px; object-fit: contain; background: var(--wash); }
.portfolio-figure figcaption { font-size: .9rem; color: var(--muted); margin-top: 8px; }
.project-role { margin-bottom: 8px; }
.project-story { border-top: 1px solid var(--line); margin-top: 20px; }
input[type=file] { max-width: 100%; font-size: 1rem; }
.profile-tags { display: flex; flex-wrap: wrap; gap: 8px; padding: 0; list-style: none; }
.profile-tags li { font-size: .95rem; padding: 5px 12px; border: 1px solid var(--line); border-radius: 3px; }
.profile-targets { border-top: 2px solid var(--ink); padding-top: 36px; margin: 12px 0 0; }
.profile-targets .eyebrow { margin-bottom: 12px; }
.profile-goals { max-width: 820px; }
.profile-goals li { margin: 0 0 18px; font-size: 1rem; }
@media (max-width: 760px) {
  .public-profile { padding-top: 32px; }
  .profile-opening, .profile-body { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .profile-opening { padding-bottom: 32px; }
  .profile-purpose { padding: 24px; }
  .profile-body { gap: 0; }
}

.profile-main { min-width: 0; }
.skill-carousel { display: flex; gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; padding: 6px 6px 14px; margin-inline: -6px; }
.skill-card { flex: 0 0 100%; min-width: 0; border: 1px solid var(--line); padding: 24px; scroll-snap-align: start; scroll-margin-top: 24px; display: flex; flex-direction: column; }
.skill-carousel.has-many .skill-card { flex-basis: 88%; }
.skill-card h3 a { color: var(--ink); text-decoration: none; }
.skill-card h3 a:hover { text-decoration: underline; }
.skill-preview { font-size: 1.05rem; }
.skill-read-more { margin-top: auto; font-size: 1rem; align-self: start; }
.skill-controls { display: grid; grid-template-columns: 44px 1fr 44px; align-items: center; text-align: center; border-top: 1px solid var(--line); margin-top: 20px; padding-top: 12px; }
.skill-controls a { display: grid; place-items: center; min-height: 44px; text-decoration: none; border: 1px solid var(--line); }
.skill-detail { padding-bottom: 64px; overflow-wrap: anywhere; }
.skill-detail h1 { font-size: clamp(2.5rem, 6vw, 4rem); }
.skill-detail-navigation { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 24px; border-top: 1px solid var(--line); padding-top: 24px; margin-top: 40px; font-size: 1rem; }
.project-thumbnail { height: 180px; margin-bottom: 20px; }
.project-detail .portfolio-image { max-height: 600px; }

.quiz-page { padding: 40px 0 64px; }
.quiz-page h1 { font-size: clamp(2.5rem, 5vw, 3.7rem); }
.quiz-progress { display: flex; flex-wrap: wrap; gap: 12px 24px; margin-bottom: 36px; font-size: .95rem; color: var(--muted); }
.quiz-progress [aria-current] { color: var(--ink); font-weight: 650; border-bottom: 2px solid var(--green); }
.quiz-topics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-bottom: 24px; }
.quiz-choice { border: 1px solid var(--line); padding: 16px; }
.quiz-choice:has(input:checked) { background: var(--wash); border-color: var(--green); }
.quiz-target { border-bottom: 1px solid var(--line); padding: 8px 0; }
.quiz-target details { margin-left: 36px; }
.quiz-target summary, .quiz-answer summary { font-size: .95rem; font-weight: 400; padding: 8px 0; }
.quiz-target details p, .quiz-answer details p { font-size: 1rem; }
.quiz-answer { border: 1px solid var(--line); padding: 24px; margin: 20px 0; }
.quiz-answer .eyebrow { margin-bottom: 12px; }
.quiz-footnote { margin-top: 28px; }
@media (max-width: 600px) { .quiz-topics { grid-template-columns: minmax(0, 1fr); } }

.quiz-wizard { max-width: 680px; }
.quiz-wizard h1 { font-size: clamp(2rem, 4vw, 2.8rem); }
.quiz-wizard progress { width: 100%; height: 6px; accent-color: var(--green); display: block; margin: 0 0 24px; }
.wizard-options { border: 0; padding: 0; margin-top: 20px; }
.wizard-options legend { margin-bottom: 12px; }
.wizard-option { display: flex; align-items: center; gap: 14px; padding: 16px; border: 1px solid var(--line); cursor: pointer; font-size: 1.05rem; font-weight: 400; line-height: 1.4; margin-bottom: 10px; }
.wizard-option input, .wizard-skip input { flex-shrink: 0; margin: 0; }
.wizard-option:has(input:checked) { background: var(--wash); border-color: var(--green); }
.wizard-skip { display: flex; align-items: center; gap: 14px; font-size: .95rem; font-weight: 400; padding: 10px 16px; cursor: pointer; }
.quiz-reasons { font-size: 1rem; padding-left: 22px; }
.quiz-restart { background: none; border: 0; color: var(--green); text-decoration: underline; font: inherit; cursor: pointer; padding: 0; }
@media (max-width: 600px) {
  .quiz-wizard { padding-top: 24px; }
  .quiz-wizard .eyebrow { margin-bottom: 12px; }
  .quiz-wizard h1 { font-size: 1.7rem; }
  .quiz-wizard progress { margin-bottom: 16px; }
  .wizard-options { margin-top: 16px; }
  .wizard-option { padding: 12px; font-size: 1rem; }
  .quiz-wizard .actions { margin-top: 16px; }
}

/* Shared SDG reference pages. */
.site-header nav { display: flex; flex-wrap: wrap; gap: 12px 24px; font-size: 1rem; }
.sdg-directory { padding-bottom: 56px; overflow-wrap: anywhere; }
.sdg-intro { padding: 48px 0 24px; }
.sdg-intro h1 { font-size: clamp(2.6rem, 5vw, 4.3rem); }
.sdg-intro .intro { font-size: 1.3rem; }
.sdg-search { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) auto; gap: 16px; align-items: end; padding: 24px; background: var(--wash); }
.sdg-search label { font-size: 1rem; }
.sdg-search input, .sdg-search select { font-size: 1rem; }
.sdg-prompts, .sdg-pagination, .sdg-results-heading { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; margin: 28px 0; font-size: 1rem; }
.sdg-results-heading { justify-content: space-between; }
.sdg-section-title, .sdg-results-heading h2 { font-family: inherit; font-size: 1.5rem; font-weight: 600; letter-spacing: -.025em; }
.sdg-section-title { margin: 40px 0 24px; }
.sdg-goal-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.sdg-goal-card { padding: 24px; border: 1px solid var(--line); border-top: 5px solid var(--sdg-color); }
.sdg-goal-card h2 { font-family: inherit; font-size: 1.5rem; font-weight: 600; line-height: 1.25; letter-spacing: -.025em; }
.sdg-goal-card p, .sdg-target-card p { font-size: 1rem; }
.sdg-goal-card p:last-child, .sdg-target-card p:last-child { margin-bottom: 0; }
.sdg-goal-card .eyebrow, .sdg-target-card .eyebrow { font-size: .8rem; margin-bottom: 16px; }
.sdg-target-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.sdg-target-card { padding: 24px; border: 1px solid var(--line); }
.sdg-goal-opening { border-bottom: 5px solid var(--sdg-color); margin-bottom: 32px; }
.sdg-source { margin-top: 48px; border-top: 1px solid var(--line); padding-top: 24px; color: var(--muted); max-width: 820px; }
.sdg-source h2, .sdg-context h2, .sdg-full-target h2 { font-family: inherit; font-size: 1.15rem; letter-spacing: 0; font-weight: 600; }
.sdg-source p { font-size: .95rem; }
.sdg-full-target { padding: 28px; background: var(--wash); margin-bottom: 36px; }
.sdg-full-target p { margin-bottom: 0; }
.sdg-context { margin-bottom: 32px; }
.sdg-pagination { border-top: 1px solid var(--line); padding-top: 24px; justify-content: space-between; }
@media (max-width: 900px) { .sdg-goal-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .sdg-search { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 600px) {
  .sdg-goal-grid, .sdg-target-grid { grid-template-columns: minmax(0, 1fr); }
  .sdg-intro { padding-top: 32px; }
  .sdg-search, .sdg-full-target { padding: 20px; }
  .site-header nav { gap: 12px; }
}
.sdg-color-1 { --sdg-color: #e5243b; }
.sdg-color-2 { --sdg-color: #dda63a; }
.sdg-color-3 { --sdg-color: #4c9f38; }
.sdg-color-4 { --sdg-color: #c5192d; }
.sdg-color-5 { --sdg-color: #ff3a21; }
.sdg-color-6 { --sdg-color: #26bde2; }
.sdg-color-7 { --sdg-color: #fcc30b; }
.sdg-color-8 { --sdg-color: #a21942; }
.sdg-color-9 { --sdg-color: #fd6925; }
.sdg-color-10 { --sdg-color: #dd1367; }
.sdg-color-11 { --sdg-color: #fd9d24; }
.sdg-color-12 { --sdg-color: #bf8b2e; }
.sdg-color-13 { --sdg-color: #3f7e44; }
.sdg-color-14 { --sdg-color: #0a97d9; }
.sdg-color-15 { --sdg-color: #56c02b; }
.sdg-color-16 { --sdg-color: #00689d; }
.sdg-color-17 { --sdg-color: #19486a; }

.quiz-next-steps { border-top: 1px solid var(--line); margin-top: 36px; padding-top: 28px; }
.quiz-next-steps h2 { font-size: 2rem; }
.next-step-options { display: grid; gap: 12px; }
.next-step-option { display: flex; border: 1px solid var(--green); padding: 20px; text-decoration: none; }
.next-step-option:hover { background: var(--wash); }
.next-step-option strong { display: block; margin-bottom: 6px; }
.next-step-option span { display: block; font-size: 1rem; color: var(--muted); }
.contact-heading { margin-top: 28px; }

.directory-filters { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; align-items: end; margin: 2rem 0; }
.directory-filters .field { margin: 0; min-width: 0; }
.directory-filters select { width: 100%; }
.directory-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; }
.directory-card { border: 1px solid #d8ddd5; border-radius: 12px; padding: 1.5rem; overflow-wrap: anywhere; }
.directory-card h2 { margin-top: 0; }
.directory-invitation { padding: 3rem 0; }
.site-header nav { flex-wrap: wrap; }
@media (max-width: 600px) { .directory-filters, .directory-grid { grid-template-columns: 1fr; } }

.dashboard-heading { margin: 2.5rem 0; }
.dashboard-heading h1 { font-size: clamp(2.5rem, 5vw, 4rem); overflow-wrap: anywhere; }
.dashboard-columns { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 3rem; align-items: start; }
.dashboard-quiz { background: var(--wash); border: 1px solid var(--line); border-radius: 12px; padding: clamp(1.5rem, 3vw, 2.5rem); }
.dashboard-columns h2 { font-size: clamp(2rem, 3.2vw, 2.8rem); }
.dashboard-directories { padding-top: 1.5rem; min-width: 0; }
.dashboard-directory-links { list-style: none; margin: 1.5rem 0 0; padding: 0; }
.dashboard-directory-links li { border-top: 1px solid var(--line); padding: 1.25rem 0; }
.dashboard-directory-links h3 { margin-bottom: .35rem; }
.dashboard-directory-links p { color: var(--muted); font-size: 1rem; margin: 0; }
.dashboard-priorities { padding-left: 1.25rem; margin: 1.5rem 0; }
.dashboard-priorities li + li { margin-top: .75rem; }
.dashboard-retake { font-size: 1rem; margin: 1.5rem 0 0; }
.dashboard-signup { margin-top: 1.5rem; font-size: 1rem; }
.dashboard-footer { margin-top: 2.5rem; }
@media (max-width: 760px) {
  .dashboard-columns { grid-template-columns: 1fr; gap: 1.5rem; }
  .dashboard-directories { padding-top: 0; }
  .dashboard-quiz .button { width: 100%; }
}

/* The alternate homepage is an isolated graphic design experiment. */
.bauhaus-page { --paper: #f2eee3; --ink: #20211f; --green: #20211f; --muted: #53534e; --line: #20211f; background: var(--paper); color: var(--ink); font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; }
.bauhaus-page .wrap { width: min(1320px, calc(100% - 96px)); }
.bauhaus-page .site-header { min-height: 106px; border-bottom: 2px solid var(--ink); }
.bauhaus-page .wordmark { font-size: 1.65rem; letter-spacing: -.065em; gap: 12px; }
.bauhaus-page .wordmark::before { content: ""; width: 24px; height: 24px; background: #e74b32; border-radius: 50% 50% 0 50%; }
.bauhaus-page .site-header nav { display: flex; gap: 30px; font-size: .9rem; }
.bauhaus-page .site-header nav a { color: var(--ink); text-decoration: none; }
.bauhaus-page .site-header nav a:hover { text-decoration: underline; }
.bauhaus-page h1, .bauhaus-page h2 { font-family: inherit; font-weight: 700; text-wrap: initial; }
.bauhaus-hero { display: grid; grid-template-columns: 1.15fr 1fr; align-items: center; gap: 32px; padding: 54px 0 48px; }
.bauhaus-kicker { font-size: .72rem; font-weight: 600; letter-spacing: .09em; text-transform: uppercase; line-height: 1.5; margin-bottom: 28px; }
.bauhaus-message .bauhaus-kicker { display: flex; align-items: center; gap: 10px; }
.bauhaus-message .bauhaus-kicker > span { width: 9px; height: 9px; background: #2d50bd; flex-shrink: 0; }
.bauhaus-hero h1 { font-size: clamp(3.2rem, 5.65vw, 5.4rem); line-height: .99; letter-spacing: -.065em; margin-bottom: 28px; }
.bauhaus-hero h1 span { color: #c33824; }
.bauhaus-intro { max-width: 37ch; font-size: 1.05rem; line-height: 1.65; margin-bottom: 26px; }
.bauhaus-jump { display: inline-flex; align-items: center; gap: 44px; padding: 13px 20px; background: var(--ink); color: var(--paper); font-size: .9rem; text-decoration: none; }
.bauhaus-jump span { font-size: 1.4rem; }
.bauhaus-jump:hover { background: #2d50bd; }
.bauhaus-art svg { display: block; width: 100%; height: auto; }
.bauhaus-art p { font-size: .68rem; letter-spacing: .035em; text-align: center; margin: 0; }
.bauhaus-join { border-top: 2px solid var(--ink); padding: 48px 0; display: grid; grid-template-columns: 1fr 1.65fr; gap: 60px; scroll-margin-top: 24px; }
.bauhaus-join .bauhaus-kicker { margin-bottom: 18px; }
.bauhaus-join h2 { font-size: clamp(2.6rem, 4vw, 3.8rem); line-height: 1; letter-spacing: -.055em; margin-bottom: 22px; }
.bauhaus-join-copy > p:not(.bauhaus-kicker) { font-size: .95rem; line-height: 1.6; max-width: 34ch; }
.bauhaus-join-copy > p:last-child { margin-bottom: 0; }
.bauhaus-choices { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.bauhaus-choice { display: flex; flex-direction: column; padding: 25px; color: #fff9ed; text-decoration: none; }
.bauhaus-person { background: #2d50bd; }
.bauhaus-company { background: #e74b32; color: #20211f; }
.bauhaus-choice-top { display: flex; justify-content: space-between; align-items: center; font-size: .75rem; gap: 12px; }
.bauhaus-choice-top > span:last-child { font-size: 1.8rem; line-height: 1; }
.bauhaus-choice-title { display: block; font-size: clamp(1.7rem, 2.5vw, 2.5rem); font-weight: 600; line-height: 1.05; letter-spacing: -.045em; margin: 40px 0 25px; }
.bauhaus-choice-note { font-size: .82rem; line-height: 1.5; max-width: 24ch; margin-top: auto; }
.bauhaus-choice:hover .bauhaus-choice-title { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: .12em; }
.bauhaus-explore { display: grid; grid-template-columns: 170px 1fr; gap: 60px; padding: 44px 0 52px; border-top: 2px solid var(--ink); align-items: center; }
.bauhaus-explore-symbol { display: grid; grid-template-columns: 1fr 1fr; aspect-ratio: 1; }
.bauhaus-explore-symbol span { background: #f5ce43; border-radius: 100% 0 0 0; }
.bauhaus-explore-symbol span:nth-child(2) { transform: rotate(90deg); background: #2d50bd; }
.bauhaus-explore-symbol span:nth-child(3) { transform: rotate(-90deg); background: #e74b32; }
.bauhaus-explore-symbol span:nth-child(4) { transform: rotate(180deg); background: #20211f; }
.bauhaus-explore .bauhaus-kicker { margin-bottom: 12px; }
.bauhaus-explore h2 { font-size: clamp(1.7rem, 2.8vw, 2.5rem); letter-spacing: -.05em; margin-bottom: 12px; }
.bauhaus-explore p:not(.bauhaus-kicker) { font-size: .95rem; }
.bauhaus-explore nav { display: flex; flex-wrap: wrap; gap: 15px 28px; font-size: .85rem; }
.bauhaus-explore nav a:first-child { font-weight: 700; }
.bauhaus-page .site-footer { font-size: .75rem; padding-block: 24px; }
.bauhaus-page :focus-visible { outline: 3px solid #20211f; outline-offset: 5px; }
@media (max-width: 900px) {
  .bauhaus-page .wrap { width: calc(100% - 48px); }
  .bauhaus-hero { gap: 12px; }
  .bauhaus-hero h1 { font-size: clamp(2.7rem, 6vw, 4rem); }
  .bauhaus-join { gap: 28px; grid-template-columns: 1fr 1.6fr; }
  .bauhaus-choice { padding: 20px; }
  .bauhaus-choice-title { font-size: 1.8rem; }
}
@media (max-width: 650px) {
  .bauhaus-page .wrap { width: calc(100% - 40px); }
  .bauhaus-page .site-header { min-height: 100px; flex-wrap: wrap; justify-content: space-between; gap: 8px; padding-block: 16px; }
  .bauhaus-page .wordmark { font-size: 1.4rem; }
  .bauhaus-page .site-header nav { gap: 22px; font-size: .8rem; }
  .bauhaus-hero { grid-template-columns: 1fr; padding: 36px 0 28px; gap: 20px; }
  .bauhaus-hero h1 { font-size: clamp(2.8rem, 10.7vw, 4.5rem); }
  .bauhaus-kicker { font-size: .63rem; margin-bottom: 24px; }
  .bauhaus-intro { font-size: 1rem; }
  .bauhaus-art { max-width: 380px; width: 100%; justify-self: center; }
  .bauhaus-join { grid-template-columns: 1fr; gap: 26px; padding: 32px 0; }
  .bauhaus-join h2 br { display: none; }
  .bauhaus-join-copy > p:not(.bauhaus-kicker) { max-width: 100%; }
  .bauhaus-choices { gap: 12px; }
  .bauhaus-choice { padding: 18px 15px; }
  .bauhaus-choice-title { font-size: clamp(1.3rem, 5vw, 1.9rem); margin-block: 28px 20px; }
  .bauhaus-choice-note { font-size: .75rem; }
  .bauhaus-choice-top { font-size: .65rem; }
  .bauhaus-explore { grid-template-columns: 1fr; gap: 24px; padding-block: 32px; }
  .bauhaus-explore-symbol { width: 84px; }
}
