/* Phase 0 brand tokens derived from the supplied logo and flyer. */
:root {
    --colour-primary: #07522e;
    --colour-primary-strong: #064125;
    --colour-secondary: #0756a3;
    --colour-accent: #f6bd16;
    --colour-ink: #14251c;
    --colour-muted: #465b4e;
    --colour-surface: #ffffff;
    --colour-background: #f6bd16;
    --colour-border: #ceddce;
    --radius-card: 1.25rem;
    --space-page: clamp(1rem, 4vw, 2rem);
    color-scheme: light;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    margin: 0;
    min-width: 0;
    background: var(--colour-background);
    color: var(--colour-ink);
    font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
    line-height: 1.5;
}
img { max-width: 100%; height: auto; }
a { color: var(--colour-primary); }
a:focus-visible, button:focus-visible { outline: 3px solid var(--colour-secondary); outline-offset: 3px; }
.skip-link {
    position: absolute;
    inset-block-start: -6rem;
    inset-inline-start: 1rem;
    z-index: 10;
    padding: .75rem 1rem;
    background: var(--colour-surface);
}
.skip-link:focus { inset-block-start: 1rem; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.button {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding: .7rem 1.2rem;
    border-radius: .65rem;
    background: var(--colour-primary);
    color: #fff;
    font-weight: 700;
    text-decoration: none;
}
.button:hover { background: var(--colour-primary-strong); }
.offline-page { max-width: 32rem; margin: 10vh auto; padding: 1rem; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }