/* /solutions/automotive-pcf/ — page-only pieces on top of solution.css (Catena-X·PCF).
   Hero flow card + static PDS bar, Catena-X role map, trust-level stairs, process-step meta + mock screens, Rulebook
   rule cards, PDS meter (static 54% 「예시」, no increase animation — canonical §4), cost bar, program grid, supplier
   chain, IT architecture, 「발행 예정」 cards, page meta. Tokens only from main.css; --signal only on night surfaces;
   --water only inside the PDS chart. No motion of its own: everything here is static, so reduced motion needs nothing. */

/* ---------- shared bits ---------- */
.sol-cx code{font:500 .9em/1.4 var(--font-mono);padding:1px 5px;border-radius:3px;background:rgba(67,81,74,.1);overflow-wrap:anywhere;word-spacing:-.2em}
.sol-cx .dark code{background:rgba(234,242,236,.1);color:var(--on-night)}
.cx-q{font-size:clamp(19px,1.6vw,23px);line-height:1.4;letter-spacing:-.018em;margin-bottom:12px}
.cx-blockhead{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:8px 24px;margin-bottom:clamp(20px,2.4vw,30px)}
.cx-blockhead .src-line{max-width:46em}
.cx-foot{margin-top:18px;max-width:64em}
.cx-colink{margin-top:14px;font-size:15px;line-height:1.7;color:var(--ink-2)}
.cx-tl-note{margin-top:22px;font-size:15px;line-height:1.75;color:var(--ink-2);max-width:64em}

/* ---------- hero: fact chips, flow card, static PDS bar ---------- */
.cx-std-chips{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:22px 0 0;padding:0}
.sol-cx .sol-hero__card .mk{container-type:inline-size}
.sol-cx .sol-hero__card .mk-body{gap:11px}
.cx-flow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.cx-flow .n{position:relative;min-width:0;padding:10px 10px 11px;border:1px solid rgba(234,242,236,.18);border-radius:6px;background:rgba(234,242,236,.04);font-size:12px;line-height:1.45;color:var(--on-night-2)}
.cx-flow .n b{display:block;margin-bottom:3px;font-size:12.5px;font-weight:600;color:var(--on-night)}
.cx-flow .n.hl{border-color:rgba(191,234,98,.6)}
.cx-flow .n:not(:last-child)::after{content:"";position:absolute;right:-11px;top:50%;width:10px;height:1.5px;background:var(--leaf)}
@container (max-width:440px){.cx-flow{grid-template-columns:repeat(2,minmax(0,1fr))}.cx-flow .n:nth-child(2)::after{display:none}}
.cx-part{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;font:500 12px/1.45 var(--font-mono);color:var(--on-night-2);word-spacing:-.2em}
.cx-part b{font-weight:500;color:var(--on-night)}
.cx-part .ex{margin-left:0}
.cx-meter{height:8px;margin-top:7px;border-radius:4px;background:rgba(234,242,236,.12);overflow:hidden}
.cx-meter span{display:block;height:100%;border-radius:0 4px 4px 0;background:var(--signal)}
.cx-pds-mini .mk-cap{margin-top:6px}

/* ---------- why now ---------- */
.cx-kfigs{margin-bottom:clamp(28px,3vw,44px)}
.cx-signals .scard h3{font-size:clamp(17.5px,1.35vw,19.5px)}
.sol-cx .cx-signals .scard p:not(.scard__k):not(.src-line){font-size:14.5px;line-height:1.7}
.cx-signals .src-line{margin-top:auto;padding-top:10px}
.cx-signals + .disclaim{margin-top:16px}

