:root { color-scheme: dark; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color: #f0f2eb; background: #050808; line-height: 1.65; }
* { box-sizing: border-box; }
body { margin: 0; }
.wrap { width: min(100% - 3rem, 960px); margin-inline: auto; }
a { color: #a3bd85; text-underline-offset: .25em; }
a:hover { color: #d2e4ba; }
a:focus-visible { outline: 2px solid #d2e4ba; outline-offset: 5px; border-radius: 2px; }
header, footer { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; flex-wrap: wrap; }
header { padding-block: 2rem; }
.wordmark { color: #f0f2eb; font-size: 1.4rem; font-weight: 800; letter-spacing: -.06em; text-decoration: none; }
.wordmark span { color: #a3bd85; }
nav { display: flex; gap: 1.5rem; }
nav a { color: #bac3bc; font-size: .9rem; text-decoration: none; padding-block: .5rem; }
.hero { padding-block: clamp(3rem, 9vw, 6rem); }
.eyebrow { color: #a3bd85; text-transform: uppercase; font-size: .75rem; letter-spacing: .18em; font-weight: 700; }
h1, h2 { line-height: 1.1; letter-spacing: -.045em; }
h1 { font-size: clamp(3.2rem, 9vw, 6.5rem); margin: 1rem 0 1.5rem; }
h1 span { color: #a3bd85; }
.intro { color: #bac3bc; font-size: clamp(1.1rem, 3vw, 1.35rem); margin-bottom: 2rem; }
.button { display: inline-flex; align-items: center; gap: 1rem; padding: .85rem 1.25rem; border-radius: .5rem; background: #a3bd85; color: #101710; font-weight: 700; text-decoration: none; }
.button:hover { background: #d2e4ba; color: #101710; }
.leagues { color: #bac3bc; font-size: .8rem; margin-top: 2rem; }
.features { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem; padding-block: 2.5rem; border-block: 1px solid #36443c; }
.features h2 { font-size: 1.3rem; }
.features p, .muted { color: #bac3bc; font-size: .95rem; }
.support { max-width: 660px; padding-block: 4rem; scroll-margin-top: 2rem; }
.support h2 { font-size: 2.5rem; }
.contact { font-size: 1.25rem; overflow-wrap: anywhere; }
footer { border-top: 1px solid #36443c; padding-block: 2rem; font-size: .8rem; color: #bac3bc; }
.policy { max-width: 720px; padding-block: 3rem 4rem; }
.policy h1 { font-size: clamp(2.5rem, 7vw, 4rem); }
.policy h2 { font-size: 1.5rem; margin-top: 2.5rem; }
.policy p, .policy li { color: #d5dbd4; }
@media (max-width: 600px) { .features { grid-template-columns: 1fr; gap: .5rem; } header { padding-block: 1.25rem; } .button { font-size: .9rem; } }