/* hercmagnus.com blog highlight elements (shared by all posts). v20261021a */

/* 0. Default lists and quotes: every post gets these with plain markup */
.article-body ul:not([class]){list-style:none;margin:0 0 26px;padding:0}
.article-body ul:not([class])>li{position:relative;margin:0 0 12px;padding-left:28px}
.article-body ul:not([class])>li::before{content:'';position:absolute;left:4px;top:.62em;width:9px;height:9px;border-radius:2px;background:var(--accent-bright);transform:rotate(45deg);box-shadow:0 0 0 4px rgba(37,73,255,.16)}
.article-body ol:not([class]){list-style:none;margin:0 0 26px;padding:0;counter-reset:hmo}
.article-body ol:not([class])>li{counter-increment:hmo;position:relative;margin:0 0 14px;padding-left:44px;min-height:30px}
.article-body ol:not([class])>li::before{content:counter(hmo);position:absolute;left:0;top:.05em;width:30px;height:30px;display:grid;place-items:center;border-radius:8px;background:var(--accent-soft);border:1px solid rgba(90,120,255,.35);color:var(--accent-bright);font-family:var(--mono);font-size:14px;font-weight:700}
.article-body li>ul:not([class]),.article-body li>ol:not([class]){margin:12px 0 0}
.article-body blockquote{position:relative;margin:32px 0;padding:24px 26px 24px 64px;background:var(--card);border:1px solid var(--line);border-radius:14px;font-size:19px;line-height:1.6;font-style:italic;color:var(--text)}
.article-body blockquote::before{content:'\201C';position:absolute;left:18px;top:10px;font-family:var(--display);font-style:normal;font-size:60px;line-height:1;color:var(--accent)}
.article-body blockquote p{margin:0 0 12px}
.article-body blockquote p:last-child{margin:0}
.article-body blockquote cite,.article-body blockquote footer{display:block;margin-top:12px;font-style:normal;font-family:var(--mono);font-size:13px;letter-spacing:.06em;color:var(--dim)}
.article-body hr{height:1px;margin:44px 0;border:0;background:linear-gradient(90deg,transparent,var(--line) 20%,var(--accent) 50%,var(--line) 80%,transparent)}
.article-body a:not(.btn){color:var(--accent-bright);text-decoration:underline;text-decoration-color:rgba(90,120,255,.45);text-underline-offset:3px}
.article-body a:not(.btn):hover{text-decoration-color:var(--accent-bright)}

/* 1. Key statement: the one line the reader must remember */
.article-body .hm-key{position:relative;margin:36px 0;padding:26px 28px 26px 30px;background:linear-gradient(135deg,rgba(37,73,255,.16),rgba(37,73,255,.04));border:1px solid rgba(90,120,255,.28);border-left:4px solid var(--accent);border-radius:14px;font-family:var(--display);font-weight:700;font-size:clamp(21px,2.4vw,26px);line-height:1.3;letter-spacing:-.01em;color:var(--text)}
.article-body .hm-key strong{font-weight:700;color:inherit}

/* 2. Punch line: short emphasis, no box */
.article-body .hm-punch{margin:30px 0;font-family:var(--display);font-weight:700;font-size:clamp(22px,2.6vw,28px);line-height:1.25;color:var(--text)}
.article-body .hm-punch strong{font-weight:700;color:inherit}
.article-body .hm-punch .hl{color:var(--warn)}