/* ---------- role map (night card): list + rail on small screens, wired 3-column map from 1024px ---------- */
.cx-map{position:relative;margin:0;padding:clamp(20px,3vw,40px);border-radius:var(--r-m);border:1px solid rgba(234,242,236,.14);box-shadow:0 40px 80px -50px rgba(0,0,0,.6)}
.cx-map__head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:6px 24px;margin-bottom:clamp(22px,3vw,40px)}
.cx-map__t{font-size:clamp(19px,1.6vw,23px);line-height:1.35;letter-spacing:-.018em}
.cx-map__nodes{position:relative;list-style:none;margin:0;padding:0 0 0 28px;display:grid;gap:14px}
.cx-map__nodes::before{content:"";position:absolute;left:8px;top:10px;bottom:10px;border-left:1.5px dashed rgba(191,234,98,.55)}
.cx-node{position:relative;min-width:0;padding:16px 16px 15px;border:1px solid rgba(234,242,236,.18);border-radius:var(--r-m);background:rgba(10,42,30,.9)}
.cx-node::before{content:"";position:absolute;left:-25px;top:20px;width:9px;height:9px;background:var(--night-2);border:1.5px solid var(--signal)}
.cx-node__k{font:500 12px/1.3 var(--font-mono);color:var(--on-night-2);word-spacing:-.25em}
.cx-node h4{margin-top:6px;font-size:17px;line-height:1.4;letter-spacing:-.012em;color:var(--on-night)}
.cx-node h4 small{display:block;margin-top:2px;font:500 12.5px/1.4 var(--font-mono);color:var(--signal);word-spacing:-.2em}
.cx-node > p:not(.cx-node__k):not(.cx-edge){margin-top:8px;font-size:14.5px;line-height:1.68;color:rgba(234,242,236,.86)}
.cx-node .chip{margin-top:12px}
.cx-node__do{margin-top:12px}
.cx-node__do li{white-space:normal;line-height:1.3}
.cx-node.is-you{border-color:var(--signal);background:rgba(15,54,38,.96)}
.cx-node.is-cert{border-style:dashed;border-color:rgba(191,234,98,.55)}
.cx-node.is-aux{border-style:dashed;background:rgba(10,42,30,.55)}
.cx-edge{display:flex;align-items:center;gap:8px;margin-top:12px;font:500 12px/1.4 var(--font-mono);color:var(--signal);word-spacing:-.2em}
.cx-edge::before{content:"";flex:none;width:9px;height:9px;border-left:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:translateY(-2px)}
.cx-map__cap{margin-top:clamp(22px,3vw,36px);padding-top:16px;border-top:1px solid rgba(234,242,236,.14);font-size:14.5px;line-height:1.7;color:var(--on-night-2);max-width:64em}
@media (min-width:1024px){
  .cx-map__nodes{--cg:clamp(28px,3vw,48px);--rg:76px;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--cg);row-gap:var(--rg);padding-left:0}
  .cx-map__nodes::before,.cx-node::before{display:none}
  .cx-node.n1{grid-column:2;grid-row:1}
  .cx-node.n2{grid-column:1;grid-row:2}
  .cx-node.n3{grid-column:2;grid-row:2}
  .cx-node.n4{grid-column:3;grid-row:2}
  .cx-node.n6{grid-column:1 / span 2;grid-row:3}
  .cx-node.n5{grid-column:3;grid-row:3}
  .cx-node.n7{grid-column:3;grid-row:4}
  /* org bus: association → operator · clearing house · CAB */
  .cx-node.n1::after{content:"";position:absolute;left:50%;top:100%;height:calc(var(--rg) / 2);border-left:1.5px dashed var(--signal)}
  .cx-node.n2::before,.cx-node.n3::before,.cx-node.n4::before{display:block;content:"";position:absolute;top:calc(var(--rg) / -2);width:auto;height:calc(var(--rg) / 2);background:none;border:0;border-top:1.5px dashed var(--signal)}
  .cx-node.n2::before{left:50%;right:calc(var(--cg) / -2);border-left:1.5px dashed var(--signal)}
  .cx-node.n3::before{left:calc(var(--cg) / -2);right:calc(var(--cg) / -2);height:0}
  .cx-node.n3::after{content:"";position:absolute;left:50%;top:calc(var(--rg) / -2);height:calc(var(--rg) / 2);border-left:1.5px dashed var(--signal)}
  .cx-node.n4::before{left:calc(var(--cg) / -2);right:50%;border-right:1.5px dashed var(--signal)}
  /* labelled edges down to the next row */
  .cx-node:is(.n1,.n2,.n3,.n4) > .cx-edge{position:absolute;left:50%;top:100%;height:var(--rg);margin:0;padding-left:12px;border-left:1.5px dashed var(--signal);max-width:calc(50% + var(--cg) / 2 - 6px)}
  .cx-node:is(.n1,.n2,.n3,.n4) > .cx-edge::before{display:none}
  .cx-node.n1 > .cx-edge{height:calc(var(--rg) / 2);border-left:0;padding-left:14px}
  .cx-node.n6::after{content:"";position:absolute;left:100%;top:50%;width:var(--cg);border-top:1.5px dashed var(--signal)}
}

