/* CLEIR Journal — single post (TOC rail, progress bar, article typography) */

.cleir-read-progress {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: rgba(196, 121, 106, 0.15);
  z-index: 9999;
  pointer-events: none;
}

.cleir-read-progress__fill {
  height: 100%;
  width: 0;
  background: #c4796a;
  transition: width 0.1s linear;
}

/* ——— Layout (200px sidebar + 64px gap + 700px content) ——— */

.cleir-article-body.elementor-element {
  max-width: 1000px !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.cleir-article-body > .e-con-inner,
.cleir-article-body > .elementor-container {
  align-items: flex-start !important;
}

.cleir-article-sidebar {
  width: 200px !important;
  max-width: 200px !important;
  min-width: 200px !important;
  flex: 0 0 200px !important;
  align-self: flex-start !important;
}

.cleir-article-content {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  max-width: none !important;
}

/* ——— Elementor Table of Contents rail ——— */

.cleir-article-toc.elementor-widget-table-of-contents .elementor-toc__header-title {
  font-family: var(--cleir-sans, "DM Sans", sans-serif) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  color: #b89b7a !important;
  margin: 0 0 16px !important;
}

.cleir-article-toc .elementor-toc__body,
.cleir-article-toc .elementor-toc__list-wrapper {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.cleir-article-toc .elementor-toc__list-wrapper {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  border-left: 1px solid #e8ddd0 !important;
}

.cleir-article-toc .elementor-toc__list-item {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.cleir-article-toc .elementor-toc__list-item-marker,
.cleir-article-toc .elementor-toc__list-item-marker:before {
  display: none !important;
  content: none !important;
}

.cleir-article-toc .elementor-toc__list-item-text-wrapper {
  margin: 0 !important;
  padding: 0 !important;
}

.cleir-article-toc .elementor-toc__list-item-text {
  display: block !important;
  padding: 8px 0 8px 16px !important;
  margin-left: -1px !important;
  font-family: var(--cleir-sans, "DM Sans", sans-serif) !important;
  font-size: 13.5px !important;
  line-height: 1.4 !important;
  font-weight: 400 !important;
  text-decoration: none !important;
  color: #8a7d6e !important;
  border-left: 2px solid transparent !important;
  transition: color 0.15s ease, border-color 0.15s ease !important;
  box-shadow: none !important;
}

.cleir-article-toc .elementor-toc__list-item-text:hover {
  color: #2c2a29 !important;
}

.cleir-article-toc .elementor-toc__list-item-text.elementor-item-active {
  color: #c4796a !important;
  font-weight: 600 !important;
  border-left-color: #c4796a !important;
}

.cleir-article-toc .elementor-toc__spinner-container {
  display: none !important;
}

/* ——— Post content typography ——— */

.cleir-article-content .elementor-widget-theme-post-content .elementor-widget-container,
.cleir-article-post .elementor-widget-container {
  max-width: 700px;
}

.cleir-article-content .elementor-widget-theme-post-content .elementor-widget-container > p:first-of-type,
.cleir-article-post .elementor-widget-container > p:first-of-type,
.cleir-article-content .elementor-widget-theme-post-content .wp-block-post-content > p:first-of-type {
  font-family: var(--cleir-sans, "DM Sans", sans-serif) !important;
  font-size: 20px !important;
  line-height: 1.7 !important;
  color: #46423f !important;
  margin: 0 0 30px !important;
  font-weight: 400 !important;
}

.cleir-article-content .elementor-widget-theme-post-content h2,
.cleir-article-content .elementor-widget-theme-post-content h2.wp-block-heading,
.cleir-article-post .elementor-widget-container h2 {
  font-family: var(--cleir-serif, "Cormorant Garamond", serif) !important;
  font-weight: 500 !important;
  font-size: 34px !important;
  line-height: 1.2 !important;
  color: #2c2a29 !important;
  margin: 44px 0 16px !important;
  scroll-margin-top: 104px;
}

.cleir-article-content .elementor-widget-theme-post-content h3,
.cleir-article-content .elementor-widget-theme-post-content h3.wp-block-heading,
.cleir-article-post .elementor-widget-container h3 {
  font-family: var(--cleir-serif, "Cormorant Garamond", serif) !important;
  font-weight: 500 !important;
  font-size: 26px !important;
  line-height: 1.25 !important;
  color: #2c2a29 !important;
  margin: 36px 0 14px !important;
  scroll-margin-top: 104px;
}

.cleir-article-content .elementor-widget-theme-post-content p:not([class*="cleir-ingredient-brief"]):not([class*="cleir-key-takeaways"]):not([class*="cleir-author-intro"]),
.cleir-article-content .elementor-widget-theme-post-content .wp-block-paragraph:not([class*="cleir-ingredient-brief"]):not([class*="cleir-key-takeaways"]):not([class*="cleir-author-intro"]),
.cleir-article-post .elementor-widget-container p:not([class*="cleir-ingredient-brief"]):not([class*="cleir-key-takeaways"]):not([class*="cleir-author-intro"]) {
  font-family: var(--cleir-sans, "DM Sans", sans-serif) !important;
  font-size: 18px !important;
  line-height: 1.78 !important;
  color: #46423f !important;
  margin: 0 0 20px !important;
}

.cleir-article-content .elementor-widget-theme-post-content blockquote,
.cleir-article-content .elementor-widget-theme-post-content .wp-block-quote,
.cleir-article-post .elementor-widget-container blockquote {
  margin:  0px !important;
  padding: 8px 0 8px 28px !important;
  border: 0 !important;
  border-left: 3px solid #c4796a !important;
  background: transparent !important;
}

.cleir-article-content .elementor-widget-theme-post-content blockquote p,
.cleir-article-content .elementor-widget-theme-post-content .wp-block-quote p,
.cleir-article-post .elementor-widget-container blockquote p {
  font-family: var(--cleir-serif, "Cormorant Garamond", serif) !important;
  font-style: italic !important;
  font-weight: 400 !important;
  font-size: 28px !important;
  line-height: 1.4 !important;
  color: #2c2a29 !important;
  margin: 0 !important;
}

.cleir-article-content .elementor-widget-theme-post-content ul,
.cleir-article-content .elementor-widget-theme-post-content .wp-block-list,
.cleir-article-post .elementor-widget-container ul {
  font-family: var(--cleir-sans, "DM Sans", sans-serif) !important;
  font-size: 18px !important;
  line-height: 1.7 !important;
  color: #46423f !important;
  margin: 0 0 20px !important;
  padding-left: 22px !important;
}

.cleir-article-content .elementor-widget-theme-post-content li,
.cleir-article-post .elementor-widget-container li {
  margin-bottom: 10px !important;
}

.cleir-article-content .elementor-widget-theme-post-content li strong,
.cleir-article-post .elementor-widget-container li strong {
  font-weight: 600 !important;
  color: #2c2a29 !important;
}

.cleir-article-content .elementor-widget-theme-post-content figure,
.cleir-article-content .elementor-widget-theme-post-content .wp-block-image,
.cleir-article-post .elementor-widget-container figure {
  margin: 32px 0 !important;
}

.cleir-article-content .elementor-widget-theme-post-content figure img,
.cleir-article-content .elementor-widget-theme-post-content .wp-block-image img,
.cleir-article-post .elementor-widget-container figure img {
  width: 100% !important;
  height: auto !important;
  display: block !important;
  border-radius: 16px !important;
}

.cleir-article-content .elementor-widget-theme-post-content figcaption,
.cleir-article-content .elementor-widget-theme-post-content .wp-element-caption,
.cleir-article-post .elementor-widget-container figcaption {
  font-family: var(--cleir-sans, "DM Sans", sans-serif) !important;
  font-size: 12.5px !important;
  color: #9b8c7c !important;
  text-align: center !important;
  margin-top: 12px !important;
}

/* ——— Ingredient in brief callout ——— */

.cleir-article-content .elementor-widget-theme-post-content .cleir-ingredient-brief,
.cleir-article-content .cleir-ingredient-brief,
.cleir-article-content .wp-block-group.cleir-ingredient-brief,
.cleir-article-post .cleir-ingredient-brief {
  background: #f2ddd2 !important;
  border-radius: 16px !important;
  padding: 28px 30px !important;
  margin: 32px 0 !important;
  border: 0 !important;
}

.cleir-article-content .elementor-widget-theme-post-content .cleir-ingredient-brief__label,
.cleir-article-content .elementor-widget-theme-post-content .cleir-ingredient-brief p.cleir-ingredient-brief__label,
.cleir-ingredient-brief__label {
  font-family: var(--cleir-sans, "DM Sans", sans-serif) !important;
  font-size: 10.5px !important;
  font-weight: 600 !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  color: #c4796a !important;
  margin: 0 0 8px !important;
}

.cleir-article-content .elementor-widget-theme-post-content .cleir-ingredient-brief__heading,
.cleir-article-content .elementor-widget-theme-post-content .cleir-ingredient-brief p.cleir-ingredient-brief__heading,
.cleir-ingredient-brief__heading {
  font-family: var(--cleir-serif, "Cormorant Garamond", serif) !important;
  font-size: 26px !important;
  line-height: 1.2 !important;
  font-weight: 400 !important;
  color: #2c2a29 !important;
  margin: 0 0 10px !important;
}

.cleir-article-content .elementor-widget-theme-post-content .cleir-ingredient-brief__text,
.cleir-article-content .elementor-widget-theme-post-content .cleir-ingredient-brief p.cleir-ingredient-brief__text,
.cleir-ingredient-brief__text {
  font-family: var(--cleir-sans, "DM Sans", sans-serif) !important;
  font-size: 15px !important;
  line-height: 1.65 !important;
  color: #5a5654 !important;
  margin: 0 !important;
}

/* ——— Key takeaways box ——— */

.cleir-article-content .cleir-key-takeaways,
.cleir-article-content .wp-block-group.cleir-key-takeaways,
.cleir-article-post .cleir-key-takeaways {
  background: #f5f0ec !important;
  border: 1px solid #e8ddd0 !important;
  border-radius: 18px !important;
  padding: 32px 34px !important;
  margin: 0px 0 8px !important;
}

.cleir-article-content .elementor-widget-theme-post-content .cleir-key-takeaways__label,
.cleir-article-content .elementor-widget-theme-post-content .cleir-key-takeaways p.cleir-key-takeaways__label,
.cleir-key-takeaways__label {
  font-family: var(--cleir-sans, "DM Sans", sans-serif) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  color: #b89b7a !important;
  margin: 0 0 18px !important;
}

.cleir-key-takeaways__list {
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
}

.cleir-key-takeaways__item {
  display: flex !important;
  gap: 12px !important;
  align-items: flex-start !important;
}

.cleir-key-takeaways__icon {
  flex: none !important;
  margin-top: 1px !important;
}

.cleir-article-content .elementor-widget-theme-post-content .cleir-key-takeaways__text,
.cleir-key-takeaways__text {
  font-family: var(--cleir-sans, "DM Sans", sans-serif) !important;
  font-size: 15.5px !important;
  line-height: 1.6 !important;
  color: #46423f !important;
}

/* ——— Author / written-by box ——— */

.cleir-article-content .cleir-author-intro,
.cleir-article-post .cleir-author-intro {
  background: #f5f0ec !important;
  border-radius: 18px !important;
  padding: 32px 34px !important;
  margin: 0px !important;
  display: flex !important;
  gap: 20px !important;
  align-items: flex-start !important;
}

.cleir-author-intro__avatar {
  flex: none !important;
  width: 56px !important;
  height: 56px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
}

.cleir-author-intro__avatar--initial {
  background: #e8c4b4 !important;
  color: #8a4a3c !important;
  font-family: var(--cleir-serif, "Cormorant Garamond", serif) !important;
  font-size: 26px !important;
  line-height: 1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.cleir-author-intro__body {
  min-width: 0 !important;
  flex: 1 1 auto !important;
}

.cleir-author-intro__label {
  font-family: var(--cleir-sans, "DM Sans", sans-serif) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: #b89b7a !important;
  margin: 0 0 6px !important;
}

.cleir-author-intro__name {
  font-family: var(--cleir-serif, "Cormorant Garamond", serif) !important;
  font-size: 24px !important;
  line-height: 1.25 !important;
  font-weight: 400 !important;
  color: #2c2a29 !important;
  margin: 0 0 8px !important;
}

.cleir-author-intro__bio {
  font-family: var(--cleir-sans, "DM Sans", sans-serif) !important;
  font-size: 15px !important;
  line-height: 1.65 !important;
  color: #5a5654 !important;
  margin: 0 !important;
}

.cleir-article-progress-wrap {
  height: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: visible !important;
}

.cleir-article-progress-wrap .elementor-widget-html .elementor-widget-container {
  padding: 0 !important;
  margin: 0 !important;
}

@media (max-width: 1024px) {
  .cleir-article-sidebar {
    display: none !important;
  }

  .cleir-article-content {
    width: 100% !important;
    max-width: 100% !important;
  }

  .cleir-article-content .elementor-widget-theme-post-content .elementor-widget-container,
  .cleir-article-post .elementor-widget-container {
    max-width: none;
  }
}

@media (max-width: 767px) {
  .cleir-article-body.elementor-element {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  .cleir-article-content .elementor-widget-theme-post-content h2,
  .cleir-article-content .elementor-widget-theme-post-content h2.wp-block-heading,
  .cleir-article-post .elementor-widget-container h2 {
    font-size: 28px !important;
    margin-top: 36px !important;
  }

  .cleir-article-content .elementor-widget-theme-post-content blockquote p,
  .cleir-article-content .elementor-widget-theme-post-content .wp-block-quote p,
  .cleir-article-post .elementor-widget-container blockquote p {
    font-size: 22px !important;
  }

  .cleir-author-intro__name {
    font-size: 21px !important;
  }

  .cleir-article-content .cleir-author-intro,
  .cleir-article-post .cleir-author-intro {
    padding: 24px 22px !important;
    gap: 16px !important;
  }
}
