:root { color-scheme: light; --blue:#1f6bf0; --ink:#16181d; --muted:#566174; --line:#e3e6eb; --soft:#f0f5ff; font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; font-size:16px; line-height:1.65; color:var(--ink); background:#fff; }
* { box-sizing:border-box; } body { margin:0; } a { color:#1757cc; text-underline-offset:.2em; } a:hover { text-decoration-thickness:2px; } a:focus-visible { outline:3px solid #1f6bf0; outline-offset:5px; border-radius:3px; } img { display:block; } .wrap { width:min(100% - 40px,1080px); margin-inline:auto; } .skip { position:absolute; left:20px; top:-100px; padding:10px 16px; background:#fff; z-index:10; } .skip:focus { top:10px; } .site-header { border-bottom:1px solid var(--line); } .header-row { display:flex; align-items:center; justify-content:space-between; gap:24px; min-height:92px; } .brand { display:inline-flex; align-items:center; gap:12px; color:var(--ink); font-size:1.12rem; font-weight:750; text-decoration:none; letter-spacing:-.025em; } .brand img { width:38px; height:38px; } nav { display:flex; flex-wrap:wrap; gap:24px; font-size:.94rem; } nav a { color:var(--muted); text-decoration:none; } nav a[aria-current=page] { color:#1757cc; font-weight:650; } .hero { padding:88px 0 72px; background:linear-gradient(125deg,#fff 15%,#f0f5ff 72%,#e5efff); border-bottom:1px solid var(--line); } .eyebrow { color:#1757cc; font-size:.78rem; font-weight:750; letter-spacing:.13em; text-transform:uppercase; } h1,h2,h3 { line-height:1.15; letter-spacing:-.035em; text-wrap:balance; } h1 { font-size:clamp(2.5rem,6vw,4.5rem); margin:20px 0 24px; max-width:850px; } .blue { color:var(--blue); } .lede { font-size:1.15rem; color:var(--muted); max-width:680px; } .actions { display:flex; flex-wrap:wrap; align-items:center; gap:18px; margin-top:30px; } .button { display:inline-block; padding:12px 20px; background:var(--blue); color:#fff; border-radius:10px; font-weight:650; text-decoration:none; } .button:hover { background:#1757cc; } .section { padding-block:62px; } .section h2 { font-size:2rem; margin:0 0 20px; } .cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; margin-top:28px; } .card { border:1px solid var(--line); border-radius:16px; padding:24px; } .card h3 { font-size:1.12rem; margin:0 0 12px; } .card p { margin:0; color:var(--muted); } .support { border-top:1px solid var(--line); background:var(--soft); } .email { overflow-wrap:anywhere; font-weight:600; } .small { font-size:.9rem; color:var(--muted); } .site-footer { padding:28px 0; border-top:1px solid var(--line); color:var(--muted); font-size:.88rem; } .site-footer p { margin:4px 0; } .footer-row { display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px 32px; } .policy { width:min(100% - 40px,780px); margin-inline:auto; padding:56px 0 72px; } .policy h1 { font-size:clamp(2.25rem,5vw,3.25rem); margin-top:12px; } .policy section { scroll-margin-top:24px; margin-top:38px; } .policy h2 { font-size:1.45rem; margin-bottom:16px; } .policy p { margin:16px 0; } .policy-meta { padding:20px 24px; background:var(--soft); border:1px solid #dce6fc; border-radius:14px; margin:24px 0; overflow-wrap:anywhere; } .policy-meta p { margin:4px 0; } .contents { padding:18px 24px; border:1px solid var(--line); border-radius:14px; } .contents ul { padding-left:20px; margin:12px 0 0; } .contents li { margin-block:5px; } .policy-url { overflow-wrap:anywhere; }
@media(max-width:640px) { .header-row { align-items:flex-start; flex-direction:column; gap:16px; padding-block:22px; } nav { gap:20px; } .hero { padding:48px 0; } .section { padding-block:42px; } .cards { grid-template-columns:1fr; } .policy { padding-top:36px; } .policy-meta { padding:16px; } }
main:focus { outline:none; }