/* 3. Question box: numbered questions to ask yourself */
.article-body .hm-questions{margin:28px 0 36px;padding:24px 26px;background:var(--card);border:1px solid var(--line);border-radius:14px}
.article-body .hm-questions .hm-label{display:block;margin:0 0 14px;font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-bright)}
.article-body .hm-questions ol{list-style:none;margin:0;padding:0;counter-reset:hmq}
.article-body .hm-questions li{counter-increment:hmq;display:flex;align-items:center;gap:16px;margin:0;padding:12px 0;border-top:1px solid var(--line);font-family:var(--display);font-size:clamp(19px,2.2vw,23px);line-height:1.3;color:var(--text)}
.article-body .hm-questions li:first-child{border-top:0;padding-top:0}
.article-body .hm-questions li::before{content:counter(hmq);flex:0 0 38px;height:38px;display:grid;place-items:center;border-radius:50%;background:var(--accent);color:#fff;font-family:var(--mono);font-size:16px;font-weight:700}
.article-body .hm-questions li strong{font-weight:700;color:inherit}

/* 4. Point cards: a short list of reasons, each with a bold lead */
.article-body .hm-cards{list-style:none;margin:24px 0 32px;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.article-body .hm-cards li{margin:0;padding:20px;background:var(--card);border:1px solid var(--line);border-top:3px solid var(--accent);border-radius:12px;font-size:16px;line-height:1.55;min-width:0}
.article-body .hm-cards li strong{display:block;margin-bottom:8px;font-family:var(--display);font-size:18px;line-height:1.3;color:var(--text)}

/* 5. Keyword chips: lists of search phrases */
.article-body .hm-chips{list-style:none;margin:16px 0 26px;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.article-body .hm-chips li{margin:0;padding:8px 14px;background:rgba(37,73,255,.10);border:1px solid rgba(90,120,255,.30);border-radius:999px;font-family:var(--mono);font-size:14px;line-height:1.3;color:#cdd6ff}
.article-body .hm-chips li.more{background:transparent;border-style:dashed;color:var(--dim)}

/* 6. Chip groups: several labelled chip lists in one panel */
.article-body .hm-chipgroups{margin:24px 0 32px;padding:22px 24px;background:var(--card);border:1px solid var(--line);border-radius:14px;display:grid;gap:18px}
.article-body .hm-chipgroups p{margin:0 0 4px;font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-bright)}
.article-body .hm-chipgroups .hm-chips{margin:0}

/* 7. Hunch cards: beliefs shown as untested claims */
.article-body .hm-hunches{margin:24px 0 28px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.article-body .hm-hunch{position:relative;margin:0;padding:22px 20px 20px;background:rgba(226,93,93,.07);border:1px dashed rgba(226,93,93,.45);border-radius:12px;font-family:var(--display);font-weight:600;font-size:20px;line-height:1.3;color:var(--text);min-width:0}
.article-body .hm-hunch::before{content:'HUNCH';display:block;margin-bottom:8px;font-family:var(--mono);font-size:11px;letter-spacing:.16em;color:var(--bad)}

/* 8. Pull quote: the big idea, centred */
.article-body .hm-pull{margin:40px 0;padding:34px 30px;text-align:center;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-family:var(--display);font-weight:700;font-size:clamp(24px,3vw,32px);line-height:1.25;letter-spacing:-.01em;color:var(--text)}
.article-body .hm-pull::before{content:'\201C';display:block;margin-bottom:6px;font-size:64px;line-height:.6;color:var(--accent)}
.article-body .hm-pull strong{font-weight:700;color:inherit}

/* 9. Finale: the closing question */
.article-body .hm-finale{margin:36px 0 8px;padding:34px 28px;text-align:center;background:linear-gradient(135deg,rgba(37,73,255,.22),rgba(232,179,57,.10));border:1px solid rgba(90,120,255,.35);border-radius:16px}
.article-body .hm-finale p{margin:0}
.article-body .hm-finale .lead{font-size:17px;color:var(--muted);margin-bottom:10px}
.article-body .hm-finale .big{font-family:var(--display);font-weight:800;font-size:clamp(30px,4vw,44px);line-height:1.1;color:var(--warn)}
.article-body .hm-finale strong{font-weight:inherit;color:inherit}

/* 10. Converted callouts (Skool-imported posts) and extras */
.article-body .hm-key p{margin:0}
.article-body .hm-key p+p{margin-top:10px}
.article-body .hm-linkbtn{margin:26px 0}
.article-body .hm-linkbtn p{margin:0}
.article-body .hm-linkbtn a{display:inline-flex;align-items:center;gap:8px;padding:14px 22px;border-radius:12px;background:var(--accent);color:#fff !important;font-family:var(--display);font-weight:700;font-size:18px;text-decoration:none !important;box-shadow:0 8px 24px rgba(37,73,255,.28)}
.article-body .hm-linkbtn a:hover{background:var(--accent-bright)}
.article-body .hm-steps{margin:28px 0 32px;display:grid;gap:10px}
.article-body .hm-steps p{margin:0;padding:16px 20px;background:var(--card);border:1px solid var(--line);border-left:4px solid var(--accent);border-radius:12px;font-family:var(--display);font-weight:700;font-size:20px;color:var(--text)}
.article-body .hm-steps p:nth-child(2){margin-left:18px}
.article-body .hm-steps p:nth-child(3){margin-left:36px}
.article-body .hm-steps p:nth-child(4){margin-left:54px;border-left-color:var(--warn)}
.article-body .hm-bad,.article-body .hm-good{margin:14px 0 18px;padding:16px 20px;border-radius:12px;font-family:var(--mono);font-size:16px;line-height:1.45;color:var(--text)}
.article-body .hm-bad{background:rgba(226,93,93,.08);border:1px dashed rgba(226,93,93,.5)}
.article-body .hm-good{background:rgba(62,207,142,.08);border:1px solid rgba(62,207,142,.45)}

@media (max-width:760px){
  .article-body .hm-steps p:nth-child(n){margin-left:0}
  .article-body .hm-cards{grid-template-columns:minmax(0,1fr)}
  .article-body .hm-hunches{grid-template-columns:minmax(0,1fr)}
  .article-body .hm-key{padding:20px 20px 20px 22px}
  .article-body .hm-questions{padding:20px}
  .article-body .hm-pull{padding:26px 8px}
}