/* Endometriosis Blog — Frontend CSS
   Brand Palette:
   Deep Teal:     #0F766E | Sage Green:  #A7C7A3 | Blush Pink: #F8D7DA
   Warm Cream:    #FFF8F3 | Charcoal:    #1F2937
   Olive Green:   #6B8E23 | Coral:       #F87171 | Lavender:   #E9D5FF | Sky Blue: #E0F2FE
*/

:root {
  --teal:    #0F766E;
  --teal-dk: #115E59;
  --sage:    #A7C7A3;
  --blush:   #F8D7DA;
  --cream:   #FFF8F3;
  --charcoal:#1F2937;
  --olive:   #6B8E23;
  --coral:   #F87171;
  --lavender:#E9D5FF;
  --sky:     #E0F2FE;
  --white:   #FFFFFF;
  --border:  #E5E7EB;
  --radius:  12px;
}

/* ── Base ── */
.ebg-post { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; color: var(--charcoal); line-height: 1.8; background: var(--cream); }
.ebg-post h2 { color: var(--teal); font-size: clamp(20px, 3vw, 26px); margin: 2rem 0 1rem; padding-bottom: 10px; border-bottom: 2px solid var(--sage); }
.ebg-post h3 { color: var(--teal); font-size: 18px; margin: 1.5rem 0 0.5rem; }
.ebg-post p  { margin: 0 0 1rem; }
.ebg-post a  { color: var(--teal); }
.ebg-post a:hover { color: var(--teal-dk); text-decoration: underline; }

/* ── Intro ── */
.ebg-intro { background: var(--white); border-radius: var(--radius); padding: 28px 32px; margin-bottom: 28px; border-left: 4px solid var(--teal); box-shadow: 0 2px 12px rgba(15,118,110,.08); }
.ebg-intro-text { font-size: 17px; color: var(--charcoal); margin: 0 0 16px; }

/* Key points */
.ebg-key-points { background: var(--sky); border-radius: 8px; padding: 16px 20px; }
.ebg-key-points strong { color: var(--teal); font-size: 14px; text-transform: uppercase; letter-spacing: .05em; display: block; margin-bottom: 8px; }
.ebg-key-points ul { margin: 0; padding-left: 20px; }
.ebg-key-points li { font-size: 14px; color: var(--charcoal); margin-bottom: 4px; }

