/*
Theme Name: CyberPowerPC Editorial
Author: CyberPowerPC
Description: Lightweight, custom editorial theme for the CyberPowerPC blog.
Version: 0.4.0
Text Domain: cppc-editorial
*/

:root { --cppc-accent:#f14c25; --cppc-ink:#17191d; --cppc-muted:#6b717a; --cppc-stroke:#e6e8eb; }

/* The header is retained as a retail-site fallback. Cloudflare may replace its
   markup on public /blog/ pages. Never apply global .grid/.card/.section styles:
   the retail site's stylesheet also uses these common names. */
*,*::before,*::after { box-sizing:border-box; }
body { margin:0; }
.skip { position:absolute;left:-10000px;top:auto; }
.skip:focus { left:12px;top:12px;background:white;z-index:1000;padding:10px; }
.header { border-bottom:1px solid #eee;background:#fff;position:relative;z-index:20; }
.header-wrap { display:flex;align-items:center;gap:28px;padding:0 18px;min-height:68px; }
.brand { white-space:nowrap;font-family:Arial,Helvetica,sans-serif;font-size:18px;letter-spacing:-.05em;font-weight:900;display:flex;align-items:center;text-decoration:none;color:#18191c; }
.brand b { font-size:30px;color:var(--cppc-accent);margin-right:5px; }
.brand span { font-weight:400;color:#555; }
.retail-nav { display:flex;align-items:center;gap:clamp(13px,2.1vw,34px);flex:1;white-space:nowrap; }
.retail-nav a { font:700 13px Arial,Helvetica,sans-serif;color:#17191d;text-decoration:none; }
.retail-nav .current { border-bottom:2px solid var(--cppc-accent);padding:22px 0; }
.header-tools { display:flex;align-items:center;gap:12px;margin-left:auto; }
.icon-btn { background:none;border:0;color:#12171e;font-size:22px;line-height:1;display:inline-flex;align-items:center;justify-content:center;min-width:25px;cursor:pointer;text-decoration:none; }
.menu-toggle { display:none; }
.mobile-menu[hidden],.search-panel[hidden] { display:none!important; }
.search-panel { padding:15px 28px;border-top:1px solid var(--cppc-stroke); }
.search-panel form { display:flex;gap:8px;max-width:700px;margin:auto; }
.search-panel input { flex:1;min-width:0;padding:10px;border:1px solid #bbb; }
.search-panel button { background:var(--cppc-ink);color:white;border:0;padding:8px 20px; }
.mobile-menu { display:none; }

/* Entire editorial component tree is isolated by #main.cppc-editorial.
   This keeps retail header/footer styling outside the theme's content. */
#main.cppc-editorial {
  display:block;
  width:100%;
  min-width:0;
  max-width:none;
  margin:0;
  padding:0 0 54px;
  background:#fff;
  color:var(--cppc-ink);
  font:400 15.5px/1.62 Inter,Montserrat,"Segoe UI",Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
}
#main.cppc-editorial *,#main.cppc-editorial *::before,#main.cppc-editorial *::after { box-sizing:border-box; }
#main.cppc-editorial .cppc-wrap { display:block;width:100%;max-width:1190px;margin:0 auto;padding:0 28px;min-width:0; }
#main.cppc-editorial a { color:inherit;text-decoration:none; }
#main.cppc-editorial a:hover { color:var(--cppc-accent); }
#main.cppc-editorial img { max-width:100%;height:auto; }
#main.cppc-editorial h1,#main.cppc-editorial h2,#main.cppc-editorial h3 {
  margin:0;
  color:inherit;
  font-family:Inter,Montserrat,"Segoe UI",Arial,sans-serif;
  font-weight:800;
  letter-spacing:-.035em;
  line-height:1.18;
  word-break:normal;
  overflow-wrap:normal;
  hyphens:none;
}
#main.cppc-editorial h1 { font-size:clamp(34px,4vw,58px); }
#main.cppc-editorial h2 { font-size:clamp(25px,2.6vw,33px); }
#main.cppc-editorial h3 { font-size:19px; }
#main.cppc-editorial p { margin:0 0 1.2em; }
#main.cppc-editorial .cppc-kicker {
  display:block;max-width:100%;color:var(--cppc-accent);
  font-size:11px;line-height:1.55;font-weight:800;text-transform:uppercase;
  letter-spacing:.065em;white-space:normal;overflow-wrap:break-word;
}
#main.cppc-editorial .cppc-button {
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  min-height:43px;padding:10px 20px;margin-top:9px;
  background:var(--cppc-accent);border:1px solid var(--cppc-accent);
  font-size:13px;font-weight:750;color:#fff;text-align:center;
}
#main.cppc-editorial .cppc-button:hover { color:#fff;background:#d83e1d; }
#main.cppc-editorial .cppc-button--light { background:white;color:var(--cppc-ink);border-color:white; }
#main.cppc-editorial .cppc-button--light:hover { color:var(--cppc-ink);background:#eff0f2; }

/* Homepage hero starts BELOW the shared retail navigation. */
#main.cppc-editorial .cppc-hero-inset { padding-top:28px; }
#main.cppc-editorial .cppc-hero {
  display:flex;position:relative;min-height:390px;align-items:center;overflow:hidden;
  background-color:#171c22;
  background-image:linear-gradient(90deg,rgba(7,10,13,.94) 0%,rgba(8,10,14,.84) 37%,rgba(5,6,8,.09) 100%),var(--cppc-hero-image,linear-gradient(135deg,#171c22,#36414f));
  background-position:center;background-size:cover;
  color:white;
}
#main.cppc-editorial .cppc-hero-copy { position:relative;z-index:1;max-width:670px;width:66%;padding:48px 44px; }
#main.cppc-editorial .cppc-hero h1 { color:white;font-size:clamp(36px,4.1vw,58px);margin:7px 0 15px;max-width:630px; }
#main.cppc-editorial .cppc-hero p { color:#fff;line-height:1.55;max-width:490px;font-size:15px;margin:0 0 10px; }

/* Blog-specific horizontal navigation, independent of the retail nav. */
#main.cppc-editorial .cppc-topic-nav {
  display:flex;width:100%;align-items:center;gap:28px;overflow-x:auto;
  white-space:nowrap;min-width:0;border-bottom:1px solid var(--cppc-stroke);
  padding:0 2px;scrollbar-width:thin;
}
#main.cppc-editorial .cppc-topic-nav a {
  display:inline-flex;align-items:center;gap:7px;white-space:nowrap;flex:none;
  min-height:52px;border-bottom:2px solid transparent;padding:14px 1px 12px;
  font-size:12.5px;font-weight:600;color:#48505a;
}
#main.cppc-editorial .cppc-topic-nav .cppc-topic-nav-home { color:var(--cppc-ink);font-weight:800; }
#main.cppc-editorial .cppc-topic-nav .cppc-topic-nav-home svg { width:17px;height:17px;flex:none; }
#main.cppc-editorial .cppc-topic-nav a:hover,#main.cppc-editorial .cppc-topic-nav a:focus-visible { border-color:var(--cppc-accent);color:var(--cppc-accent); }

#main.cppc-editorial .cppc-section { padding:42px 0 10px;min-width:0; }
#main.cppc-editorial .cppc-section-head { display:flex;justify-content:space-between;align-items:baseline;gap:20px;margin-bottom:20px; }
#main.cppc-editorial .cppc-section-head>a { white-space:nowrap;color:var(--cppc-ink);font-size:13px;font-weight:700; }

/* Lead story is intentionally wider. Secondary stories stack as horizontal cards. */
#main.cppc-editorial .cppc-lead-grid {
  display:grid!important;grid-template-columns:minmax(0,1.14fr) minmax(0,.86fr)!important;
  grid-template-rows:repeat(3,minmax(0,auto));gap:17px 25px;
  width:100%;min-width:0;align-items:start;
}
#main.cppc-editorial .cppc-lead-grid>.cppc-article-card--lead { grid-column:1;grid-row:1/span 3; }
#main.cppc-editorial .cppc-article-card {
  display:block;position:relative;min-width:0;max-width:none;width:auto;
  margin:0;padding:0;text-align:left;overflow:visible;
  background:transparent;border:0;border-radius:0;box-shadow:none;
  font-size:inherit;
}
#main.cppc-editorial .cppc-card-image {
  display:block;position:relative;width:100%;max-width:100%;min-width:0;
  aspect-ratio:16 / 9;overflow:hidden;background:#e9ecef;
}
#main.cppc-editorial .cppc-card-image>.cppc-thumbnail,
#main.cppc-editorial .cppc-card-image>.cppc-image-placeholder {
  display:block;width:100%!important;height:100%!important;max-width:none!important;
  object-fit:cover;object-position:center;position:absolute;inset:0;
}
#main.cppc-editorial .cppc-image-placeholder { background:linear-gradient(135deg,#e8ecf0,#cdd3da); }
#main.cppc-editorial .cppc-card-copy { display:block;width:100%;min-width:0;padding:10px 0 0; }
#main.cppc-editorial .cppc-card-title {
  display:block;margin:5px 0 8px;font-size:18px;line-height:1.3;
  overflow-wrap:break-word;word-break:normal;hyphens:none;
}
#main.cppc-editorial .cppc-card-title a { color:var(--cppc-ink); }
#main.cppc-editorial .cppc-card-meta { color:#848991;font-size:12px;line-height:1.5; }
#main.cppc-editorial .cppc-article-card--lead .cppc-card-title { font-size:25px;line-height:1.22; }
#main.cppc-editorial .cppc-article-card--compact {
  display:grid!important;grid-template-columns:150px minmax(0,1fr)!important;
  align-items:start;gap:16px;width:100%;
}
#main.cppc-editorial .cppc-article-card--compact .cppc-card-copy { padding:0; }
#main.cppc-editorial .cppc-article-card--compact .cppc-card-title { font-size:16px;line-height:1.27; }

