/* Editorial blocks — the "standard content" half of the hybrid editing architecture
   (see docs/elementor-integration.md). Every dd_block() region renders inside one of the
   wrapper classes below, which own the section-specific size/spacing/color so an editor
   never has to reproduce inline styles to keep a section on-brand — including for any
   *new* heading/paragraph/list/button they add that isn't one of the theme's existing
   .h1/.h2/.lede classes. The approved seed copy reuses those existing classes directly
   (so it's byte-identical to before this system existed) — every selector below excludes
   elements that already carry .h1/.h2/.h3/.lede/.lede-dark, so this file only ever styles
   *fresh* content an editor adds, and never fights the already-correct shared classes
   regardless of load order or matching specificity. */

.dd-editorial{font-family:var(--dd-font-body);color:var(--dd-ink-soft);line-height:1.7}
.dd-editorial :where(h1,h2,h3,h4,.wp-block-heading):not(.h1):not(.h2):not(.h3){
  font-family:var(--dd-font-display);font-weight:600;color:var(--dd-ink);
  letter-spacing:-.03em;line-height:1.05;margin:0 0 20px
}
.dd-editorial h1:not(.h1){font-size:var(--dd-h2)}
.dd-editorial h2:not(.h2){font-size:var(--dd-h2-sm)}
.dd-editorial h3:not(.h3){font-size:var(--dd-h3);letter-spacing:-.02em}
.dd-editorial p:not(.lede):not(.lede-dark){font-size:17px;line-height:1.65;margin:0 0 16px}
.dd-editorial p:not(.lede):not(.lede-dark):last-child{margin-bottom:0}
.dd-editorial a{color:var(--dd-signal-3);text-decoration:underline;text-underline-offset:2px}
.dd-editorial ul,.dd-editorial ol{padding-left:22px;margin:0 0 16px;display:grid;gap:8px}
.dd-editorial strong{color:var(--dd-ink);font-weight:600}
.dd-editorial img,.dd-editorial .wp-block-image img{max-width:100%;height:auto;border-radius:20px;display:block}
.dd-editorial .wp-block-button__link,.dd-editorial .button{
  display:inline-block;font-family:var(--dd-font-ui);font-size:15px;color:#fff;
  background:var(--dd-gradient);padding:14px 28px;border-radius:999px;text-decoration:none;
  margin-top:6px
}
.dd-editorial figcaption{font-family:var(--dd-font-ui);font-size:12px;color:rgba(21,18,15,.5);margin-top:8px}

/* Dark-background contexts (CTA banner, dark-theme page intros, footer) — only recolors
   fresh headings that don't already carry an explicit color via .lede-dark or an inline
   white already baked into a wrapper-specific rule below. */
.dd-editorial.on-dark{color:rgba(251,248,244,.7)}
.dd-editorial.on-dark :where(h1,h2,h3,h4,.wp-block-heading):not(.h1):not(.h2):not(.h3){color:#fff}
.dd-editorial.on-dark a{color:var(--dd-signal-1)}

/* Page-hero pattern — Careers / Professional Learning / Corporate Training / Contact /
   Gallery all wrap their dd_block() intro in this class. The seed copy already carries
   .h1/.lede, so this only supplies the max-width the inline style used to. */
.page-hero-intro h1.h1{max-width:18ch}
.page-hero-intro p.lede,.page-hero-intro p.lede-dark{max-width:640px;margin-top:12px}
.page-hero-intro p:not(.lede):not(.lede-dark){max-width:640px}

/* Home About section */
.dd-home-about-block h2.h2{font-size:clamp(28px,2.9vw,40px);line-height:1.18;margin-bottom:30px}
.dd-home-about-block p:not(.lede):not(.lede-dark){font-size:16.5px;line-height:1.7;color:var(--dd-ink-soft)}

/* About page sections share the same treatment as Home's About block */
.dd-about-section h2.h2{font-size:clamp(28px,2.9vw,40px);line-height:1.18;margin-bottom:24px}
.dd-about-section p:not(.lede):not(.lede-dark){font-size:16.5px;line-height:1.7;color:var(--dd-ink-soft);max-width:64ch}

/* FAQ heading (no shared class existed for this exact size) */
.dd-faq-heading-block h2:not(.h2){font-family:var(--dd-font-display);font-weight:600;font-size:var(--dd-h2-sm);line-height:1.04;letter-spacing:-.03em;margin:0 0 32px}

/* CTA banner (on the dark gradient banner background — no shared class existed for this) */
.dd-cta-banner-block h2:not(.h2){font-family:var(--dd-font-display);font-weight:600;font-size:clamp(38px,4.4vw,64px);line-height:1.02;letter-spacing:-.032em;margin:0 0 22px;color:#fff}
.dd-cta-banner-block p:not(.lede):not(.lede-dark){font-size:19px;line-height:1.6;color:rgba(255,255,255,.9);margin:0;max-width:560px}

/* Footer brand blurb (no shared class existed for this either) */
.dd-footer-blurb-block p:not(.lede):not(.lede-dark){font-family:var(--dd-font-body);font-size:14.5px;line-height:1.65;color:rgba(251,248,244,.6);max-width:34ch;margin:0 0 26px}
/* The blurb is the only paragraph in its block, so it is also :last-child, and the
   generic `.dd-editorial p…:last-child{margin-bottom:0}` above outranks the rule on
   the line before this one — it carries one more pseudo-class. That is why the 26px
   the export puts between the blurb and the newsletter field measured 0. Restated at
   matching specificity so the footer keeps its gap and every other editorial block
   keeps its trimmed last paragraph. */
.dd-footer-blurb-block p:not(.lede):not(.lede-dark):last-child{margin-bottom:26px}

/* Archive intro (Gallery, Insights) */
.dd-archive-intro-block h1.h1{max-width:14ch}
.dd-archive-intro-block p.lede{max-width:560px;margin-bottom:60px;font-size:19px}

/* ── Section shells (v2) ──────────────────────────────────────────────────────
   The editorial/team/about sections are now standalone full-width sections rather than
   regions inside a padded .dd-page, so they carry their own measure. */
.dd-about-section.is-narrow { max-width: 720px; }
.dd-page-header-media { margin-top: 40px; }
