/* Opt-in brand motion for the about page; static SVG remains the fallback. */
.about-brand-motion{display:grid;grid-template-columns:minmax(220px,.8fr) minmax(0,1.2fr);align-items:center;gap:36px;padding:26px 30px;margin:30px 0;border-block:1px solid #e2e8e3;background:#f7faf7;border-radius:4px}
.about-brand-visual{position:relative;display:grid;place-items:center;height:280px;min-width:0}
.about-brand-fallback{display:block;width:min(80%,240px);height:auto}
.about-brand-visual canvas{display:none;position:absolute;inset:0;width:100%;height:100%;touch-action:pan-y}
.about-brand-motion[data-typeflow-display=canvas] .about-brand-fallback{display:none}
.about-brand-motion[data-typeflow-display=canvas] canvas{display:block}
.about-brand-copy{min-width:0}
.about-brand-copy h2{font-size:24px;line-height:1.5;margin:0 0 12px;color:#202923}
.about-brand-copy>p{font-size:14px;line-height:1.9;color:#536157;margin:0 0 18px}
.about-brand-toggle{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 18px;border:1px solid #277044;border-radius:4px;background:#fff;color:#276b41;font:inherit;font-size:14px;font-weight:650;line-height:1.5;cursor:pointer}
.about-brand-toggle:hover{background:#edf6ef}
.about-brand-toggle:disabled{color:#6d796f;border-color:#ccd6ce;cursor:default;background:#f7faf7}
.about-brand-toggle[hidden]{display:none}
.about-brand-copy .about-brand-status{font-size:12px;line-height:1.75;margin:11px 0 0;color:#66736a;min-height:42px}
.about-brand-toggle:focus-visible,.about-brand-visual canvas:focus-visible{outline:3px solid #49b867;outline-offset:4px}
@media(max-width:680px){.about-brand-motion{grid-template-columns:1fr;gap:8px;padding:14px 20px 22px;margin:24px 0}.about-brand-visual{height:220px}.about-brand-fallback{width:min(75%,220px)}.about-brand-copy h2{font-size:21px}.about-brand-copy>p{font-size:14px}.about-brand-copy .about-brand-status{min-height:0}}
@media(prefers-reduced-motion:reduce){.about-brand-motion[data-typeflow-display=canvas] canvas{display:none}.about-brand-motion[data-typeflow-display=canvas] .about-brand-fallback{display:block}}
@media print{.about-brand-motion{background:none;break-inside:avoid}.about-brand-motion[data-typeflow-display=canvas] canvas,.about-brand-toggle,.about-brand-status{display:none}.about-brand-motion[data-typeflow-display=canvas] .about-brand-fallback{display:block}}