/* Featured series is a deliberate dark image-driven interruption. */
#main.cppc-editorial .cppc-feature-band {
  display:grid!important;grid-template-columns:1fr 1fr!important;min-height:258px;
  overflow:hidden;background:#121820;color:white;margin-top:54px;
}
#main.cppc-editorial .cppc-feature-content { padding:40px 44px;align-self:center;min-width:0; }
#main.cppc-editorial .cppc-feature-content h2 { color:#fff;margin:8px 0 12px; }
#main.cppc-editorial .cppc-feature-content p { max-width:420px;line-height:1.58;color:#eceef2; }
#main.cppc-editorial .cppc-feature-art {
  display:flex;align-items:center;justify-content:center;text-align:left;
  background:linear-gradient(115deg,#222a34,#3d4b58);
  color:#c0c8d2;letter-spacing:.33em;line-height:2.3;font-size:12px;
}

/* Shared three-up grid: home, archive/search, and single related stories. */
#main.cppc-editorial .cppc-article-grid {
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  align-items:start;justify-items:stretch;
  gap:30px 24px;width:100%;min-width:0;max-width:none;
}
#main.cppc-editorial .cppc-article-grid>.cppc-article-card { min-width:0;width:100%;grid-column:auto; }
#main.cppc-editorial .cppc-article-grid .cppc-card-title { font-size:17px;line-height:1.35; }

