.guide-bd {
  --guide-bd-accent: #2f6fb0;      /* cool winter blue */
  --guide-bd-accent-soft: #eaf2fb; /* tinted panel background */
  --guide-bd-ink: #1f2933;         /* body text */
  --guide-bd-warn: #b5480f;        /* the "don't do this" note */
}

/* --- Headings: explicit colour, don't rely on base inheritance --- */
.guide-bd h1 {
  color: var(--guide-bd-ink);
  line-height: 1.15;
}

.guide-bd h2 {
  color: var(--guide-bd-accent);
  margin-top: 2.2em;
  margin-bottom: 0.5em;
  line-height: 1.25;
}

/* --- Lead paragraph under the H1 --- */
.guide-bd-lead {
  font-size: 1.15rem;
  line-height: 1.6;
  color: var(--guide-bd-ink);
}

/* --- The hero "one-tap trick" callout --- */
.guide-bd-tip {
  background: var(--guide-bd-accent-soft);
  border-left: 4px solid var(--guide-bd-accent);
  border-radius: 8px;
  padding: 1.1em 1.3em;
  margin: 1.8em 0;
}

.guide-bd-tip-title {
  margin: 0 0 0.4em;
  font-weight: 700;
  color: var(--guide-bd-accent);
  font-size: 1.05rem;
}

.guide-bd-tip p {
  margin: 0.4em 0 0;
}

.guide-bd-tip p:first-of-type {
  margin-top: 0;
}

/* --- Smaller inline caveat / note --- */
.guide-bd-note {
  font-size: 0.95rem;
  line-height: 1.55;
  padding: 0.9em 1.1em;
  border: 1px solid #dbe4ee;
  border-radius: 8px;
  background: #fbfcfe;
  margin: 1.4em 0;
}

/* --- End-of-day checklist --- */
.guide-bd-checklist {
  list-style: none;
  padding: 0;
  margin: 1.2em 0;
}

.guide-bd-checklist li {
  position: relative;
  padding: 0.5em 0 0.5em 1.9em;
  border-bottom: 1px solid #eef2f6;
  line-height: 1.5;
}

.guide-bd-checklist li:last-child {
  border-bottom: none;
}

.guide-bd-checklist li::before {
  content: "\2713"; /* tick */
  position: absolute;
  left: 0;
  top: 0.5em;
  color: var(--guide-bd-accent);
  font-weight: 700;
}

/* --- Inline links inside the article --- */
.guide-bd-link,
.guide-bd a {
  color: var(--guide-bd-accent);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.guide-bd-link:hover,
.guide-bd a:hover {
  text-decoration: none;
}

/* --- Soft closing CTA --- */
.guide-bd-cta {
  margin-top: 1.6em;
  padding-top: 1.2em;
  border-top: 1px solid #eef2f6;
  font-size: 1.02rem;
}

/* --- Small-screen tightening --- */
@media (max-width: 600px) {
  .guide-bd-lead { font-size: 1.08rem; }
  .guide-bd-tip { padding: 1em 1.1em; }
}