.example-guide{max-width:880px;padding-top:48px;padding-bottom:64px}.example-guide h1{max-width:760px;margin:12px 0 22px}.example-guide .example-intro{font-size:19px;max-width:720px}.example-guide section{margin-top:46px;scroll-margin-top:24px}.example-guide h2{font-size:31px;margin-bottom:16px}.example-guide h3{font-size:18px;margin:0 0 8px}.example-guide p,.example-guide li{max-width:76ch}.example-guide-nav{font-size:13px;text-align:right}.example-toc{display:flex;gap:12px 24px;flex-wrap:wrap;margin:28px 0;padding:20px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.example-note{background:var(--pale);padding:18px 22px;border-left:3px solid var(--green);margin:22px 0}.example-note p{margin:0}.example-comparison{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:24px 0}.example-comparison figure{margin:0;background:var(--white);border:1px solid var(--line);padding:20px}.example-comparison figcaption{font-size:13px;color:var(--muted);margin-top:14px}.example-tiles{display:grid;grid-template-columns:1fr 1fr;gap:12px;max-width:296px;margin:auto}.example-tiles img{width:100%;height:auto;border:1px solid var(--line)}.example-output{display:block;width:100%;max-width:270px;height:auto;margin:auto;border:1px solid var(--line)}.example-steps{padding-left:25px}.example-steps>li{padding:0 0 20px 8px}.example-steps p{margin:6px 0}.example-table-wrap{overflow-x:auto}.example-guide table{width:100%;border-collapse:collapse;font-size:14px}.example-guide caption{text-align:left;font-size:13px;color:var(--muted);margin-bottom:12px}.example-guide th,.example-guide td{text-align:left;vertical-align:top;padding:15px 12px;border-bottom:1px solid var(--line)}.example-guide thead{background:var(--pale)}.example-guide tbody th{width:21%}.example-guide td:last-child{min-width:135px}.example-guide .example-cta{padding:28px;background:var(--pale);border:1px solid var(--line)}.example-guide .example-cta p{margin:10px 0 18px}.example-date{font-size:12px;color:var(--muted)}@media(max-width:600px){.example-guide{padding-top:30px}.example-guide h1{font-size:38px}.example-guide h2{font-size:28px}.example-comparison{grid-template-columns:1fr}.example-guide-nav{max-width:100px}.example-guide .example-cta{padding:20px}.example-guide th,.example-guide td{padding:12px 8px}.example-guide table{font-size:13px}.example-guide td:last-child{min-width:105px}}