/* Topic tiles are full-sized links, not tiny icon/arrow widgets. */
#main.cppc-editorial .cppc-topics-section { padding-bottom:48px; }
#main.cppc-editorial .cppc-topic-tiles {
  display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;
  align-items:stretch;gap:14px;width:100%;
}
#main.cppc-editorial .cppc-topic-tile {
  display:flex;flex-direction:column;justify-content:center;gap:6px;
  min-width:0;min-height:110px;padding:20px 24px;
  border:1px solid var(--cppc-stroke);background:#fff;
  transition:border-color .12s ease,background .12s ease;
}
#main.cppc-editorial .cppc-topic-tile:hover,#main.cppc-editorial .cppc-topic-tile:focus-visible { border-color:var(--cppc-accent);background:#fffaf8; }
#main.cppc-editorial .cppc-topic-tile-title { font-size:17px;line-height:1.3;font-weight:800;white-space:normal;overflow-wrap:break-word; }
#main.cppc-editorial .cppc-topic-count { color:var(--cppc-muted);font-size:12px; }

/* Search, category, tag, date and other listing pages. */
#main.cppc-editorial.cppc-listing-page { padding-top:44px; }
#main.cppc-editorial .cppc-archive-intro { margin:0 0 32px;max-width:900px; }
#main.cppc-editorial .cppc-archive-intro h1 { margin:8px 0 11px;font-size:clamp(32px,3.2vw,46px); }
#main.cppc-editorial .cppc-archive-intro p,#main.cppc-editorial .cppc-archive-description { color:var(--cppc-muted);font-size:14px;margin:0; }
#main.cppc-editorial .cppc-pagination { display:block;margin:48px 0 12px;clear:both; }
#main.cppc-editorial .cppc-pagination .nav-links { display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:8px; }
#main.cppc-editorial .cppc-pagination .page-numbers { display:inline-flex;align-items:center;justify-content:center;min-width:38px;min-height:38px;padding:7px 12px;border:1px solid var(--cppc-stroke);color:var(--cppc-ink);font-size:13px;font-weight:600; }
#main.cppc-editorial .cppc-pagination .page-numbers.current { color:#fff;background:var(--cppc-ink);border-color:var(--cppc-ink); }
#main.cppc-editorial .cppc-pagination .page-numbers:hover { border-color:var(--cppc-accent); }
#main.cppc-editorial .cppc-empty-state { padding:45px 0 65px; }
#main.cppc-editorial .cppc-empty-state p { margin:14px 0 20px; }