/* ---------- trust levels (stairs), myths, role boundary ---------- */
.cx-levels{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap);align-items:start}
.cx-level{position:relative;min-width:0;padding:clamp(18px,2vw,26px);border-radius:var(--r-m);border-top:4px solid var(--rule-2);background:var(--card)}
.cx-level.l1{margin-top:72px}
.cx-level.l2{margin-top:36px;border-top-color:var(--sprout)}
.cx-level.l3{border-top-color:var(--brand)}
.cx-level__k{display:flex;align-items:center;gap:8px;font:500 12px/1 var(--font-mono);color:var(--forest);word-spacing:-.25em}
.cx-level h4{margin-top:10px;font-size:clamp(18px,1.5vw,21px);line-height:1.38;letter-spacing:-.018em}
.cx-level dl{margin:14px 0 0;display:grid}
.cx-level dl > div{padding:11px 0;border-top:1px solid var(--rule)}
.cx-level dt{margin-bottom:4px;font:500 12px/1.4 var(--font-mono);color:var(--ink-2);word-spacing:-.25em}
.cx-level dd{margin:0;font-size:14.5px;line-height:1.68}
.cx-levels + .src-line{margin-top:16px}
@media (max-width:900px){.cx-levels{grid-template-columns:minmax(0,1fr)}.cx-level.l1,.cx-level.l2{margin-top:0}}
.cx-myths .scard h4{font-size:clamp(17.5px,1.4vw,20px);line-height:1.4;letter-spacing:-.015em}
.cx-myths .scard p b{margin-right:6px;font-weight:650;color:var(--ink)}
.cx-roles__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap)}
.cx-roles__col{min-width:0;padding:clamp(18px,2vw,26px);border-radius:var(--r-m);background:var(--card)}
.cx-roles__col.is-not{background:transparent;border:1.5px dashed var(--rule-2)}
.cx-roles__col h4{font-size:clamp(18px,1.5vw,21px);letter-spacing:-.018em}
.cx-roles__col ul{list-style:none;margin:12px 0 0;padding:0}
.cx-roles__col li{position:relative;padding:12px 0 12px 30px;border-top:1px solid var(--rule);font-size:15.5px;line-height:1.6}
.cx-roles__col.is-do li::before{content:"";position:absolute;left:3px;top:18px;width:12px;height:6px;border-left:2px solid var(--brand);border-bottom:2px solid var(--brand);transform:rotate(-45deg)}
.cx-roles__col.is-not li::before{content:"";position:absolute;left:2px;top:17px;width:14px;height:14px;background:linear-gradient(45deg,transparent 44%,var(--ink-2) 44% 56%,transparent 56%),linear-gradient(-45deg,transparent 44%,var(--ink-2) 44% 56%,transparent 56%)}
.cx-status{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;margin-top:var(--gap);padding:14px 18px;border:1px solid var(--rule-2);border-radius:var(--r-m);background:var(--card);font-size:14.5px;line-height:1.6}
.cx-status b{font-weight:650}
.cx-status .cx-status__n{color:var(--ink-2)}
@media (max-width:760px){.cx-roles__grid{grid-template-columns:minmax(0,1fr)}}

