/*
 * BayLeaf shared stylesheet for GitHub Pages surfaces (index.html, support.html).
 *
 * Accessibility invariants (see politics/VPAT-pages.md for the ACR):
 *   - All text/background pairs pass WCAG 2.1 AA (lowest contrast 5.74:1).
 *   - .service-link variants have explicit :focus-visible indicators that remain
 *     visible against every background color (blue, green, dark gray).
 *   - Colors changed here MUST be re-verified against WCAG relative-luminance
 *     formulas before shipping. Previous regressions (#888 at 3.54:1, #2d8659 at
 *     4.50:1 on threshold) were caught post-hoc; prefer headroom above 5:1.
 */

* { box-sizing: border-box; }

body {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    max-width: 800px;
    margin: 0 auto;
    padding: 2rem;
    line-height: 1.6;
    color: #333;
}

h1 { color: #1a1a1a; }
h2 { color: #2a5298; margin-top: 2rem; }
a { color: #2a5298; }

.tagline {
    font-size: 1.1rem;
    color: #666;
    margin-bottom: 2rem;
}

/*
 * Button-styled link system.
 *
 *   .service-link                  : default blue primary (#2a5298, 7.61:1)
 *   .service-link.primary-action   : green for primary calls-to-action
 *                                    (#1e5a3a, 8.14:1); used for BayLeaf API on
 *                                    landing and the direct-email button on
 *                                    support.
 *   .service-link with inline style="background: #555;" : dark-gray secondary
 *                                    (7.46:1); used for Source/Status/Support
 *                                    on landing.
 */
.service-link {
    display: inline-block;
    background: #2a5298;
    color: white;
    padding: 0.75rem 1.5rem;
    text-decoration: none;
    border-radius: 4px;
    font-weight: 500;
}
.service-link:hover { background: #1e3a6e; }
.service-link.primary-action { background: #1e5a3a; }
.service-link.primary-action:hover { background: #164a2e; }
.service-link:focus-visible {
    outline: 3px solid #fff;
    outline-offset: 2px;
    box-shadow: 0 0 0 5px #2a5298;
}

/* Button row container (.services on landing, .channels on support). */
.services, .channels {
    display: flex;
    gap: 1rem;
    margin: 1.5rem 0;
    flex-wrap: wrap;
}

ul { padding-left: 1.5rem; }
li { margin-bottom: 0.5rem; }

/* Callout box (support.html uses this for the one-person-operation disclosure). */
.note {
    background: #f8f9fa;
    border-left: 3px solid #2a5298;
    padding: 1rem 1.25rem;
    margin: 1.5rem 0;
    font-size: 0.95rem;
    color: #444;
}

/* Footer on both pages. */
.contact {
    margin-top: 2rem;
    padding-top: 1rem;
    border-top: 1px solid #eee;
}