/* Reading page: deliberate reading measure and optional desktop sidebar. */
#main.cppc-editorial.cppc-single-page { padding-top:20px; }
#main.cppc-editorial .cppc-breadcrumbs { display:flex;flex-wrap:wrap;gap:9px;align-items:center;padding:7px 0 21px;font-size:12px;color:var(--cppc-muted); }
#main.cppc-editorial .cppc-article-head { max-width:850px;padding:12px 0 28px; }
#main.cppc-editorial .cppc-article-head h1 { margin:9px 0 17px;font-size:clamp(35px,4.2vw,56px); }
#main.cppc-editorial .cppc-dek { max-width:740px;color:#565e69;font-size:17px;line-height:1.57; }
#main.cppc-editorial .cppc-byline { color:var(--cppc-muted);font-size:12.5px; }
#main.cppc-editorial .cppc-article-layout {
  display:grid!important;grid-template-columns:minmax(0,790px) minmax(0,266px)!important;
  gap:42px;align-items:start;min-width:0;
}
#main.cppc-editorial .cppc-article-body {
  display:block;min-width:0;max-width:100%;width:100%;
  font-size:16px;line-height:1.8;overflow-wrap:break-word;
}
#main.cppc-editorial .cppc-article-body p { margin:0 0 1.35em; }
#main.cppc-editorial .cppc-article-body h2 { margin:1.9em 0 .65em;font-size:27px; }
#main.cppc-editorial .cppc-article-body h3 { margin:1.4em 0 .55em;font-size:21px; }
#main.cppc-editorial .cppc-article-body img { display:block;max-width:100%;height:auto; }
#main.cppc-editorial .cppc-article-body figure { max-width:100%;margin:1.6em 0; }
#main.cppc-editorial .cppc-article-body iframe { max-width:100%; }
#main.cppc-editorial .cppc-article-body table { display:block;max-width:100%;overflow-x:auto;border-collapse:collapse; }
#main.cppc-editorial .cppc-article-side { display:block;min-width:0;position:sticky;top:20px;font-size:13px; }
#main.cppc-editorial .cppc-side-box { border:1px solid var(--cppc-stroke);padding:18px 20px;margin-bottom:16px; }
#main.cppc-editorial .cppc-side-box strong,#main.cppc-editorial .cppc-side-box summary { font-size:14px;font-weight:800; }
#main.cppc-editorial .cppc-side-box p { color:#626a73;margin:11px 0;line-height:1.6; }
#main.cppc-editorial .cppc-side-box a { color:var(--cppc-accent); }
#main.cppc-editorial .cppc-toc-box[hidden] { display:none!important; }
#main.cppc-editorial .cppc-toc-details summary { cursor:pointer;list-style:none; }
#main.cppc-editorial .cppc-toc-details summary::-webkit-details-marker { display:none; }
#main.cppc-editorial .cppc-toc-details summary::after { content:'▾';float:right;color:#6c727b;font-size:11px; }
#main.cppc-editorial .cppc-toc-details[open] summary::after { transform:rotate(180deg); }
#main.cppc-editorial .cppc-toc-box ol { padding-left:19px;margin:14px 0 0;line-height:1.5; }
#main.cppc-editorial .cppc-toc-box li { margin:9px 0;overflow-wrap:break-word; }
#main.cppc-editorial .cppc-toc-box .cppc-toc-subitem { margin-left:14px; }
#main.cppc-editorial .cppc-related-section { padding-top:54px; }

