/* About & FAQ uses the established DYG editorial world. */
.about-purpose h1{font-size:clamp(48px,5.8vw,78px);line-height:.9;letter-spacing:-.08em;text-transform:uppercase;margin:15px 0 0}
.about-purpose{padding-top:48px}
.faq-section{display:grid;grid-template-columns:.7fr 1.3fr;gap:8vw;border-top:1px solid var(--line)}
.faq-intro p{font:12px var(--mono);line-height:1.6;margin-top:24px}
.faq-list{border-top:1px solid var(--ink)}
.faq-list details{border-bottom:1px solid var(--line)}
.faq-list summary{position:relative;cursor:pointer;list-style:none;padding:24px 36px 24px 0;font-size:21px;line-height:1.25;min-height:44px}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary::after{content:'+';position:absolute;right:4px;top:22px;font:24px var(--mono);color:var(--blue)}
.faq-list details[open] summary::after{content:'−'}
.faq-list summary:hover{color:var(--blue)}
.faq-answer{padding:0 28px 24px 0;max-width:65ch;font-size:16px;line-height:1.6}
.faq-answer p{margin:0}
.faq-answer a{text-decoration:underline;text-underline-offset:4px;overflow-wrap:anywhere}
.about-contact{display:grid;grid-template-columns:.7fr 1.3fr;gap:8vw;background:var(--blue);color:var(--paper)}
.about-contact h2{font-size:clamp(42px,5vw,68px)}
.about-contact .dot{background:var(--pink)}
.contact-copy p{font-size:20px;line-height:1.45;max-width:42ch;margin:0 0 22px}
.contact-email{font-size:clamp(20px,2.4vw,34px);line-height:1.3;display:inline-block;color:var(--acid);text-decoration:underline;text-underline-offset:7px;overflow-wrap:anywhere;min-height:44px;margin:8px 0 24px}
.contact-actions{display:flex;flex-wrap:wrap;gap:16px 28px;font:12px var(--mono)}
.contact-actions a{display:inline-flex;align-items:center;min-height:44px;text-decoration:underline;text-underline-offset:5px}
.about-contact :focus-visible{outline-color:var(--paper)}
@media(max-width:800px){.about-purpose{padding-top:32px}.faq-section,.about-contact{grid-template-columns:1fr;gap:28px}.about-purpose h1{font-size:clamp(48px,11vw,76px)}.faq-list summary{font-size:20px;padding-top:22px;padding-bottom:22px}.contact-copy p{font-size:18px}.contact-email{font-size:clamp(20px,5.4vw,30px)}.faq-section h2{font-size:48px}}

.about-purpose,.faq-section,.about-contact{scroll-margin-top:96px}

/* Compact About sections with the shorter quoted mission headline. */
.about-purpose,.faq-section,.about-contact{padding-top:40px;padding-bottom:40px}
.about-purpose .manifesto-copy small{margin-top:20px}
.faq-intro p{margin-top:16px}
@media(max-width:800px){.about-purpose,.faq-section,.about-contact{padding-top:32px;padding-bottom:32px}.faq-section,.about-contact{gap:20px}}

/* Brand color on the mission; keep the FAQ reading surface quiet. */
.about-purpose{background:var(--acid)}
.about-purpose h1{color:var(--blue)}
.about-purpose .manifesto-copy small{color:var(--ink)}