/* Learn section redesign (v3), 2026-10-15: /learn/ hub (ab-learn-hub.php) and the guides (ab-learn-article.php).
   Loaded after hub-v3.css by mu-plugins/ab-hub-v3-router.php. Scoped to body.ab-redesign-learn-hub /
   body.ab-redesign-learn-article .ab-v3-main. The article bodies carry a lot of inline styles (tables, callout
   boxes), hence the !important on those overrides. Tokens: forest #2E331D, leaf #7FC688, marigold #FAAF3A. */

/* ======================================================================
   Shared: light hero
   ====================================================================== */
body.ab-redesign-learn-hub .ab-v3-main .ab-learn-hero,
body.ab-redesign-learn-article .ab-v3-main .ab-article-hero { background: transparent; padding: 44px 32px 8px; }
body.ab-redesign-learn-hub .ab-v3-main .ab-learn-hero__inner,
body.ab-redesign-learn-article .ab-v3-main .ab-article-hero__inner { max-width: 1256px; margin: 0 auto; }
body.ab-redesign-learn-hub .ab-v3-main .ab-learn-hero__label,
body.ab-redesign-learn-hub .ab-v3-main .ab-learn-hero__label a,
body.ab-redesign-learn-article .ab-v3-main .ab-article-hero__label,
body.ab-redesign-learn-article .ab-v3-main .ab-article-hero__label a {
  font-family: var(--ab-font-body); font-size: 12px; letter-spacing: .03em; text-transform: none; color: rgba(46, 51, 29, .6); margin: 0 0 14px;
}
body.ab-redesign-learn-hub .ab-v3-main .ab-learn-hero__title,
body.ab-redesign-learn-article .ab-v3-main .ab-article-hero__title {
  font-family: var(--ab-font-display); font-weight: 400; text-transform: lowercase; letter-spacing: 0; color: var(--ab-color-forest);
}
body.ab-redesign-learn-hub .ab-v3-main .ab-learn-hero__title { font-size: clamp(40px, 5.4vw, 72px); line-height: 1; margin: 0 0 16px; }
body.ab-redesign-learn-article .ab-v3-main .ab-article-hero__title { font-size: clamp(34px, 4.2vw, 58px); line-height: 1.04; margin: 0 0 14px; max-width: 980px; }
body.ab-redesign-learn-hub .ab-v3-main .ab-learn-hero__desc {
  font-family: var(--ab-font-body); font-weight: 300; font-size: 16px; line-height: 1.7; color: rgba(46, 51, 29, .85); max-width: 720px;
}
body.ab-redesign-learn-article .ab-v3-main .ab-article-hero__meta {
  display: inline-flex; font-family: var(--ab-font-body); font-size: 12.5px; color: var(--ab-color-forest);
  background: #fff; border: 1.5px solid rgba(46, 51, 29, .14); border-radius: 999px; padding: 6px 14px;
}

/* ======================================================================
   /learn/ hub
   ====================================================================== */
