/* ============================================================
   CCI — article body inside Elementor
   ------------------------------------------------------------
   The article column is styled by putting `prose` in the CSS Classes field of
   the container that holds the post body. Almost every rule in
   news-article.css is a descendant selector, so it reaches the copy wherever
   Elementor puts it — except one:

       .prose > p { font-size:18px; line-height:1.8; color:#2c2c34; margin:0 0 26px }

   That is a DIRECT CHILD selector, and Elementor wraps every widget in
   .elementor-widget-container. The body paragraphs stop being children of
   .prose the moment the page is built in the builder rather than hand-written,
   and silently lose their reading size, leading and rhythm.

   The rule is restated here as a descendant, scoped to the widgets that
   actually hold running copy — Text Editor and Post Content — so it cannot
   reach a paragraph inside a pull quote, a callout or a figure caption, each of
   which the design styles separately and more specifically anyway.

   This file is loaded by the article widgets. It is deliberately NOT in
   elementor-compat.css: that file is about neutralising third-party resets,
   this is about one selector the design writes that the builder cannot satisfy.
   ============================================================ */

.prose .elementor-widget-text-editor p,
.prose .elementor-widget-theme-post-content p {
  font-size: 18px;
  line-height: 1.8;
  color: #2c2c34;
  margin: 0 0 26px;
}

/* The design's opening paragraph carries .lead and a drop cap. Elementor's
   Text Editor puts the class on its own wrapper rather than on the <p>, so
   the paragraph inside a .lead widget is treated as the lead. */
.prose .elementor-widget-text-editor.lead p,
.prose .elementor-widget-text-editor .lead {
  font-size: 20px;
  line-height: 1.7;
  color: var(--ink);
  margin-bottom: 30px;
}
/* news-article.css takes the lead down to 18px on phones, but its rule is
   `.prose .lead` at (0,2,0) — the wrapper-aware selectors above are (0,3,0)
   and were holding the desktop size. The drop cap is unaffected: it is a
   ::first-letter rule the selectors above never touch. */
@media (max-width: 720px) {
  .prose .elementor-widget-text-editor.lead p,
  .prose .elementor-widget-text-editor .lead {
    font-size: 18px;
  }
}

/* The widget wrappers must not add rhythm of their own — the paragraph
   margins above already carry it, and doubling them opens gaps the design
   never has. */
.prose .elementor-widget-text-editor p:last-child,
.prose .elementor-widget-theme-post-content p:last-child {
  margin-bottom: 0;
}

/* ------------------------------------------------------------
   The copy-link button

   news-article.css styles the two share buttons differently, and it does it
   with an ID:

       .share-btn svg          { fill:#fff; stroke:none }
       .share-btn#copyLink svg { fill:none; stroke:#fff; … }

   The Facebook glyph is a solid shape; the link glyph is two open strokes and
   needs the second rule or it renders as a black blob. The widget dropped the
   id — ids are unique per document and the widget can be placed more than once
   — so the rule is re-hung on the data attribute it uses instead.
   ------------------------------------------------------------ */
.share-btn[data-cew-copy] svg {
  fill: none;
  stroke: #fff;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}