@media (max-width:1307px) {
  .retail-nav { display:none; }
  .menu-toggle { display:inline-flex; }
  .mobile-menu:not([hidden]) { display:flex;flex-direction:column;padding:12px 26px;border-top:1px solid var(--cppc-stroke);max-height:75vh;overflow:auto; }
  .mobile-menu a { padding:12px 0;border-bottom:1px solid var(--cppc-stroke);font-weight:700; }
  .header-wrap { justify-content:space-between; }
  .header-tools { margin-left:auto; }
}
@media (max-width:950px) {
  #main.cppc-editorial .cppc-article-grid { grid-template-columns:repeat(2,minmax(0,1fr))!important; }
  #main.cppc-editorial .cppc-topic-tiles { grid-template-columns:repeat(2,minmax(0,1fr))!important; }
  #main.cppc-editorial .cppc-article-layout { grid-template-columns:minmax(0,1fr) 235px!important;gap:28px; }
  #main.cppc-editorial .cppc-lead-grid { grid-template-columns:minmax(0,1fr) minmax(0,.9fr)!important;gap:15px 18px; }
  #main.cppc-editorial .cppc-article-card--compact { grid-template-columns:110px minmax(0,1fr)!important;gap:12px; }
}
@media (max-width:800px) {
  #main.cppc-editorial .cppc-lead-grid { grid-template-columns:minmax(0,1fr)!important;grid-template-rows:auto; }
  #main.cppc-editorial .cppc-lead-grid>.cppc-article-card--lead { grid-column:auto;grid-row:auto; }
  #main.cppc-editorial .cppc-article-card--compact { grid-template-columns:160px minmax(0,1fr)!important; }
  #main.cppc-editorial .cppc-feature-band { grid-template-columns:1fr!important; }
  #main.cppc-editorial .cppc-feature-art { min-height:145px; }
  #main.cppc-editorial .cppc-article-layout { display:flex!important;flex-direction:column;gap:24px; }
  #main.cppc-editorial .cppc-article-body { order:1; }
  #main.cppc-editorial .cppc-article-side { order:0;position:static;width:100%; }
  #main.cppc-editorial .cppc-shop-box { display:none; }
  #main.cppc-editorial .cppc-toc-box { margin:0; }
}
@media (max-width:620px) {
  #main.cppc-editorial .cppc-wrap { padding:0 18px; }
  .header-wrap { min-height:64px;padding:0 12px;gap:8px; }
  .brand { font-size:16px; }
  .brand b { font-size:27px; }
  .header-tools { gap:10px; }
  .account-btn { display:none; }
  #main.cppc-editorial .cppc-hero-inset { padding-top:16px; }
  #main.cppc-editorial .cppc-hero { min-height:360px;background-position:60% center; }
  #main.cppc-editorial .cppc-hero-copy { width:100%;max-width:none;padding:30px 24px; }
  #main.cppc-editorial .cppc-hero h1 { font-size:clamp(31px,8.5vw,40px); }
  #main.cppc-editorial .cppc-topic-nav { gap:23px; }
  #main.cppc-editorial .cppc-topic-nav a { min-height:51px;font-size:12px; }
  #main.cppc-editorial .cppc-section { padding-top:33px; }
  #main.cppc-editorial .cppc-section-head { align-items:baseline;gap:8px;margin-bottom:18px; }
  #main.cppc-editorial .cppc-section-head h2 { font-size:25px; }
  #main.cppc-editorial .cppc-section-head>a { font-size:12px; }
  #main.cppc-editorial .cppc-lead-grid { gap:24px; }
  #main.cppc-editorial .cppc-article-card--compact { grid-template-columns:120px minmax(0,1fr)!important;gap:12px; }
  #main.cppc-editorial .cppc-article-card--compact .cppc-card-title { font-size:15px; }
  #main.cppc-editorial .cppc-article-card--lead .cppc-card-title { font-size:22px; }
  #main.cppc-editorial .cppc-feature-band { margin-top:35px; }
  #main.cppc-editorial .cppc-feature-content { padding:28px 23px; }
  #main.cppc-editorial .cppc-article-grid { grid-template-columns:minmax(0,1fr)!important;gap:27px; }
  #main.cppc-editorial .cppc-article-grid .cppc-card-title { font-size:18px; }
  #main.cppc-editorial .cppc-topic-tiles { grid-template-columns:minmax(0,1fr)!important;gap:11px; }
  #main.cppc-editorial .cppc-topic-tile { min-height:90px;padding:16px 20px; }
  #main.cppc-editorial .cppc-topic-tile-title { font-size:16px; }
  #main.cppc-editorial.cppc-listing-page { padding-top:28px; }
  #main.cppc-editorial .cppc-archive-intro { margin-bottom:25px; }
  #main.cppc-editorial .cppc-archive-intro h1 { font-size:32px; }
  #main.cppc-editorial .cppc-breadcrumbs { padding:4px 0 16px; }
  #main.cppc-editorial .cppc-article-head { padding:8px 0 22px; }
  #main.cppc-editorial .cppc-article-head h1 { font-size:clamp(32px,8vw,40px); }
  #main.cppc-editorial .cppc-article-body { font-size:15.5px; }
  #main.cppc-editorial .cppc-article-body h2 { font-size:25px; }
  #main.cppc-editorial .cppc-related-section { padding-top:32px; }
}

