/* Shared styling for /guides/. Modelled on privacy_policy.html so the content
   pages look like the rest of the site without duplicating the 60 KB landing
   page. One file, linked by every guide, so a change lands everywhere. */
* { box-sizing: border-box; margin: 0; padding: 0; }
body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
  font-size: 16px;
  line-height: 1.75;
  color: #2D3748;
  background: #F7FAFC;
}
.wrapper { max-width: 720px; margin: 0 auto; padding: 40px 24px 80px; }
.logo {
  font-size: 20px; font-weight: 800; color: #1B2A4A;
  margin-bottom: 8px; display: inline-flex; align-items: center; gap: 8px;
  text-decoration: none;
}
.crumbs { font-size: 13px; color: #718096; margin-bottom: 36px; }
.crumbs a { color: #1F5FA6; text-decoration: none; }
.crumbs a:hover { text-decoration: underline; }
h1 { font-size: 30px; font-weight: 800; color: #1B2A4A; margin-bottom: 10px; line-height: 1.25; }
.lede { font-size: 18px; color: #4A5568; margin-bottom: 36px; }
h2 { font-size: 20px; font-weight: 700; color: #1B2A4A; margin-top: 40px; margin-bottom: 12px; }
h3 { font-size: 17px; font-weight: 700; color: #1B2A4A; margin-top: 28px; margin-bottom: 8px; }
p { margin-bottom: 16px; }
ul, ol { margin: 10px 0 18px 22px; }
li { margin-bottom: 8px; }
a { color: #1F5FA6; }
a:hover { text-decoration: underline; }
strong { color: #1B2A4A; }
.note {
  background: #EBF8FF; border-left: 3px solid #3182CE;
  padding: 16px 20px; border-radius: 0 8px 8px 0; margin: 24px 0;
}
.note p:last-child { margin-bottom: 0; }
table { border-collapse: collapse; width: 100%; margin: 20px 0; font-size: 15px; }
th, td { text-align: left; padding: 10px 12px; border-bottom: 1px solid #E2E8F0; vertical-align: top; }
th { color: #1B2A4A; font-weight: 700; background: #EDF2F7; }
.cta {
  background: #fff; border: 1px solid #E2E8F0; border-radius: 12px;
  padding: 24px; margin: 40px 0 0;
}
.cta h2 { margin-top: 0; }
.cta-button {
  display: inline-block; background: #1B2A4A; color: #fff; font-weight: 700;
  padding: 12px 22px; border-radius: 8px; text-decoration: none; margin-top: 8px;
}
.cta-button:hover { background: #24375f; text-decoration: none; }
.more { margin-top: 48px; border-top: 1px solid #E2E8F0; padding-top: 24px; }
.more ul { list-style: none; margin-left: 0; }
.more li { margin-bottom: 14px; }
.more span { display: block; font-size: 14px; color: #718096; }
footer { margin-top: 56px; font-size: 13px; color: #718096; }
footer a { color: #718096; }