:root {
  color-scheme: light;
  --paper: #f5f5ed;
  --surface: #fff;
  --ink: #193529;
  --green: #286345;
  --purple: #733181;
  --muted: #536258;
  --line: #dfe5d8;
  font-family: Arial, Helvetica, sans-serif;
  color: var(--ink);
  background: var(--paper);
  font-synthesis: none;
  -webkit-text-size-adjust: 100%;
}
* { box-sizing: border-box; }
body { margin: 0; min-width: 280px; }
a { color: inherit; text-underline-offset: .2em; }
img { display: block; max-width: 100%; height: auto; }
p, h1, h2 { margin-top: 0; }
a:focus-visible { outline: 3px solid #ab6710; outline-offset: 5px; }
.skip-link { position: absolute; left: 1rem; top: -6rem; z-index: 2; padding: 1rem; background: var(--surface); }
.skip-link:focus { top: 1rem; }
.site-header { border-bottom: 1px solid var(--line); background: var(--surface); }
.header-inner, .footer-inner { width: min(100% - 5rem, 1280px); margin-inline: auto; display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; }
.header-inner { min-height: 96px; padding-block: 1.25rem; }
.brand { display: inline-flex; flex-direction: column; text-decoration: none; color: var(--green); min-width: 0; }
.brand-name { font-size: clamp(1.125rem, 2.4vw, 1.875rem); font-weight: 700; letter-spacing: -.035em; white-space: nowrap; }
.recycle { display: inline-block; margin-inline: .08em; font-size: 1em; }
.brand-domain { font-size: .8125rem; color: var(--muted); margin-top: .4rem; }
.site-status { display: flex; align-items: center; gap: .6rem; margin: 0; font-size: .875rem; color: var(--muted); flex-shrink: 0; }
.site-status span { width: 7px; height: 7px; border-radius: 50%; background: #6c9a46; }
.intro { padding: 2.25rem 1.5rem 2rem; text-align: center; background: radial-gradient(ellipse at 50% 0%, #fff5c9 0%, transparent 70%); }
.eyebrow { color: #526447; font-size: .75rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; margin-bottom: .9rem; line-height: 1.6; }
h1 { font-size: clamp(2rem, 3.2vw, 2.75rem); line-height: 1.13; letter-spacing: -.035em; max-width: 1000px; margin: 0 auto 1rem; }
.intro-copy { max-width: 650px; margin-inline: auto; font-size: 1rem; line-height: 1.6; color: var(--muted); }
.intro-copy p { margin-bottom: .15rem; }
.projects { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.875rem; width: min(100% - 4rem, 1120px); margin: 0 auto 2rem; align-items: stretch; }
.project { --project-accent: var(--green); min-width: 0; overflow: hidden; display: flex; flex-direction: column; background: var(--surface); border: 1px solid var(--line); border-radius: 15px; box-shadow: 2px 4px 0 #e8ecdf; }
.donation { --project-accent: var(--purple); }
.project-heading { border-top: 4px solid var(--project-accent); padding: 1.35rem 1.625rem 1.3rem; }
.project-label { color: var(--project-accent); font-size: .6875rem; letter-spacing: .055em; font-weight: 700; text-transform: uppercase; line-height: 1.6; margin-bottom: .65rem; }
h2 { font-size: clamp(1.4rem, 2vw, 1.7rem); line-height: 1.17; letter-spacing: -.025em; margin: 0; }
.poster { display: block; align-self: center; width: min(calc(100% - 3.25rem), 350px); text-decoration: none; }
.poster img { width: 100%; aspect-ratio: 1414 / 2000; object-fit: contain; }
.poster-hint { display: flex; align-items: center; justify-content: center; gap: .4rem; min-height: 36px; font-size: .75rem; color: var(--muted); text-decoration: underline; }
.project-content { display: flex; flex-direction: column; flex: 1; padding: .65rem 1.625rem 1.4rem; gap: .85rem; }
.project-content > p:first-child { color: var(--muted); font-size: .9375rem; line-height: 1.5; margin: 0; }
.action { display: flex; align-items: center; justify-content: center; gap: .5rem; margin-top: auto; padding: .9rem .75rem; min-height: 49px; border-radius: 7px; background: var(--project-accent); color: #fff; font-size: .9375rem; line-height: 1.4; font-weight: 700; text-decoration: none; text-align: center; }
.action:hover { filter: brightness(1.1); }
.action-note { display: block; font-size: .75rem; line-height: 1.5; text-align: center; color: var(--muted); margin: 0; }
.email-note { overflow-wrap: anywhere; text-decoration: none; }
.email-note:hover { text-decoration: underline; }
.site-footer { border-top: 1px solid var(--line); background: var(--surface); }
.footer-inner { min-height: 76px; padding-block: 1rem; }
.contact { font-size: .875rem; color: var(--green); text-decoration: none; overflow-wrap: anywhere; }
.contact:hover { text-decoration: underline; }
.site-footer nav { display: flex; flex-wrap: wrap; align-items: center; gap: 1.5rem; }
.site-footer nav a { display: inline-flex; align-items: center; min-height: 44px; color: var(--muted); font-size: .875rem; }
.legal-content { max-width: 760px; margin: 2.5rem auto; padding: 0 1.5rem; line-height: 1.65; overflow-wrap: anywhere; }
.legal-content h1 { font-size: 2.25rem; margin-bottom: 1.5rem; }
.legal-content h2 { font-size: 1.25rem; margin: 1.8rem 0 .75rem; }
.legal-content address { font-style: normal; }
.back-link { display: inline-block; min-height: 44px; padding-block: .65rem; color: var(--green); }
@media (max-width: 950px) {
  .header-inner, .footer-inner { width: calc(100% - 4rem); }
  .projects { grid-template-columns: minmax(0, 1fr); width: min(calc(100% - 4rem), 620px); }
  .project-heading { padding: 1.5rem 1.75rem 1.4rem; }
  h2 { font-size: 1.75rem; }
  .poster { width: min(calc(100% - 3.5rem), 414px); }
  .project-content { padding: .8rem 1.75rem 1.5rem; }
  .footer-inner { flex-direction: column; gap: .6rem; }
}
@media (max-width: 600px) {
  .header-inner { width: calc(100% - 2.75rem); flex-direction: column; align-items: flex-start; gap: 1.35rem; padding-block: 1.5rem; }
  .brand-name { font-size: clamp(1rem, 5.5vw, 1.375rem); }
  .brand-domain { font-size: .8125rem; }
  .site-status { font-size: .8125rem; }
  .intro { padding: 1.75rem 1.375rem 1.875rem; }
  .eyebrow { font-size: .6875rem; letter-spacing: .02em; }
  .eyebrow span { display: block; }
  h1 { max-width: 380px; font-size: 2rem; }
  .intro-copy { max-width: 350px; }
  .intro-copy p { margin-bottom: .4rem; }
  .projects { width: calc(100% - 2.25rem); gap: 1.75rem; }
  .project-heading { padding: 1.35rem 1.25rem 1.2rem; }
  h2 { font-size: clamp(1.25rem, 6vw, 1.5625rem); }
  .project-label { font-size: .6875rem; letter-spacing: .025em; }
  .poster { width: calc(100% - 2.5rem); }
  .project-content { padding: .65rem 1.25rem 1.4rem; gap: 1rem; }
  .action { padding-inline: .5rem; }
  .footer-inner { width: calc(100% - 2.75rem); padding-block: 1.25rem; }
  .contact { text-align: center; line-height: 1.7; }
  .contact span { display: block; font-weight: 700; }
  .legal-content { margin-block: 1.5rem; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; }
}

.participation-info { margin: 0; color: var(--muted); font-size: .8125rem; line-height: 1.6; }