/* PicoChest information pages (About, Privacy Policy, Disclaimer): a soft storybook look with readability first.
   Every rule is scoped to main.info-page, so no other page changes. No web fonts, no images beyond the page's own. */
.info-page {
  --ip-cream: #fffaf1;
  --ip-sky: #e8f3fb;
  --ip-meadow: #dcefd3;
  --ip-peach: #fde7d8;
  --ip-line: #eadbc6;
  --ip-wood: #7a4e24;
  --ip-coral: #a33a2f;
}
.info-page .tool-heading { max-width: 44rem; }
.info-page .eyebrow { color: var(--ip-wood); }
.info-page .info-content { margin-top: 1.5rem; padding: clamp(1rem, 4vw, 2rem); border: 1px solid var(--ip-line); border-radius: 1.25rem; background: var(--ip-cream); }
.info-page .info-content section { border-top-color: var(--ip-line); }
.info-page .info-content > section:first-child, .info-page .info-toc + .info-chapter { border-top: 0; }
.info-page .info-content h2 { font-size: clamp(1.2rem, 3.6vw, 1.5rem); line-height: 1.4; }
.info-page .info-content a { color: var(--ip-coral); text-underline-offset: .15em; }
.info-page .info-content a:hover { color: #7e2b23; }
.info-page :focus-visible { outline: 3px solid var(--focus, #f59e0b); outline-offset: 2px; }
.info-page code { padding: 0 .25em; border-radius: .3em; background: #f6ecdd; font-size: .92em; overflow-wrap: anywhere; }

/* About */
.info-hero { max-width: 44rem; margin: 0; }
.info-hero img { display: block; width: 100%; height: auto; border-radius: 1.25rem; }
.info-groups { padding: 0; list-style: none; }
.info-groups li { margin: .55rem 0; }
.info-tag { display: inline-block; margin-right: .5rem; padding: .05rem .65rem; border-radius: 999px; background: var(--ip-meadow); color: #2f4a26; font-size: .85rem; font-weight: 700; }
.info-cat-row { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: .9rem; }
.info-cat-row img { width: clamp(4rem, 18vw, 6.5rem); height: auto; border-radius: 50%; background: #fff; }
.info-faq dt { margin-top: .9rem; font-weight: 700; }
.info-faq dd { margin: .25rem 0 0; }
.info-actions { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: 1.25rem; padding-top: 1.5rem; border-top: 1px solid var(--ip-line); }
.info-page .info-content a.info-button { display: inline-flex; align-items: center; gap: .35rem; min-height: 44px; padding: .5rem 1rem; border: 2px solid #b9824f; border-radius: 999px; background: #fff; color: #4a3216; font-weight: 700; text-decoration: none; }
.info-page .info-content a.info-button:hover { background: var(--ip-peach); }
.info-page .info-content a.info-button-primary { border-color: var(--ip-coral); background: var(--ip-coral); color: #fff; }
.info-page .info-content a.info-button-primary:hover { background: #7e2b23; }

/* Privacy Policy: contents and chapter numbers. Numbers are drawn by CSS, so headings keep their plain text. */
.info-toc { margin-bottom: .5rem; padding: 1rem 1.25rem; border-radius: 1rem; background: var(--ip-sky); }
.info-toc-title { margin: 0 0 .4rem; font-weight: 700; }
.info-toc ol { margin: 0; padding: 0; list-style: none; counter-reset: toc; }
.info-toc ol ol { padding-left: 1.25rem; counter-reset: tocsub; }
.info-toc li { margin: .2rem 0; line-height: 1.6; }
.info-toc > ol > li { counter-increment: toc; }
.info-toc ol ol > li { counter-increment: tocsub; }
.info-toc > ol > li > a::before { content: counter(toc) ". "; }
.info-toc ol ol > li > a::before { content: counter(toc) "-" counter(tocsub) ". "; }
.info-numbered { counter-reset: chapter; }
.info-numbered .info-chapter { counter-increment: chapter; counter-reset: sub; scroll-margin-top: 1rem; }
.info-numbered .info-sub { counter-increment: sub; scroll-margin-top: 1rem; }
.info-numbered .info-chapter > h2::before { content: counter(chapter) ". "; }
.info-numbered .info-sub > h2::before { content: counter(chapter) "-" counter(sub) ". "; }
.info-numbered .info-sub > h2 { font-size: clamp(1.08rem, 3.2vw, 1.25rem); }
.info-table { margin: .75rem 0; }
.info-table table { width: 100%; border-collapse: collapse; background: #fff; font-size: .95rem; }
.info-table th, .info-table td { padding: .5rem .6rem; border: 1px solid var(--ip-line); text-align: left; vertical-align: top; line-height: 1.6; }
.info-table thead th { background: var(--ip-peach); }
.info-table tbody th { background: #fff7ec; font-weight: 700; }

@media (max-width: 40rem) {
  /* each row becomes a small card; the column names come from data-label */
  .info-table table, .info-table tbody, .info-table tr, .info-table th, .info-table td { display: block; }
  .info-table table { background: transparent; }
  .info-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .info-table tbody tr { margin-bottom: .75rem; border: 1px solid var(--ip-line); border-radius: .8rem; overflow: hidden; background: #fff; }
  .info-table tbody th, .info-table tbody td { border: 0; }
  .info-table tbody td { border-top: 1px solid var(--ip-line); }
  .info-table tbody td::before { content: attr(data-label); display: block; color: var(--ip-wood); font-size: .82rem; font-weight: 700; }
}
@media (max-width: 30rem) {
  .info-page .info-content { padding: .9rem; border-radius: 1rem; }
  .info-toc { padding: .85rem 1rem; }
}