/* ---------- process: step meta, parallel note, mock screens ---------- */
.sol-cx .sx-step__txt > p.cx-stepname{margin-top:0;margin-bottom:8px;font:500 12px/1.3 var(--font-mono);letter-spacing:.02em;color:var(--forest);word-spacing:-.25em}
.sol-cx .sx-step__txt > p.cx-lede{margin-top:8px;font-size:16.5px;line-height:1.5;font-weight:600;color:var(--ink)}
.cx-meta{margin:16px 0 0;display:grid}
.cx-meta > div{display:grid;grid-template-columns:6.4em minmax(0,1fr);gap:2px 14px;padding:10px 0;border-top:1px solid var(--rule);font-size:14px;line-height:1.6}
.cx-meta dt{font:500 12px/1.75 var(--font-mono);color:var(--forest);word-spacing:-.25em}
.cx-meta dd{margin:0;color:var(--ink-2)}
@media (max-width:600px){.cx-meta > div{grid-template-columns:minmax(0,1fr)}}
.cx-par{position:relative;margin:0;padding:16px 0 16px 58px;border-top:1px dashed var(--rule-2);font-size:14.5px;line-height:1.65;color:var(--ink-2)}
.cx-par::before{content:"";position:absolute;left:11px;top:15px;width:20px;height:20px;border:1.5px dashed var(--forest);border-radius:var(--r-s);
  background:linear-gradient(90deg,transparent 6px,var(--forest) 6px 7.5px,transparent 7.5px 10.5px,var(--forest) 10.5px 12px,transparent 12px) center/100% 10px no-repeat,var(--paper)}
.cx-par b{font-weight:650;color:var(--ink)}
.sx.is-ready .cx-par{border-top:0;background:var(--paper)}
@media (max-width:600px){.cx-par{padding-left:40px}.cx-par::before{left:2px}}
.sol-cx .sx-screen{container-type:inline-size}
.sol-cx .sx-screen .mk-body{gap:11px}
.cx-opt3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.cx-o{position:relative;display:grid;gap:5px;align-content:start;min-width:0;padding:11px;border:1px solid rgba(234,242,236,.18);border-radius:6px;background:rgba(234,242,236,.03);font-size:12px;line-height:1.45;color:var(--on-night-2)}
.cx-o b{padding-right:20px;font-size:13px;font-weight:600;color:var(--on-night)}
.cx-o small{font:500 11px/1.3 var(--font-mono);word-spacing:-.2em}
.cx-o.is-on{border-color:rgba(191,234,98,.7);background:rgba(191,234,98,.06)}
.cx-o.is-on::after{content:"✓";position:absolute;right:9px;top:9px;width:17px;height:17px;border-radius:3px;background:var(--signal);color:var(--night);font:700 11px/17px var(--font-sans);text-align:center}
@container (max-width:460px){.cx-opt3{grid-template-columns:minmax(0,1fr)}}
.cx-check{display:grid;gap:6px;padding:10px 12px;border:1px solid rgba(234,242,236,.16);border-left:2px solid var(--signal);border-radius:4px}
.cx-onb .n{font-size:11.5px}

