.elementor-32738 .elementor-element.elementor-element-66d6cbc{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:center;--padding-top:160px;--padding-bottom:48px;--padding-left:24px;--padding-right:24px;}.elementor-32738 .elementor-element.elementor-element-66d6cbc:not(.elementor-motion-effects-element-type-background), .elementor-32738 .elementor-element.elementor-element-66d6cbc > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FAF9F4;}.elementor-32738 .elementor-element.elementor-element-d05f947{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;--gap:8px 8px;--row-gap:8px;--column-gap:8px;--flex-wrap:wrap;--margin-top:0px;--margin-bottom:32px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-32738 .elementor-element.elementor-element-6c90635 .elementor-icon-list-icon{width:14px;}.elementor-32738 .elementor-element.elementor-element-6c90635 .elementor-icon-list-icon i{font-size:14px;}.elementor-32738 .elementor-element.elementor-element-6c90635 .elementor-icon-list-icon svg{--e-icon-list-icon-size:14px;}.elementor-32738 .elementor-element.elementor-element-5db07a3 .elementor-icon-list-icon{width:14px;}.elementor-32738 .elementor-element.elementor-element-5db07a3 .elementor-icon-list-icon i{font-size:14px;}.elementor-32738 .elementor-element.elementor-element-5db07a3 .elementor-icon-list-icon svg{--e-icon-list-icon-size:14px;}.elementor-32738 .elementor-element.elementor-element-2022ac8{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;--gap:14px 14px;--row-gap:14px;--column-gap:14px;--padding-top:48px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-32738 .elementor-element.elementor-element-8435306{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:2px 2px;--row-gap:2px;--column-gap:2px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-32738 .elementor-element.elementor-element-3b83d51{--display:flex;--padding-top:0px;--padding-bottom:80px;--padding-left:24px;--padding-right:24px;}.elementor-32738 .elementor-element.elementor-element-3b83d51:not(.elementor-motion-effects-element-type-background), .elementor-32738 .elementor-element.elementor-element-3b83d51 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FAF9F4;}.elementor-32738 .elementor-element.elementor-element-82a80c5{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:96px;--padding-left:24px;--padding-right:24px;}.elementor-32738 .elementor-element.elementor-element-82a80c5:not(.elementor-motion-effects-element-type-background), .elementor-32738 .elementor-element.elementor-element-82a80c5 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FAF9F4;}.elementor-32738 .elementor-element.elementor-element-102e42b .elementor-icon-list-icon{width:14px;}.elementor-32738 .elementor-element.elementor-element-102e42b .elementor-icon-list-icon i{font-size:14px;}.elementor-32738 .elementor-element.elementor-element-102e42b .elementor-icon-list-icon svg{--e-icon-list-icon-size:14px;}.elementor-32738 .elementor-element.elementor-element-b630d27{--grid-side-margin:10px;--grid-column-gap:10px;--grid-row-gap:10px;--grid-bottom-margin:10px;}.elementor-32738 .elementor-element.elementor-element-7aae944{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:80px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:56px;--padding-bottom:56px;--padding-left:48px;--padding-right:48px;}@media(max-width:1024px){ .elementor-32738 .elementor-element.elementor-element-b630d27{--grid-side-margin:10px;--grid-column-gap:10px;--grid-row-gap:10px;--grid-bottom-margin:10px;}}@media(min-width:768px){.elementor-32738 .elementor-element.elementor-element-66d6cbc{--content-width:768px;}.elementor-32738 .elementor-element.elementor-element-3b83d51{--content-width:1152px;}.elementor-32738 .elementor-element.elementor-element-82a80c5{--content-width:768px;}}@media(max-width:767px){.elementor-32738 .elementor-element.elementor-element-66d6cbc{--padding-top:120px;--padding-bottom:40px;--padding-left:20px;--padding-right:20px;}.elementor-32738 .elementor-element.elementor-element-8435306{--width:90px;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-32738 .elementor-element.elementor-element-3b83d51{--padding-top:0px;--padding-bottom:56px;--padding-left:20px;--padding-right:20px;}.elementor-32738 .elementor-element.elementor-element-82a80c5{--padding-top:0px;--padding-bottom:72px;--padding-left:20px;--padding-right:20px;} .elementor-32738 .elementor-element.elementor-element-b630d27{--grid-side-margin:10px;--grid-column-gap:10px;--grid-row-gap:10px;--grid-bottom-margin:10px;}.elementor-32738 .elementor-element.elementor-element-7aae944{--padding-top:40px;--padding-bottom:40px;--padding-left:28px;--padding-right:28px;}}/* Start custom CSS for container, class: .elementor-element-66d6cbc *//* Logo cross-fade. The dark logo is layered underneath as a pseudo-element and revealed as the white one fades, so there is no swap flicker and no second Image widget to keep in sync. Root-relative path so it survives the push to prod. */ /* ============================================================ CCI — Insights single template (Theme Builder doc 32738) Parity target: BlogLayout.tsx. Added 2026-08-27. ============================================================ */ .cci-progress-wrap{ position:relative; z-index:60; }.cci-progress .elementor-widget-container{ padding:0; }.cci-progress .elementor-progress-tracker{ height:2px !important; background:transparent !important; border-radius:0 !important; }.cci-progress .elementor-progress-tracker .current-progress{ background:#E43C3A !important; transition:width .15s linear; }.cci-article-glow::before{ content:""; position:absolute; top:-128px; left:50%; transform:translateX(-50%); width:1000px; max-width:100%; height:600px; border-radius:50%; background:rgba(228,60,58,.07); filter:blur(64px); pointer-events:none; z-index:0; }.cci-article-hero img{ width:100%; aspect-ratio:21/9; object-fit:cover; border-radius:12px; background:rgba(21,23,30,.05); display:block; } @media (max-width:767px){ .cci-article-hero img{ border-radius:8px; }}.cci-prose .elementor-widget-container{ font-size:1.125rem; line-height:1.7; color:rgba(21,23,30,.85); } @media (min-width:768px){ .cci-prose .elementor-widget-container{ font-size:1.25rem; }}.cci-prose p{ margin:0 0 1.35em; }.cci-prose h2{ font-weight:800; color:#15171E; font-size:1.9rem; line-height:1.15; letter-spacing:-.018em; margin:2.4em 0 .6em; text-wrap:balance; }.cci-prose h3{ font-weight:700; color:#15171E; font-size:1.35rem; line-height:1.2; margin:2em 0 .5em; }.cci-prose a{ color:#C52B2B; text-decoration:underline; text-underline-offset:3px; text-decoration-thickness:1px; }.cci-prose a:hover{ color:#E43C3A; }.cci-prose strong{ color:#15171E; font-weight:700; }.cci-prose ul, .cci-prose ol{ margin:0 0 1.35em; padding-left:1.4em; }.cci-prose li{ margin-bottom:.5em; }.cci-prose ul li::marker{ color:#E43C3A; }.cci-prose blockquote{ margin:2em 0; padding:0 0 0 1.4em; border-left:3px solid #E43C3A; font-weight:600; font-style:normal; color:#15171E; font-size:1.15em; line-height:1.4; }.cci-prose blockquote p:last-child{ margin-bottom:0; }.cci-prose img{ max-width:100%; height:auto; border-radius:8px; margin:2em 0; display:block; }.cci-prose figure{ margin:2em 0; }.cci-prose figcaption{ font-family:"IBM Plex Mono",ui-monospace,monospace; font-size:11px; text-transform:uppercase; letter-spacing:.12em; color:rgba(21,23,30,.55); margin-top:.7em; }.cci-prose hr{ border:0; border-top:1px solid rgba(21,23,30,.12); margin:2.5em 0; }.cci-prose table{ display:block; overflow-x:auto; width:100%; border-collapse:collapse; font-size:.9em; }.cci-prose iframe{ max-width:100%; }.cci-tags{ margin-top:64px; padding-top:32px; border-top:1px solid rgba(21,23,30,.1); }.cci-tags .elementor-icon-list-item{ margin:0 !important; }.cci-tags .elementor-icon-list-item::after{ display:none !important; }.cci-tags .elementor-post-info__terms-list{ display:flex; flex-wrap:wrap; gap:8px; }.cci-tags .elementor-post-info__terms-list-item{ font-family:"IBM Plex Mono",ui-monospace,monospace; font-size:10px; font-weight:600; text-transform:uppercase; letter-spacing:.18em; color:rgba(21,23,30,.7); border:1px solid rgba(21,23,30,.15); border-radius:999px; padding:6px 12px; text-decoration:none; transition:color .2s ease, border-color .2s ease; }.cci-tags .elementor-post-info__terms-list-item::before{ content:"#"; opacity:.55; }.cci-tags .elementor-post-info__terms-list-item:hover{ color:#E43C3A; border-color:#E43C3A; }.cci-share{ margin-top:28px; }.cci-share .elementor-share-btn{ background:transparent !important; border:1px solid rgba(21,23,30,.15); color:#E43C3A !important; transition:border-color .2s ease, color .2s ease; }.cci-share .elementor-share-btn:hover{ border-color:#E43C3A; } /* --- Insights single: chip corrections (2026-08-27) --- */ /* Elementor injects a default icon into every post-info row. */ .cci-chip .elementor-icon-list-icon, .cci-tags .elementor-icon-list-icon{ display:none !important; } /* Elementor separates terms with raw ", " text nodes. font-size:0 on the list collapses them; the links restore their own size. */ .cci-chip--cat .elementor-post-info__terms-list, .cci-tags .elementor-post-info__terms-list{ font-size:0; }.cci-chip--cat .elementor-post-info__terms-list-item, .cci-tags .elementor-post-info__terms-list-item{ font-size:10px; } /* Slightly calmer title glow. */ .cci-article-glow::before{ background:rgba(228,60,58,.055); } /* --- Insights single: .elementor-32738 .elementor-element.elementor-element-66d6cbc corrections (2026-08-27b) --- */ /* Elementor's widget renders .elementor-scrolling-tracker, not .elementor-progress-tracker. */ .cci-progress .elementor-scrolling-tracker{ height:2px !important; background:transparent !important; border-radius:0 !important; }.cci-progress .elementor-scrolling-tracker .current-progress, .cci-progress .elementor-scrolling-tracker-progress{ background:#E43C3A !important; } /* --- Insights single: prose measure (2026-08-27c) --- */ /* The theme sets p{font-size:16px} directly, and any direct rule beats an inherited one, so the reading size has to be set on the elements. */ .cci-prose p, .cci-prose li, .cci-prose blockquote{ font-size:1.125rem; line-height:1.7; } @media (min-width:768px){ .cci-prose p, .cci-prose li{ font-size:1.25rem; } .cci-prose blockquote{ font-size:1.4rem; }}.cci-prose p{ color:rgba(21,23,30,.85); } /* --- Insights single: tag + share corrections (2026-08-27d) --- */ /* font-size:0 on the list (to kill Elementor's raw ", " text nodes) has to be undone on the links themselves, scoped tightly enough to win. */ .cci-tags .elementor-post-info .elementor-post-info__terms-list a.elementor-post-info__terms-list-item, .cci-chip--cat .elementor-post-info .elementor-post-info__terms-list a.elementor-post-info__terms-list-item{ font-size:10px; }.cci-tags .elementor-post-info .elementor-post-info__terms-list{ display:flex; flex-wrap:wrap; gap:8px; } /* Share icons ship white; on a transparent button that is invisible. */ .cci-share .elementor-share-btn__icon, .cci-share .elementor-share-btn i, .cci-share .elementor-share-btn svg{ color:inherit !important; fill:currentColor !important; }.cci-share .elementor-share-btn:hover{ background:#E43C3A !important; }.cci-share .elementor-share-btn:hover .elementor-share-btn__icon, .cci-share .elementor-share-btn:hover i, .cci-share .elementor-share-btn:hover svg{ color:#FFFFFF !important; fill:#FFFFFF !important; } /* Read-time clock. The icon font's codepoint is unreadable from CSSOM, so this is an inline SVG rather than a guessed glyph. */ .cci-chip--time div.elementor-shortcode::before{ font-family:inherit; content:""; display:inline-block; width:12px; height:12px; flex:none; background-image:url("data:image/svg+xml;utf8,"); background-size:contain; background-repeat:no-repeat; background-position:center; opacity:.7; margin-right:4px; }.cci-article-head, .cci-article-herowrap, .cci-article-body{ background-color:transparent !important; } /* CTA labels: Derek line-height 20px, mine was 14 */ /* featured image: single image, 1100px */ .cci-article-herowrap > .e-con-inner{ max-width:1100px !important; }.cci-article-hero img{ max-width:1100px; margin-left:auto; margin-right:auto; } /* the post content repeats the featured image; the JS snippet hides it, this is the belt-and-braces for when JS has not run yet */ .cci-prose img.cci-dupe-hero{ display:none !important; } /* --- Logo (167x56 in source) --------------------------- */ /* --- Nav pill (663x42 in source) ----------------------- */ /* Light pages (Insights single and friends) take the dark tone */ /* --- Insights single: title block ---------------------- */ .cci-article-head{ position:relative; isolation:isolate; overflow:hidden; text-align:center; background-color:transparent !important; padding:160px 24px 48px !important; }.cci-article-head .e-con-inner{ max-width:720px !important; margin-inline:auto !important; padding:0 !important; }.cci-article-head > *{ position:relative; z-index:1; }.cci-backlink{ margin:0 0 40px !important; }.cci-backlink .elementor-heading-title{ font-family:"IBM Plex Mono", ui-monospace, monospace; font-size:11px; font-weight:600; line-height:16.5px; letter-spacing:2.2px; text-transform:uppercase; color:rgb(91,94,103); display:inline-flex; align-items:center; gap:8px; transition:color .2s ease; }.cci-backlink .elementor-heading-title::before{ content:"\2190"; }.cci-backlink:hover .elementor-heading-title{ color:#15171E; }.cci-chip{ width:auto !important; flex:0 0 auto !important; }.cci-chip .elementor-widget-container > *{ margin:0; }.cci-chip .elementor-post-info, .cci-chip .elementor-shortcode{ display:inline-flex; align-items:center; gap:8px; margin:0 !important; padding:6px 12px !important; border-radius:9999px !important; font-family:"IBM Plex Mono", ui-monospace, monospace; font-size:10px; font-weight:600; line-height:15px; letter-spacing:2.2px; text-transform:uppercase; }.cci-chip--time .elementor-shortcode{ gap:6px; }.cci-chip .elementor-icon-list-item{ margin:0 !important; padding:0 !important; }.cci-chip .elementor-icon-list-item::after{ display:none !important; }.cci-chip .elementor-icon-list-text{ padding:0; }.cci-chip--cat .elementor-post-info{ background-color:#C52B2B; border:0; }.cci-chip--cat .elementor-post-info, .cci-chip--cat .elementor-post-info a{ color:#FFFFFF !important; text-decoration:none; }.cci-chip--pub .elementor-post-info, .cci-chip--time .elementor-shortcode{ color:rgba(21,23,30,.7); border:1px solid rgba(21,23,30,.15); }.cci-article-h1{ margin:0 0 32px !important; }.cci-article-h1 .elementor-heading-title{ font-family:Inter, ui-sans-serif, system-ui, sans-serif; font-size:clamp(2.25rem, 5.6vw, 72px); font-weight:800; line-height:1; letter-spacing:-.025em; color:#15171E; text-align:center; text-wrap:balance; margin:0; }.cci-article-dek{ margin:0 !important; }.cci-article-dek .elementor-widget-container{ font-size:clamp(1.125rem, 2vw, 24px); font-weight:500; line-height:1.3333; color:rgba(21,23,30,.8); margin:0; }.cci-article-dek p{ margin:0; } /* --- Author badge (387x66 in source) ------------------- */ .cci-abadge{ width:auto !important; max-width:none !important; flex:0 0 auto !important; display:inline-flex !important; align-items:center !important; justify-content:flex-start !important; gap:16px !important; padding:12px 20px !important; margin:48px auto 0 !important; border:1px solid rgba(21,23,30,.1) !important; border-radius:9999px !important; background-color:rgba(243,239,232,.6) !important; }.cci-abadge__mark{ width:40px !important; height:40px !important; flex:0 0 40px !important; border-radius:9999px !important; background:rgb(250,249,244) !important; border:1px solid rgba(21,23,30,.1) !important; display:flex !important; align-items:center !important; justify-content:center !important; overflow:hidden !important; padding:0 !important; }.cci-abadge__mark > *{ display:flex !important; align-items:center !important; justify-content:center !important; width:100% !important; height:100% !important; }.cci-abadge__mark img{ width:38px !important; height:auto !important; max-height:24px !important; object-fit:contain !important; border-radius:0 !important; background:none !important; border:0 !important; padding:0 !important; }.cci-abadge__name .elementor-heading-title{ font-family:Inter, ui-sans-serif, system-ui, sans-serif; font-size:14px; font-weight:700; line-height:20px; color:rgb(21,23,30); margin:0; text-align:left; }.cci-abadge__role .elementor-heading-title{ font-family:"IBM Plex Mono", ui-monospace, monospace; font-size:10px; font-weight:400; line-height:12.5px; letter-spacing:1px; text-transform:uppercase; color:rgb(91,94,103); margin:0; text-align:left; } /* Author badge - stay a pill on small screens. Elementor containers default to flex-wrap:wrap, so on a narrow viewport the text column dropped below the mark and the pill rendered as a tall blob. Kim flagged it 31 Aug. */ .cci-abadge{ flex-wrap:nowrap !important; }.cci-abadge > *{ min-width:0 !important; }.cci-abadge__name .elementor-heading-title, .cci-abadge__role .elementor-heading-title{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } @media (max-width:767px){ .cci-abadge{ gap:12px !important; padding:9px 16px !important; margin-top:36px !important; max-width:100% !important; } .cci-abadge__mark{ width:32px !important; height:32px !important; flex:0 0 32px !important; } .cci-abadge__mark img{ width:30px !important; max-height:19px !important; } .cci-abadge__name .elementor-heading-title{ font-size:13px !important; line-height:18px !important; } .cci-abadge__role .elementor-heading-title{ font-size:9px !important; line-height:12px !important; letter-spacing:.8px !important; } } @media (max-width:1024px){ .cci-article-head{ padding:128px 20px 40px !important; } } /* --- Corrections folded in after first front-end check --- */ /* Category chip shows the first term only, as in the source */ .cci-chip--cat .elementor-post-info__terms-list-item:not(:first-child){ display:none !important; }.cci-chip--cat .elementor-post-info__terms-list{ display:inline !important; }.cci-article-dek{ margin:0 !important; }.cci-article-dek, .cci-article-dek p, .cci-article-dek .elementor-widget-container{ font-size:clamp(1.125rem, 2vw, 24px) !important; font-weight:500 !important; line-height:1.3333 !important; color:rgba(21,23,30,.8) !important; }.cci-article-dek p{ margin:0 !important; } /* --- Second front-end check: four residual deltas -------- */ /* 1. Pill is a block-level flex; width:auto fills the row. */ /* 2. The anchor inside the backlink resets type. Re-assert. */ .cci-backlink .elementor-heading-title a{ font-family:"IBM Plex Mono", ui-monospace, monospace !important; font-size:11px !important; font-weight:600 !important; line-height:16.5px !important; letter-spacing:2.2px !important; text-transform:uppercase !important; color:rgb(91,94,103) !important; text-decoration:none !important; }.cci-backlink .elementor-heading-title a:hover{ color:#15171E !important; } /* 3. Collapse the heading widget line box around the link. */ .cci-backlink, .cci-backlink .elementor-widget-container{ line-height:16.5px !important; } /* 4. Chip icons were forcing the pill 4px taller than 27. */ .cci-chip .elementor-icon-list-item, .cci-chip .elementor-icon-list-text{ line-height:15px !important; }.cci-chip .elementor-icon-list-icon{ display:flex !important; align-items:center !important; }.cci-chip .elementor-icon-list-icon svg{ width:12px !important; height:12px !important; display:block !important; } /* 5. Elementor injects a default icon into every post-info */ /* row. The source shows an icon on the read-time chip */ /* only, so suppress it on the other two. */ .cci-chip--cat .elementor-icon-list-icon, .cci-chip--pub .elementor-icon-list-icon{ display:none !important; } /* 6. The text span was a line box mixing a 0px strut with */ /* 10px text, which rendered 19px instead of 15px. */ .cci-chip .elementor-icon-list-text{ display:flex !important; align-items:center !important; line-height:15px !important; height:15px !important; }.cci-chip .elementor-icon-list-item{ align-items:center !important; } /* 7. Elementor re-declares typography on the post-info inner */ /* spans and anchors, which knocked the chips back to */ /* Inter sentence case. Assert the whole subtree. */ .cci-chip .elementor-post-info, .cci-chip .elementor-post-info *, .cci-chip .elementor-shortcode, .cci-chip .elementor-shortcode *{ font-family:"IBM Plex Mono", ui-monospace, monospace !important; font-size:10px !important; font-weight:600 !important; letter-spacing:2.2px !important; text-transform:uppercase !important; color:inherit !important; } /* Terms are separated by raw ", " text nodes; zero the list */ /* font-size to drop them, restore it on the term itself. */ .cci-chip--cat .elementor-post-info__terms-list{ font-size:0 !important; }.cci-chip--cat .elementor-post-info__terms-list-item{ font-size:10px !important; }.cci-chip--cat .elementor-post-info, .cci-chip--cat .elementor-post-info a{ color:#FFFFFF !important; }.cci-chip--pub .elementor-post-info, .cci-chip--pub .elementor-post-info *{ color:rgba(21,23,30,.7) !important; }.cci-chip--time .elementor-shortcode, .cci-chip--time .elementor-shortcode *{ color:rgba(21,23,30,.7) !important; } /* 8. Flexing the text span collapsed the space between the */ /* "Published" prefix and the date. Restore it as a gap. */ .cci-chip--pub .elementor-icon-list-text{ gap:.42em !important; } /* --- Article body, measured off the source --------------- */ /* The block editor repeats the featured image at the top of */ /* the content and pads it with a spacer block. The template */ /* already renders it as the 1100px hero, so drop both. This */ /* is structural, so CSS handles it, not the de-dupe script. */ .elementor-widget-theme-post-content .wp-block-post-featured-image, .elementor-widget-theme-post-content .wp-block-post-featured-image + .wp-block-spacer{ display:none !important; } /* Source: p 20/1.7 mb24 - h2 36/1.1 mt64 mb20 - */ /* h3 26.4/1.2 mt44 mb16 - blockquote 20.8/1.5 m40 */ .cci-prose p, .elementor-widget-theme-post-content p{ font-size:20px !important; line-height:1.7 !important; font-weight:400 !important; color:rgba(21,23,30,.85) !important; margin:0 0 24px !important; }.cci-prose h2, .elementor-widget-theme-post-content h2{ font-size:36px !important; line-height:1.1 !important; letter-spacing:-.02em !important; font-weight:800 !important; color:#15171E !important; margin:64px 0 20px !important; }.cci-prose h3, .elementor-widget-theme-post-content h3{ font-size:26.4px !important; line-height:1.2 !important; letter-spacing:-.01em !important; font-weight:800 !important; color:#15171E !important; margin:44px 0 16px !important; }.cci-prose blockquote, .elementor-widget-theme-post-content blockquote{ font-size:20.8px !important; line-height:1.5 !important; font-weight:400 !important; color:#15171E !important; margin:40px 0 !important; } /* The first block of the body should not carry a top margin */ /* - the hero already sets the 80px offset. Covers both the */ /* plain first child and the one following the dropped */ /* featured-image plus spacer pair. */ .elementor-widget-theme-post-content > .elementor-widget-container > :first-child, .elementor-widget-theme-post-content .wp-block-post-featured-image + .wp-block-spacer + *{ margin-top:0 !important; } /* ========================================================== Press release boilerplate panel The block editor emits the boilerplate as a run of blocks carrying .has-background. Rather than ask editors to build a container, the run is painted as one continuous panel: the first block caps the top, the last caps the bottom. ========================================================== */ .elementor-widget-theme-post-content .has-background{ background-color:#F3EFE8 !important; margin:0 !important; padding:0 40px !important; border-left:1px solid rgba(21,23,30,.1) !important; border-right:1px solid rgba(21,23,30,.1) !important; color:rgba(21,23,30,.75) !important; }.elementor-widget-theme-post-content .has-background:not(.has-background + .has-background){ margin-top:48px !important; padding-top:40px !important; border-top:1px solid rgba(21,23,30,.1) !important; border-radius:16px 16px 0 0 !important; }.elementor-widget-theme-post-content .has-background:not(:has(+ .has-background)){ padding-bottom:40px !important; border-bottom:1px solid rgba(21,23,30,.1) !important; border-radius:0 0 16px 16px !important; } /* Boilerplate headings read as the CTA band eyebrow. */ .elementor-widget-theme-post-content h4{ font-family:"IBM Plex Mono", ui-monospace, monospace !important; font-size:11px !important; font-weight:600 !important; line-height:1 !important; letter-spacing:.2em !important; text-transform:uppercase !important; color:rgba(21,23,30,.7) !important; display:flex !important; align-items:center !important; gap:12px !important; }.elementor-widget-theme-post-content h4::before{ content:""; width:40px; height:1px; background:#C52B2B; flex:none; }.elementor-widget-theme-post-content h4.has-background + .has-background{ padding-top:24px !important; } /* Boilerplate body sits a step below article copy. */ .elementor-widget-theme-post-content p.has-background{ font-size:17px !important; line-height:1.6 !important; color:rgba(21,23,30,.75) !important; }.elementor-widget-theme-post-content p.has-background + p.has-background{ padding-top:20px !important; } /* The links row, tagged by the JS snippet, renders as the */ /* same button pair used in the header: outline then red. */ .elementor-widget-theme-post-content p.cci-pr-actions{ display:flex !important; flex-wrap:wrap !important; gap:12px !important; padding-top:28px !important; } /* The theme colours body links at a higher specificity than */ /* a bare class, so the button colours are re-asserted from */ /* inside the row. 13px rather than the header 14px: the */ /* 688px measure will not hold both labels at 14. */ .elementor-widget-theme-post-content p.cci-pr-actions a.cci-btn-ghost, .elementor-widget-theme-post-content p.cci-pr-actions a.cci-btn-primary{ font-size:13px !important; }.elementor-widget-theme-post-content p.cci-pr-actions a.cci-btn-ghost{ background-color:transparent !important; color:rgb(21,23,30) !important; border:1px solid rgb(21,23,30) !important; }.elementor-widget-theme-post-content p.cci-pr-actions a.cci-btn-ghost:hover{ background-color:rgb(21,23,30) !important; color:#FAF9F4 !important; }.elementor-widget-theme-post-content p.cci-pr-actions a.cci-btn-primary{ background-color:#C52B2B !important; color:#FFFFFF !important; border:0 !important; }.elementor-widget-theme-post-content p.cci-pr-actions a.cci-btn-primary:hover{ background-color:#E43C3A !important; color:#FFFFFF !important; } /* The buttons are class-tagged by script after first paint, */ /* so a colour transition starts from the un-tagged link */ /* colours and, mid-flight, outranks even !important. No */ /* transition on colour: the base state must be exact. */ .cci-btn-ghost, .cci-btn-primary, .elementor-widget-theme-post-content p.cci-pr-actions a{ transition:none !important; } /* Legacy spacer blocks sat above every boilerplate heading */ /* to fake separation in the old theme. The panel and the */ /* heading margin now own that space, so collapse the spacers */ /* that precede them. Spacers elsewhere in the copy stay. */ .elementor-widget-theme-post-content .wp-block-spacer:has(+ h4), .elementor-widget-theme-post-content .wp-block-spacer:has(+ .has-background){ height:0 !important; }.elementor-widget-theme-post-content h4{ margin:40px 0 16px !important; } /* Template-rendered boilerplate (shortcode). Same panel as the */ /* inline block run, but self-contained in one container. */ .cci-boiler{ background-color:#F3EFE8; border:1px solid rgba(21,23,30,.1); border-radius:16px; padding:40px; margin:48px 0 0; color:rgba(21,23,30,.75); }.cci-boiler__eyebrow{ font-family:"IBM Plex Mono", ui-monospace, monospace; font-size:11px; font-weight:600; line-height:1; letter-spacing:.2em; text-transform:uppercase; color:rgba(21,23,30,.7); display:flex; align-items:center; gap:12px; margin:0 0 24px; }.cci-boiler__eyebrow::before{ content:""; width:40px; height:1px; background:#C52B2B; flex:none; }.cci-boiler__p{ font-size:17px !important; line-height:1.6 !important; color:rgba(21,23,30,.75) !important; margin:0 0 20px !important; }.cci-boiler__p:last-of-type{ margin-bottom:0 !important; }.cci-boiler .cci-pr-actions{ display:flex !important; flex-wrap:wrap !important; gap:12px !important; margin:28px 0 0 !important; }.cci-boiler a.cci-btn-ghost{ background-color:transparent !important; color:rgb(21,23,30) !important; border:1px solid rgb(21,23,30) !important; }.cci-boiler a.cci-btn-ghost:hover{ background-color:rgb(21,23,30) !important; color:#FAF9F4 !important; }.cci-boiler a.cci-btn-primary{ background-color:#C52B2B !important; color:#FFFFFF !important; border:0 !important; }.cci-boiler a.cci-btn-primary:hover{ background-color:#E43C3A !important; }.cci-boiler a.cci-btn-ghost, .cci-boiler a.cci-btn-primary{ font-size:13px !important; } @media (max-width:600px){ .cci-boiler{ padding:24px !important; } } /* Belt and braces: where the template panel renders, hide any */ /* inline copy still sitting in the post body, so a release can */ /* never show the boilerplate twice while the old copies are */ /* still being cleaned out of the content. */ .elementor-widget-theme-post-content .has-background{ display:none !important; } /* The article prose rule is widget-scoped, so the boilerplate */ /* paragraph needs the same scope to hold 17px. */ .elementor-widget-theme-post-content .cci-boiler__p{ font-size:17px !important; line-height:1.6 !important; color:rgba(21,23,30,.75) !important; margin:0 0 20px !important; }.elementor-widget-theme-post-content .cci-boiler__p:last-of-type{ margin-bottom:0 !important; } /* The second CTA carried a legacy 12px left margin on top of */ /* the slot gap, which both doubled the button spacing and */ /* pushed the pair 29px past the container edge. Gap owns the */ /* spacing; the widgets carry none. */ /* One of the three header slots was growing to absorb the free */ /* space, which threw the gaps uneven and pushed the CTA pair */ /* past the container. Every slot sizes to its content and */ /* space-between splits what is left evenly. */ /* The boilerplate eyebrow is an h4 inside the post content, so */ /* it was picking up the 40px heading margin on top of the */ /* panel s own 40px padding - 80 at the top against 40 at the */ /* bottom. Restate it at higher specificity. */ .elementor-widget-theme-post-content .cci-boiler__eyebrow{ margin:0 0 24px !important; } /* ========================================================== Body prose corrections from the Blind Spots diff, 2026-08-28 Two measured misses: - paragraph leading was 34px against the source 28px. The source container carries leading-1.7 but the paragraph itself resolves to Tailwind text-xl, which is 20/28. - the prose column measured 768 against the source 720; the source column is 48rem with 24px inline padding. ========================================================== */ .cci-prose p, .elementor-widget-theme-post-content p{ line-height:28px !important; }.elementor-widget-theme-post-content{max-width:min(720px,100%)!important; margin-inline:auto !important; } /* ========================================================== Blind Spots review pass, 2026-08-28 ========================================================== */ /* 1. Pull quote, measured off the source: cream-70 panel, */ /* 4px red rule, italic, 20.8/31. */ .cci-prose blockquote, .elementor-widget-theme-post-content blockquote{ background-color:rgba(243,239,232,.7) !important; border:0 !important; border-left:4px solid #E43C3A !important; border-radius:0 !important; padding:32px 32px 32px 40px !important; margin:40px 0 !important; font-size:20.8px !important; line-height:31px !important; font-weight:400 !important; font-style:italic !important; color:#15171E !important; }.elementor-widget-theme-post-content blockquote p{ font-size:inherit !important; line-height:inherit !important; font-style:inherit !important; color:inherit !important; margin:0 !important; } /* 2. Links in body copy were rendering 16px against the */ /* paragraph 20px, which read as a font change. Inherit. */ .cci-prose a, .elementor-widget-theme-post-content p a, .elementor-widget-theme-post-content li a{ font-size:inherit !important; font-family:inherit !important; font-weight:inherit !important; letter-spacing:inherit !important; line-height:inherit !important; } /* 3. Legacy spacer blocks sit above every heading. The */ /* heading margins own that space now. */ .elementor-widget-theme-post-content .wp-block-spacer:has(+ h2), .elementor-widget-theme-post-content .wp-block-spacer:has(+ h3), .elementor-widget-theme-post-content .wp-block-spacer:has(+ h4){ height:0 !important; } /* 4. The boilerplate now lives in the template and renders */ /* only on Community News. Any copy still pasted into a */ /* post body stays hidden, so it can never appear on an */ /* article that should not carry it. */ /* 5. Legacy inline contact form, superseded by the template */ /* CTA. Hidden with the heading that introduces it (that */ /* heading is matched by the script, which can read text). */ .elementor-widget-theme-post-content .gform_wrapper, .elementor-widget-theme-post-content .gform-body{ display:none !important; } /* 6. The prose column narrowed to 720, so the panel buttons */ /* no longer fit at 13px and were wrapping. */ .elementor-widget-theme-post-content p.cci-pr-actions a.cci-btn-ghost, .elementor-widget-theme-post-content p.cci-pr-actions a.cci-btn-primary, .cci-boiler a.cci-btn-ghost, .cci-boiler a.cci-btn-primary{ font-size:12px !important; padding:0 16px !important; white-space:nowrap !important; }.cci-boiler .cci-pr-actions{ flex-wrap:nowrap !important; } /* The inline button row is also a .cci-pr-actions, and that */ /* rule sets display:flex at higher specificity, so it */ /* survived the blanket hide. Beat it explicitly. */ .elementor-widget-theme-post-content .has-background.cci-pr-actions, .elementor-widget-theme-post-content p.has-background{ display:none !important; } /* ========================================================== Section headings and their dividers Measured on the source: the hairline lives on the heading, not on a wrapper. h2 there carries border-top 1px at ink-8, padding-top 32, margin 64 above and 20 below, at 36/40. The script tags whichever level is acting as the section heading in a given article, so imported posts that demoted their sections to h3 get the same treatment. ========================================================== */ .elementor-widget-theme-post-content .cci-sec{ border-top:1px solid rgba(21,23,30,.08) !important; padding-top:32px !important; margin:64px 0 20px !important; font-size:36px !important; line-height:40px !important; letter-spacing:-.02em !important; font-weight:800 !important; color:#15171E !important; } /* ========================================================== POST IMAGES - faint red glow. Kim’s call 31 Aug. Applies to the featured image and to images placed in the body of a blog post. Deliberately low opacity - it should read as a lift off the cream, not a border. Excludes related-post thumbnails and any UI chrome. ========================================================== */ .elementor-widget-theme-post-featured-image img, .elementor-widget-theme-post-content figure.wp-block-image img, .elementor-widget-theme-post-content figure.wp-block-embed img{ box-shadow: 0 0 0 1px rgba(228,60,58,.05), 0 2px 10px rgba(228,60,58,.06), 0 14px 40px rgba(228,60,58,.07) !important; } @media (max-width:700px){ .elementor-widget-theme-post-featured-image img, .elementor-widget-theme-post-content figure.wp-block-image img{ box-shadow: 0 0 0 1px rgba(228,60,58,.05), 0 8px 24px rgba(228,60,58,.06) !important; } } /* ========================================================== SECTION MARKERS - numbered vs unnumbered. Measured off Derek insights post, 31 Aug 2026. Numbered sections take the red square and drop the rule; unnumbered sections keep the hairline they had. cci-sec--num is set by markNumbered() in the JS snippet. ADDITIVE ONLY - the block above is unchanged. ========================================================== */ .elementor-widget-theme-post-content h3{ font-size:26.4px !important; line-height:31.68px !important; letter-spacing:-.01em !important; font-weight:800 !important; }.elementor-widget-theme-post-content h3.cci-sec{ font-size:26.4px !important; line-height:31.68px !important; }.elementor-widget-theme-post-content .cci-sec--num{ display:flex !important; align-items:baseline; gap:16px; border-top:0 !important; padding-top:0 !important; margin:44px 0 16px !important; }.elementor-widget-theme-post-content .cci-sec--num::before{ content:""; flex:0 0 auto; width:.65rem; height:.65rem; background:#E43C3A; transform:translateY(-2px); } @media (max-width:700px){ .elementor-widget-theme-post-content h3, .elementor-widget-theme-post-content h3.cci-sec{ font-size:23px !important; line-height:28px !important; } .elementor-widget-theme-post-content .cci-sec--num{gap:12px;} }.cci-ep-headgrid{ display:grid !important; grid-template-columns:280px 1fr !important; gap:40px !important; align-items:start !important; width:100% !important; max-width:none !important; margin-top:32px !important; padding:0 !important; }.cci-ep-artcol{ width:280px !important; padding:0 !important; }.cci-ep-artcol img{ width:280px !important; height:280px !important; object-fit:cover !important; border-radius:6px !important; box-shadow:0 0 0 2px rgba(228,60,58,.4), 0 14px 40px -14px rgb(228,60,58) !important; }.cci-ep-textcol{ display:flex !important; flex-direction:column !important; align-items:flex-start !important; padding:0 !important; width:100% !important; max-width:none !important; }.cci-ep-textcol > *{ width:100% !important; }.cci-ep-textcol .cci-chiprow{ justify-content:flex-start !important; padding:0 !important; width:auto !important; }.cci-ep-textcol .cci-article-h1{ margin-top:16px !important; }.cci-ep-textcol .cci-ep-durwrap{ margin-top:12px !important; }.cci-ep-textcol .cci-ep-playerwrap{ margin-top:32px !important; }.cci-transcript__head{ display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; }.cci-chip--soon{ display:inline-flex; align-items:center; gap:6px; border:1px solid rgba(228,60,58,.4); background-color:rgba(228,60,58,.1); border-radius:9999px; padding:4px 12px; font-size:12px; line-height:16px; font-weight:600; letter-spacing:.6px; text-transform:uppercase; color:rgb(181,178,171); }.cci-transcript__panel{ margin-top:20px; padding:32px; text-align:center; border:2px dashed rgba(228,60,58,.3); border-radius:6px; background-color:rgba(39,42,52,.2); }.cci-transcript__panel p{ color:rgb(209,203,189); margin:0 0 20px; }.cci-transcript__btn{ display:inline-flex; align-items:center; justify-content:center; min-width:234px; height:40px; padding:0 20px; border:1px solid rgb(250,249,244); border-radius:6px; background:transparent; font-size:14px; line-height:20px; font-weight:600; letter-spacing:.7px; text-transform:uppercase; color:#FAF9F4; text-decoration:none; }.cci-transcript__btn:hover{ background-color:rgba(250,249,244,.12); color:#FFFFFF; }.cci-railcard{ width:280px; padding:24px; border-radius:6px; border:2px solid rgba(228,60,58,.3); background-color:rgba(39,42,52,.4); backdrop-filter:blur(4px); }.cci-railcard__h{ font-size:14px; line-height:20px; font-weight:700; letter-spacing:.7px; text-transform:uppercase; color:#FFFFFF; margin:0; }.cci-railcard__p{ font-size:14px; line-height:20px; font-weight:400; color:rgb(209,203,189); margin:12px 0 0; }.cci-railcard__btn{ display:inline-flex; align-items:center; justify-content:center; width:228px; height:40px; padding:0 20px; margin-top:16px; border-radius:6px; text-decoration:none; font-size:14px; line-height:20px; font-weight:600; letter-spacing:.7px; text-transform:uppercase; }.cci-railcard__btn--primary{ background-color:#E43C3A; color:#FFFFFF; border:1px solid #E43C3A; }.cci-railcard__btn--primary:hover{ background-color:#C93230; color:#FFFFFF; }.cci-railcard__btn--ghost{ background:transparent; color:#FAF9F4; border:1px solid rgb(250,249,244); }.cci-railcard__btn--ghost:hover{ background-color:rgba(250,249,244,.12); color:#FFFFFF; } /* 14 Sep 2026: bare URLs pasted as link text must wrap on phones */ .cci-prose a{overflow-wrap:anywhere}/* End custom CSS */