/* Content pages (/zorg, /avg-ai-notulist). Generated by scripts/content-pages.mjs, on top of legal.css. */
.lg-top nav { flex-wrap: wrap; align-items: center; gap: 8px 16px; }
.lg-top nav a[aria-current="page"] { text-decoration: underline; text-underline-offset: 4px; }
.ct-btn { display: inline-block; background: var(--teal, #8ff3e0); color: var(--teal-ink, #0d1b24) !important; font-weight: 650; padding: 8px 16px; border-radius: 999px; text-decoration: none; }
.ct-crumbs { font-size: 14px; color: var(--muted); margin: 0 0 14px; }
.ct-crumbs a { color: inherit; }
.ct-cards { list-style: none; padding: 0; display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.ct-cards li { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 14px 16px; margin: 0; max-width: none; }
.ct-cards strong { display: block; margin-bottom: 4px; }
.ct-attn h3:first-child { margin-top: 4px; }
.ct-faq details { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-sm); padding: 0 16px; margin: 8px 0; }
.ct-faq summary { cursor: pointer; font-weight: 650; padding: 12px 0; }
.ct-faq details p { margin: 0 0 14px; }
.ct-cta { background: var(--navy); color: #fff; border-radius: var(--radius); padding: 20px 22px; margin: 32px 0 8px; }
.ct-cta p { margin: 6px 0; max-width: none; }
.ct-cta a:not(.ct-btn) { color: #fff; margin-left: 12px; }
.ct-sources { font-size: 15px; }
.ct-note { color: var(--muted); font-size: 14px; margin-top: 18px; }
@media (max-width: 640px) {
  .ct-check table { min-width: 0; }
  .ct-check thead { display: none; }
  .ct-check tr, .ct-check td { display: block; }
  .ct-check tr { border-bottom: 1px solid var(--line); padding: 6px 0; }
  .ct-check td { border: 0; padding: 4px 12px; }
  .ct-check td:first-child { font-weight: 650; padding-top: 10px; }
  .ct-check td:nth-child(2)::before { content: "Waarom: "; color: var(--muted); }
  .ct-check td:nth-child(3)::before { content: "My Notetaker: "; font-weight: 650; }
}

/* Chrome extension page: Store button with a note, and the screenshot */
.ct-store { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; margin: 18px 0 8px; }
.ct-store .ct-btn { padding: 10px 20px; }
.ct-store span { color: var(--muted, #55647d); font-size: .92em; }
.ct-fig { margin: 22px 0 8px; }
.ct-fig img { display: block; width: 100%; height: auto; border-radius: var(--radius, 12px); border: 1px solid #e3e8f0; box-shadow: 0 10px 30px rgb(15 31 54 / 0.10); }
.ct-fig figcaption { margin-top: 8px; font-size: .88em; color: var(--muted, #55647d); }

/* Pages the Chrome extension opens: welcome, what's new, removed (scripts/extension-pages.mjs) */
.ext-page { max-width: 720px; }
.ext-steps { padding-left: 1.2em; display: grid; gap: 10px; }
.ext-signup { margin: 28px 0; padding: 20px 22px; border-radius: var(--radius, 12px); background: var(--navy, #0f1f36); color: #fff; }
.ext-signup h2 { color: #fff; margin-top: 0; }
.ext-signup p { color: #dfe6ee; }
.ext-form { display: flex; flex-wrap: wrap; gap: 10px; margin: 12px 0; }
.ext-form input { flex: 1 1 240px; min-height: 44px; padding: 0 14px; border-radius: 999px; border: 1px solid #c9d4e3; font: inherit; }
.ext-form .ct-btn { min-height: 44px; padding: 0 20px; border: 0; cursor: pointer; font: inherit; font-weight: 650; }
.ext-small { font-size: .9em; opacity: .85; }
.ext-feedback { display: grid; gap: 12px; margin: 20px 0; }
.ext-feedback fieldset { border: 1px solid var(--line, #e3e8f0); border-radius: var(--radius, 12px); padding: 14px 16px; display: grid; gap: 8px; }
.ext-feedback legend { font-weight: 650; padding: 0 6px; }
.ext-feedback textarea { width: 100%; padding: 10px 12px; border-radius: 10px; border: 1px solid var(--line, #c9d4e3); font: inherit; }
.ext-feedback .ct-btn { justify-self: start; border: 0; cursor: pointer; font: inherit; font-weight: 650; padding: 10px 20px; }
.ext-error { margin: 0; padding: 10px 14px; border-radius: 10px; background: #fdecec; color: #a4161a; }
.ext-thanks { padding: 14px 16px; border-radius: 10px; background: var(--ok-soft, #e6f6ef); }
kbd { font: 600 .85em/1 var(--font-mono, monospace); padding: 2px 6px; border: 1px solid var(--line, #c9d4e3); border-bottom-width: 2px; border-radius: 5px; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