/* ---------- Rulebook v4: rule cards (4 + 3), electricity callout, "more rules" disclosure ---------- */
.cx-rules{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--gap)}
.cx-rule{grid-column:span 3;display:flex;flex-direction:column;gap:10px;min-width:0;padding:clamp(20px,2vw,26px);border-radius:var(--r-m);background:var(--card)}
.cx-rule:nth-child(n+5){grid-column:span 4}
.cx-rule__big{font:650 clamp(26px,2.3vw,34px)/1.1 var(--font-sans);letter-spacing:-.03em;color:var(--brand);font-variant-numeric:lining-nums}
.cx-rule h3{font-size:clamp(18px,1.4vw,20px);line-height:1.4;letter-spacing:-.015em}
.cx-rule > p:not(.cx-rule__big):not(.cx-rule__c){font-size:15px;line-height:1.7;color:var(--ink-2)}
.cx-rule__c{display:flex;flex-wrap:wrap;gap:6px;margin-top:auto;padding-top:6px}
@media (max-width:1100px){.cx-rules{grid-template-columns:repeat(2,minmax(0,1fr))}.cx-rule,.cx-rule:nth-child(n+5){grid-column:auto}}
@media (max-width:680px){.cx-rules{grid-template-columns:minmax(0,1fr)}}
.callout--note.cx-power > p:not(.callout__k):not(.src-line){margin-top:12px;font-size:15.5px;line-height:1.75;color:var(--ink-2);max-width:64em}
.callout--note.cx-power .src-line{margin-top:12px}
.cx-more{margin-top:clamp(28px,3vw,40px);border-top:1px solid var(--rule-2);border-bottom:1px solid var(--rule-2)}
.cx-more > summary{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 0;list-style:none;cursor:pointer;font-size:clamp(17px,1.35vw,19px);font-weight:600;letter-spacing:-.01em}
.cx-more > summary::-webkit-details-marker{display:none}
.cx-more > summary i{position:relative;flex:none;width:20px;height:20px}
.cx-more > summary i::before,.cx-more > summary i::after{content:"";position:absolute;left:3px;right:3px;top:50%;height:1.5px;background:var(--ink);transition:transform .25s var(--ease-out)}
.cx-more > summary i::after{transform:rotate(90deg)}
.cx-more[open] > summary i::after{transform:rotate(0)}
.cx-more > summary:hover{color:var(--brand)}
.cx-more > .table-wrap{margin-bottom:22px}