body.ab-redesign-learn-hub .ab-v3-main .ab-learn-hero__stats { border-top: 0; padding-top: 0; margin-top: 24px; gap: 12px; flex-wrap: wrap; }
body.ab-redesign-learn-hub .ab-v3-main .ab-learn-hero__stat {
  font-family: var(--ab-font-body); font-size: 13px; color: rgba(46, 51, 29, .7);
  background: #fff; border-radius: 18px; padding: 14px 22px; min-width: 120px;
}
body.ab-redesign-learn-hub .ab-v3-main .ab-learn-hero__stat strong {
  font-family: var(--ab-font-display); font-weight: 400; font-size: 34px; line-height: 1; color: var(--ab-color-forest); margin-bottom: 4px;
}
body.ab-redesign-learn-hub .ab-v3-main .ab-learn-hero__inner > p:last-child a {
  display: inline-flex; color: var(--ab-color-forest) !important; font-family: var(--ab-font-body); font-size: 14px !important;
  background: var(--ab-color-marigold); border-radius: 999px; padding: 10px 20px; box-shadow: 0 6px 16px rgba(250, 175, 58, .3);
}
body.ab-redesign-learn-hub .ab-v3-main .ab-learn-hero__inner > p:last-child a:hover { background: var(--ab-color-forest); color: #fff !important; }

body.ab-redesign-learn-hub .ab-v3-main .ab-learn-body { max-width: 1256px; padding: 48px 32px 8px; box-sizing: content-box; }
body.ab-redesign-learn-hub .ab-v3-main .ab-learn-section { margin-bottom: 56px; scroll-margin-top: 100px; }
body.ab-redesign-learn-hub .ab-v3-main .ab-learn-section__header { margin-bottom: 22px; }
body.ab-redesign-learn-hub .ab-v3-main .ab-learn-section__title {
  font-family: var(--ab-font-display); font-weight: 400; text-transform: lowercase; letter-spacing: 0;
  font-size: clamp(28px, 3vw, 42px); line-height: 1.05; color: var(--ab-color-forest); margin: 0 0 8px; gap: 12px;
}
body.ab-redesign-learn-hub .ab-v3-main .ab-learn-section__icon {
  display: inline-flex; align-items: center; justify-content: center; flex: none; width: 46px; height: 46px; margin: 0;
  background: #fff; border-radius: 50%; font-size: 21px;
}
body.ab-redesign-learn-hub .ab-v3-main .ab-learn-section__desc { font-family: var(--ab-font-body); font-weight: 300; font-size: 15px; color: rgba(46, 51, 29, .78); margin-left: 58px; }
body.ab-redesign-learn-hub .ab-v3-main .ab-learn-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
body.ab-redesign-learn-hub .ab-v3-main .ab-learn-card {
  flex-direction: column; gap: 14px; background: #fff; border: 1.5px solid transparent; border-radius: 22px; padding: 22px 22px 20px;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
body.ab-redesign-learn-hub .ab-v3-main .ab-learn-card:hover { transform: translateY(-4px); border-color: var(--ab-color-marigold); box-shadow: 0 14px 26px rgba(46, 51, 29, .1); }
body.ab-redesign-learn-hub .ab-v3-main .ab-learn-card__content { order: 1; }
body.ab-redesign-learn-hub .ab-v3-main .ab-learn-card__arrow {
  order: 2; margin-top: auto; width: 34px; height: 34px; background: var(--ab-color-page-bg); color: var(--ab-color-forest); font-size: 15px;
}
body.ab-redesign-learn-hub .ab-v3-main .ab-learn-card:hover .ab-learn-card__arrow { background: var(--ab-color-marigold); color: var(--ab-color-forest); }
body.ab-redesign-learn-hub .ab-v3-main .ab-learn-card__title {
  font-family: var(--ab-font-display); font-weight: 400; text-transform: lowercase; font-size: 21px; line-height: 1.1; color: var(--ab-color-forest); margin: 0 0 8px;
}
body.ab-redesign-learn-hub .ab-v3-main .ab-learn-card__excerpt { font-family: var(--ab-font-body); font-weight: 300; font-size: 13.5px; line-height: 1.6; color: rgba(46, 51, 29, .75); -webkit-line-clamp: 3; }
/* "Show all states" + legality links */
body.ab-redesign-learn-hub .ab-v3-main .ab-learn-section button {
  background: var(--ab-color-forest) !important; color: #fff !important; border-radius: 999px !important; padding: 12px 28px !important;
  font-family: var(--ab-font-body) !important; font-size: 14px !important; font-weight: 400 !important; margin-top: 10px;
}
body.ab-redesign-learn-hub .ab-v3-main .ab-learn-section button:hover { background: var(--ab-color-marigold) !important; color: var(--ab-color-forest) !important; }
body.ab-redesign-learn-hub .ab-v3-main .ab-learn-section button + p a,
body.ab-redesign-learn-hub .ab-v3-main .ab-learn-section button + p + p a { color: var(--ab-color-forest) !important; font-family: var(--ab-font-body); text-underline-offset: 3px; }
/* FAQ */
body.ab-redesign-learn-hub .ab-v3-main .ab-learn-faq { max-width: 900px; }
body.ab-redesign-learn-hub .ab-v3-main .ab-learn-faq details { background: #fff; border: 1px solid var(--ab-color-mint-medium); border-radius: 16px; }
body.ab-redesign-learn-hub .ab-v3-main .ab-learn-faq details[open] { border-color: var(--ab-color-marigold); }
body.ab-redesign-learn-hub .ab-v3-main .ab-learn-faq summary { background: transparent; font-family: var(--ab-font-body); font-weight: 400; font-size: 15px; color: var(--ab-color-forest); }
body.ab-redesign-learn-hub .ab-v3-main .ab-learn-faq details div { font-family: var(--ab-font-body); font-weight: 300; color: rgba(46, 51, 29, .85); }
/* "Ready to shop?" box (inline-styled) */
body.ab-redesign-learn-hub .ab-v3-main .ab-learn-body > div[style*="background:var(--ab-green)"] {
  background: var(--ab-color-forest) !important; border-radius: 28px !important; padding: 56px 32px !important; margin-top: 8px !important;
}
body.ab-redesign-learn-hub .ab-v3-main .ab-learn-body > div[style*="background:var(--ab-green)"] h2 {
  font-family: var(--ab-font-display) !important; font-weight: 400 !important; text-transform: lowercase; font-size: clamp(30px, 3.2vw, 44px) !important; color: var(--ab-color-mint-light) !important;
}
body.ab-redesign-learn-hub .ab-v3-main .ab-learn-body > div[style*="background:var(--ab-green)"] p { font-family: var(--ab-font-body); font-weight: 300; color: rgba(235, 244, 232, .8) !important; }
body.ab-redesign-learn-hub .ab-v3-main .ab-learn-body > div[style*="background:var(--ab-green)"] a {
  background: var(--ab-color-marigold) !important; color: var(--ab-color-forest) !important; border-radius: 999px !important; font-family: var(--ab-font-body); font-weight: 400 !important; padding: 13px 30px !important;
}
body.ab-redesign-learn-hub .ab-v3-main .ab-learn-body > div[style*="background:var(--ab-green)"] a:hover { background: #fff !important; }
body.ab-redesign-learn-hub .ab-v3-main .ab-learn-footer { max-width: 1256px; padding: 24px 32px 72px; box-sizing: content-box; }
body.ab-redesign-learn-hub .ab-v3-main .ab-learn-footer__note { border-top: 1px solid var(--ab-color-mint-medium); font-family: var(--ab-font-body); font-weight: 300; font-size: 13px; color: rgba(46, 51, 29, .7); }

/* ======================================================================
   Articles
   ====================================================================== */
body.ab-redesign-learn-article .ab-v3-main .ab-article-layout { max-width: 1256px; padding: 28px 32px 72px; grid-template-columns: minmax(0, 1fr) 300px; gap: 28px; box-sizing: content-box; }
/* Reading card */
body.ab-redesign-learn-article .ab-v3-main .ab-article-main {
  background: var(--ab-color-card-bg); border-radius: 28px; padding: 52px 60px;
  font-family: var(--ab-font-body); color: rgba(46, 51, 29, .88);
}
body.ab-redesign-learn-article .ab-v3-main .ab-article-main p,
body.ab-redesign-learn-article .ab-v3-main .ab-article-main li { font-family: var(--ab-font-body); font-weight: 300; font-size: 16px; line-height: 1.8; color: rgba(46, 51, 29, .88); }
body.ab-redesign-learn-article .ab-v3-main .ab-article-main strong { font-weight: 700; color: var(--ab-color-forest); }
body.ab-redesign-learn-article .ab-v3-main .ab-article-main h2 {
  font-family: var(--ab-font-display) !important; font-weight: 400 !important; text-transform: lowercase; letter-spacing: 0;
  font-size: clamp(28px, 2.6vw, 38px) !important; line-height: 1.1; color: var(--ab-color-forest) !important; margin: 52px 0 16px; padding-top: 0; scroll-margin-top: 100px;
}
body.ab-redesign-learn-article .ab-v3-main .ab-article-main h3 {
  font-family: var(--ab-font-body) !important; font-weight: 700 !important; font-size: 18px !important; color: var(--ab-color-forest) !important;
  margin: 32px 0 10px; padding-top: 14px; position: relative;
}
body.ab-redesign-learn-article .ab-v3-main .ab-article-main h3::before {
  content: ""; position: absolute; top: 0; left: 0; width: 36px; height: 3px; border-radius: 3px; background: var(--ab-color-marigold);
}
body.ab-redesign-learn-article .ab-v3-main .ab-article-main a { color: var(--ab-color-forest); text-underline-offset: 3px; text-decoration-color: rgba(46, 51, 29, .35); }
body.ab-redesign-learn-article .ab-v3-main .ab-article-main a:hover { text-decoration-color: var(--ab-color-marigold); }
body.ab-redesign-learn-article .ab-v3-main .ab-article-main li::marker { color: var(--ab-color-leaf); }
body.ab-redesign-learn-article .ab-v3-main .ab-article-main img { border-radius: 18px; height: auto; }
body.ab-redesign-learn-article .ab-v3-main .ab-article-main figcaption { font-family: var(--ab-font-body); font-weight: 300; color: rgba(46, 51, 29, .65) !important; }
body.ab-redesign-learn-article .ab-v3-main .ab-article-main hr { border-top: 1px solid var(--ab-color-mint-medium); }
/* Byline */
body.ab-redesign-learn-article .ab-v3-main .ab-author-byline { font-family: var(--ab-font-body); color: rgba(46, 51, 29, .7) !important; font-size: 13.5px !important; }
/* Callout boxes: one family of rounded cards instead of four colour schemes */
body.ab-redesign-learn-article .ab-v3-main .ab-key-takeaway,
body.ab-redesign-learn-article .ab-v3-main .ab-plain-english,
body.ab-redesign-learn-article .ab-v3-main .ab-medical-reviewer,
body.ab-redesign-learn-article .ab-v3-main .ab-scope-note,
body.ab-redesign-learn-article .ab-v3-main .ab-ymyl-disclaimer,
body.ab-redesign-learn-article .ab-v3-main .ab-sge-table-wrap,
body.ab-redesign-learn-article .ab-v3-main .learn-article__toc,
body.ab-redesign-learn-article .ab-v3-main .learn-toc,
body.ab-redesign-learn-article .ab-v3-main .toc-box {
  background: #fff !important; border: 1px solid var(--ab-color-mint-medium) !important; border-radius: 20px !important; padding: 22px 26px !important;
  color: rgba(46, 51, 29, .88) !important;
}
body.ab-redesign-learn-article .ab-v3-main .ab-key-takeaway { border-left: 4px solid var(--ab-color-leaf) !important; }
body.ab-redesign-learn-article .ab-v3-main .ab-plain-english { border-left: 4px solid var(--ab-color-marigold) !important; }
body.ab-redesign-learn-article .ab-v3-main .ab-medical-reviewer { border-left: 4px solid var(--ab-color-forest) !important; }
body.ab-redesign-learn-article .ab-v3-main .ab-scope-note,
body.ab-redesign-learn-article .ab-v3-main .ab-ymyl-disclaimer { background: #FFF8EC !important; border-color: #F3DDB4 !important; }
body.ab-redesign-learn-article .ab-v3-main .ab-key-takeaway *,
body.ab-redesign-learn-article .ab-v3-main .ab-plain-english *,
body.ab-redesign-learn-article .ab-v3-main .ab-medical-reviewer *,
body.ab-redesign-learn-article .ab-v3-main .ab-scope-note *,
body.ab-redesign-learn-article .ab-v3-main .ab-ymyl-disclaimer * { color: inherit !important; }
body.ab-redesign-learn-article .ab-v3-main .ab-key-takeaway > p:first-child,
body.ab-redesign-learn-article .ab-v3-main .ab-plain-english > p:first-child {
  font-size: 11.5px !important; letter-spacing: 1.6px; text-transform: uppercase; font-weight: 700 !important; color: #8F5E08 !important;
}
body.ab-redesign-learn-article .ab-v3-main .ab-medical-reviewer a { color: var(--ab-color-forest) !important; }
/* Tables */
body.ab-redesign-learn-article .ab-v3-main .ab-article-main table {
  width: 100%; border-collapse: separate !important; border-spacing: 0; background: #fff; border: 1px solid var(--ab-color-mint-medium) !important;
  border-radius: 16px; overflow: hidden; font-family: var(--ab-font-body);
}
body.ab-redesign-learn-article .ab-v3-main .ab-article-main th,
body.ab-redesign-learn-article .ab-v3-main .ab-article-main td {
  border: 0 !important; border-bottom: 1px solid var(--ab-color-mint-medium) !important; font-size: 14px !important; color: var(--ab-color-forest);
}
body.ab-redesign-learn-article .ab-v3-main .ab-article-main tr:last-child td { border-bottom: 0 !important; }
body.ab-redesign-learn-article .ab-v3-main .ab-article-main tr[style*="background:#14532d"],
body.ab-redesign-learn-article .ab-v3-main .ab-article-main tr[style*="background: #2D5016"],
body.ab-redesign-learn-article .ab-v3-main .ab-article-main thead tr,
body.ab-redesign-learn-article .ab-v3-main .ab-article-main th { background: var(--ab-color-forest) !important; color: #fff !important; }
body.ab-redesign-learn-article .ab-v3-main .ab-article-main th { font-weight: 400 !important; letter-spacing: .02em; }
body.ab-redesign-learn-article .ab-v3-main .ab-article-main tr[style*="background:#f9f9f9"],
body.ab-redesign-learn-article .ab-v3-main .ab-article-main tr[style*="background: #f8fafc"] { background: rgba(235, 244, 232, .5) !important; }
body.ab-redesign-learn-article .ab-v3-main .ab-article-main caption { font-family: var(--ab-font-body); color: var(--ab-color-forest); }
/* FAQ details */
body.ab-redesign-learn-article .ab-v3-main .ab-article-main details { background: #fff; border: 1px solid var(--ab-color-mint-medium); border-radius: 16px; }
body.ab-redesign-learn-article .ab-v3-main .ab-article-main details[open] { border-color: var(--ab-color-marigold); }
body.ab-redesign-learn-article .ab-v3-main .ab-article-main summary { background: transparent; font-family: var(--ab-font-body); font-weight: 400; color: var(--ab-color-forest); }
/* Author box */
body.ab-redesign-learn-article .ab-v3-main .ab-author-box { background: #fff; border: 0; border-radius: 22px; padding: 26px; }
body.ab-redesign-learn-article .ab-v3-main .ab-author-box__label { color: #8F5E08; letter-spacing: 1.6px; }
body.ab-redesign-learn-article .ab-v3-main .ab-author-box__name { font-family: var(--ab-font-display); font-weight: 400; text-transform: lowercase; font-size: 24px; color: var(--ab-color-forest); }
body.ab-redesign-learn-article .ab-v3-main .ab-author-box__title { color: rgba(46, 51, 29, .65); }
body.ab-redesign-learn-article .ab-v3-main .ab-author-box__bio { font-size: 14px !important; }
body.ab-redesign-learn-article .ab-v3-main .ab-author-box__link { color: var(--ab-color-forest) !important; }
/* Back link */
body.ab-redesign-learn-article .ab-v3-main .ab-article-back {
  background: #fff; border: 1.5px solid rgba(46, 51, 29, .18); border-radius: 999px; font-family: var(--ab-font-body); font-weight: 400; color: var(--ab-color-forest) !important;
}
body.ab-redesign-learn-article .ab-v3-main .ab-article-back:hover { background: #fff; border-color: var(--ab-color-marigold); }
/* Shop CTA (inline-styled) */
body.ab-redesign-learn-article .ab-v3-main .ab-article-main > div[style*="background:#2D5016"] { background: var(--ab-color-forest) !important; border-radius: 24px !important; padding: 44px 28px !important; }
body.ab-redesign-learn-article .ab-v3-main .ab-article-main > div[style*="background:#2D5016"] h2 { color: var(--ab-color-mint-light) !important; margin-top: 0 !important; }
body.ab-redesign-learn-article .ab-v3-main .ab-article-main > div[style*="background:#2D5016"] p { color: rgba(235, 244, 232, .8) !important; }
body.ab-redesign-learn-article .ab-v3-main .ab-article-main > div[style*="background:#2D5016"] a {
  background: var(--ab-color-marigold) !important; color: var(--ab-color-forest) !important; border-radius: 999px !important; font-weight: 400 !important; text-decoration: none;
}
body.ab-redesign-learn-article .ab-v3-main .ab-article-main > div[style*="background:#2D5016"] a:hover { background: #fff !important; }
body.ab-redesign-learn-article .ab-v3-main .ab-article-disclaimer { border-top: 1px solid var(--ab-color-mint-medium); font-family: var(--ab-font-body); font-weight: 300; color: rgba(46, 51, 29, .7); }
/* Sidebar */
body.ab-redesign-learn-article .ab-v3-main .ab-article-sidebar { top: 110px; }
body.ab-redesign-learn-article .ab-v3-main .ab-article-toc { background: #fff; border-radius: 22px; padding: 22px 24px; }
body.ab-redesign-learn-article .ab-v3-main .ab-article-toc__title,
body.ab-redesign-learn-article .ab-v3-main .ab-article-related__title {
  font-family: var(--ab-font-body); font-size: 11.5px; letter-spacing: 1.6px; font-weight: 700; color: #8F5E08;
}
body.ab-redesign-learn-article .ab-v3-main .ab-article-toc__list a,
body.ab-redesign-learn-article .ab-v3-main .ab-article-related__list a { font-family: var(--ab-font-body); font-size: 13.5px; color: var(--ab-color-forest); }
body.ab-redesign-learn-article .ab-v3-main .ab-article-toc__list a:hover,
body.ab-redesign-learn-article .ab-v3-main .ab-article-related__list a:hover { color: #8F5E08; }
body.ab-redesign-learn-article .ab-v3-main .ab-article-related { padding: 4px 24px; }
body.ab-redesign-learn-article .ab-v3-main .ab-article-related__list li { border-bottom-color: var(--ab-color-mint-medium); }

/* ======================================================================
   Tablet / mobile
   ====================================================================== */
@media (max-width: 1100px) {
  body.ab-redesign-learn-hub .ab-v3-main .ab-learn-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  body.ab-redesign-learn-article .ab-v3-main .ab-article-layout { grid-template-columns: 1fr; }
  body.ab-redesign-learn-article .ab-v3-main .ab-article-sidebar { position: static; }
}
@media (max-width: 760px) {
  body.ab-redesign-learn-hub .ab-v3-main .ab-learn-hero,
  body.ab-redesign-learn-article .ab-v3-main .ab-article-hero { padding: 26px 16px 4px; }
  body.ab-redesign-learn-hub .ab-v3-main .ab-learn-body { padding: 32px 16px 4px; }
  body.ab-redesign-learn-hub .ab-v3-main .ab-learn-grid { grid-template-columns: 1fr; }
  body.ab-redesign-learn-hub .ab-v3-main .ab-learn-section__desc { margin-left: 0; }
  body.ab-redesign-learn-hub .ab-v3-main .ab-learn-hero__stats { flex-direction: row; gap: 8px; }
  body.ab-redesign-learn-hub .ab-v3-main .ab-learn-hero__stat { flex: 1; padding: 10px 14px; min-width: 0; }
  body.ab-redesign-learn-hub .ab-v3-main .ab-learn-hero__stat strong { font-size: 26px; }
  body.ab-redesign-learn-hub .ab-v3-main .ab-learn-footer { padding: 16px 16px 56px; }
  body.ab-redesign-learn-article .ab-v3-main .ab-article-layout { padding: 16px 16px 56px; }
  body.ab-redesign-learn-article .ab-v3-main .ab-article-main { padding: 28px 20px; border-radius: 22px; }
  body.ab-redesign-learn-article .ab-v3-main .ab-article-main table { display: block; overflow-x: auto; }
  body.ab-redesign-learn-article .ab-v3-main .ab-key-takeaway, body.ab-redesign-learn-article .ab-v3-main .ab-plain-english,
  body.ab-redesign-learn-article .ab-v3-main .ab-medical-reviewer, body.ab-redesign-learn-article .ab-v3-main .ab-scope-note,
  body.ab-redesign-learn-article .ab-v3-main .ab-ymyl-disclaimer, body.ab-redesign-learn-article .ab-v3-main .ab-sge-table-wrap,
  body.ab-redesign-learn-article .ab-v3-main .learn-article__toc, body.ab-redesign-learn-article .ab-v3-main .learn-toc,
  body.ab-redesign-learn-article .ab-v3-main .toc-box { padding: 16px 16px !important; border-radius: 16px !important; }
}