/* Shared visual rules for legacy and redesigned pages. */
:root {
    --site-ink: #202b35;
    --site-muted: #697783;
    --site-line: #e4e9ed;
    --site-surface: #fff;
    --site-canvas: #f5f7f8;
    --site-green: #00a85e;
    --site-green-dark: #008b4d;
    --site-radius: 10px;
    --site-shadow: 0 5px 20px rgba(31, 49, 59, .06);
}

html { scroll-behavior: smooth; }
body {
    color: var(--site-ink);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
    font-size: 1rem;
    line-height: 1.6;
}
body h1, body h2, body h3, body h4, body h5, body h6 {
    color: var(--site-ink);
    font-family: inherit;
    font-weight: 650;
    letter-spacing: -.012em;
}
body h1 { font-size: clamp(1.7rem, 2.3vw, 2.25rem); line-height: 1.22; }
body h2 { font-size: clamp(1.35rem, 1.8vw, 1.75rem); line-height: 1.3; }
body h3 { font-size: 1.125rem; line-height: 1.4; }
body p { line-height: 1.7; }
body a { transition: color .16s ease, background-color .16s ease, border-color .16s ease; }
body button, body .button, body .btn { transition: color .16s ease, background-color .16s ease, border-color .16s ease, box-shadow .16s ease; }
body :focus-visible { outline: 2px solid rgba(0, 168, 94, .72); outline-offset: 2px; }

/* One calm control language across older forms. */
body input[type="text"], body input[type="password"], body input[type="email"],
body input[type="number"], body input[type="search"], body select, body textarea {
    border: 1px solid #dce3e7;
    border-radius: 7px;
    background-color: var(--site-surface);
    color: var(--site-ink);
    box-shadow: none;
}
body input[type="text"]:focus, body input[type="password"]:focus, body input[type="email"]:focus,
body input[type="number"]:focus, body input[type="search"]:focus, body select:focus, body textarea:focus {
    border-color: var(--site-green);
    box-shadow: 0 0 0 3px rgba(0, 168, 94, .1);
}
body input::placeholder, body textarea::placeholder { color: #8a969f; }
body .button, body button.button { border-radius: 7px; font-weight: 600; }

/* Stable icon sizing and color in interactive controls. */
body .button > i, body .btn > i, body button > i, body a[aria-label] > i {
    display: inline-block;
    vertical-align: -.06em;
    line-height: 1;
}
body .button:hover, body .btn:hover { box-shadow: 0 4px 12px rgba(31, 49, 59, .08); }

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
