/* ===================================================================
   White-background options — same palette on a white canvas.
   On white: bright cyan/lime are FILLS (navy text), deep cyan = links,
   magenta = number pops. Two variants: .wv-grad (cyan→lime) · .wv-spectrum
   =================================================================== */
.pv{
  --ink:#0e1830; --body:#2d3646; --muted:#57617a;
  --line:#e5eaf1; --line-2:#eef2f7; --wash:#f5f9fc; --panel:#ffffff;
  --cyan:#68e1fb; --magenta:#d43ef6; --lime:#c5fd50; --cyanDeep:#0e8fb8; --magDeep:#c026d6;
  --fill:linear-gradient(100deg,#68e1fb,#c5fd50); --fill-ink:#08233a; --hdr-ink:#08233a;
  --atext:#0e8fb8; --pop:#c026d6; --btn:#c5fd50; --btn-ink:#0e1830; --link:#0e8fb8;
  --cyanA:rgba(104,225,251,.22); --magA:rgba(212,62,246,.14); --limeA:rgba(197,253,80,.28);
  --r-card:12px; --r-btn:9px; --r-band:16px;
  position:relative; color:var(--body); font-family:'Open Sans',sans-serif; font-size:16.5px; line-height:1.7;
  padding:0 6px;  /* clear the overflow:hidden ancestor so bordered blocks (table) aren't shaved */
}
.pv.wv-spectrum{--fill:#68e1fb;}
.pv *{box-sizing:border-box;}
.pv::before{content:""; position:absolute; inset:-30px -20px auto -20px; height:900px; z-index:0; pointer-events:none;
  background:radial-gradient(440px 300px at 90% 3%, var(--cyanA), transparent 72%),
            radial-gradient(380px 300px at 4% 24%, var(--limeA), transparent 74%);}
.pv>*{position:relative; z-index:1;}
.pv h1,.pv h2,.pv h3,.pv h4{font-family:'Montserrat',Arial,sans-serif !important; color:var(--ink) !important;
  letter-spacing:-.028em; line-height:1.12; margin:0; padding:0 !important; font-weight:800 !important; text-transform:none !important; display:block;}
.pv p{color:var(--body) !important; margin:0 0 1.1em !important; max-width:66ch; text-align:left !important; font-size:16px !important;}
.pv p:empty{display:none !important; margin:0 !important;}
/* theme decorates every heading with a 20x1px PURE-BLACK ::after tick — off-palette, and its
   breathing room came from the padding we reset. The eyebrow already labels each section. */
.pv h1::after,.pv h2::after,.pv h3::after,.pv h4::after{display:none !important;}  /* collapse wpautop's stray empty <p></p> (was a 65px gap under every eyebrow) */
.pv strong{color:var(--ink); font-weight:700;}
.pv a{color:var(--link); text-decoration:none; font-weight:600;}
.pv a:hover{filter:brightness(1.1);}
.pv-eyebrow{display:block; font-family:'Montserrat',Arial,sans-serif; font-weight:700; font-size:13px;
  letter-spacing:.14em; text-transform:uppercase; margin:0 0 12px; color:var(--atext); line-height:1.2;}
.pv-lead h2 .accent{color:var(--magDeep);}

.pv-lead{padding:6px 0 4px;}
.pv .pv-lead h2{font-size:clamp(26px,5vw,38px) !important; line-height:1.12 !important; margin:0 0 18px !important; text-wrap:balance; letter-spacing:-.032em;}
.pv-lead p{font-size:18px !important; line-height:1.62;}

.pv-sec{margin:50px 0 0;}
.pv .pv-h2{font-size:clamp(22px,3.6vw,28px) !important; line-height:1.18 !important; margin:0 0 10px; letter-spacing:-.03em;}
.pv .pv-h2{margin:0 0 12px !important;}  /* theme sets .entry h2 margin 40/20 !important — override so eyebrow sits tight */
.pv-sub{font-size:16px !important; color:var(--muted) !important; margin:0 0 24px; max-width:60ch;}

/* feature band — light wash panel, magenta number pop */
.pv-band{position:relative; overflow:hidden; border-radius:var(--r-band); padding:38px 40px; margin:40px 0;
  background:linear-gradient(160deg,#f7fbff,#f8fdf1); border:1px solid var(--line); box-shadow:0 18px 44px -28px rgba(20,40,80,.18);}
.pv-band::before{content:""; position:absolute; top:-45%; right:-6%; width:52%; height:200%;
  background:radial-gradient(closest-side, var(--cyanA), transparent 72%); pointer-events:none;}
.pv-band::after{content:""; position:absolute; bottom:-55%; left:-12%; width:50%; height:190%;
  background:radial-gradient(closest-side, var(--limeA), transparent 72%); pointer-events:none;}
.pv-band>*{position:relative; z-index:1;}
.pv-band .num{display:block; font-family:'Montserrat',Arial,sans-serif; font-weight:800; color:var(--pop);
  font-size:clamp(52px,8.4vw,80px); line-height:.9; letter-spacing:-.04em; margin-bottom:4px;}
.pv-band .num small{font-size:.30em; font-weight:700; letter-spacing:-.01em; color:var(--muted);}
.pv .pv-band h3{color:var(--ink) !important; font-size:clamp(19px,2.6vw,22px) !important; line-height:1.25 !important; margin:12px 0 12px !important; max-width:28ch; letter-spacing:-.02em;}
.pv-band p{color:var(--body) !important; max-width:62ch; margin:0 0 .7em;}
.pv-band .band-chips{display:flex; flex-wrap:wrap; gap:8px; margin-top:16px;}
.pv-band .band-chips span{font-size:12px; font-weight:600; color:#0a6f92;
  background:rgba(104,225,251,.12); border:1px solid rgba(14,143,184,.28); border-radius:7px; padding:6px 12px;}

/* cards — white, hairline + soft shadow, bright fill icon chip */
.pv-cards{display:grid; grid-template-columns:repeat(auto-fit,minmax(244px,1fr)); gap:14px; margin:24px 0;}
.pv-card{position:relative; overflow:hidden; background:var(--panel); border:1px solid var(--line); border-radius:var(--r-card); padding:24px 22px;
  box-shadow:0 12px 30px -22px rgba(20,40,80,.25); transition:border-color .18s ease, transform .18s ease, box-shadow .18s ease;}
.pv-card::before{content:""; position:absolute; top:0; left:0; right:0; height:3px; background:var(--fill);}
.pv-card:hover{transform:translateY(-2px); border-color:#cfe6ef; box-shadow:0 18px 38px -22px rgba(20,40,80,.32);}
.pv-chip{width:42px; height:42px; border-radius:10px; display:flex; align-items:center; justify-content:center; background:var(--fill);}
.pv-chip svg{width:22px; height:22px; stroke:var(--fill-ink); fill:none; stroke-width:1.9;}
.pv .pv-card h3{font-size:17px !important; line-height:1.3 !important; margin:14px 0 9px !important; letter-spacing:-.02em;}
.pv .pv-card p{font-size:15px !important; line-height:1.55; color:var(--body) !important; margin:0 !important; max-width:none;}
/* SPECTRUM (white) — flat rotating solids */
.pv.wv-spectrum .pv-card:nth-child(3n+2) .pv-chip{background:var(--magenta);}
.pv.wv-spectrum .pv-card:nth-child(3n+2) .pv-chip svg{stroke:#fff;}
.pv.wv-spectrum .pv-card:nth-child(3n+3) .pv-chip{background:var(--lime);}
.pv.wv-spectrum .pv-card:nth-child(3n+2)::before{background:var(--magenta);}
.pv.wv-spectrum .pv-card:nth-child(3n+3)::before{background:var(--lime);}

/* table — bright fill header, navy text, white body */
.pv-tablewrap{overflow-x:auto; border:1px solid var(--line); border-radius:var(--r-card); margin:22px 0; box-shadow:0 12px 30px -24px rgba(20,40,80,.2);}
.pv-table{width:100%; border-collapse:collapse; font-size:14.5px; min-width:520px; background:var(--panel);}
/* border:0 FIRST — the theme paints a BLACK 1px border on every cell's top/left/right.
   Left un-reset, that square grid is sheared off by the wrapper's rounded clip = "cut corners". */
.pv-table th,.pv-table td{text-align:left; padding:15px 20px; border:0 !important; border-bottom:1px solid var(--line) !important; vertical-align:top; line-height:1.5; color:var(--body); font-size:14.5px !important;}
.pv-table th+th,.pv-table th+td,.pv-table td+td{border-left:1px solid var(--line-2) !important;}
.pv-table thead th{font-family:'Montserrat',Arial,sans-serif; color:var(--hdr-ink) !important; font-weight:800;
  background:var(--fill); border-bottom:0 !important; letter-spacing:-.01em;}
.pv-table tbody th{font-weight:700; color:var(--ink) !important; width:22%; background:var(--wash);}
.pv-table tbody tr:last-child td,.pv-table tbody tr:last-child th{border-bottom:0 !important;}
.pv-table tbody tr:hover td{background:#f4fbfe;}

/* steps — bright fill badges */
.pv-steps{display:grid; gap:12px; margin:24px 0;}
.pv-step{display:flex; gap:16px; align-items:flex-start;
  background:var(--panel); border:1px solid var(--line); border-radius:var(--r-card); padding:19px 22px; box-shadow:0 10px 26px -24px rgba(20,40,80,.22);}
.pv-badge{flex:0 0 40px; width:40px; height:40px; border-radius:10px; background:var(--fill); color:var(--hdr-ink);
  font-family:'Montserrat',Arial,sans-serif; font-weight:800; font-size:15px; display:flex; align-items:center; justify-content:center;}
.pv-step>div{flex:1 1 auto; min-width:0;}
.pv .pv-step h3{font-size:17px !important; line-height:1.3 !important; margin:1px 0 6px !important; letter-spacing:-.02em;}
.pv .pv-step p{font-size:15px !important; line-height:1.55; margin:0 !important; max-width:64ch;}

/* proof — white panel, magenta stat numbers, fill rule */
.pv-proof{position:relative; overflow:hidden; background:var(--panel); border:1px solid var(--line); border-radius:var(--r-band); padding:28px 30px; margin:26px 0; box-shadow:0 14px 34px -26px rgba(20,40,80,.2);}
.pv-proof::after{content:""; position:absolute; top:-50%; right:-8%; width:46%; height:200%;
  background:radial-gradient(closest-side, var(--limeA), transparent 72%); pointer-events:none;}
.pv-proof::before{display:none;}
.pv-proof{border-left:4px solid var(--cyan);}
.pv-proof>*{position:relative; z-index:1;}
.pv-stats{display:flex; flex-wrap:wrap; gap:12px; margin:0 0 20px;}
.pv-stat{flex:1 1 220px; background:var(--wash); border:1px solid var(--line); border-radius:var(--r-card); padding:18px 20px;}
.pv-stat .n{font-family:'Montserrat',Arial,sans-serif; font-weight:800; font-size:32px; line-height:1; letter-spacing:-.03em; color:var(--pop);}
.pv-stat .l{font-size:13.5px; color:var(--body); margin-top:7px; display:block; line-height:1.5;}
.pv-names{font-family:'Montserrat',Arial,sans-serif !important; font-weight:700 !important; font-size:16px; color:var(--ink) !important;
  line-height:1.9; margin:0 0 14px; max-width:none; letter-spacing:-.01em;}
.pv .pv-cred{font-size:14.5px !important; color:var(--body) !important; border-top:1px solid var(--line); padding-top:15px; margin:0; max-width:none;}

/* CTA — light wash panel, glow, lime button */
.pv-cta{position:relative; overflow:hidden; border-radius:var(--r-band); margin:54px 0 8px; padding:46px 40px;
  background:linear-gradient(150deg,#f6fbff,#f8fdf2); border:1px solid var(--line); box-shadow:0 18px 44px -28px rgba(20,40,80,.18);}
.pv-cta::before{content:""; position:absolute; top:-45%; right:-6%; width:52%; height:200%;
  background:radial-gradient(closest-side, var(--cyanA), transparent 70%); pointer-events:none;}
.pv-cta::after{content:""; position:absolute; bottom:-55%; left:-10%; width:48%; height:190%;
  background:radial-gradient(closest-side, var(--limeA), transparent 72%); pointer-events:none;}
.pv-cta>*{position:relative; z-index:1;}
.pv .pv-cta h3{color:var(--ink) !important; font-size:clamp(21px,3vw,26px) !important; line-height:1.2 !important; margin:0 0 12px !important; max-width:22ch; letter-spacing:-.03em;}
.pv-cta p{color:var(--body) !important; max-width:56ch; margin:0 0 22px;}
.pv-btn{display:inline-block; font-family:'Montserrat',Arial,sans-serif; font-weight:800; font-size:15px;
  color:var(--btn-ink) !important; background:var(--btn); padding:14px 30px; border-radius:var(--r-btn);
  box-shadow:0 12px 26px -8px rgba(120,180,0,.4); transition:transform .16s ease, filter .16s ease;}
.pv-btn:hover{transform:translateY(-1px); filter:brightness(1.05);}

/* process chain (Plan -> Source -> ... ) — cyan dot markers (structure) */
.pv-chain{display:flex; flex-wrap:wrap; align-items:center; gap:9px; margin:22px 0 4px;}
.pv-chain span{display:inline-flex; align-items:center; gap:9px; font-family:'Montserrat',Arial,sans-serif; font-weight:700; font-size:13px;
  color:var(--ink); background:var(--wash); border:1px solid var(--line); border-radius:9px; padding:9px 14px;}
.pv-chain span::before{content:""; width:7px; height:7px; border-radius:50%; background:var(--cyan);}

/* simple point list — hairline card + cyan left rule */
.pv-list{display:grid; gap:10px; margin:22px 0;}
.pv-item{background:var(--panel); border:1px solid var(--line); border-left:3px solid var(--cyan); border-radius:10px;
  padding:15px 18px; box-shadow:0 10px 26px -24px rgba(20,40,80,.22);}
.pv-item p{margin:0; font-size:14.5px; line-height:1.55; color:var(--body) !important; max-width:none;}

/* related-links pills — magenta link text */
.pv-links{list-style:none; padding:0; margin:22px 0 0; display:flex; flex-wrap:wrap; gap:10px;}
.pv-links li{margin:0;}
.pv-links li a{display:inline-block; font-family:'Open Sans',sans-serif; font-weight:600; font-size:14px; color:var(--link);
  background:var(--wash); border:1px solid var(--line); border-radius:22px; padding:8px 16px;}
.pv-links li a:hover{filter:brightness(1.06); border-color:#cfe6ef;}

/* ===================================================================
   .wv-minimal — the "how Linear does it" option: ONE accent, flat solid
   surfaces (zero gradient), hairline borders, tinted chips, underlined
   table header, generous whitespace. Maximum clarity.
   =================================================================== */
.pv.wv-minimal{
  /* EXACT brand palette, each with one role:
     cyan #68E1FB = structure · magenta #D43EF6 = emphasis · lime #C5FD50 = action */
  --atext:#bd1fd6; --link:#bd1fd6; --pop:#d43ef6;      /* magenta emphasis text */
  --fill:#68e1fb; --fill-ink:#0c0f2a; --hdr-ink:#0c0f2a;/* solid cyan fills, navy on top */
  --btn:#c5fd50; --btn-ink:#0c0f2a;                    /* lime action button */
  --line:#e6ebf1;
}
.pv.wv-minimal::before{display:none;}                    /* flat — no ambient glow */
.pv.wv-minimal .pv-lead h2 .accent{color:var(--pop);}
.pv.wv-minimal .pv-eyebrow{color:var(--atext);}
/* flat cards — hairline + 2px cyan rule; chip stays solid cyan w/ navy icon (base) */
.pv.wv-minimal .pv-card::before{height:2px;}
.pv.wv-minimal .pv-card:hover{border-color:#bfe6f2;}
/* band / cta / proof — flat wash, no gradient wash, no colored glow */
.pv.wv-minimal .pv-band,.pv.wv-minimal .pv-cta{background:var(--wash);}
.pv.wv-minimal .pv-band::before,.pv.wv-minimal .pv-band::after,
.pv.wv-minimal .pv-cta::before,.pv.wv-minimal .pv-cta::after,
.pv.wv-minimal .pv-proof::after{display:none;}
.pv.wv-minimal .pv-band .band-chips span{color:#0a6f92; background:rgba(104,225,251,.14); border-color:rgba(104,225,251,.5);}
/* table — wash header + 2px cyan underline (Linear-style) */
.pv.wv-minimal .pv-table thead th{background:var(--wash); color:var(--ink) !important; border-bottom:2px solid var(--cyan) !important;}
.pv.wv-minimal .pv-btn{box-shadow:0 12px 26px -10px rgba(150,210,40,.5);}

/* ===================================================================
   .wv-tri — WHITE bg, icon chips + accents use ONE gradient across all
   three brand colours: cyan #68E1FB -> magenta #D43EF6 -> lime #C5FD50.
   =================================================================== */
.pv.wv-tri{
  --fill:linear-gradient(120deg,#68e1fb 0%,#d43ef6 52%,#c5fd50 100%);
  --fill-ink:#0c0f2a; --hdr-ink:#0c0f2a;
  --btn:linear-gradient(120deg,#68e1fb,#d43ef6 52%,#c5fd50); --btn-ink:#0c0f2a;
}
.pv.wv-tri .pv-btn{box-shadow:0 12px 26px -10px rgba(150,120,200,.4);}

@media(max-width:600px){
  .pv{font-size:15.5px;}
  .pv-band,.pv-cta{padding:30px 22px;}
  .pv-cards{grid-template-columns:1fr;}
  .pv-step{gap:13px;}
  .pv-table{min-width:0;}
  .pv-table th,.pv-table td{padding:11px 12px; font-size:13px !important;}
}


/* ===================================================================
   DE-CARDING VARIANTS — pure CSS modifiers on identical markup.
   .wv-flat  = capability grid de-boxed only
   .wv-edit  = de-boxed grid + steps as a cyan spine + proof un-nested
   The 2027 band, the comparison table and the CTA stay boxed in BOTH:
   they are the only genuinely discrete objects, and they punctuate
   the page once everything around them opens up.
   =================================================================== */

/* --- capability grid: chip + whitespace carry it, no wrapper --- */
.pv.wv-flat .pv-cards,.pv.wv-edit .pv-cards{gap:32px 30px;}
.pv.wv-flat .pv-card,.pv.wv-edit .pv-card{
  background:none; border:0; box-shadow:none; padding:0; overflow:visible;}
.pv.wv-flat .pv-card::before,.pv.wv-edit .pv-card::before{display:none;}
.pv.wv-flat .pv-card:hover,.pv.wv-edit .pv-card:hover{transform:none; box-shadow:none; border-color:transparent;}

/* --- steps: one continuous sequence, not four isolated boxes --- */
.pv.wv-edit .pv-steps{position:relative; padding-left:42px; gap:0; display:block;}
.pv.wv-edit .pv-steps::before{content:""; position:absolute; left:13px; top:7px; bottom:16px; width:2px;
  background:linear-gradient(var(--cyan),var(--cyan) 76%,rgba(104,225,251,0));}
.pv.wv-edit .pv-step{position:relative; display:block; background:none; border:0; box-shadow:none;
  border-radius:0; padding:0 0 24px;}
.pv.wv-edit .pv-step + .pv-step{border-top:1px solid var(--line-2); padding-top:22px;}
.pv.wv-edit .pv-step:last-child{padding-bottom:0;}
.pv.wv-edit .pv-badge{position:absolute; left:-42px; top:0; width:28px; height:28px; flex:0 0 28px;
  border-radius:50%; background:var(--panel); border:2px solid var(--cyan); color:#0a6f92; font-size:11.5px;}
.pv.wv-edit .pv-step + .pv-step .pv-badge{top:22px;}

/* --- proof: the numbers are the payoff, so stop nesting them two deep --- */
.pv.wv-edit .pv-proof{background:none; border:0; box-shadow:none; padding:0; border-radius:0; overflow:visible;}
.pv.wv-edit .pv-proof::before{display:none;}
.pv.wv-edit .pv-stats{gap:36px; margin:0 0 4px;}
.pv.wv-edit .pv-stat{background:none; border:0; border-radius:0; padding:0;}
.pv.wv-edit .pv-stat .n{font-size:clamp(34px,5vw,44px);}
.pv.wv-edit .pv-names{border-top:1px solid var(--line); padding-top:20px; margin-top:22px; max-width:none;}
.pv.wv-edit .pv-cred{border-top:0; padding-top:2px;}

/* ===================================================================
   INDUSTRY components (added for the Chemicals preview)
   The value-chain flow reuses the de-carded steps language: ONE cyan
   spine, hollow node markers, labels as eyebrows. The AI layer is the
   only place magenta appears — emphasis, exactly one job.
   =================================================================== */
/* ---- value-chain, BANDED ("table") ------------------------------------------
   Restores the structure of the live page's diagram — stacked layers, each an
   evenly-spaced row of cells — in the Minimal palette. The live version is an
   inline SVG carrying 29 colours across four hues; here the three layers take
   the three palette roles: neutral = the customer's own chain, cyan = the SAP
   core, magenta = the AI layer (magenta's single job on the page).
   Desktop keeps the even row, which is the tabular read Ali wants. Mobile
   stacks the cells: an evenly-spaced 5-up at 390px is precisely what makes the
   live SVG illegible, so reflowing is the win, not a regression.            */
.pv-vchain{margin:30px 0 8px; padding:18px 16px 16px; background:var(--panel);
  border:1px solid var(--line); border-radius:var(--r-band);}
.ch-band{padding:13px 14px 14px; border:1px solid var(--line); border-radius:12px; background:var(--wash);}
.ch-head{display:flex; align-items:center; gap:9px; margin:0 0 11px;}
.ch-ico{flex:none; width:22px; height:22px; border-radius:7px; background:var(--muted);
  display:inline-flex; align-items:center; justify-content:center;}
.ch-ico svg{width:13px; height:13px; fill:none; stroke:#fff; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round;}
.ch-t{font-family:'Montserrat',Arial,sans-serif; font-weight:700; font-size:11.5px;
  letter-spacing:.1em; text-transform:uppercase; color:var(--muted);}
.ch-t em{font-style:normal; text-transform:none; letter-spacing:.01em; color:var(--pop); font-weight:700;}
.ch-row{display:grid; grid-template-columns:repeat(var(--n,5),minmax(0,1fr)); gap:22px;}
.ch-cell{position:relative; display:flex; align-items:center; justify-content:center; text-align:center;
  font-family:'Montserrat',Arial,sans-serif; font-weight:700; font-size:12.5px; line-height:1.35;
  color:var(--ink); background:var(--panel); border:1px solid var(--line); border-radius:8px; padding:9px 11px;}
/* chevrons sit in the grid gap, so the row stays evenly divided */
.ch-chain .ch-cell + .ch-cell::before{content:""; position:absolute; left:-15px; top:50%; margin-top:-4px;
  width:7px; height:7px; border-top:1.7px solid var(--cyanDeep); border-right:1.7px solid var(--cyanDeep);
  transform:rotate(45deg);}
/* ch-set: a chain band that is an unordered SET, not a left-to-right sequence, opts out of the
   directional chevron. Specificity (0,5,1) beats the base chevron rule (0,3,1) with no !important.
   Applied per-band (e.g. AMS "Your SAP landscape" — coexisting systems, not a pipeline). */
.pv.wv-minimal .ch-set .ch-cell + .ch-cell::before{display:none;}
.ch-down{display:block; height:18px; position:relative;}
.ch-down::before{content:""; position:absolute; left:50%; top:4px; margin-left:-7px; width:0; height:0;
  border-left:7px solid transparent; border-right:7px solid transparent; border-top:9px solid var(--cyanDeep);}
/* layer 2 — the SAP core takes cyan */
.ch-core{border-color:rgba(104,225,251,.50); background:rgba(104,225,251,.07);}
.ch-core .ch-ico{background:var(--cyanDeep);}
.ch-core .ch-t{color:var(--cyanDeep);}
.ch-core .ch-cell{border-color:rgba(104,225,251,.60); font-size:11.5px; letter-spacing:-.005em;}
/* layer 3 — the differentiator takes magenta, the one place it appears */
.ch-ai{border-color:rgba(212,62,246,.34); background:rgba(212,62,246,.05);}
.ch-ai .ch-ico{background:var(--magDeep);}
.ch-ai .ch-t{color:var(--magDeep);}
.ch-ai .ch-cell{border-color:rgba(212,62,246,.42);}
/* outcomes strip: the live band puts white text on a saturated fill; on this
   palette that fails contrast, so it takes the dark --fill-ink token instead */
.ch-out{margin:14px 0 0; padding:13px 16px; border-radius:12px; background:var(--fill);
  display:flex; flex-wrap:wrap; justify-content:center; gap:6px 18px;}
.ch-out span{font-family:'Montserrat',Arial,sans-serif; font-weight:700; font-size:12px; color:var(--fill-ink);}
.pv .ch-cap{text-align:center; font-family:'Open Sans',sans-serif; font-size:12.5px !important;
  color:var(--muted) !important; margin:15px auto 0 !important; max-width:74ch; line-height:1.55;}

/* pressures — context, not capability: hairline rows, no cards, two columns */
.pv-press{display:grid; grid-template-columns:repeat(auto-fit,minmax(290px,1fr)); gap:0 36px; margin:20px 0 0;}
.pv-press .pp{display:flex; gap:13px; padding:14px 0; border-top:1px solid var(--line-2);}
.pv-press .pp::before{content:""; flex:none; width:7px; height:7px; margin-top:9px; border-radius:2px; background:var(--cyan);}
.pv-press .pp-t{font-size:15px; line-height:1.55; color:var(--body);}

/* narrative paragraph + inline link inside the proof block */
.pv .pv-proof p{font-size:15px !important; line-height:1.6; color:var(--body) !important; margin:0 0 4px !important; max-width:70ch;}
.pv-inline{color:var(--link) !important; font-weight:600; border-bottom:1px solid rgba(189,31,214,.32);}
.pv-inline:hover{border-bottom-color:var(--link);}

@media(max-width:600px){
  .pv-vchain{padding:14px 12px 12px;}
  .ch-band{padding:12px 12px 13px;}
  .ch-row{grid-template-columns:1fr !important; gap:8px;}
  .ch-cell{justify-content:flex-start; text-align:left; font-size:12.5px; padding:8px 12px;}
  .ch-out{gap:6px 18px; padding:12px 14px;}
  .pv-press{grid-template-columns:1fr; gap:0;}
}

/* proof block that carries a narrative paragraph after the stats needs the gap back */
.pv .pv-proof .pv-stats{margin-bottom:24px !important;}
@media(min-width:721px){.pv-cards-3{grid-template-columns:repeat(3,1fr) !important;}}

/* THEME OVERRIDE #7 (found on the industry page): .entry li carries
   list-style-type:disc + margin-left:20px !important and display:list-item,
   so `list-style:none` on the <ul> alone still paints a bullet beside every pill. */
.pv ul.pv-links{margin-left:0 !important; padding-left:0 !important; list-style:none !important;}
.pv ul.pv-links li{list-style:none !important; list-style-type:none !important;
  display:inline-block !important; margin:0 !important; padding:0 !important;}
/* 3-up row inside a 767px template column needs a tighter gutter to stay readable */
.pv.wv-edit .pv-cards-3{gap:28px 24px;}

/* phones: the chain wraps to 2 per row, and an absolutely-placed chevron then
   lands at the start of a line. Drop the connectors and let the order read. */
@media(max-width:600px){
  /* stacked cells: a chevron pointing right between vertical rows reads wrong */
  .ch-chain .ch-cell + .ch-cell::before{display:none;}
}

/* Two components the emitter needs that the pilot stylesheet doesn't have, because
   the Chemicals pilot was hand-built and these cases only appear once you render all
   fifteen sectors. Loaded after whitebg.css. */

/* Capability chips in the proof block. The pilot's Chemicals proof had none — the
   credential-restating chips ("SAP Gold Partner") are filtered out in the emitter,
   so what lands here is the distinctive claim: "Joint-venture accounting depth". */
.pv .pv-tags{list-style:none !important; display:flex; flex-wrap:wrap; gap:8px;
  margin:2px 0 20px !important; padding:0 !important;}
.pv .pv-tags li{list-style:none !important; display:inline-block !important;
  font-family:'Montserrat',Arial,sans-serif; font-weight:600; font-size:12.5px; line-height:1.3;
  color:var(--cyanDeep); background:var(--wash); border:1px solid var(--line);
  border-radius:100px; padding:7px 14px; margin:0 !important;}

/* The CTA band carries no heading — neither the source data nor the live pages have
   one, and inventing fifteen would be writing copy under the guise of a render. The
   body sentence is already a direct address, so it is sized to lead. */
.pv .pv-cta .pv-cta-lead{font-family:'Montserrat',Arial,sans-serif !important;
  font-weight:700 !important; color:var(--ink) !important;
  font-size:clamp(19px,2.6vw,23px) !important; line-height:1.32 !important;
  letter-spacing:-.02em; max-width:34ch; margin:0 0 22px !important;}

/* The roster line reads as a sentence, not a heading — the pilot's .pv-names was a
   bare list of names, this one is prefixed "Trusted by". */
.pv.wv-edit .pv-names{font-size:15px !important; font-weight:600 !important;
  color:var(--body) !important; line-height:1.55;}

/* Headings were breaking with a single orphaned word on the last line — flagged on
   several sectors at 390px, and it is the kind of thing that reads as machine-set.
   `balance` evens the lines; `pretty` on body copy only prevents a one-word last
   line. Both degrade to normal wrapping where unsupported. */
.pv h2, .pv h3, .pv .ch-t, .pv .pv-cta-lead{text-wrap:balance;}
.pv p, .pv .pp-t, .pv .ch-cap{text-wrap:pretty;}

/* Hierarchy corrections — layered after whitebg + rollout-extras, before any
   restraint layer. These are fork-independent: they change which things on the page look
   important, not how much surface decoration the page carries, so they apply whichever
   design direction wins.

   Everything here comes from two independent reviews (desktop 1440, mobile 390) and was
   confirmed in the source CSS before being changed, not judged by eye. */

/* ================================================================ 1. the AI band leads
   The diagram's three bands were emphasised in the wrong order. Measured from the sheets,
   not squinted at:

       .ch-core (SAP)   border rgba(104,225,251,.50)  fill .07  cells .60   5 cells   cyan
       .ch-ai  (AI)     border rgba(212,62,246,.34)   fill .05  cells .42   3 cells   magenta

   So the band captioned "the Altivate difference" was the least emphasised object in the
   figure — lower alpha on every one of the three weights than the band above it. That
   directly contradicts the positioning this page exists to argue: SAP is the foundation,
   SAP+AI is the differentiator.

   Corrected order is chain (neutral, recessive) < core (cyan, present) < AI (magenta,
   peak). No new colour is introduced and no hue is reassigned: whitebg.css already gives
   magenta exactly one job on the page — "the AI layer is the only place magenta appears,
   emphasis, exactly one job" — and this simply lets it do that job properly. Only the
   weights move. */
.pv.wv-minimal .ch-chain{border-color:#e1e8ee !important; background:#fbfcfd !important;}
.pv.wv-minimal .ch-chain .ch-cell{border-color:#e1e8ee !important;}
.pv.wv-minimal .ch-chain .ch-ico{background:#8fa3b0 !important;}
.pv.wv-minimal .ch-chain .ch-t{color:#5d707d !important;}

.pv.wv-minimal .ch-core{border-color:rgba(14,143,184,.34) !important; background:rgba(14,143,184,.05) !important;}
.pv.wv-minimal .ch-core .ch-cell{border-color:rgba(14,143,184,.42) !important;}

/* the peak: strongest border, strongest fill, and the only band whose cells are opaque
   white so they lift off their own ground rather than sitting in it. Magenta channels
   212,62,246 = --magenta, the hue whitebg reserves for the AI layer. The icon chip and the
   band title are left alone on purpose — whitebg already paints them var(--magDeep), so
   they follow the palette without a literal here. */
.pv.wv-minimal .ch-ai{border-color:rgba(212,62,246,.62) !important; background:rgba(212,62,246,.09) !important;}
.pv.wv-minimal .ch-ai .ch-cell{border-color:rgba(212,62,246,.55) !important; background:#fff !important;}
.pv.wv-minimal .ch-ai .ch-t{font-weight:800 !important;}

/* ================================================================ 2. the edge changes gear
   DELIVERY (4 cards) and THE EDGE (3 cards) used an identical chip + heading + body
   treatment, so the page ran seven near-identical card blocks — about 2,600px of mobile
   scroll — and the AI section earned no more attention than the SAP one before it. A
   single tinted ground is enough to mark the turn in the argument without adding a new
   component or a line of copy. Flat, so the restraint layer has nothing to undo.

   The ground is tinted in the AI section's own hue, magenta, so it reads as the same
   argument the AI band of the diagram is making rather than as a second, unrelated panel.
   The eyebrow is deliberately NOT overridden here: var(--atext) is already magenta, so it
   picks the colour up from the palette on its own. */
.pv.wv-minimal .pv-sec-edge{
  background:#fdf6fe;
  border:1px solid rgba(212,62,246,.16);
  border-radius:var(--r-band);
  padding:26px 26px 6px;
  margin:34px 0;
}
.pv.wv-minimal .pv-sec-edge .pv-card{border-color:rgba(212,62,246,.20);}

/* ================================================================ 3. proof reads as proof
   Named clients were the smallest type in the section called PROOF — quieter than the
   generic capability pill above them. The renderer now emits them first; this gives them
   the weight. They are still not a heading: the aim is parity with the body copy they sit
   beside, not a second headline. */
.pv.wv-minimal .pv-names{
  font-family:'Montserrat',Arial,sans-serif !important;
  font-size:15px !important;
  font-weight:700 !important;
  color:var(--ink) !important;
  line-height:1.5 !important;
  margin:18px 0 4px !important;
  padding:14px 0 0 !important;
  border-top:1px solid var(--line) !important;
}

/* One pill token was doing two jobs: the static capability tags in PROOF were visually
   identical to the actual links under KEEP READING, so the page offered the same
   affordance for something clickable and something not. Tags lose the pill shape and the
   panel fill and become plain ruled labels; links keep the pill and own it alone. */
.pv.wv-minimal .pv-tags li{
  background:transparent !important;
  border:0 !important;
  border-left:2px solid rgba(14,143,184,.45) !important;
  border-radius:0 !important;
  padding:1px 0 1px 10px !important;
  color:var(--body) !important;
  font-weight:600 !important;
}

/* ================================================================ 4. tap targets
   .pv-links li a was 14px with 8px padding and no line-height -> about 37-40px, under the
   44px minimum. Padding alone clears it without changing the visual weight of the pill. */
.pv.wv-minimal .pv-links li a{padding:11px 18px !important; line-height:1.45 !important;}

/* ================================================================ 5. mobile chain sequence
   At <=600px .ch-row collapses to a single column and the right-pointing chevron between
   chain cells is explicitly display:none — so an ordered five-stage value chain rendered
   as five identical stacked boxes, indistinguishable from the unordered SAP product set
   below it. Numbering restores the sequence without reintroducing a connector that would
   have to be re-drawn for a vertical axis. Scoped to the chain band only: the SAP and AI
   bands genuinely are unordered sets and must not be numbered. */
@media screen and (max-width:600px){
  .pv.wv-minimal .ch-chain .ch-cells{counter-reset:chainstep;}
  .pv.wv-minimal .ch-chain .ch-cell{counter-increment:chainstep; position:relative; padding-left:34px !important;}
  .pv.wv-minimal .ch-chain .ch-cell::after{
    content:counter(chainstep);
    position:absolute; left:12px; top:50%; transform:translateY(-50%);
    font-family:'Montserrat',Arial,sans-serif; font-size:11px; font-weight:800;
    color:#8fa3b0;
  }
  /* the outcomes strip wrapped centred, so four outcomes landed as a ragged 1/2/1 stack
     that read as broken prose rather than a list */
  .pv.wv-minimal .ch-out{justify-content:flex-start !important;}
}

/* ================================================================ 6. lead rhythm
   The lead is now three paragraphs rather than one wall. The payoff sentence — "The
   result: ..." / "The outcome: ..." in 14 of 15 sectors — carries slightly more weight so
   the eye can find the conclusion without reading the whole block first. Deliberately
   understated: this is emphasis inside body copy, not a pull-quote. */
.pv.wv-minimal .pv-lead p{margin:0 0 14px;}
.pv.wv-minimal .pv-lead p.pv-outcome{
  color:var(--ink);
  font-weight:600;
  border-left:3px solid var(--cyan);
  padding-left:15px;
  margin-top:18px;
}
@media screen and (max-width:600px){
  /* 18px was set !important with no mobile step-down; at a ~35-character measure that is
     what turned a 128-word lead into 20-plus lines */
  .pv.wv-minimal .pv-lead p{font-size:16.5px !important; line-height:1.6;}
}

/* Minimal, restraint dialled up — layered last, after whitebg + rollout-extras + hierarchy.
   Nothing structural changes: same sections, same components, same content, same length.
   This removes only the four things the Quiet Editorial critique scores Minimal on, and
   that a designer would call SaaS-marketing tells rather than brand:

       gradients  18 -> 0     flat brand tints instead of two-stop fills and glow blobs
       shadows     2 -> 0     hairlines carry the separation instead of depth
       uppercase   9 -> 0     letter-spaced kickers become sentence-case labels
       radius>4px 43 -> 0     12px "app card" corners become 4px

   The gradient figure is 18, not the 8 first reported: an element-only scan cannot see
   ::before/::after, and five of them are radial glow blobs living exactly there.

   Kept deliberately: the card grids, the four-layer diagram and the overall page length.
   Those are what make the page scannable for a buyer, and they are a different argument
   from the one about surface styling. */

/* ---------------------------------------------------------------- flat, not gradient */
.pv.wv-minimal{
  --fill:#68e1fb;                 /* the icon-chip fill — the palette's own --cyan, flat */
  --r-band:4px; --r-card:4px; --r-btn:4px;
}
/* The two big panels were near-white two-stop washes; flat kills the gradient, including
   the faint green second stop (#f8fdf1) that is the lime end of the palette bleeding into
   a background wash. Lime is the action colour here — it belongs on the button, not under
   a panel — so removing it from the wash is a restraint decision, not a palette one. */
.pv.wv-minimal .pv-band,
.pv.wv-minimal .pv-cta{background:#f6fafc !important;}
.pv.wv-minimal .pv-chip,
.pv.wv-minimal .pv-badge{background:#68e1fb !important;}
/* .ch-out — the outcomes strip that closes the diagram — deliberately gets NO override
   here: it reads var(--fill), so the flat token above already de-gradients it while it
   keeps full-strength cyan. An earlier draft washed it to #eef7fa and the diagram lost its
   payoff — the conclusion row became one more pale box. The tell being removed is the
   gradient, not the colour; a flat brand fill is brand, not SaaS decoration. */
/* Radial "glow" blobs bled behind the band, the proof block and the CTA — five of them,
   all on ::before/::after, which is why an element-only scan reported zero gradients while
   they were still painting. A soft coloured haze under a content block is the ambient-SaaS
   tell in its purest form; the hairline does the job.
   `background:none` rather than `display:none` on purpose: a display-none pseudo still
   reports its background-image to getComputedStyle, so hiding them that way leaves the
   audit unable to distinguish a suppressed blob from a live one. Nulling the paint makes
   the measurement honest — the count is the thing being reported to a human. */
.pv.wv-minimal .pv-band::before,
.pv.wv-minimal .pv-band::after,
.pv.wv-minimal .pv-proof::before,
.pv.wv-minimal .pv-proof::after,
.pv.wv-minimal .pv-cta::before,
.pv.wv-minimal .pv-cta::after{background:none !important; display:none !important;}

/* ---------------------------------------------------------------- no depth, only rules
   Every shadow in the sheet, including the lime halo under the button — which is authored
   in whitebg.css and is correct on the S/4HANA page; it is removed here only because a
   coloured glow is one of the four tells this variant exists to strip. */
.pv.wv-minimal .pv-band,
.pv.wv-minimal .pv-card,
.pv.wv-minimal .pv-card:hover,
.pv.wv-minimal .pv-tablewrap,
.pv.wv-minimal .pv-item,
.pv.wv-minimal .pv-proof,
.pv.wv-minimal .pv-cta,
.pv.wv-minimal .pv-btn,
.pv.wv-minimal .pv-step{box-shadow:none !important;}
/* the lift-on-hover is the same tell in motion */
.pv.wv-minimal .pv-card:hover{transform:none !important; border-color:#cfe6ef !important;}

/* ---------------------------------------------------------------- sentence case (with one
   deliberate exception — fable's hybrid, the direction Ali chose 2026-07-23).
   The uppercase letter-spaced kicker was the single most repeated tell on the page. Page
   eyebrows lose it: "Industries", "The pressures", "Delivery", "Proof" become quiet labels.
   The three DIAGRAM layer-labels (.ch-t) KEEP it, because caps inside a technical figure is
   schematic-label convention, not heading styling — it makes the value-chain read as an
   architecture schematic rather than a marketing infographic. So .ch-t is left to inherit
   whitebg's uppercase + .1em; only its size is nudged for parity with the eyebrow it replaced. */
.pv.wv-minimal .pv-eyebrow{text-transform:none !important; letter-spacing:0 !important;
  font-size:13px !important; font-weight:600 !important;}
.pv.wv-minimal .ch-t{font-size:12.5px !important;}

/* ---------------------------------------------------------------- square up
   Blanket 4px, then restore the two shapes that are genuinely circular rather than a
   rounded box — the 7px chain bullet and the numbered step marker. Flattening those would
   turn a dot into a square and read as a mistake, not restraint. */
.pv.wv-minimal .pv-band,
.pv.wv-minimal .pv-card,
.pv.wv-minimal .pv-chip,
.pv.wv-minimal .pv-badge,
.pv.wv-minimal .pv-tablewrap,
.pv.wv-minimal .pv-proof,
.pv.wv-minimal .pv-stat,
.pv.wv-minimal .pv-cta,
.pv.wv-minimal .pv-btn,
.pv.wv-minimal .pv-item,
.pv.wv-minimal .pv-tags li,
.pv.wv-minimal .pv-links li a,
.pv.wv-minimal .pv-chain span,
.pv.wv-minimal .ch-band,
.pv.wv-minimal .ch-ico,
.pv.wv-minimal .ch-cell,
.pv.wv-minimal .ch-out,
.pv.wv-minimal .pv-vchain{border-radius:4px !important;}
.pv.wv-minimal .pv-chain span::before,
.pv.wv-minimal .pv-press .pp::before{border-radius:50% !important;}

.pv{background:#fff;}

/* ch-tracks — SAP + AI as side-by-side peer bands (PE + Family/Holding twin-track diagram).
   Additive: a wrapper the 15 sibling industry pages never emit, so zero blast radius.
   Collapses at the same 600px breakpoint the .ch-row rules already use, so mobile matches
   the proven sibling behaviour. Premises verified against PROD_minimal.css:
   .ch-band marginless (:256), .ch-down 18px spacer+triangle (:276), .ch-out has its own
   margin:14px 0 0 (:291), .ch-row collapses at 600px (:311). */
.pv .ch-tracks{display:grid; grid-template-columns:1fr 1fr; gap:14px; margin:0;}
.pv .ch-tracks .ch-band{margin:0;}
/* inside a half-width track band the cells stack vertically; the shipped .ch-row gap is
   22px (tuned for HORIZONTAL cells) — tighten to 10px when the row is a single column. */
.pv .ch-tracks .ch-row{gap:10px;}
@media (max-width:600px){
  .pv .ch-tracks{grid-template-columns:1fr; gap:14px;}
}