/* Archive navigation sits above the results heading, giving readers a route home. */
#main.cppc-editorial.cppc-listing-page .cppc-topic-nav { margin:-16px 0 28px; }
#main.cppc-editorial .cppc-topic-nav a[aria-current="page"] { border-bottom-color:var(--cppc-accent);color:var(--cppc-ink); }
@media (max-width:620px) {
  #main.cppc-editorial.cppc-listing-page .cppc-topic-nav { margin:-12px 0 21px; }
}

/* ───────────────────────────────────────────────────────────────────────────
   v0.4 — Cloudflare embed containment, image-led hero, uncropped card media.
   The retail page can place the fetched WordPress markup inside a narrow
   wrapper. Break out to the viewport without changing the retail navigation.
   ─────────────────────────────────────────────────────────────────────────── */
#main.cppc-editorial {
  width:100vw!important;
  max-width:100vw!important;
  min-width:0!important;
  position:relative!important;
  margin-left:calc(50% - 50vw)!important;
  margin-right:0!important;
  float:none!important;
  clear:both;
}
#main.cppc-editorial > .cppc-wrap {
  width:100%!important;
  max-width:1210px!important;
  min-width:0!important;
  margin:0 auto!important;
  padding-left:clamp(18px,2.2vw,32px)!important;
  padding-right:clamp(18px,2.2vw,32px)!important;
}