/* ---------- PDS (night band): text column + static meter, worked example tables, scenario table ---------- */
.cx-pds{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--gap) clamp(28px,4.5vw,72px);align-items:start}
.cx-pds__txt .principles{margin-top:0}
.cx-pds__txt .src-line{margin-top:10px}
.cx-h3d{margin-top:clamp(28px,3vw,40px);font-size:clamp(18px,1.5vw,21px);line-height:1.4;letter-spacing:-.018em}
.cx-acts{list-style:none;margin:12px 0 0;padding:0;display:grid}
.cx-acts li{position:relative;padding:11px 0 11px 28px;border-top:1px solid rgba(234,242,236,.12);font-size:15px;line-height:1.6;color:var(--on-night)}
.cx-acts li::before{content:"";position:absolute;left:2px;top:21px;width:13px;height:1.5px;background:var(--signal)}
.cx-acts li::after{content:"";position:absolute;left:9px;top:18px;width:6px;height:6px;border-top:1.5px solid var(--signal);border-right:1.5px solid var(--signal);transform:rotate(45deg)}
.cx-why{margin-top:clamp(24px,3vw,36px)}
.cx-why .disclaim{margin-top:10px}
.cx-pdsbox,.cx-scen{padding:clamp(18px,2.2vw,28px);border:1px solid rgba(234,242,236,.16);border-radius:var(--r-m);background:rgba(15,54,38,.78)}
.cx-scen{margin-top:var(--gap)}
.cx-pdsbox__t{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;font-size:clamp(18px,1.5vw,21px);line-height:1.35;letter-spacing:-.015em}
.cx-pdsbox__t .ex{margin-left:0}
.cx-pdsbox .mk-cap{margin-top:6px}
.cx-pdsbig{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 10px;margin-top:18px}
.cx-pdsbig b{font:640 clamp(48px,5.2vw,74px)/1 var(--font-sans);letter-spacing:-.045em;font-variant-numeric:lining-nums}
.cx-pdsbig small{font-size:14px;color:var(--on-night-2)}
.cx-bar{display:flex;gap:2px;height:22px;margin-top:16px;border-radius:4px;overflow:hidden;background:rgba(234,242,236,.06)}
.cx-bar .seg{display:block;height:100%;min-width:2px}
.cx-bar .cx-own,.cx-legend .cx-own i{background:var(--signal)}
.cx-bar .cx-sup,.cx-legend .cx-sup i{background:radial-gradient(rgba(10,42,30,.55) 1px,transparent 1.4px) 0 0/5px 5px,var(--water)}
.cx-bar .cx-2nd,.cx-legend .cx-2nd i{background:repeating-linear-gradient(135deg,rgba(234,242,236,.34) 0 1.5px,transparent 1.5px 6px),var(--night-3);box-shadow:inset 0 0 0 1px rgba(234,242,236,.22)}
.cx-legend{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px 18px;font:500 12px/1.5 var(--font-mono);color:var(--on-night-2);word-spacing:-.2em}
.cx-legend li{display:inline-flex;align-items:center;gap:7px}
.cx-legend i{flex:none;width:16px;height:10px;border-radius:2px}
.cx-legend b{font-weight:500;color:var(--on-night)}
.cx-pdsbox .table-wrap,.cx-scen .table-wrap{margin-top:18px}
.cx-pds .dtable tr.is-sum th,.cx-pds .dtable tr.is-sum td{border-top:1.5px solid rgba(234,242,236,.35);font-weight:600;color:var(--on-night)}
.cx-pds .dtable caption .ex{margin-left:8px}
.cx-formula{margin-top:16px;border-top:1px solid rgba(234,242,236,.14)}
.cx-formula > summary{display:inline-flex;align-items:center;gap:10px;padding:14px 0 6px;list-style:none;cursor:pointer;font:500 13px/1.4 var(--font-mono);color:var(--signal);word-spacing:-.2em}
.cx-formula > summary::-webkit-details-marker{display:none}
.cx-formula > summary::before{content:"";width:7px;height:7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(-45deg);transition:transform .2s var(--ease-out)}
.cx-formula[open] > summary::before{transform:rotate(45deg)}
.cx-formula > div{display:grid;gap:10px;padding:6px 0 4px;font-size:14.5px;line-height:1.7;color:var(--on-night-2)}
.cx-eq{padding:10px 12px;border:1px solid rgba(234,242,236,.18);border-radius:var(--r-s);background:rgba(234,242,236,.04);font:500 14px/1.6 var(--font-mono);color:var(--on-night);overflow-wrap:anywhere;word-spacing:-.15em}
.cx-scen__d{margin-top:8px;font-size:14.5px;line-height:1.7;color:var(--on-night-2)}
.cx-mini{display:inline-block;vertical-align:middle;width:64px;height:6px;margin-right:8px;border-radius:3px;background:linear-gradient(90deg,var(--signal) 0 var(--v),rgba(234,242,236,.16) var(--v) 100%)}
.cx-scentab td.cx-v{white-space:nowrap}
.cx-scentab th[scope=row]{width:34%}
.cx-scentab td:last-child{width:42%}
.cx-scen1 th[scope=row]{width:20%}
.cx-scen1 td:last-child{width:36%}
.cx-scentab tr.is-flat th{color:var(--signal)}
.cx-scen__notes{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:6px}
.cx-scen__notes li{position:relative;padding-left:16px;font-size:13.5px;line-height:1.6;color:var(--on-night-2)}
.cx-scen__notes li::before{content:"";position:absolute;left:0;top:9px;width:5px;height:5px;background:var(--on-night-2)}
@media (max-width:900px){.cx-pds{grid-template-columns:minmax(0,1fr)}.cx-pds__viz{order:-1}}

/* ---------- cost bar, packages ---------- */
.cx-costbar{list-style:none;margin:0 0 clamp(28px,3vw,44px);padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px}
.cx-costbar li{display:flex;flex-direction:column;gap:10px;min-width:0;padding:0 2px}
.cx-costbar li::before{content:"";height:10px;border-radius:2px;background:var(--brand)}
.cx-costbar li.is-dep::before{background:var(--sprout)}
.cx-costbar li.is-opt::before{background:repeating-linear-gradient(135deg,var(--rule-2) 0 2px,transparent 2px 6px);box-shadow:inset 0 0 0 1px var(--rule-2)}
.cx-costbar b{font-size:15px;line-height:1.35;font-weight:600}
.cx-costbar small{font-size:13px;line-height:1.5;color:var(--ink-2)}
.cx-need{align-self:flex-start;padding:4px 6px;border:1px dashed var(--ink-2);border-radius:var(--r-xs);font:500 11.5px/1 var(--font-mono);color:var(--ink-2);white-space:nowrap}
.cx-need.is-must{border-style:solid;border-color:var(--ink);color:var(--ink)}
@media (max-width:900px){.cx-costbar{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:20px}}
@media (max-width:520px){.cx-costbar{grid-template-columns:repeat(2,minmax(0,1fr))}}
.cx-costnotes{margin-top:18px}
.cx-quote{margin-top:22px;margin-bottom:0}
.cx-quote p{font-size:15.5px;line-height:1.7;color:var(--ink-2)}

