.playbook-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
}
.playbook-card {
  display: grid;
  grid-template-columns: minmax(90px, 135px) minmax(0, 1fr);
  gap: 22px;
  align-items: start;
  padding: 24px;
  background: #faf8f5;
  border: 1px solid #dedfd9;
}
.playbook-card img, .playbook-hero img {
  display: block;
  width: 100%;
  height: auto;
}
.playbook-card h2 { font-size: clamp(21px, 2.2vw, 30px); margin-bottom: 12px; }
.playbook-card .eyebrow { margin-bottom: 10px; }
.playbook-card .actions { gap: 8px; margin-top: 16px; }
.playbook-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(120px, 210px); gap: 40px; align-items: center; }
.playbook-reading section { margin-top: 56px; }
.playbook-reading h2 { font-size: clamp(25px, 3.2vw, 38px); }
.playbook-reading table { width: 100%; border-collapse: collapse; margin-bottom: 24px; font-size: .86rem; overflow-wrap: anywhere; }
.playbook-reading td, .playbook-reading th { border: 1px solid #dedfd9; padding: 8px; text-align: left; }
.playbook-reading th { background: #f4e2d4; }
.playbook-reading blockquote { margin-inline: 0; padding-inline-start: 18px; border-inline-start: 3px solid #f47b35; }
@media (max-width: 1000px) { .playbook-grid { grid-template-columns: 1fr; } }
@media (max-width: 560px) {
  .playbook-hero { grid-template-columns: 1fr; gap: 22px; }
  .playbook-hero img { max-width: 142px; }
  .playbook-card { grid-template-columns: 1fr; gap: 16px; }
  .playbook-card img { max-width: 115px; }
}
