/* ==========================================================================
   Case-study detail pages — one design per page (same content blocks,
   different layout + colour story). Loaded after case-detail.css.
     cd-v1  Website Transformation        coral · editorial list / timeline   (base design)
     cd-v2  AI-Driven Digital Growth      cobalt · dashboard tiles + bento
     cd-v3  AI-Powered Lead Generation    amber · funnel + staircase
     cd-v4  AI Search & Brand Visibility  dark · chat / search-results
   ========================================================================== */

.page-banner[data-tone="amber"]{ --tone:var(--amber); }

/* colour tokens, scoped to the page content (header / CTA / footer keep brand coral) */
.cd-v2 :is(.cd-progress,.cd-snap,.cd-nav,.cd-sum,.cd-ctx,.cd-prob,.cd-sol,.cd-impl,.cd-outs,.cd-lesson,.csd-pn){
  --coral:#2A2DFF; --coral-dim:#2023C9; --accent-lt:#A3A6FF; --on-accent:#fff; --tint:#E7E8FF; }
.cd-v3 :is(.cd-progress,.cd-snap,.cd-nav,.cd-sum,.cd-ctx,.cd-prob,.cd-sol,.cd-impl,.cd-outs,.cd-lesson,.csd-pn){
  --coral:#FFB627; --coral-dim:#8A5C08; --accent-lt:#FFB627; --on-accent:#12140F; --tint:#FFF1D1; }
.cd-v4 :is(.cd-progress,.cd-snap,.cd-nav,.cd-sum,.cd-ctx,.cd-prob,.cd-sol,.cd-impl,.cd-outs,.cd-lesson,.csd-pn){
  --coral:#FF4B33; --coral-dim:#FF8A78; --accent-lt:#FF6A52; --on-accent:#fff; }

.cd-v2 .banner-title .accent{ color:#A3A6FF; }
.cd-v3 .banner-title .accent{ color:#FFB627; }

/* ==========================================================================
   V2 — AI-DRIVEN DIGITAL GROWTH  (cobalt · "growth dashboard")
   ========================================================================== */
/* snapshot: four tiles, each with a growth bar */
.cd-v2 .cd-snap-grid{ background:none; border:0; box-shadow:none; gap:12px; overflow:visible; }
.cd-v2 .cd-snap-grid > div{ background:#fff; border:1px solid rgba(18,20,15,.1); border-radius:18px; padding:22px 24px; box-shadow:0 14px 34px rgba(42,45,255,.12); }
.cd-v2 .cd-snap-grid > div::after{ content:""; display:block; height:5px; border-radius:5px; margin-top:16px; background:var(--coral); }
.cd-v2 .cd-snap-grid > div:nth-child(1)::after{ width:30%; }
.cd-v2 .cd-snap-grid > div:nth-child(2)::after{ width:52%; }
.cd-v2 .cd-snap-grid > div:nth-child(3)::after{ width:74%; }
.cd-v2 .cd-snap-grid > div:nth-child(4)::after{ width:100%; }
.cd-v2 .cd-snap-grid > div:nth-child(1){ background:var(--coral); }
.cd-v2 .cd-snap-grid > div:nth-child(1) small{ color:rgba(255,255,255,.75); }
.cd-v2 .cd-snap-grid > div:nth-child(1) b{ color:#fff; }
.cd-v2 .cd-snap-grid > div:nth-child(1)::after{ background:#fff; }

/* summary: label row + tinted statement card */
.cd-v2 .cd-sum-grid{ grid-template-columns:1fr; gap:22px; }
.cd-v2 .cd-sum-lbl{ display:flex; align-items:center; gap:18px; }
.cd-v2 .cd-sum-lbl .csd-kick{ margin:0; }
.cd-v2 .cd-bignum{ font-size:64px; order:-1; }
.cd-v2 .cd-sum-grid > div:last-child{ background:var(--tint); border-radius:28px; padding:clamp(26px,3.4vw,44px); }

/* context: one white card, coral top bar */
.cd-v2 .cd-ctx-grid{ grid-template-columns:1fr; gap:0; max-width:920px; margin-inline:auto; background:#fff; border:1px solid rgba(18,20,15,.1); border-top:6px solid var(--coral); border-radius:24px; padding:clamp(26px,3.5vw,40px); box-shadow:0 20px 50px rgba(42,45,255,.08); }
.cd-v2 .cd-ctx-card{ display:grid; grid-template-columns:auto 1fr; gap:2px 14px; align-items:center; margin-bottom:16px; }
.cd-v2 .cd-ctx-card > i{ grid-row:1 / 3; font-size:46px; margin:0; }
.cd-v2 .cd-ctx-card .csd-kick{ margin:0; align-self:end; }
.cd-v2 .cd-ctx-text{ border-left:0; padding:0; }

/* problem -> goal: one split bar, arrow in the middle */
.cd-v2 .cd-pair{ position:relative; grid-template-columns:1fr 1fr; border:1px solid rgba(18,20,15,.14); border-radius:20px; overflow:hidden; background:#fff; }
.cd-v2 .cd-p-c, .cd-v2 .cd-p-o{ border:0; border-radius:0; transform:none; }
.cd-v2 .cd-p-c{ padding:24px 56px 24px 28px; }
.cd-v2 .cd-p-o{ padding:24px 28px 24px 56px; background:var(--tint); }
.cd-v2 .cd-pair.is-on .cd-p-o{ background:var(--coral); color:#fff; }
.cd-v2 .cd-p-arrow{ position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); z-index:2; }
.cd-v2 .cd-p-arrow i{ box-shadow:0 0 0 6px #fff; }

/* solution: bento cards with number badges */
.cd-v2 .cd-steps{ grid-template-columns:repeat(6,1fr); gap:14px; border-top:0; }
.cd-v2 .cd-step{ grid-column:span 2; display:flex; flex-direction:column; align-items:flex-start; gap:16px; padding:26px; background:#fff; border:1px solid rgba(18,20,15,.12); border-radius:22px; }
.cd-v2 .cd-step:nth-child(1), .cd-v2 .cd-step:nth-child(2){ grid-column:span 3; }
.cd-v2 .cd-step:hover{ padding:26px; transform:translateY(-4px); box-shadow:0 18px 40px rgba(42,45,255,.14); background:#fff; }
.cd-v2 .cd-step-n{ width:46px; height:46px; border-radius:50%; background:var(--tint); color:var(--coral); -webkit-text-stroke:0; font-size:16px; display:grid; place-items:center; }
.cd-v2 .cd-step:nth-child(1){ background:var(--coral); border-color:transparent; }
.cd-v2 .cd-step:nth-child(1) p{ color:#fff; }
.cd-v2 .cd-step:nth-child(1) .cd-step-n, .cd-v2 .cd-step:nth-child(1):hover .cd-step-n{ background:rgba(255,255,255,.2); color:#fff; }

/* delivery: full cobalt band, 3 x 2 stage cards */
.cd-v2 .cd-impl{ background:var(--coral); color:#fff; }
.cd-v2 .cd-impl .csd-kick{ color:rgba(255,255,255,.8); }
.cd-v2 .cd-impl-head p{ color:rgba(255,255,255,.82); }
.cd-v2 .cd-impl-grid{ grid-template-columns:1fr; gap:36px; }
.cd-v2 .cd-impl-head{ position:static; max-width:640px; }
.cd-v2 .cd-tl{ grid-template-columns:repeat(3,1fr); gap:14px; padding-left:0; }
.cd-v2 .cd-tl-rail, .cd-v2 .cd-tl li::before{ display:none; }
.cd-v2 .cd-tl li, .cd-v2 .cd-tl li:last-child{ flex-direction:column; align-items:flex-start; gap:14px; padding:24px; border:1px solid rgba(255,255,255,.3); border-radius:20px; background:rgba(255,255,255,.08); color:#fff; }
.cd-v2 .cd-tl li:hover{ transform:translateY(-4px); }
.cd-v2 .cd-tl li.is-on{ background:#fff; color:var(--ink); border-color:#fff; }
.cd-v2 .cd-tl-n{ color:#fff; font-size:34px; min-width:0; }
.cd-v2 .cd-tl li.is-on .cd-tl-n{ color:var(--coral); }
.cd-v2 .cd-tl small{ color:inherit; opacity:.7; }

/* outcomes: four tall tiles in a row */
.cd-v2 .cd-out-grid{ grid-template-columns:repeat(4,1fr); }
.cd-v2 .cd-out{ grid-template-columns:1fr; align-content:space-between; gap:36px; min-height:230px; padding:26px; border-radius:24px; }
.cd-v2 .cd-out:nth-child(odd){ background:var(--tint); border-color:transparent; }

/* lesson: soft tinted panel */
.cd-v2 .cd-lesson-box{ background:var(--tint); color:var(--ink); border:1px solid rgba(42,45,255,.2); }
.cd-v2 .cd-lesson-box > i{ color:var(--coral); opacity:.14; }
.cd-v2 .cd-lesson-box .csd-kick{ color:var(--coral-dim); }

/* ==========================================================================
   V3 — AI-POWERED LEAD GENERATION  (amber · "funnel / pipeline")
   ========================================================================== */
.cd-v3 .cd-progress i{ background:var(--ink); }

/* snapshot: chevron pipeline */
.cd-v3 .cd-snap-grid{ background:none; border:0; box-shadow:none; overflow:visible; gap:0; filter:drop-shadow(0 14px 22px rgba(18,20,15,.16)); }
.cd-v3 .cd-snap-grid > div{ border:0; padding:22px 40px 22px 44px; clip-path:polygon(0 0,calc(100% - 24px) 0,100% 50%,calc(100% - 24px) 100%,0 100%,24px 50%); margin-left:-6px; }
.cd-v3 .cd-snap-grid > div:first-child{ margin-left:0; padding-left:28px; clip-path:polygon(0 0,calc(100% - 24px) 0,100% 50%,calc(100% - 24px) 100%,0 100%); }
.cd-v3 .cd-snap-grid > div:nth-child(1){ background:var(--ink); }
.cd-v3 .cd-snap-grid > div:nth-child(1) small{ color:var(--muted-lt); }
.cd-v3 .cd-snap-grid > div:nth-child(1) b{ color:var(--paper); }
.cd-v3 .cd-snap-grid > div:nth-child(2){ background:#FFB627; }
.cd-v3 .cd-snap-grid > div:nth-child(3){ background:#FFCC66; }
.cd-v3 .cd-snap-grid > div:nth-child(4){ background:#FFE3A6; }
.cd-v3 .cd-snap-grid > div:nth-child(n+2) small{ color:rgba(18,20,15,.7); }

/* summary: centred statement */
.cd-v3 .cd-sum-grid{ grid-template-columns:1fr; gap:20px; text-align:center; justify-items:center; }
.cd-v3 .cd-sum-lbl{ display:flex; flex-direction:column; align-items:center; }
.cd-v3 .cd-bignum{ font-size:110px; color:#FFB627; -webkit-text-stroke:2px var(--ink); }
.cd-v3 .cd-sum-grid > div:last-child{ max-width:900px; }
.cd-v3 .cd-chips{ justify-content:center; }
.cd-v3 .cd-chips li::before{ box-shadow:0 0 0 1px rgba(18,20,15,.45); }

/* context: ink | amber split */
.cd-v3 .cd-ctx-grid{ grid-template-columns:1fr 1.25fr; gap:0; border-radius:28px; overflow:hidden; }
.cd-v3 .cd-ctx-card{ background:var(--ink); color:var(--paper); padding:clamp(28px,4vw,48px); }
.cd-v3 .cd-ctx-card h2{ color:var(--paper); }
.cd-v3 .cd-ctx-card .csd-kick{ color:#FFB627; }
.cd-v3 .cd-ctx-text{ background:#FFB627; color:var(--ink); border:0; padding:clamp(28px,4vw,48px); font-weight:500; display:flex; align-items:center; }

/* problem -> goal: narrowing funnel */
.cd-v3 .cd-pairs{ justify-items:center; }
.cd-v3 .cd-pair{ width:100%; }
.cd-v3 .cd-pair:nth-child(2){ width:94%; }
.cd-v3 .cd-pair:nth-child(3){ width:88%; }
.cd-v3 .cd-pair:nth-child(4){ width:82%; }
.cd-v3 .cd-pair:nth-child(5){ width:76%; }
.cd-v3 .cd-p-o{ border-color:rgba(138,92,8,.6); }

/* solution: ascending staircase */
.cd-v3 .cd-steps{ grid-template-columns:repeat(5,1fr); gap:12px; align-items:end; border-top:0; }
.cd-v3 .cd-step{ display:flex; flex-direction:column; justify-content:space-between; gap:22px; padding:22px 20px; border:0; border-radius:20px 20px 6px 6px; color:var(--ink); }
.cd-v3 .cd-step:hover{ padding:22px 20px; transform:translateY(-6px); }
.cd-v3 .cd-step:nth-child(1){ background:#FFF3D6; min-height:200px; }
.cd-v3 .cd-step:nth-child(2){ background:#FFE6AD; min-height:236px; }
.cd-v3 .cd-step:nth-child(3){ background:#FFD77A; min-height:272px; }
.cd-v3 .cd-step:nth-child(4){ background:#FFC64D; min-height:308px; }
.cd-v3 .cd-step:nth-child(5){ background:#FFB627; min-height:344px; }
.cd-v3 .cd-step-n, .cd-v3 .cd-step:hover .cd-step-n{ -webkit-text-stroke:1.5px var(--ink); }
.cd-v3 .cd-step:hover .cd-step-n{ color:var(--ink); }
.cd-v3 .cd-step p{ font-size:15px; }

/* delivery: stages step down-right */
.cd-v3 .cd-tl{ padding-left:0; gap:10px; }
.cd-v3 .cd-tl-rail, .cd-v3 .cd-tl li::before{ display:none; }
.cd-v3 .cd-tl li, .cd-v3 .cd-tl li:last-child{ padding:16px 22px; border:0; border-left:4px solid rgba(255,182,39,.5); border-radius:6px 16px 16px 6px; background:rgba(255,255,255,.06); }
.cd-v3 .cd-tl li.is-on{ background:#FFB627; color:var(--ink); border-left-color:var(--ink); }
.cd-v3 .cd-tl li.is-on .cd-tl-n, .cd-v3 .cd-tl li.is-on small{ color:var(--ink); }
.cd-v3 .cd-tl li:nth-of-type(2){ margin-left:24px; }
.cd-v3 .cd-tl li:nth-of-type(3){ margin-left:48px; }
.cd-v3 .cd-tl li:nth-of-type(4){ margin-left:72px; }
.cd-v3 .cd-tl li:nth-of-type(5){ margin-left:96px; }
.cd-v3 .cd-tl li:nth-of-type(6){ margin-left:120px; }
.cd-v3 .cd-tl li:nth-of-type(7){ margin-left:144px; }

/* outcomes: ink cards, amber ticks */
.cd-v3 .cd-out{ background:var(--ink); color:var(--paper); border-color:transparent; border-radius:30px 30px 30px 6px; }
.cd-v3 .cd-out:nth-child(even){ border-radius:30px 6px 30px 30px; }
.cd-v3 .cd-out:hover{ border-color:#FFB627; }

/* lesson: amber block */
.cd-v3 .cd-lesson-box{ background:#FFB627; color:var(--ink); border-radius:40px 40px 40px 6px; }
.cd-v3 .cd-lesson-box > i{ color:var(--ink); opacity:.1; }
.cd-v3 .cd-lesson-box .csd-kick{ color:var(--ink); }
.cd-v3 .cd-lesson-box p .w{ opacity:.3; }
.cd-v3 .cd-back{ background:var(--ink); color:var(--paper); }
.cd-v3 .cd-back:hover{ background:#fff; color:var(--ink); }

/* ==========================================================================
   V4 — AI SEARCH & BRAND VISIBILITY  (dark · "chat / search results")
   ========================================================================== */
body.cd-v4{ background:#0E100B; color:var(--paper); }
.cd-v4 :is(.cd-head h2,.cd-ctx-card h2,.cd-impl-head h2,.cd-lead,.cd-step p,.cd-out p){ color:var(--paper); }
.cd-v4 .cd-nav-in{ background:rgba(23,26,19,.92); border-color:rgba(255,255,255,.14); box-shadow:0 10px 30px rgba(0,0,0,.4); }
.cd-v4 .cd-nav a{ color:var(--muted-lt); }
.cd-v4 .cd-nav a:hover{ color:#fff; }

/* snapshot: console bar */
.cd-v4 .cd-snap-grid{ background:#171A13; border:1px solid rgba(255,255,255,.12); border-top:1px solid rgba(255,255,255,.12); box-shadow:0 0 0 1px rgba(255,75,51,.3), 0 30px 80px rgba(0,0,0,.55); }
.cd-v4 .cd-snap-grid > div{ border-right-color:rgba(255,255,255,.1); }
.cd-v4 .cd-snap-grid small{ color:var(--muted-lt); }
.cd-v4 .cd-snap-grid small::before{ content:"› "; color:var(--coral); }
.cd-v4 .cd-snap-grid b{ color:var(--paper); font-family:var(--font-mono); font-weight:500; }

/* summary: statement in a rounded query box */
.cd-v4 .cd-lead{ background:#171A13; border:1px solid rgba(255,255,255,.18); border-radius:28px; padding:22px 28px; }
.cd-v4 .cd-chips li{ background:transparent; border-color:rgba(255,255,255,.24); color:var(--paper); }

/* context: query bubble + answer bubble */
.cd-v4 .cd-ctx-grid{ grid-template-columns:1fr; gap:14px; max-width:880px; margin-inline:auto; }
.cd-v4 .cd-ctx-card{ justify-self:end; max-width:520px; background:var(--coral); color:#fff; padding:20px 26px; border-radius:24px 24px 4px 24px; }
.cd-v4 .cd-ctx-card > i{ display:none; }
.cd-v4 .cd-ctx-card .csd-kick{ color:rgba(255,255,255,.85); margin-bottom:6px; }
.cd-v4 .cd-ctx-card h2{ color:#fff; }
.cd-v4 .cd-ctx-text{ justify-self:start; max-width:740px; background:#171A13; border:1px solid rgba(255,255,255,.12); border-radius:24px 24px 24px 4px; padding:24px 28px; color:rgba(243,245,238,.88); }

/* problem -> goal: question (right) / answer (left) chat */
.cd-v4 .cd-pairs{ gap:30px; }
.cd-v4 .cd-pair{ grid-template-columns:1fr; gap:10px; }
.cd-v4 .cd-p-arrow{ display:none; }
.cd-v4 .cd-p-c{ justify-self:end; width:min(560px,88%); background:#1B1F16; color:var(--paper); border:1px solid rgba(255,255,255,.12); border-radius:22px 22px 4px 22px; }
.cd-v4 .cd-pair.is-on .cd-p-c{ background:#14170F; border-color:rgba(255,255,255,.08); }
.cd-v4 .cd-p-o{ justify-self:start; width:min(640px,92%); background:transparent; color:var(--paper); border-radius:22px 22px 22px 4px; }
.cd-v4 .cd-p-o b{ color:var(--coral-dim); }
.cd-v4 .cd-pair.is-on .cd-p-o{ background:var(--coral); color:#fff; }

/* solution: window-style cards */
.cd-v4 .cd-steps{ grid-template-columns:1fr 1fr; gap:14px; border-top:0; }
.cd-v4 .cd-step{ display:flex; flex-direction:column; align-items:flex-start; gap:14px; padding:22px 24px 26px; background:#171A13; border:1px solid rgba(255,255,255,.1); border-radius:16px; }
.cd-v4 .cd-step:last-child{ grid-column:span 2; }
.cd-v4 .cd-step:hover{ background:#1B1F16; padding:22px 24px 26px; border-color:var(--coral); }
.cd-v4 .cd-step::before{ content:""; width:44px; height:8px; background:radial-gradient(circle at 4px 4px,#FF4B33 3.5px,#0000 4.5px), radial-gradient(circle at 22px 4px,#FFB627 3.5px,#0000 4.5px), radial-gradient(circle at 40px 4px,rgba(255,255,255,.35) 3.5px,#0000 4.5px); }
.cd-v4 .cd-step-n{ font:500 13px var(--font-mono); letter-spacing:.14em; color:var(--coral); -webkit-text-stroke:0; }
.cd-v4 .cd-step-n::after{ content:" /05"; opacity:.45; }
.cd-v4 .cd-step:hover .cd-step-n{ color:var(--coral); }

/* delivery: stage cards with chips */
.cd-v4 .cd-impl{ background:#171A13; border-block:1px solid rgba(255,255,255,.08); }
.cd-v4 .cd-tl{ gap:10px; padding-left:0; }
.cd-v4 .cd-tl-rail, .cd-v4 .cd-tl li::before{ display:none; }
.cd-v4 .cd-tl li, .cd-v4 .cd-tl li:last-child{ padding:14px 20px 14px 14px; border:1px solid rgba(255,255,255,.1); border-radius:14px; }
.cd-v4 .cd-tl li.is-on{ border-color:var(--coral); background:rgba(255,75,51,.08); }
.cd-v4 .cd-tl-n{ display:grid; place-items:center; width:46px; height:46px; min-width:46px; border-radius:10px; background:rgba(255,75,51,.15); font-size:17px; }

/* outcomes: ranked result rows */
.cd-v4 .cd-out-grid{ grid-template-columns:1fr; gap:0; max-width:920px; border-top:1px solid rgba(255,255,255,.12); }
.cd-v4 .cd-out{ background:transparent; border:0; border-bottom:1px solid rgba(255,255,255,.12); border-radius:0; padding:24px 96px 24px 8px; }
.cd-v4 .cd-out:hover{ background:#14170F; transform:none; box-shadow:none; border-color:rgba(255,255,255,.12); }
.cd-v4 .cd-out span{ background:transparent; border:1.5px solid var(--coral); color:var(--coral); }
.cd-v4 .cd-out::after{ bottom:auto; top:50%; transform:translateY(-50%); right:10px; font-size:54px; opacity:.35; }

/* lesson + prev/next */
.cd-v4 .cd-lesson-box{ background:#171A13; border:1px solid rgba(255,75,51,.5); box-shadow:0 0 70px rgba(255,75,51,.12); }
.cd-v4 .csd-pn a{ border-color:rgba(255,255,255,.16); color:var(--paper); }
.cd-v4 .csd-pn a:hover{ background:var(--coral); color:#fff; }
.cd-v4 .csd-pn a:hover small{ color:#fff; }

/* ==========================================================================
   Responsive for variants
   ========================================================================== */
@media (max-width:1000px){
  .cd-v2 .cd-steps{ grid-template-columns:1fr 1fr; }
  .cd-v2 .cd-step, .cd-v2 .cd-step:nth-child(1), .cd-v2 .cd-step:nth-child(2){ grid-column:span 1; }
  .cd-v2 .cd-step:last-child{ grid-column:span 2; }
  .cd-v2 .cd-tl{ grid-template-columns:1fr 1fr; }
  .cd-v2 .cd-out-grid{ grid-template-columns:1fr 1fr; }
  .cd-v3 .cd-snap-grid > div, .cd-v3 .cd-snap-grid > div:first-child{ clip-path:none; margin-left:0; padding:18px 20px; }
  .cd-v3 .cd-ctx-grid{ grid-template-columns:1fr; }
  .cd-v3 .cd-steps{ grid-template-columns:1fr 1fr; align-items:stretch; }
  .cd-v3 .cd-step:nth-child(n){ min-height:0; }
  .cd-v3 .cd-step:last-child{ grid-column:span 2; }
  .cd-v4 .cd-steps{ grid-template-columns:1fr; }
  .cd-v4 .cd-step:last-child{ grid-column:auto; }
}
@media (max-width:640px){
  .cd-v2 .cd-steps, .cd-v2 .cd-tl, .cd-v2 .cd-out-grid, .cd-v3 .cd-steps{ grid-template-columns:1fr; }
  .cd-v2 .cd-step:last-child, .cd-v3 .cd-step:last-child{ grid-column:auto; }
  .cd-v2 .cd-pair{ grid-template-columns:1fr; }
  .cd-v2 .cd-p-arrow{ display:none; }
  .cd-v2 .cd-p-c, .cd-v2 .cd-p-o{ padding:22px; }
  .cd-v2 .cd-out{ min-height:0; gap:18px; }
  .cd-v2 .cd-sum-lbl{ flex-wrap:wrap; }
  .cd-v3 .cd-pair:nth-child(n){ width:100%; }
  .cd-v3 .cd-tl li:nth-of-type(n){ margin-left:0; }
  .cd-v3 .cd-bignum{ font-size:84px; }
  .cd-v4 .cd-p-c, .cd-v4 .cd-p-o{ width:100%; }
  .cd-v4 .cd-out{ padding-right:56px; }
  .cd-v4 .cd-out::after{ font-size:34px; }
  .cd-v4 .cd-ctx-card{ max-width:none; }
}

/* V2 outcomes: ghost number sits top-right so it never collides with the text */
.cd-v2 .cd-out::after{ top:14px; bottom:auto; right:18px; }

/* A problem card with no text (case 04 has a 5th goal but no 5th problem yet) is hidden, not shown empty */
.cd-p-c:has(> p:empty), .cd-pair:has(.cd-p-c > p:empty) .cd-p-arrow{ visibility:hidden; }
.cd-v4 .cd-p-c:has(> p:empty){ display:none; }