/* ===========================================
   HurrelledEditions Article Style Pro
   Version: 1.0.0
   Site: https://hurellededitions.com/
   Scoped to .he-article-wrap only
   Does NOT affect any other page or post
=========================================== */

/* ── BASE WRAPPER ── */
.he-article-wrap {
  margin: 0 auto;
  padding: 0 16px;
  line-height: 1.8;
  color: #1e1e1e;
  box-sizing: border-box;
  font-family: Georgia, 'Times New Roman', serif;
}

.he-article-wrap *,
.he-article-wrap *::before,
.he-article-wrap *::after {
  box-sizing: border-box;
}

/* ── TYPOGRAPHY ── */
.he-article-wrap p  { margin: 0 0 1.3em; }

.he-article-wrap h2 {
  font-size: 1.55em;
  font-weight: 700;
  margin: 2em 0 0.6em;
  color: #111;
  line-height: 1.3;
  font-family: Georgia, serif;
  border-bottom: 2px solid #e8eef5;
  padding-bottom: 0.3em;
}

.he-article-wrap h3 {
  font-size: 1.2em;
  font-weight: 700;
  margin: 1.6em 0 0.5em;
  color: #1a1a1a;
  line-height: 1.35;
  font-family: Georgia, serif;
}

.he-article-wrap ul,
.he-article-wrap ol {
  margin: 0 0 1.2em 0;
  padding-left: 1.5em;
}