/* ---------- programs: wide DSA card over three domestic cards ---------- */
.sol-cx .prog-grid.cx-proggrid{grid-template-columns:repeat(3,minmax(0,1fr))}
.prog--wide{grid-column:1 / -1}
.cx-prog__lead{font-size:15px;line-height:1.7;color:var(--ink-2)}
.prog__top .chip{font-size:11.5px}
.prog__foot .text-link{font-size:14px}
@media (min-width:901px){.prog--wide dl{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(20px,3vw,44px)}}
@media (max-width:1100px){.sol-cx .prog-grid.cx-proggrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:900px){.sol-cx .prog-grid.cx-proggrid{grid-template-columns:minmax(0,1fr)}}

/* ---------- Tier-1 cascade: supplier chain card, data principles ---------- */
.cx-casc .steps__body h4{padding-top:8px;font-size:clamp(19px,1.6vw,23px);line-height:1.35;letter-spacing:-.018em}
.cx-casc__side{display:grid;gap:var(--gap);min-width:0}
.cx-chain{margin:0;padding:clamp(20px,2.4vw,30px);border-radius:var(--r-m);border:1px solid rgba(234,242,236,.14)}
.cx-chain__t{font:500 12px/1.3 var(--font-mono);color:var(--signal);word-spacing:-.25em;margin-bottom:18px}
.cx-chain__list{list-style:none;margin:0;padding:0;display:grid;gap:42px}
.cx-tier{position:relative;padding:14px 16px;border:1px solid rgba(234,242,236,.2);border-radius:var(--r-m);background:rgba(10,42,30,.9)}
.cx-tier b{display:block;font-size:16px;line-height:1.4;font-weight:600}
.cx-tier > span:not(.cx-tier__up){display:block;margin-top:4px;font-size:14px;line-height:1.6;color:var(--on-night-2)}
.cx-tier.is-you{border-color:var(--signal);background:rgba(15,54,38,.96)}
.cx-tier__up{position:absolute;left:22px;bottom:100%;height:42px;display:flex;align-items:center;padding-left:12px;border-left:1.5px dashed var(--signal);font:500 11.5px/1.2 var(--font-mono);color:var(--signal);word-spacing:-.2em;white-space:nowrap}
.cx-pdslink{display:inline-flex;margin-top:10px;font:500 12px/1.3 var(--font-mono);color:var(--signal);text-decoration:none;border-bottom:1px solid rgba(191,234,98,.5);word-spacing:-.2em}
.cx-pdslink:hover{border-bottom-color:var(--signal)}
.cx-chain figcaption{margin-top:20px;padding-top:14px;border-top:1px solid rgba(234,242,236,.14);font-size:14px;line-height:1.7;color:var(--on-night-2)}
.cx-principles{padding:clamp(18px,2vw,26px);border:1.5px solid var(--night);border-radius:var(--r-m);background:var(--card)}
.cx-principles h3{font-size:clamp(18px,1.5vw,21px);letter-spacing:-.018em}
.cx-principles ul{list-style:none;margin:12px 0 0;padding:0}
.cx-principles li{position:relative;padding:12px 0 12px 22px;border-top:1px solid var(--rule);font-size:15px;line-height:1.65}
.cx-principles li::before{content:"";position:absolute;left:0;top:20px;width:8px;height:8px;background:var(--brand)}
.cx-casc__more{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px 28px;align-items:center;margin-top:clamp(28px,3vw,40px);padding-top:22px;border-top:1px solid var(--rule-2)}
.cx-casc__more p{font-size:15px;line-height:1.75;color:var(--ink-2)}
.cx-casc__more p + p{margin-top:6px}
.cx-slot{display:inline-flex;margin-right:10px;padding:6px 8px;border:1px dashed var(--ink-2);border-radius:var(--r-xs);font:500 12px/1 var(--font-mono);color:var(--ink-2);word-spacing:-.25em;vertical-align:middle}
@media (max-width:900px){.cx-casc__more{grid-template-columns:minmax(0,1fr)}.cx-casc__more .btn{justify-self:start}}