/* Main feature: the graphic is displayed intact, never behind overlay copy. */
#main.cppc-editorial .cppc-hero-inset { padding-top:36px; }
#main.cppc-editorial .cppc-hero {
  display:grid!important;
  grid-template-columns:minmax(0,1.14fr) minmax(0,.86fr)!important;
  align-items:stretch;
  min-height:0!important;
  background:#f4f5f6!important;
  background-image:none!important;
  color:var(--cppc-ink);
  overflow:hidden;
}
#main.cppc-editorial .cppc-hero-media {
  display:flex!important;
  grid-column:1;
  grid-row:1;
  width:100%;
  min-width:0;
  aspect-ratio:16 / 10;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  background:#14171b;
}
#main.cppc-editorial .cppc-hero-media img,
#main.cppc-editorial .cppc-hero-placeholder {
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  display:block;
  object-fit:contain!important;
  object-position:center;
  background:#14171b;
}
#main.cppc-editorial .cppc-hero-placeholder {
  background:linear-gradient(130deg,#18212b,#2b394c);
}
#main.cppc-editorial .cppc-hero-copy {
  grid-column:2;
  grid-row:1;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  width:auto!important;
  max-width:none!important;
  min-width:0;
  padding:clamp(24px,3.4vw,46px)!important;
  color:var(--cppc-ink);
}
#main.cppc-editorial .cppc-hero h1 {
  max-width:100%;
  margin:10px 0 18px;
  color:var(--cppc-ink)!important;
  font-size:clamp(28px,3.15vw,44px);
  line-height:1.1;
  overflow-wrap:break-word;
}
#main.cppc-editorial .cppc-hero h1 a { color:inherit; }
#main.cppc-editorial .cppc-hero p {
  max-width:100%;
  color:#434a53!important;
  font-size:14px;
  line-height:1.6;
}

/* Preserve complete embedded text/logos in editorial graphic thumbnails. */
#main.cppc-editorial .cppc-card-image { background:#f0f1f3; }
#main.cppc-editorial .cppc-card-image>.cppc-thumbnail {
  object-fit:contain!important;
  object-position:center!important;
  background:#f0f1f3;
}

@media (max-width:900px) {
  #main.cppc-editorial .cppc-hero { grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr)!important; }
  #main.cppc-editorial .cppc-hero-copy { padding:25px!important; }
  #main.cppc-editorial .cppc-hero h1 { font-size:clamp(25px,3.8vw,36px); }
}
@media (max-width:800px) {
  #main.cppc-editorial .cppc-hero-inset { padding-top:24px; }
  #main.cppc-editorial .cppc-hero { grid-template-columns:minmax(0,1fr)!important; }
  #main.cppc-editorial .cppc-hero-media {
    grid-column:1;
    grid-row:1;
    aspect-ratio:16 / 9;
  }
  #main.cppc-editorial .cppc-hero-copy {
    grid-column:1;
    grid-row:2;
    padding:25px 28px 30px!important;
    background:#f4f5f6;
  }
  #main.cppc-editorial .cppc-hero h1 { font-size:clamp(28px,5vw,40px); }
  #main.cppc-editorial .cppc-hero p { font-size:14px; }

  /* All 4 feature cards share the same media-above-copy layout on mobile. */
  #main.cppc-editorial .cppc-article-card--compact {
    display:block!important;
    grid-template-columns:none!important;
    width:100%!important;
  }
  #main.cppc-editorial .cppc-article-card--compact .cppc-card-copy { padding:10px 0 0; }
  #main.cppc-editorial .cppc-article-card--compact .cppc-card-title { font-size:19px;line-height:1.32; }
  #main.cppc-editorial .cppc-lead-grid { gap:28px!important; }
}
@media (max-width:620px) {
  #main.cppc-editorial .cppc-hero-inset { padding-top:20px; }
  #main.cppc-editorial .cppc-hero { min-height:0!important;background-position:center!important; }
  #main.cppc-editorial .cppc-hero-media { aspect-ratio:16 / 9; }
  #main.cppc-editorial .cppc-hero-copy { padding:22px 20px 26px!important; }
  #main.cppc-editorial .cppc-hero h1 { font-size:clamp(27px,7vw,34px); }
  #main.cppc-editorial .cppc-article-card--compact .cppc-card-title { font-size:20px; }
  #main.cppc-editorial .cppc-article-card--compact .cppc-kicker { font-size:11px; }
}
