/* Articles: loaded last on every article page, so it overrides the older inline styles
   each article still carries. Brings articles in line with the v2 pages: readable
   sentence-case labels, pill buttons, larger body text, the v2 menu and footer. */

body { font-weight: 400; }

/* -- Labels -- */
.eyebrow {
  font-size: 0.8rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.08em !important;
  color: var(--rose);
}

/* -- Buttons: pill, sentence case -- */
.btn-primary {
  border-radius: 100px;
  font-size: 0.95rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.01em !important;
  text-transform: none !important;
  padding: 0.95rem 1.9rem !important;
}

/* -- Menu: same as the rest of the site -- */
.nav-links a { font-size: 0.8rem; letter-spacing: 0.14em; }
.nav-drawer a {
  font-size: 1.0625rem !important;
  letter-spacing: 0.01em !important;
  text-transform: none !important;
  color: var(--mocha) !important;
}
.nav-drawer a.nav-drawer-book { color: var(--cream) !important; font-size: 0.95rem !important; }

/* -- Article header -- */
.article-hero { padding: calc(80px + 2.25rem) 0 0.5rem; }
.article-hero h1 { font-weight: 400; line-height: 1.08; }
.article-back {
  font-size: 0.95rem !important;
  letter-spacing: 0.01em !important;
  text-transform: none !important;
  color: var(--mocha) !important;
  margin-bottom: 1.5rem !important;
}
/* author / read-time lines are styled inline; keep them readable, not tiny capitals */
.article-hero p {
  font-size: 0.9rem !important;
  letter-spacing: 0.01em !important;
  text-transform: none !important;
}

/* -- Body text: darker and a touch larger for easy reading on phones -- */
.article-body p,
.article-body li {
  font-size: 1.0625rem;
  line-height: 1.75;
  color: #4A443E;
}
.article-body h2 { font-weight: 400; font-size: clamp(1.6rem, 6vw, 2.1rem); line-height: 1.15; }
.article-body h3 { font-weight: 500; }
.article-body a { text-underline-offset: 3px; }
.pull-quote { font-size: 1.35rem !important; border-left-width: 3px !important; }
.warning-list { border-radius: 16px; }
.warning-list li { color: var(--mocha); }

/* -- Closing call to action -- */
.article-cta { border-radius: 24px; padding: 3rem 1.5rem !important; }
.article-cta h2 { font-weight: 400; }
.article-cta p { font-size: 1rem !important; }
.article-cta .btn-primary { background: var(--cream); color: var(--mocha); }
.article-cta .btn-primary:hover { background: var(--blush); }

/* -- Footer: same readable size as the rest of the site -- */
.footer-legal {
  font-size: 0.82rem !important;
  line-height: 1.7;
  letter-spacing: 0.01em !important;
  color: #cfc7be !important;
}
.footer-legal a { color: #cfc7be !important; }

@media (max-width: 900px) {
  .container-narrow, .container { padding-left: 1.25rem; padding-right: 1.25rem; }
}