/* ── Sections ── */
.ebg-section { background: var(--white); border-radius: var(--radius); padding: 28px 32px; margin-bottom: 20px; }
.ebg-section-diet     { border-top: 3px solid var(--olive); }
.ebg-section-warning  { border-top: 3px solid var(--coral); background: #FFF5F5; }
.ebg-section-healing  { border-top: 3px solid var(--sage); }
.ebg-section-lifestyle{ border-top: 3px solid var(--teal); }
.ebg-section-medical  { border-top: 3px solid var(--sky); background: #F0FBFF; }
.ebg-section-fertility{ border-top: 3px solid #EC4899; background: #FFF5F8; }

/* ── Food lists ── */
.ebg-food-list { list-style: none; padding: 0; margin: 0; }
.ebg-food-list li { padding: 10px 0; border-bottom: 1px solid var(--border); font-size: 15px; }
.ebg-food-list li:last-child { border: none; }
.ebg-food-list.ebg-good li::before { content: '✓ '; color: var(--olive); font-weight: 700; }
.ebg-food-list.ebg-bad  li { color: #7F1D1D; background: #FFF5F5; padding: 10px 14px; border-radius: 6px; margin-bottom: 6px; border: none; }

/* ── Week grid ── */
.ebg-week-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px; margin: 20px 0; }
.ebg-week-card { background: var(--cream); border: 1px solid var(--sage); border-radius: 10px; padding: 20px; }
.ebg-week-num { background: var(--teal); color: #fff; font-size: 12px; font-weight: 700; padding: 4px 12px; border-radius: 20px; display: inline-block; margin-bottom: 10px; }
.ebg-week-card strong { display: block; color: var(--teal); font-size: 15px; margin-bottom: 6px; }
.ebg-week-card p { font-size: 13px; color: #6B7280; margin: 0; }

/* ── Ebook CTA ── */
.ebg-ebook-cta { margin: 32px 0; border-radius: var(--radius); overflow: hidden; }
.ebg-cta-top    { background: linear-gradient(135deg, #0F766E 0%, #115E59 100%); }
.ebg-cta-bottom { background: linear-gradient(135deg, #1F2937 0%, #374151 100%); }
.ebg-cta-inner { padding: 36px 40px; display: grid; grid-template-columns: 1fr auto; gap: 32px; align-items: center; }
.ebg-cta-badge { display: inline-block; background: rgba(255,255,255,.15); color: #fff; font-size: 12px; font-weight: 700; padding: 5px 14px; border-radius: 20px; margin-bottom: 12px; letter-spacing: .05em; text-transform: uppercase; }
.ebg-cta-text h3 { color: #fff; font-size: clamp(18px, 2.5vw, 24px); margin: 0 0 10px; }
.ebg-cta-text p  { color: rgba(255,255,255,.85); font-size: 15px; margin: 0 0 14px; }
.ebg-cta-list { list-style: none; padding: 0; margin: 0; }
.ebg-cta-list li { color: var(--sage); font-size: 14px; padding: 4px 0; }
.ebg-cta-buttons { display: flex; flex-direction: column; gap: 12px; min-width: 220px; }
.ebg-btn-primary { display: block; background: var(--blush); color: #7F1D1D; font-weight: 700; font-size: 15px; padding: 14px 24px; border-radius: 8px; text-decoration: none; text-align: center; transition: background .2s; border: none; }
.ebg-btn-primary:hover { background: #F4C2C8; color: #7F1D1D; text-decoration: none; }
.ebg-btn-secondary { display: block; background: rgba(255,255,255,.1); color: #fff; font-weight: 600; font-size: 14px; padding: 12px 24px; border-radius: 8px; text-decoration: none; text-align: center; border: 1px solid rgba(255,255,255,.25); transition: background .2s; }
.ebg-btn-secondary:hover { background: rgba(255,255,255,.2); color: #fff; text-decoration: none; }

/* ── Merged FAQs ── */
.ebg-merged-faqs { background: var(--sky); border-radius: var(--radius); padding: 28px 32px; margin: 24px 0; }
.ebg-merged-faqs h2 { color: #0369A1; border-color: #BAE6FD; }
.ebg-merged-faq-item { background: var(--white); border-radius: 8px; padding: 20px; margin-top: 14px; }
.ebg-merged-faq-item h3 { color: var(--teal); font-size: 16px; margin-bottom: 10px; }
.ebg-merged-faq-item p { font-size: 15px; color: var(--charcoal); margin: 0; }

/* ── Related posts ── */
.ebg-related-posts { margin: 28px 0; }
.ebg-related-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 16px; margin-top: 16px; }
.ebg-related-card { display: flex; align-items: center; gap: 14px; background: var(--white); border: 1px solid var(--border); border-radius: 10px; padding: 18px; text-decoration: none; transition: box-shadow .2s, border-color .2s, transform .15s; }
.ebg-related-card:hover { box-shadow: 0 4px 20px rgba(15,118,110,.12); border-color: var(--teal); transform: translateY(-2px); text-decoration: none; }
.ebg-related-icon { font-size: 24px; flex-shrink: 0; }
.ebg-related-body h4 { font-size: 14px; color: var(--charcoal); margin: 0; line-height: 1.4; }
.ebg-related-arrow { color: var(--teal); font-size: 18px; margin-left: auto; flex-shrink: 0; }
/* Cluster colour accents */
.ebg-cluster-diet       { border-left: 3px solid var(--olive); }
.ebg-cluster-natural-healing { border-left: 3px solid var(--sage); }
.ebg-cluster-fertility  { border-left: 3px solid #EC4899; }
.ebg-cluster-medical    { border-left: 3px solid #0EA5E9; }
.ebg-cluster-symptoms   { border-left: 3px solid var(--coral); }
.ebg-cluster-triggers   { border-left: 3px solid var(--coral); }
.ebg-cluster-lifestyle  { border-left: 3px solid var(--teal); }

/* ── Sources ── */
.ebg-sources { background: var(--white); border: 1px solid var(--border); border-radius: var(--radius); padding: 24px 28px; margin: 24px 0; }
.ebg-sources h2 { font-size: 18px; border: none; padding: 0; margin-top: 0; }
.ebg-sources ol { padding-left: 20px; margin: 0; }
.ebg-sources li { font-size: 13px; margin-bottom: 6px; }
.ebg-sources a { color: var(--teal); word-break: break-all; }

/* ── Disclaimer ── */
.ebg-disclaimer { background: #F9FAFB; border: 1px solid var(--border); border-radius: 8px; padding: 16px 20px; margin-top: 24px; font-size: 12px; color: #6B7280; line-height: 1.6; }

/* ── Internal links ── */
.ebg-internal-link { color: var(--teal); font-weight: 600; border-bottom: 1px dotted var(--teal); text-decoration: none; }
.ebg-internal-link:hover { border-bottom-style: solid; }

/* ── Theme overrides ── */
.ebg-theme-fertility .ebg-intro { border-color: #EC4899; }
.ebg-theme-warning   .ebg-intro { border-color: var(--coral); }
.ebg-theme-diet      .ebg-intro { border-color: var(--olive); }

/* ── Responsive ── */
@media (max-width: 700px) {
  .ebg-cta-inner    { grid-template-columns: 1fr; }
  .ebg-cta-buttons  { flex-direction: row; flex-wrap: wrap; min-width: auto; }
  .ebg-intro, .ebg-section, .ebg-merged-faqs, .ebg-sources { padding: 20px; }
  .ebg-week-grid    { grid-template-columns: 1fr; }
}