:root{--ink:#16211e;--muted:#60716a;--cream:#fbfaf6;--mint:#d8f7ea;--lime:#d4ff59;--dark:#122722}

@font-face{font-family:'Instrument Sans';src:url('fonts/InstrumentSans-Regular.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Instrument Sans';src:url('fonts/InstrumentSans-Medium.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Instrument Sans';src:url('fonts/InstrumentSans-SemiBold.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Instrument Sans';src:url('fonts/InstrumentSans-Bold.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}

*{box-sizing:border-box}
body{margin:0;color:#dff3ea;background:var(--dark);
  font-family:'Instrument Sans',ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  line-height:1.45}
.wrap{width:min(1180px,calc(100% - 40px));margin:auto}

/* the same header the product page uses */
.bar{background:radial-gradient(circle at 82% 12%,rgba(109,239,209,.29),transparent 23rem),
  radial-gradient(circle at 20% 74%,rgba(90,127,255,.18),transparent 28rem),var(--dark)}
.bar .wrap{display:flex;align-items:center;justify-content:space-between;height:84px}
.brand{display:flex;align-items:center;gap:10px;font-weight:760;letter-spacing:-.022em;text-decoration:none;color:#f8fff9}
.brand-mark{width:24px;height:24px;border-radius:8px 10px 9px 7px;display:inline-grid;place-items:center;
  color:#0f2923;background:linear-gradient(135deg,#4cc0ff 5%,#9a68ff 43%,#ff6c88 68%,#f9ea63);font-size:15px;font-weight:700}
.bar nav{display:flex;align-items:center;gap:27px;font-size:14px}
.bar nav a{color:#a9c6bc;text-decoration:none}
.bar nav a:hover{color:#f8fff9}

.hero{padding:22px 0 54px;background:radial-gradient(circle at 82% 12%,rgba(109,239,209,.29),transparent 23rem),
  radial-gradient(circle at 20% 74%,rgba(90,127,255,.18),transparent 28rem),var(--dark)}
.eyebrow{margin:0 0 17px;color:#a9d2c3;font-size:11px;font-weight:800;letter-spacing:.17em;text-transform:uppercase}
h1{margin:0 0 20px;max-width:20ch;color:#f8fff9;font-size:clamp(38px,5.4vw,62px);line-height:1.02;letter-spacing:-.026em}
.lede{max-width:62ch;margin:0;color:#b2c8c0;font-size:18px;letter-spacing:-.018em;line-height:1.6}

main section{padding:0 0 10px}
.rules{list-style:none;counter-reset:r;margin:44px 0 0;padding:0;display:grid;gap:14px}
.rules li{counter-increment:r;position:relative;padding:22px 26px 22px 62px;border-radius:18px;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12)}
.rules li::before{content:counter(r,decimal-leading-zero);position:absolute;left:24px;top:24px;
  color:#7fb3a2;font-size:12px;font-weight:700;letter-spacing:.08em}
.rules h3{margin:0 0 8px;color:#f8fff9;font-size:17px;letter-spacing:-.016em}
.rules p{margin:0;color:#b2c8c0;font-size:15px;line-height:1.65}
main a{color:#d4ff59}
main section:last-of-type .lede{font-size:14px;color:#8fa9a1;margin-top:36px}

.site-foot{margin-top:54px;border-top:1px solid rgba(255,255,255,.14);padding:40px 0 56px;color:#b2c8c0}
.foot-links{display:flex;flex-wrap:wrap;gap:10px 26px;margin-bottom:18px}
.foot-links a{color:#dff3ea;text-decoration:none;font-weight:600;font-size:14px}
.foot-links a:hover{text-decoration:underline}
.foot-note{margin:0;font-size:13px;line-height:1.7;opacity:.8}
.foot-note a{color:#dff3ea}