/* Agency and problem-based learning: shared additions to the existing Ainstein design. */
.agency { background:var(--paper); }
.agency-layout { display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px,5vw,64px); align-items:start; }
.agency h2, .project-example h3 { max-width:22ch; }
.agency-copy > p { margin-top:22px; max-width:60ch; }
.agency-copy > p:first-child { margin-top:0; }
.project-example { padding:clamp(24px,3vw,38px); background:var(--sky); border-top:3px solid var(--ink); }
.project-example h3 { font-family:var(--serif); font-size:clamp(27px,3vw,36px); font-weight:500; line-height:1.15; margin:12px 0 18px; }
.project-example .example-label { font-size:14px; font-weight:600; }
.project-example > p, .project-example dd { font-size:16px; line-height:1.6; }
.project-example dl { margin:22px 0 0; }
.project-example dl > div { padding:16px 0; border-top:1px solid var(--hairline); }
.project-example dt { font-weight:700; margin-bottom:5px; }
.project-example dd { margin:0; }
.project-example .age-note { margin-top:16px; font-size:14px; }
.agency .btn { margin-top:8px; }
.learning-evidence { margin-top:40px; max-width:68ch; padding-left:24px; border-left:3px solid var(--cyan-ink); }
.learning-evidence h3 { font-size:20px; margin-bottom:12px; }
.learning-evidence p + p { margin-top:14px; }
section[id] { scroll-margin-top:86px; }
.agency a:focus-visible, #problem-based-learning a:focus-visible { outline:3px solid var(--ink); outline-offset:5px; }
@media(max-width:820px) { .agency-layout { grid-template-columns:1fr; } .project-example { max-width:680px; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } .hero h1, .hero .lede, .hero .cta, .hero .plate { animation:none; } }