/* ---------- IT·security (night band): architecture, spec tables, mini FAQ ---------- */
.cx-arch{margin:0 0 clamp(36px,4vw,56px);padding:clamp(18px,2.4vw,30px);border:1px solid rgba(234,242,236,.14);border-radius:var(--r-m);background:rgba(15,54,38,.6)}
.cx-arch__k{margin-bottom:14px;font:500 12px/1.3 var(--font-mono);color:var(--signal);word-spacing:-.25em}
.cx-arch__flow,.cx-arch__side{list-style:none;margin:0;padding:0;display:grid;gap:24px}
.cx-arch__flow{grid-template-columns:repeat(6,minmax(0,1fr))}
.cx-arch__side{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.cx-arch__flow li,.cx-arch__side li{position:relative;display:flex;flex-direction:column;gap:6px;min-width:0;padding:14px;border:1px solid rgba(234,242,236,.2);border-radius:var(--r-m);background:rgba(10,42,30,.9);font-size:13.5px;line-height:1.55;color:var(--on-night-2)}
.cx-arch__flow b,.cx-arch__side b{font-size:14.5px;line-height:1.4;font-weight:600;color:var(--on-night)}
.cx-arch__flow li.hl{border-color:var(--signal)}
.cx-arch__side li{border-style:dashed}
.cx-arch__flow li:not(:last-child)::after{content:"";position:absolute;left:100%;top:50%;width:24px;border-top:1.5px dashed var(--signal)}
.cx-arch__sub{margin-top:24px}
.cx-arch figcaption{margin-top:20px;padding-top:14px;border-top:1px solid rgba(234,242,236,.14);font-size:14.5px;line-height:1.7;color:var(--on-night-2);max-width:64em}
@media (max-width:1100px){.cx-arch__flow{grid-template-columns:repeat(3,minmax(0,1fr))}.cx-arch__flow li:nth-child(3n)::after{display:none}}
@media (max-width:680px){
  .cx-arch__flow,.cx-arch__side{grid-template-columns:minmax(0,1fr)}
  .cx-arch__flow{gap:22px}
  .cx-arch__flow li:not(:last-child)::after{display:block;left:24px;top:100%;width:0;height:22px;border-top:0;border-left:1.5px dashed var(--signal)}
}
.cx-it-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--gap);align-items:start}
.cx-it-grid .table-src{margin-top:10px}
.dtable td.cx-srccell{white-space:nowrap;overflow-wrap:normal}
/* stacked comparison table (≤760px): keep its visible caption full width */
@media (max-width:1100px){.cx-it-grid{grid-template-columns:minmax(0,1fr)}}
.cx-itcta{display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px;margin-top:clamp(28px,3vw,40px)}
.cx-itcta .chip{border-style:dashed}

/* ---------- insights: 「발행 예정」 cards are not links ---------- */

/* ---------- page meta under the references ---------- */
.cx-pagemeta{display:grid;gap:8px;margin-top:clamp(28px,3vw,40px);padding-top:20px;border-top:1px solid var(--rule-2);font-size:13.5px;line-height:1.7;color:var(--ink-2);max-width:72em}
.cx-pagemeta b{margin-right:8px;font-weight:650;color:var(--ink)}

/* ---------- mobile CTA bar: never let a long label widen the page ---------- */
.sol-cx .mcta__set .btn{min-width:0;overflow:hidden}

/* English edition (2026-10-26) */
html[lang="en"] .cx-need{white-space:normal;line-height:1.25}
