/* =============================================================
   DOC 3 · Provisions- & Incentive-Blueprint
   Distinct visual system: TECHNICAL BLUEPRINT + GAUGE.
   Shares CI from base.css; adds graph-paper grid, gauge motif,
   ACID nodes, role/KPI tables, calc strips, %-rows, dos/donts.
   Mono numerals (IBM Plex Mono) give it the engineering feel.
   ============================================================= */
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600&display=swap');

:root{ --font-mono:"IBM Plex Mono","JetBrains Mono",ui-monospace,monospace; }

.motif{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden;}
.glow-top{position:absolute;z-index:1;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle, rgba(144,207,232,.28), transparent 68%);}

/* ---------- blueprint graph-paper grid (dark pages) ---------- */
.bpgrid{position:absolute;inset:0;z-index:1;pointer-events:none;
  background-image:
    linear-gradient(rgba(144,207,232,.10) 1px,transparent 1px),
    linear-gradient(90deg, rgba(144,207,232,.10) 1px,transparent 1px),
    linear-gradient(rgba(144,207,232,.045) 1px,transparent 1px),
    linear-gradient(90deg, rgba(144,207,232,.045) 1px,transparent 1px);
  background-size:24mm 24mm,24mm 24mm,6mm 6mm,6mm 6mm;}
