:root {
  --ink: #071a17;
  --muted: #5c6b67;
  --brand: #062f25;
  --lime: #b8ff5a;
  --line: #dce8df;
  --soft: #f2f7f3;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html { overflow-x: hidden; }
body { margin: 0; background: var(--soft); color: var(--ink); overflow-x: hidden; }
a { color: inherit; text-decoration: none; }
.checklist-page {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: clamp(0.75rem, 1.8vw, 1.5rem);
}
.checklist-hero, .checklist-footer, .checklist-intro, .checklist-grid article {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 22px;
  box-shadow: 0 18px 48px rgba(6, 47, 37, 0.08);
}
.checklist-hero { padding: clamp(1.5rem, 4vw, 3rem); background: linear-gradient(135deg, var(--brand), #0b6559); color: #ffffff; }
.checklist-hero img { width: min(340px, 82vw); height: auto; display: block; margin-bottom: 1.5rem; background: #ffffff; border-radius: 10px; padding: 0.45rem; }
.checklist-hero p { margin: 0 0 0.75rem; color: var(--lime); font-weight: 950; text-transform: uppercase; letter-spacing: 0.1em; }
.checklist-hero h1 { max-width: 900px; margin: 0; font-size: clamp(2.1rem, 5vw, 4.5rem); line-height: 0.98; }
.checklist-actions { display: flex; flex-wrap: wrap; gap: 0.75rem; margin-top: 1.7rem; }
.checklist-actions button, .checklist-actions a, .checklist-footer a {
  border: 0;
  border-radius: 999px;
  padding: 0.9rem 1.15rem;
  font: inherit;
  font-weight: 950;
  cursor: pointer;
}
.checklist-actions button, .checklist-footer a { background: var(--lime); color: var(--brand); }
.checklist-actions a { background: rgba(255, 255, 255, 0.14); color: #ffffff; border: 1px solid rgba(255, 255, 255, 0.32); }
.checklist-intro { padding: 1.3rem 1.5rem; margin: 1rem 0; }
.checklist-intro p, .checklist-footer p { color: var(--muted); line-height: 1.7; margin: 0; }
.checklist-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.checklist-grid article { padding: 1.3rem; }
.checklist-grid h2, .checklist-footer h2 { margin: 0 0 1rem; color: var(--brand); }
.checklist-grid label { display: flex; align-items: flex-start; gap: 0.65rem; color: var(--muted); line-height: 1.5; font-weight: 750; padding: 0.55rem 0; }
.checklist-grid input { width: 1.15rem; height: 1.15rem; margin-top: 0.15rem; accent-color: var(--brand); flex: 0 0 auto; }
.checklist-footer { margin-top: 1rem; padding: 1.4rem; }
.checklist-footer a { display: inline-flex; margin-top: 1rem; }

@media (max-width: 760px) {
  .checklist-page { padding: 0.65rem; }
  .checklist-hero, .checklist-footer, .checklist-intro, .checklist-grid article { border-radius: 16px; }
  .checklist-hero { padding: 1.2rem; }
  .checklist-hero img { width: min(280px, 100%); margin-bottom: 1rem; }
  .checklist-hero p { font-size: 0.72rem; line-height: 1.5; }
  .checklist-hero h1 { font-size: clamp(2rem, 11vw, 3.2rem); }
  .checklist-actions { flex-direction: column; }
  .checklist-actions button, .checklist-actions a, .checklist-footer a { width: 100%; }
  .checklist-grid { grid-template-columns: 1fr; }
  .checklist-grid article, .checklist-intro, .checklist-footer { padding: 1rem; }
}

@media print {
  body { background: #ffffff; }
  .checklist-page { width: 100%; padding: 0; }
  .checklist-hero, .checklist-footer, .checklist-intro, .checklist-grid article { box-shadow: none; break-inside: avoid; }
  .checklist-actions { display: none; }
}