.he-article-wrap li   { margin-bottom: 0.5em; }
.he-article-wrap strong { font-weight: 700; color: #111; }

.he-article-wrap a {
  color: #1a3a5c;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.he-article-wrap a:hover { opacity: .75; }

.he-article-wrap section { margin-bottom: 0.4em; }


/* ================================================
   CORE BOXES
================================================ */

/* ── Pull Quote Box ── */
.he-pull-quote {
  background: #f0f6ff;
  border-left: 5px solid #1a3a5c;
  border-radius: 6px;
  padding: 20px 24px;
  margin: 0 0 1.8em;
  font-style: italic;
}
.he-pq-label {
  font-weight: 700;
  font-size: 0.75em;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  margin-bottom: 8px;
  color: #1a3a5c;
  font-style: normal;
}
.he-pull-quote p {
  margin: 0;
  font-size: 1.05em;
  color: #1a3a5c;
  line-height: 1.7;
}

/* ── Tip Box ── */
.he-tip-box {
  background: #f0fdf6;
  border-left: 5px solid #2e7d5e;
  border-radius: 6px;
  padding: 16px 20px;
  margin: 1.6em 0;
}
.he-tip-label {
  display: block;
  font-weight: 700;
  font-size: 0.82em;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  margin-bottom: 8px;
  color: #2e7d5e;
}
.he-tip-box p { margin: 0; }

/* ── Note Box ── */
.he-note-box {
  background: #fffceb;
  border-left: 5px solid #7b5800;
  border-radius: 6px;
  padding: 16px 20px;
  margin: 1.6em 0;
}
.he-note-label {
  display: block;
  font-weight: 700;
  font-size: 0.82em;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  margin-bottom: 8px;
  color: #7b5800;
}
.he-note-box p { margin: 0; }

/* ── Warning Box ── */
.he-warning-box {
  background: #fff4f0;
  border-left: 5px solid #8b2500;
  border-radius: 6px;
  padding: 16px 20px;
  margin: 1.6em 0;
}
.he-warn-label {
  display: block;
  font-weight: 700;
  font-size: 0.82em;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  margin-bottom: 8px;
  color: #8b2500;
}
.he-warning-box p { margin: 0; }

/* ── Author Insight Box ── */
.he-insight-box {
  background: #f7f0ff;
  border-left: 5px solid #4a1a6b;
  border-radius: 6px;
  padding: 18px 20px;
  margin: 2em 0 1.6em;
}
.he-insight-label {
  display: block;
  font-weight: 700;
  font-size: 0.82em;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  margin-bottom: 8px;
  color: #4a1a6b;
}
.he-insight-box p { margin: 0; }


/* ================================================
   COMPONENTS
================================================ */

/* ── Book Stat Strip ── */
.he-stat-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin: 1.6em 0;
}
.he-stat-item {
  flex: 1;
  min-width: 120px;
  background: #f0f6ff;
  border: 1px solid #c7daf5;
  border-radius: 8px;
  padding: 16px 14px;
  text-align: center;
}
.he-stat-number {
  font-size: 1.8em;
  font-weight: 800;
  color: #1a3a5c;
  line-height: 1.1;
  display: block;
  font-family: Georgia, serif;
}
.he-stat-desc {
  font-size: 0.8em;
  color: #555;
  margin-top: 4px;
  display: block;
  font-family: sans-serif;
}

/* ── Reading Tips List ── */
.he-reading-tips {
  background: #f0fdf6;
  border: 1px solid #a7f3d0;
  border-radius: 8px;
  padding: 18px 20px;
  margin: 1.6em 0;
}
.he-reading-tips-title {
  font-weight: 700;
  font-size: 0.95em;
  color: #145a3e;
  margin-bottom: 12px;
  display: block;
}
.he-reading-tips ul {
  margin: 0;
  padding-left: 1.4em;
}
.he-reading-tips li {
  margin-bottom: 8px;
  font-size: 0.95em;
  color: #1e1e1e;
}

/* ── Comparison Box ── */
.he-compare {
  display: flex;
  gap: 14px;
  margin: 1.6em 0;
  flex-wrap: wrap;
}
.he-compare-col {
  flex: 1;
  min-width: 200px;
  border-radius: 8px;
  padding: 16px 18px;
}
.he-compare-col.good {
  background: #f0fdf6;
  border: 1px solid #a7f3d0;
}
.he-compare-col.bad {
  background: #fff4f0;
  border: 1px solid #fdc5b2;
}
.he-compare-title {
  font-weight: 700;
  font-size: 0.88em;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: 10px;
  display: block;
}
.he-compare-col.good .he-compare-title { color: #145a3e; }
.he-compare-col.bad  .he-compare-title { color: #8b2500; }
.he-compare-col ul {
  margin: 0;
  padding-left: 1.2em;
}
.he-compare-col li {
  font-size: 0.92em;
  margin-bottom: 6px;
  color: #1e1e1e;
}

/* ── Reading Checklist ── */
.he-checklist {
  background: #f7f8fc;
  border: 1px solid #c7daf5;
  border-radius: 8px;
  padding: 16px 20px;
  margin: 1.6em 0;
}
.he-checklist-title {
  font-weight: 700;
  font-size: 0.95em;
  color: #111;
  margin-bottom: 12px;
  display: block;
}
.he-checklist ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.he-checklist li {
  padding: 6px 0 6px 28px;
  position: relative;
  font-size: 0.95em;
  border-bottom: 1px solid #e8eef5;
  color: #1e1e1e;
  margin: 0;
}
.he-checklist li:last-child { border-bottom: none; }
.he-checklist li::before {
  content: '✓';
  position: absolute;
  left: 0;
  top: 6px;
  color: #1a3a5c;
  font-weight: 700;
  font-size: 1em;
}

/* ── Step-by-Step ── */
.he-steps {
  margin: 1.6em 0;
}
.he-step {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  padding: 16px 0;
  border-bottom: 1px solid #e8eef5;
}
.he-step:last-child { border-bottom: none; }
.he-step-num {
  flex-shrink: 0;
  width: 34px;
  height: 34px;
  background: #1a3a5c;
  color: #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 700;
  font-family: sans-serif;
}
.he-step-body { flex: 1; }
.he-step-body strong {
  font-size: 1em;
  color: #111;
  display: block;
  margin-bottom: 4px;
}
.he-step-body p {
  font-size: 0.95em;
  color: #444;
  margin: 0;
}

/* ── Did You Know Box ── */
.he-did-you-know {
  background: #fffceb;
  border: 1px solid #fde68a;
  border-radius: 8px;
  padding: 16px 20px;
  margin: 1.6em 0;
  display: flex;
  gap: 14px;
  align-items: flex-start;
}
.he-dyk-icon {
  font-size: 1.6em;
  flex-shrink: 0;
  line-height: 1;
}
.he-dyk-body { flex: 1; }
.he-dyk-label {
  font-weight: 700;
  font-size: 0.82em;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: #7b5800;
  display: block;
  margin-bottom: 6px;
}
.he-dyk-body p { margin: 0; font-size: 0.95em; color: #1e1e1e; }

/* ── Price / Edition Box ── */
.he-price-box {
  background: #f7f8fc;
  border: 1px solid #c7daf5;
  border-left: 5px solid #1a3a5c;
  border-radius: 6px;
  padding: 16px 20px;
  margin: 1.6em 0;
}
.he-price-label {
  font-weight: 700;
  font-size: 0.82em;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: #1a3a5c;
  display: block;
  margin-bottom: 10px;
}
.he-price-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 7px 0;
  border-bottom: 1px solid #c7daf5;
  font-size: 0.93em;
}
.he-price-row:last-child { border-bottom: none; }
.he-price-row span:last-child { font-weight: 700; color: #111; }

/* ── FAQ Section ── */
.he-faq { margin: 1.6em 0; }
.he-faq-item {
  border: 1px solid #d1dceb;
  border-radius: 8px;
  margin-bottom: 10px;
  overflow: hidden;
}
.he-faq-q {
  background: #f7f9fc;
  padding: 14px 18px;
  font-weight: 700;
  font-size: 0.97em;
  color: #111;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  user-select: none;
}
.he-faq-q::after {
  content: '+';
  font-size: 1.3em;
  color: #1a3a5c;
  font-weight: 400;
  flex-shrink: 0;
  transition: transform .25s;
}
.he-faq-item.open .he-faq-q::after {
  transform: rotate(45deg);
}
.he-faq-a {
  display: none;
  padding: 14px 18px;
  font-size: 0.95em;
  color: #333;
  border-top: 1px solid #d1dceb;
  background: #fff;
}
.he-faq-a p { margin: 0; }
.he-faq-item.open .he-faq-a { display: block; }

/* ── Book Details / Metadata ── */
.he-tools-box {
  background: #f7f8fc;
  border: 1px solid #c7daf5;
  border-radius: 8px;
  padding: 16px 20px;
  margin: 1.6em 0;
}
.he-tools-title {
  font-weight: 700;
  font-size: 0.95em;
  color: #111;
  margin-bottom: 12px;
  display: block;
}
.he-tools-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.he-tool-tag {
  background: #fff;
  border: 1px solid #c7daf5;
  border-radius: 20px;
  padding: 5px 14px;
  font-size: 0.85em;
  color: #1a3a5c;
  white-space: nowrap;
  font-family: sans-serif;
}

/* ── Key Takeaway / Highlight ── */
.he-highlight {
  background: linear-gradient(135deg, #f0f6ff 0%, #e8f0f8 100%);
  border: 1px solid #c7daf5;
  border-radius: 8px;
  padding: 20px 24px;
  margin: 1.6em 0;
  text-align: center;
}
.he-highlight-text {
  font-size: 1.15em;
  font-weight: 700;
  color: #1a3a5c;
  line-height: 1.4;
  display: block;
  font-family: Georgia, serif;
  font-style: italic;
}
.he-highlight-sub {
  font-size: 0.85em;
  color: #555;
  margin-top: 6px;
  display: block;
  font-family: sans-serif;
}

/* ── Editor's Note Box ── */
.he-editor-box {
  background: #fff4f0;
  border: 1px solid #fdc5b2;
  border-radius: 8px;
  padding: 16px 20px;
  margin: 1.6em 0;
  display: flex;
  gap: 14px;
  align-items: flex-start;
}
.he-editor-icon { font-size: 1.8em; flex-shrink: 0; line-height: 1; }
.he-editor-body { flex: 1; }
.he-editor-label {
  font-weight: 700;
  font-size: 0.85em;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #8b2500;
  display: block;
  margin-bottom: 6px;
}
.he-editor-body p { margin: 0; font-size: 0.95em; color: #1e1e1e; }

/* ── Recap / Summary Box ── */
.he-recap-box {
  background: #f7f0ff;
  border: 1px solid #d8c0f0;
  border-radius: 8px;
  padding: 18px 20px;
  margin: 1.6em 0;
}
.he-recap-label {
  font-weight: 700;
  font-size: 0.82em;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: #4a1a6b;
  display: block;
  margin-bottom: 10px;
}
.he-recap-box ul {
  margin: 0;
  padding-left: 1.3em;
}
.he-recap-box li {
  font-size: 0.95em;
  margin-bottom: 6px;
  color: #1e1e1e;
}

/* ── Dos and Don'ts ── */
.he-dos-donts {
  display: flex;
  gap: 14px;
  margin: 1.6em 0;
  flex-wrap: wrap;
}
.he-dos, .he-donts {
  flex: 1;
  min-width: 200px;
  border-radius: 8px;
  padding: 16px 18px;
}
.he-dos {
  background: #f0fdf6;
  border: 1px solid #a7f3d0;
}
.he-donts {
  background: #fff4f0;
  border: 1px solid #fdc5b2;
}
.he-dos-title, .he-donts-title {
  font-weight: 700;
  font-size: 0.88em;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: 10px;
  display: block;
}
.he-dos-title   { color: #145a3e; }
.he-donts-title { color: #8b2500; }
.he-dos ul, .he-donts ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.he-dos li, .he-donts li {
  padding: 5px 0 5px 22px;
  position: relative;
  font-size: 0.92em;
  color: #1e1e1e;
  margin: 0;
  border-bottom: 1px solid rgba(0,0,0,.05);
}
.he-dos li:last-child,
.he-donts li:last-child { border-bottom: none; }
.he-dos li::before {
  content: '✓';
  position: absolute;
  left: 0;
  color: #2e7d5e;
  font-weight: 700;
}
.he-donts li::before {
  content: '✗';
  position: absolute;
  left: 0;
  color: #8b2500;
  font-weight: 700;
}

/* ── Image Placeholder ── */
.he-img-placeholder {
  background: #f0f6ff;
  border: 2px dashed #c7daf5;
  border-radius: 8px;
  padding: 28px 20px;
  margin: 1.6em 0;
  text-align: center;
  color: #6b7280;
  font-size: 0.88em;
  font-family: sans-serif;
}
.he-img-placeholder span {
  display: block;
  font-size: 1.8em;
  margin-bottom: 6px;
}


/* ================================================
   TABLES
================================================ */
.he-table-wrap {
  width: 100%;
  overflow-x: auto;
  margin: 1.4em 0 1.8em;
  -webkit-overflow-scrolling: touch;
  border-radius: 6px;
}
.he-article-wrap table {
  width: 100%;
  min-width: 480px;
  border-collapse: collapse;
  font-size: 0.93em;
  background: #fff;
  border: 1px solid #c7daf5;
  border-radius: 6px;
  overflow: hidden;
  font-family: sans-serif;
}
.he-article-wrap thead { background: #1a3a5c; color: #fff; }
.he-article-wrap th {
  text-align: left;
  padding: 12px 14px;
  font-weight: 700;
  font-size: 0.9em;
  letter-spacing: 0.03em;
}
.he-article-wrap td {
  padding: 11px 14px;
  border-top: 1px solid #e0eaf5;
  vertical-align: top;
  color: #2a2a2a;
}
.he-article-wrap tbody tr:nth-child(even) td { background: #f7faff; }
.he-article-wrap tbody tr:hover td { background: #edf4ff; }


/* ================================================
   MOBILE
================================================ */
@media (max-width: 600px) {
  .he-article-wrap      { padding: 0 12px; }
  .he-article-wrap h2   { font-size: 1.3em; }
  .he-article-wrap h3   { font-size: 1.1em; }

  .he-pull-quote,
  .he-tip-box,
  .he-note-box,
  .he-warning-box,
  .he-insight-box,
  .he-reading-tips,
  .he-checklist,
  .he-tools-box,
  .he-price-box,
  .he-recap-box    { padding: 14px 15px; }

  .he-compare,
  .he-dos-donts    { flex-direction: column; }

  .he-stat-strip   { gap: 8px; }
  .he-stat-item    { min-width: 100px; }
  .he-stat-number  { font-size: 1.5em; }

  .he-did-you-know,
  .he-editor-box   { flex-direction: column; gap: 8px; }

  .he-highlight-text { font-size: 1em; }
}