.bpgrid.fade-bottom{-webkit-mask-image:linear-gradient(0deg,#000,transparent 60%);mask-image:linear-gradient(0deg,#000,transparent 60%);}
.bpgrid.fade-top{-webkit-mask-image:linear-gradient(180deg,#000,transparent 55%);mask-image:linear-gradient(180deg,#000,transparent 55%);}
/* corner ticks — engineering plate detail */
.tick{position:absolute;z-index:2;width:7mm;height:7mm;pointer-events:none;}
.tick::before,.tick::after{content:"";position:absolute;background:rgba(144,207,232,.5);}
.tick::before{left:0;top:0;width:7mm;height:1px;}
.tick::after{left:0;top:0;width:1px;height:7mm;}

/* ---------- gauge motif (cover) ---------- */
.gaugewrap{position:absolute;left:50%;top:30mm;transform:translateX(-50%);width:96mm;text-align:center;}
.gaugewrap svg{width:96mm;height:auto;overflow:visible;filter:drop-shadow(0 10px 30px rgba(12,133,180,.4));}

/* ---------- ACID node rail ---------- */
.acidrail{display:flex;align-items:center;justify-content:space-between;gap:0;width:100%;position:relative;}
.acidrail::before{content:"";position:absolute;left:6%;right:6%;top:50%;height:1px;background:rgba(255,255,255,.16);}
.acidrail .nd{position:relative;display:flex;flex-direction:column;align-items:center;gap:2mm;}
.acidrail .nd .dot{width:12mm;height:12mm;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-family:var(--font-display);font-size:15pt;color:#fff;background:rgba(10,10,10,1);border:1px solid rgba(144,207,232,.4);}
.acidrail .nd.on .dot{background:radial-gradient(circle,var(--ice),var(--blue));color:#001;border-color:var(--ice);box-shadow:0 0 18px 2px rgba(144,207,232,.5);}
.acidrail .nd .cap{font-family:var(--font-ui);font-weight:600;font-size:6.6pt;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.55);}

/* ============================================================
   ACID framework cards
   ============================================================ */
.acidcards{display:grid;grid-template-columns:repeat(4,1fr);gap:4mm;}
.acidcards .acd{position:relative;border:1px solid var(--rule);border-radius:10px;padding:6mm 5mm;overflow:hidden;display:flex;flex-direction:column;
  background:radial-gradient(ellipse 120% 60% at 50% 0, rgba(144,207,232,.18), transparent 70%), #fff;}
.acidcards .acd .L{font-family:var(--font-display);font-weight:400;font-size:34pt;line-height:.9;letter-spacing:-0.04em;color:var(--accent-deep);}
.acidcards .acd .nm{font-family:var(--font-sans);font-weight:600;font-size:10pt;letter-spacing:-0.02em;color:#000;margin:3mm 0 2mm;}
.acidcards .acd .d{font-family:var(--font-sans);font-size:8.4pt;line-height:1.45;color:var(--ink-60);margin-top:auto;}

/* ---------- role / KPI table ---------- */
.rtable{border:1px solid var(--rule);border-radius:10px;overflow:hidden;}
.rtable .rr{display:grid;grid-template-columns:46mm 1fr;border-top:1px solid var(--rule);}
.rtable .rr:first-child{border-top:none;}
.rtable .rr .role{padding:4mm 6mm;font-family:var(--font-sans);font-weight:600;font-size:9.6pt;letter-spacing:-0.02em;color:#000;background:#F7F6F3;display:flex;align-items:center;}
.rtable .rr .kpi{padding:4mm 6mm;font-family:var(--font-mono);font-size:8.2pt;line-height:1.6;color:var(--ink-70);letter-spacing:-0.02em;}
.rtable .rr .kpi b{color:var(--accent-deep);font-weight:600;}

/* ---------- calc strip (mono) ---------- */
.calc{display:flex;align-items:stretch;gap:0;border:1px solid var(--rule);border-radius:10px;overflow:hidden;flex-wrap:wrap;}
.calc .c{flex:1;min-width:34mm;padding:5mm;border-left:1px solid var(--rule);display:flex;flex-direction:column;gap:1.5mm;}
.calc .c:first-child{border-left:none;}
.calc .c .lab{font-family:var(--font-ui);font-weight:500;font-size:7pt;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-50);}
.calc .c .v{font-family:var(--font-mono);font-weight:500;font-size:14pt;letter-spacing:-0.02em;color:#000;}
.calc .c.hi{background:radial-gradient(ellipse 100% 100% at 50% 0,rgba(144,207,232,.22),transparent 70%),#fff;}
.calc .c.hi .v{color:var(--accent-deep);}
.calc .c .op{font-family:var(--font-mono);color:var(--grey-350);font-size:11pt;}

/* ---------- ratio block (4:1) ---------- */
.ratio{display:flex;align-items:center;gap:7mm;padding:6mm 8mm;border-radius:10px;
  background:linear-gradient(115deg,var(--deep),var(--blue-d));color:#fff;position:relative;overflow:hidden;}
.ratio::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px);background-size:8mm 8mm;}
.ratio .big{position:relative;font-family:var(--font-mono);font-weight:600;font-size:34pt;letter-spacing:-0.03em;color:var(--ice);white-space:nowrap;}
.ratio .tx{position:relative;font-size:9.4pt;line-height:1.5;color:rgba(255,255,255,.85);}
.ratio .tx b{color:#fff;}

/* ---------- incentive %-per-role ---------- */
.pctgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:4mm;}
.pctgrid .pc{position:relative;border:1px solid var(--rule);border-radius:10px;padding:5mm 6mm;overflow:hidden;
  background:radial-gradient(ellipse 100% 80% at 100% 0,rgba(144,207,232,.16),transparent 60%),#fff;}
.pctgrid .pc .top{display:flex;align-items:baseline;justify-content:space-between;gap:4mm;margin-bottom:2mm;}
.pctgrid .pc .role{font-family:var(--font-sans);font-weight:600;font-size:10.5pt;letter-spacing:-0.02em;color:#000;}
.pctgrid .pc .pct{font-family:var(--font-mono);font-weight:600;font-size:18pt;letter-spacing:-0.03em;color:var(--accent-deep);white-space:nowrap;}
.pctgrid .pc .d{font-size:8.5pt;line-height:1.45;color:var(--ink-60);}

/* ---------- industries check (DB bars) ---------- */
.industries{display:flex;flex-direction:column;gap:2.5mm;}
.industries .ind{display:grid;grid-template-columns:54mm 1fr auto;gap:5mm;align-items:center;padding:3mm 6mm;border:1px solid var(--rule);border-radius:8px;background:#fff;}
.industries .ind .nm{font-family:var(--font-sans);font-weight:500;font-size:9.4pt;letter-spacing:-0.02em;color:#000;}
.industries .ind .bar{height:5mm;border-radius:3px;background:var(--grey-150);position:relative;overflow:hidden;}
.industries .ind .bar i{position:absolute;left:0;top:0;bottom:0;border-radius:3px;background:linear-gradient(90deg,var(--ice),var(--blue));}
.industries .ind .db{font-family:var(--font-mono);font-size:8.6pt;color:var(--accent-deep);white-space:nowrap;}

/* ---------- dos / donts ---------- */
.dd{display:grid;grid-template-columns:1fr 1fr;gap:6mm;align-items:start;}
.ddcol{border:1px solid var(--rule);border-radius:10px;overflow:hidden;}
.ddcol .hd{padding:4mm 6mm;font-family:var(--font-ui);font-weight:600;font-size:8.5pt;letter-spacing:.1em;text-transform:uppercase;display:flex;align-items:center;gap:3mm;}
.ddcol.no .hd{background:#F3F1EE;color:var(--grey-600);}
.ddcol.yes .hd{background:#E7F3F8;color:var(--accent-deep);}
.ddcol .li{padding:3mm 6mm;border-top:1px solid var(--rule-faint);font-size:9pt;line-height:1.4;color:var(--ink-78);display:grid;grid-template-columns:6mm 1fr;gap:2mm;align-items:start;}
.ddcol .li:first-of-type{border-top:none;}
.ddcol .li .mk{width:5mm;height:5mm;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-top:.2mm;}
.ddcol.no .li .mk{background:#EDEBE7;color:var(--grey-500);}
.ddcol.yes .li .mk{background:radial-gradient(circle,#fff,#E0EFF5);border:1px solid rgba(23,150,201,.25);}
.ddcol .li .mk svg{width:11px;height:11px;stroke-width:2.4;fill:none;}
.ddcol.no .li .mk svg{stroke:var(--grey-500);}
.ddcol.yes .li .mk svg{stroke:var(--accent-deep);}

/* rule callout (Auszahlungsregel) */
.rulecard{position:relative;border-radius:10px;overflow:hidden;padding:6mm 7mm;color:#fff;
  background:linear-gradient(160deg,#0A0A0A 0%, var(--sky-900) 130%);}
.rulecard::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(144,207,232,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(144,207,232,.07) 1px,transparent 1px);background-size:7mm 7mm;}
.rulecard .lbl{position:relative;font-family:var(--font-ui);font-weight:600;font-size:7.5pt;letter-spacing:.16em;text-transform:uppercase;color:var(--ice);margin-bottom:3mm;display:inline-flex;gap:7px;align-items:center;}
.rulecard .lbl .dot{width:6px;height:6px;border-radius:50%;background:var(--ice);}
.rulecard .txt{position:relative;font-family:var(--font-display);font-weight:400;font-size:16pt;line-height:1.22;letter-spacing:-0.02em;}
.rulecard .txt em{font-style:italic;color:var(--ice);}
.rulecard .sub{position:relative;margin-top:3mm;font-size:8.8pt;line-height:1.5;color:rgba(255,255,255,.72);}