:root{
  --ink:#14171B;--charcoal:#2E3338;--blue:#1C75BC;--blue-deep:#0E4C82;--blue-soft:#E8F1FA;
  --red:#D11F2A;--red-deep:#9B1C1C;--amber:#B7791F;--amber-soft:#FBF1E0;--paper:#FFFFFF;--fog:#F5F7F9;--line:#E4E8EC;--mute:#5C646D;--mute2:#8A929B;
  --A4:794px;--pad:54px;--ease:cubic-bezier(.2,.7,.2,1);--ccf-green:#A6D957;--ccf-green-d:#8CBE3F;--ccf-black:#0A0C0B;--bk-line:rgba(255,255,255,.12);font-synthesis:none;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;font-family:var(--font-display)}
body{font-family:var(--font-display);color:var(--ink);background:#5b626b;line-height:1.5;-webkit-font-smoothing:antialiased}
.doc{width:var(--A4);margin:0 auto;background:var(--paper);box-shadow:0 0 40px rgba(0,0,0,.35)}
h1,h2,h3,h4,h5{font-family:var(--font-display);letter-spacing:-.02em;line-height:1.08;font-weight:700}
.wrap{padding:0 var(--pad)}
a{color:var(--blue);text-decoration:none}
.eyebrow{font-family:var(--font-tech);font-size:11.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--blue)}
.eyebrow.od{color:#7FB6E6}
section{padding:38px 0}
.muted{color:var(--mute)}
.brk{break-before:page}
nav{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
nav .in{display:flex;align-items:center;justify-content:space-between;height:54px;padding:0 var(--pad)}
nav img{height:26px}
.nl{display:flex;gap:14px;font-size:12px;font-weight:600;flex-wrap:wrap}
.nl a{color:var(--charcoal)}.nl a:hover{color:var(--blue)}
.shead{margin-bottom:24px}
.shead h2{font-size:29px;margin:10px 0 12px}
.shead p{font-size:14.5px;color:var(--mute);max-width:62ch}
.alt{background:var(--fog)}
.dark{background:var(--ink);color:#fff}
.dark .shead p,.dark .muted{color:#AEB7C0}.dark h2,.dark h3,.dark h4,.dark h5{color:#fff}

.cover{background:linear-gradient(160deg,#0C1014,#161D24 55%,#0E2740);color:#fff;padding:64px 0 58px;position:relative;overflow:hidden}
.cover h1{font-size:74px;font-weight:800;margin:14px 0 0;line-height:.98}.cover h1 .ac{color:#4FA3E3}
.cover .sub{font-size:18px;color:#C6D2DC;max-width:46ch;margin-top:20px;line-height:1.4}
.cover .tag{display:inline-flex;align-items:center;gap:10px;margin-top:30px;font-family:var(--font-tech);font-weight:400;font-size:14px;letter-spacing:.02em}
.cover .tag .dot{width:9px;height:9px;border-radius:50%;background:#4FA3E3;box-shadow:0 0 0 5px rgba(79,163,227,.18)}
.pills{display:flex;gap:8px;flex-wrap:wrap;margin-top:26px}
.pill{border:1px solid rgba(255,255,255,.22);color:#C6D2DC;border-radius:999px;padding:6px 12px;font-size:11px;font-weight:500}
.coverby{position:absolute;bottom:20px;left:var(--pad);font-size:11px;color:#7c8794;letter-spacing:.04em}
.ap{position:absolute;right:-90px;top:46%;transform:translateY(-50%);width:360px;height:360px;opacity:.5}

.intro2{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:6px}
.ic{border:1px solid var(--line);border-radius:13px;padding:18px 20px;background:#fff}
.ic .k{font-family:var(--font-tech);font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--blue);margin-bottom:6px}
.ic p{font-size:13px;color:var(--charcoal);line-height:1.45}

.steps{display:flex;flex-direction:column;gap:10px}
.step{display:grid;grid-template-columns:auto 1fr;gap:16px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:15px 18px}
.step .sn{font-family:var(--font-display);font-weight:800;font-size:20px;color:var(--blue)}
.step h4{font-size:14.5px;margin-bottom:3px}.step p{font-size:12.5px;color:var(--mute)}
.mband{display:grid;grid-template-columns:auto 1fr;gap:22px;align-items:center;margin:22px 0;background:#0C1014;border-radius:16px;padding:22px}
.mband img{width:88px;border-radius:6px}
.mband h4{color:#fff;font-size:16px;margin-bottom:6px}.mband p{font-size:12.5px;color:#AEB7C0}
.mband .lin{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:10px;font-family:var(--font-tech);font-size:11px;font-weight:600;color:#7FB6E6}
.cases{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:6px}
.case{border:1px solid var(--line);border-radius:11px;padding:13px 16px;background:#fff;font-size:13px;color:var(--charcoal)}
.case b{color:var(--blue-deep);font-family:var(--font-display)}
.mxcap{font-family:var(--font-tech);font-size:13px;font-weight:700;color:var(--charcoal);margin:18px 0 2px}
.mxsub{font-size:12.5px;color:var(--mute);margin-bottom:6px}
.syn{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:6px}
.syc{border:1px solid var(--line);border-radius:10px;padding:12px 14px;background:#fff;font-size:12.5px}
.syc .sn2{font-family:var(--font-display);font-weight:600;color:var(--charcoal);font-size:13.5px}
.syc.hit{border-color:var(--blue);background:var(--blue-soft)}.syc.hit .sn2{color:var(--blue-deep)}
.syc .fl{display:inline-block;margin-top:4px;font-size:10px;font-weight:700;font-family:var(--font-tech);letter-spacing:.06em;color:var(--blue)}
.arc{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:6px}
.as{border-radius:12px;padding:15px;color:#fff}.as .pc{font-family:var(--font-tech);font-weight:700;font-size:11px;opacity:.8}
.as h4{font-size:14px;margin:6px 0 4px}.as p{font-size:12px;opacity:.92;line-height:1.4}
.as.d1{background:#7a1d22}.as.d2{background:var(--blue-deep)}.as.d3{background:var(--blue)}.as.d4{background:var(--charcoal)}

.two{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.lcard{border:1px solid var(--line);border-radius:14px;padding:22px}
.lcard.bad{border-color:#F2D2D2;background:linear-gradient(180deg,#FEF5F5,#fff)}
.lcard.good{border-color:#CFE3F4;background:linear-gradient(180deg,#F3F8FD,#fff)}
.lcard .tw{font-family:var(--font-tech);font-weight:700;font-size:11px;letter-spacing:.12em;text-transform:uppercase}
.bad .tw{color:var(--red)}.good .tw{color:var(--blue)}
.lcard h3{font-size:17px;margin:4px 0 12px}
.lcard ul{list-style:none;display:flex;flex-direction:column;gap:9px}
.lcard li{font-size:13px;color:var(--charcoal);padding-left:14px;position:relative;line-height:1.4}
.lcard li::before{content:"";position:absolute;left:0;top:7px;width:6px;height:6px;border-radius:50%}
.bad li::before{background:var(--red)}.good li::before{background:var(--blue)}

.frm{display:flex;align-items:center;justify-content:center;gap:10px;font-family:var(--font-display);font-weight:700;font-size:20px;margin-bottom:24px;flex-wrap:wrap}
.frm .ct{color:var(--charcoal)}.frm .ms{color:var(--red)}.frm .in{color:var(--blue)}.frm .fx{color:var(--mute2)}
.cols{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.col{border:1px solid var(--line);border-radius:13px;padding:18px;background:#fff}
.col .lab{font-family:var(--font-tech);font-weight:700;font-size:12px;display:flex;align-items:center;gap:8px;margin-bottom:12px}
.col .lab .n{width:21px;height:21px;border-radius:6px;display:grid;place-items:center;color:#fff;font-size:11px}
.col.ctx .lab{color:var(--charcoal)}.col.ctx .n{background:var(--charcoal)}
.col.mis .lab{color:var(--red)}.col.mis .n{background:var(--red)}
.col.inn .lab{color:var(--blue)}.col.inn .n{background:var(--blue)}
.col ul{list-style:none;display:flex;flex-direction:column;gap:9px}
.col li{font-size:12px;color:var(--charcoal);padding-left:13px;position:relative;line-height:1.38}
.col li::before{content:"";position:absolute;left:0;top:7px;width:5px;height:5px;border-radius:2px;background:currentColor;opacity:.5}
.fline{text-align:center;margin-top:24px;font-size:15px;color:var(--charcoal);max-width:66ch;margin-inline:auto}.fline b{color:var(--blue)}

.rules{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.rule{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.13);border-radius:13px;padding:18px}
.rule .rn{font-family:var(--font-display);font-weight:800;font-size:24px;color:#4FA3E3}
.rule h4{font-size:15px;margin:8px 0 6px}.rule p{font-size:12.5px;color:#AEB7C0;line-height:1.45}

.trio{display:flex;flex-direction:column;gap:14px}
.asset{border:1px solid var(--line);border-radius:14px;padding:20px;background:#fff}
.asset .t{font-family:var(--font-tech);font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--mute2);margin-bottom:6px}
.asset h3{font-size:19px;margin-bottom:6px}.asset.villain h3{color:var(--red)}.asset.thing h3{color:var(--blue)}
.asset p{font-size:13.5px;color:var(--mute)}
.mb{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.mb span{background:var(--blue-soft);color:var(--blue-deep);font-weight:600;font-size:12px;padding:5px 10px;border-radius:7px}

.mxwrap{display:grid;grid-template-columns:16px 1fr;gap:8px;margin-top:10px}
.mxY{writing-mode:vertical-rl;transform:rotate(180deg);display:flex;align-items:center;justify-content:space-between;font-family:var(--font-tech);font-size:9.5px;font-weight:700;color:var(--mute);letter-spacing:.03em;text-transform:uppercase}
.mxmain{display:flex;flex-direction:column;gap:7px}
.mxgrid{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto auto;gap:6px}
.q{border:1px solid var(--line);border-radius:10px;padding:12px;background:#fff;min-height:118px}
.q .ql{font-family:var(--font-tech);font-size:9.5px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;color:var(--mute2);margin-bottom:8px;display:block}
.q.odin{background:var(--blue-soft);border:1.5px solid var(--blue)}.q.odin .ql{color:var(--blue-deep)}
.chip2{display:inline-flex;align-items:center;gap:6px;font-family:var(--font-display);font-size:11px;font-weight:600;color:var(--charcoal);background:var(--fog);border:1px solid var(--line);border-radius:6px;padding:3px 8px;margin:0 4px 4px 0}
/* square greyscale mark inside competitive chip */
.chip2 .wlogo{width:14px;height:14px;max-width:14px;border-radius:3px;object-fit:contain}
.chip2.me{background:var(--blue);color:#fff;border-color:var(--blue);font-family:var(--font-display)}
.mxX{display:flex;justify-content:space-between;font-family:var(--font-tech);font-size:9.5px;font-weight:700;color:var(--mute);letter-spacing:.03em;text-transform:uppercase;padding:0 2px}

.angles{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:6px}
.ang{border:1px solid var(--line);border-radius:11px;padding:14px 16px;background:#fff}
.ang .ah{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:4px}
.ang h4{font-size:14px}.ang p{font-size:12.5px;color:var(--mute)}
.ang .pl{font-family:var(--font-tech);font-size:9px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;padding:3px 7px;border-radius:999px;white-space:nowrap}
.pl.sc{background:var(--blue);color:#fff}.pl.set{background:var(--fog);color:var(--mute);border:1px solid var(--line)}.pl.wn{background:#0E4C82;color:#fff}

.score{width:100%;border-collapse:collapse;font-size:13px;background:#fff;border:1px solid var(--line);border-radius:13px;overflow:hidden}
.score th,.score td{padding:10px;text-align:center;border-bottom:1px solid var(--line)}
.score th:first-child,.score td:first-child{text-align:left;color:var(--charcoal);font-size:12.5px}
.score thead th{font-family:var(--font-tech);font-size:12px;font-weight:700;background:var(--fog)}
.score .win{background:var(--blue-soft)}.score thead .win{background:var(--blue);color:#fff}
.score .tot td{font-weight:800;font-family:var(--font-display);font-size:14px;border-top:2px solid var(--ink);border-bottom:none}.score .tot .win{color:var(--blue-deep)}
.sv{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:7px;font-weight:600;font-family:var(--font-display);font-size:12px}
.s5{background:#1C75BC;color:#fff}.s4{background:#7FB6E6;color:#0E2740}.s3{background:#D8E6F2;color:#0E4C82}.s2{background:#F7DDDD;color:#9B1C1C}
.chip{display:inline-block;margin-top:14px;background:var(--ink);color:#fff;font-family:var(--font-display);font-weight:600;font-size:13px;padding:9px 16px;border-radius:999px}.chip b{color:#7FB6E6}
.crit{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:14px}
.cc{border:1px solid var(--line);border-radius:12px;padding:15px;background:#fff}
.cc h4{font-size:14px;display:flex;gap:8px;align-items:center;margin-bottom:6px}
.cc h4 .ax{font-family:var(--font-tech);font-size:10px;font-weight:700;color:#fff;background:var(--blue);border-radius:5px;padding:2px 7px}
.cc p{font-size:12.5px;color:var(--mute);margin-bottom:7px}
.cc .why{font-size:12px;color:var(--charcoal);background:var(--fog);border-radius:7px;padding:9px 11px;line-height:1.45}.cc .why b{color:var(--blue-deep)}

.tk{display:flex;flex-direction:column;gap:14px;margin-top:6px}
.tb{border:1px solid var(--line);border-radius:14px;padding:20px}
.tb.taken{background:linear-gradient(180deg,#FDF3F3,#fff);border-color:#F2D5D5}.tb.open{background:linear-gradient(180deg,#F1F8FD,#fff);border-color:#CFE3F4}
.tb h3{font-size:16px;margin-bottom:4px}.taken h3{color:var(--red)}.open h3{color:var(--blue)}
.phr{display:flex;flex-wrap:wrap;gap:7px;margin-top:12px}
.p{font-size:12px;padding:5px 11px;border-radius:999px;font-weight:500}
.taken .p{background:#fff;border:1px solid #F0D3D3;color:var(--red-deep);text-decoration:line-through;text-decoration-color:rgba(209,31,42,.5)}
.open .p{background:var(--blue);color:#fff}.open .p.ld{box-shadow:0 5px 14px rgba(28,117,188,.35)}
.lw{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
.br{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;width:118px;height:82px;border:1px solid var(--line);border-radius:12px;background:#fff;padding:10px;text-align:center}
.br img{max-height:26px;max-width:90px;object-fit:contain;filter:grayscale(1);opacity:.82}
.br .bn{font-family:var(--font-display);font-size:10.5px;font-weight:600;color:var(--mute)}.br .cl{font-size:9.5px;color:var(--mute2);line-height:1.25}
.lgtext{font-family:var(--font-display);font-weight:700;font-size:12px;color:var(--charcoal)}

.cards{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.ccd{border:1px solid var(--line);border-radius:13px;padding:16px;background:#fff;display:flex;flex-direction:column;gap:6px}
.ccd .tp{display:flex;align-items:center;gap:9px;min-height:28px}
/* white official mark on a dark tile, beside the brand name (winner-card treatment) */
.ccd .tp img{width:34px;height:34px;max-width:34px;object-fit:contain;padding:7px;border-radius:7px;background:#14171B;filter:brightness(0) invert(1)}
.ccd .tp .wname{font-family:var(--font-display);font-weight:700;font-size:14px;letter-spacing:-.01em;color:var(--ink);line-height:1.1}
.ccd .co{font-size:11px;font-weight:600;color:var(--mute)}

/* greyscale company / product logos, method-deck treatment.
   Clearbit logo with a Google-favicon fallback; lgErr() swaps to favicon, then to a text mark. */
.wlogo{height:18px;width:auto;max-width:104px;object-fit:contain;filter:grayscale(1) contrast(1.05);opacity:.92;mix-blend-mode:multiply;vertical-align:middle}
/* on dark sections multiply fails; invert + brighten keeps the greyscale mark legible light-on-dark */
.dark .wlogo,.book .wlogo,.pov .wlogo,.cover .wlogo,.subhero .wlogo{
  mix-blend-mode:normal;filter:grayscale(1) brightness(0) invert(1) opacity(.85)}
/* small inline logo chip: greyscale mark + name, sits in matrix quadrants and the naming board */
.lchip{display:inline-flex;align-items:center;gap:7px;background:var(--fog);border:1px solid var(--line);border-radius:6px;padding:3px 9px 3px 7px;margin:0 4px 4px 0;font-family:var(--font-display);font-size:11px;font-weight:600;color:var(--charcoal);vertical-align:middle}
.lchip .wlogo{width:14px;height:14px;max-width:14px;border-radius:3px;object-fit:contain}
.br .wlogo{width:24px;height:24px;max-width:24px;border-radius:4px;object-fit:contain;margin-bottom:2px}
.bench-logo .logo-mark{
  flex:none;
  width:24px;
  height:24px;
  display:grid;
  place-items:center;
  font-family:var(--font-display);
  font-weight:800;
  font-size:10px;
  line-height:1;
}
.bench-logo .logo-text{
  border:1px solid var(--line);
  color:var(--charcoal);
  padding:5px 8px;
  font-family:var(--font-display);
  font-size:13px;
  font-weight:800;
  line-height:1;
  background:#fff;
}
.bench-logo.logo-guidewheel .logo-mark{
  border-radius:50%;
  border:2px solid #0B406F;
  box-shadow:inset 0 0 0 5px #9CD5F5;
  background:#fff;
}
.bench-logo.logo-guidewheel .logo-text{color:#0B406F}
.bench-logo.logo-linkedin .logo-mark{
  background:#0A66C2;
  color:#fff;
  border-radius:4px;
  align-items:end;
  padding-bottom:4px;
  font-size:13px;
}
.bench-logo.logo-linkedin .logo-text{color:#0A66C2}
.bench-logo.logo-salesforce .logo-mark{
  position:relative;
  width:31px;
  border-radius:999px;
  background:#2F9FEA;
}
.bench-logo.logo-salesforce .logo-mark::before,
.bench-logo.logo-salesforce .logo-mark::after{
  content:"";
  position:absolute;
  background:#2F9FEA;
  border-radius:50%;
}
.bench-logo.logo-salesforce .logo-mark::before{width:17px;height:17px;left:4px;top:-5px}
.bench-logo.logo-salesforce .logo-mark::after{width:19px;height:19px;right:2px;top:-6px}
.bench-logo.logo-salesforce .logo-text{color:#0B77BE}
.bench-logo.logo-samsara .logo-mark{
  border-radius:50%;
  color:#fff;
  background:#111418;
}
.bench-logo.logo-samsara .logo-text{color:#111418}
.bench-logo.logo-augury .logo-mark{
  border-radius:50%;
  color:#fff;
  background:#176FB5;
}
.bench-logo.logo-augury .logo-text{color:#176FB5}
.bench-logo.logo-bright .logo-mark{
  color:#0A0C0B;
  background:var(--ccf-green);
}
.bench-logo.logo-bright .logo-text{color:#252B31}
.ccd .cat{font-family:var(--font-display);font-weight:700;font-size:14px;color:var(--blue-deep)}
.ccd .r{font-size:12px;color:var(--mute)}.ccd .r b{color:var(--charcoal)}
.ccd .o{margin-top:auto;font-size:12px;font-weight:600;color:var(--blue);border-top:1px solid var(--line);padding-top:8px}

.pf{display:flex;gap:10px;justify-content:space-between;flex-wrap:wrap}
.st{text-align:center;flex:1;min-width:110px}
.st .b{font-family:var(--font-display);font-weight:800;font-size:32px;color:var(--blue)}.st .l{font-size:11.5px;color:var(--mute);margin-top:3px;line-height:1.3}
.cust{display:flex;flex-wrap:wrap;gap:20px;align-items:center;justify-content:center;margin-top:32px;opacity:.9}.cust img{height:22px;filter:grayscale(1);opacity:.7}
.cust .lgtext{border:1px solid var(--line);background:#fff;color:var(--charcoal);padding:7px 11px;font-size:12px;font-weight:800;line-height:1}

.opt{border:1px solid var(--line);border-radius:12px;padding:15px 18px;background:#fff;display:grid;grid-template-columns:1fr auto;gap:14px;align-items:center;margin-bottom:10px}
.opt h4{font-size:14.5px;margin-bottom:3px}.opt p{font-size:12.5px;color:var(--mute)}
.v{font-family:var(--font-tech);font-weight:700;font-size:10.5px;padding:5px 10px;border-radius:999px;white-space:nowrap;text-align:center}
.v.rej{background:#FDECEC;color:var(--red-deep)}.v.part{background:var(--amber-soft);color:var(--amber)}.v.win{background:var(--blue);color:#fff}

.alos{background:var(--ink);color:#fff;border-radius:18px;padding:30px}
.alos .eyebrow{color:#7FB6E6}.alos h3{color:#fff;font-size:24px;margin:10px 0 10px}.alos>p{color:#AEB7C0;font-size:14px;max-width:64ch}
.alos .ab{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:18px}
.alos .bx{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:18px}
.alos .bx.g{border-color:rgba(79,163,227,.5)}.alos .bx.b{border-color:rgba(209,31,42,.5)}
.alos .bx h5{font-family:var(--font-display);font-size:13px;margin-bottom:10px}.alos .bx.g h5{color:#7FB6E6}.alos .bx.b h5{color:#E98A8A}
.alos .bx ul{list-style:none;display:flex;flex-direction:column;gap:7px}
.alos .bx li{font-size:12.5px;color:#C6D2DC;padding-left:13px;position:relative;line-height:1.4}
.alos .bx li::before{content:"";position:absolute;left:0;top:7px;width:5px;height:5px;border-radius:50%}
.alos .bx.g li::before{background:#4FA3E3}.alos .bx.b li::before{background:var(--red)}
.alos .rs{margin-top:18px;background:rgba(79,163,227,.12);border:1px solid rgba(79,163,227,.4);border-radius:11px;padding:18px;font-size:13.5px;color:#E6ECF1;line-height:1.55}.alos .rs b{color:#fff}

.bd{display:flex;flex-direction:column;gap:12px}
.bdr{border:1px solid var(--line);border-top:4px solid var(--blue);border-radius:11px;padding:16px 20px;background:#fff}.bdr.ev{border-top-color:var(--red)}
.bdr .t2{font-family:var(--font-tech);font-weight:700;font-size:10px;letter-spacing:.08em;text-transform:uppercase;margin-bottom:5px;color:var(--blue)}.bdr.ev .t2{color:var(--red)}
.bdr h4{font-size:15px;margin-bottom:5px}.bdr p{font-size:13px;color:var(--mute)}
.bq{font-family:var(--font-display);font-weight:700;font-size:26px;line-height:1.25;color:#fff;max-width:24ch}.qa{color:#7FB6E6;font-size:13px;margin-top:14px;font-weight:500}

.pov{background:linear-gradient(170deg,#0C1014,#0E2740);color:#fff}
.povb{font-size:15.5px;line-height:1.6;color:#D7E0E8}.povb p{margin-bottom:16px}
.povb .turn{font-family:var(--font-display);font-weight:700;font-size:24px;color:#fff;margin:26px 0}.povb .end{font-family:var(--font-display);font-weight:700;font-size:24px;color:#4FA3E3;margin-top:8px}
.stack{display:flex;flex-direction:column;gap:11px}
.ly{border:1px solid var(--line);border-radius:12px;padding:15px 18px;background:#fff;display:flex;gap:14px}
.ly .k{font-family:var(--font-tech);font-weight:700;font-size:11px;color:var(--mute2);width:78px;flex:none;text-transform:uppercase;letter-spacing:.05em;padding-top:2px}.ly .vv{font-size:13.5px}.ly .vv b{color:var(--blue-deep)}
.next{list-style:none;counter-reset:n;display:flex;flex-direction:column;gap:11px;margin-top:20px}
.next li{counter-increment:n;display:flex;gap:12px;font-size:13.5px;color:var(--charcoal)}
.next li::before{content:counter(n);flex:none;width:25px;height:25px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;font-family:var(--font-display);font-weight:700;font-size:12px}

/* CONSIDERATIONS GRID */
.cgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:6px}
.gc{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#fff;display:flex;flex-direction:column;transition:transform .2s,box-shadow .2s}
.gc:hover{transform:translateY(-2px);border-color:#B9C7D2}
.gc .thumb{height:118px;background-size:cover;background-position:center top;border-bottom:1px solid var(--line)}
.gc .gcb{padding:15px 18px;display:flex;flex-direction:column;gap:5px}
.gc .gt{font-family:var(--font-tech);font-size:9.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--mute2)}
.gc h4{font-size:16px}.gc p{font-size:12.5px;color:var(--mute)}
.gc .go{margin-top:6px;font-family:var(--font-display);font-weight:600;font-size:12.5px;color:var(--blue)}

/* SUB-PAGE */
.subhero{background:linear-gradient(160deg,#0C1014,#0E2740);color:#fff;padding:50px 0 42px}
.subhero h1{font-size:40px;color:#fff;font-weight:800;margin:12px 0 12px;line-height:1.02}
.subhero p{font-size:15px;color:#C6D2DC;max-width:62ch;line-height:1.45}
.backlink{display:inline-flex;gap:7px;font-size:12.5px;color:#7FB6E6;font-weight:600;margin-bottom:6px}
.snap{border:1px solid var(--line);border-radius:10px;overflow:hidden;background:#fff;margin:0}
.snap img{display:block;width:100%}
.snap .cap{font-size:11.5px;color:var(--mute);padding:8px 12px;border-top:1px solid var(--line);background:var(--fog)}
.snaprow{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:8px}
.bq2{font-family:var(--font-display);font-weight:700;font-size:21px;line-height:1.3;color:var(--ink);border:1px solid var(--line);border-top:4px solid var(--blue);padding:18px 20px;margin:8px 0}
.bq2.red{border-top-color:var(--red)}

footer{background:#0C1014;color:#8A929B;padding:34px 0;font-size:11.5px}
footer .in{display:flex;justify-content:space-between;gap:18px;align-items:center;padding:0 var(--pad)}
footer img{height:22px}footer .r{text-align:right;max-width:46ch;line-height:1.5}

/* ===== METHOD: THE BOOK THEME (black + lime, matches The Category Creation Formula) ===== */
.book{background:var(--ccf-black);color:#D7E0E8}
.book .eyebrow{color:var(--ccf-green)}
.book .shead h2,.book h3,.book h4,.book h5{color:#fff}
.book .shead p,.book .muted{color:#AEB7C0}
.book .mxcap{color:#fff}
.book .mxsub{color:#AEB7C0}

/* book band + cases, lifted off the black */
.book .mband{background:rgba(255,255,255,.04);border:1px solid var(--bk-line)}
.book .mband .lin{color:var(--ccf-green)}
.book .case{background:rgba(255,255,255,.04);border-color:var(--bk-line);color:#C6D2DC}
.book .case b{color:var(--ccf-green)}

/* category vs product relationship map */
.relmap{border:1px solid var(--bk-line);border-radius:13px;overflow:hidden;background:rgba(255,255,255,.03);margin-top:10px}
.relmap .relhead,.relmap .relrow{display:grid;grid-template-columns:82px 1fr 18px 1.15fr;gap:10px;align-items:center;padding:11px 16px}
.relmap .relhead{background:rgba(166,217,87,.10);border-bottom:1px solid var(--bk-line);font-family:var(--font-tech);font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.relmap .relhead .ca{grid-column:2;color:var(--ccf-green)}
.relmap .relhead .pr{grid-column:4;color:#AEB7C0}
.relmap .relrow{border-bottom:1px solid var(--bk-line)}
.relmap .relrow:last-child{border-bottom:none}
.relmap .co2{font-family:var(--font-display);font-weight:700;font-size:12px;color:#fff}
.relmap .catc{justify-self:start;font-size:12.5px;font-weight:600;color:#0A0C0B;background:var(--ccf-green);border-radius:7px;padding:6px 11px}
.relmap .arr{text-align:center;color:var(--mute2);font-size:13px}
.relmap .prodc{justify-self:start;font-size:12.5px;color:#D7E0E8;background:rgba(255,255,255,.06);border:1px solid var(--bk-line);border-radius:7px;padding:6px 11px}
.relmap .relrow.odin{background:rgba(166,217,87,.09)}
.relmap .relrow.odin .prodc{border-color:var(--ccf-green);color:#fff}
.relnote{font-size:12.5px;color:#AEB7C0;line-height:1.55;margin-top:10px;max-width:72ch}
.relnote b{color:var(--ccf-green);font-family:var(--font-display);font-weight:600}

/* expandable full process */
details.mfull{margin-top:20px;border:1px solid var(--bk-line);border-radius:13px;background:rgba(255,255,255,.03);overflow:hidden}
details.mfull>summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:16px 18px}
details.mfull>summary::-webkit-details-marker{display:none}
details.mfull>summary .sm{font-family:var(--font-display);font-weight:700;font-size:14.5px;color:#fff}
details.mfull>summary .sm small{display:block;font-family:Inter,sans-serif;font-weight:500;font-size:11.5px;color:#AEB7C0;margin-top:3px;letter-spacing:0;text-transform:none}
details.mfull>summary .chev{flex:none;width:30px;height:30px;border-radius:50%;border:1px solid var(--ccf-green);color:var(--ccf-green);display:grid;place-items:center;font-size:13px;transition:transform .2s,background .2s}
details.mfull[open]>summary .chev{transform:rotate(180deg);background:rgba(166,217,87,.14)}
details.mfull[open]>summary{border-bottom:1px solid var(--bk-line)}
details.mfull .mbody{padding:6px 18px 22px}
details.mfull .mbody>.mxcap:first-child{margin-top:14px}

/* book-themed inner components */
.book .step{background:rgba(255,255,255,.04);border-color:var(--bk-line)}
.book .step .sn{color:var(--ccf-green)}
.book .step p{color:#AEB7C0}
.book .syc{background:rgba(255,255,255,.04);border-color:var(--bk-line);color:#C6D2DC}
.book .syc .sn2{color:#fff}
.book .syc.hit{border-color:var(--ccf-green);background:rgba(166,217,87,.10)}
.book .syc.hit .sn2{color:var(--ccf-green)}
.book .syc .fl{color:var(--ccf-green)}
.book .as.d2{background:#3f5f1c}.book .as.d3{background:#5d8a24}.book .as.d4{background:#23282b}
.book .lcard{background:rgba(255,255,255,.04);border-color:var(--bk-line)}
.book .lcard.good{border-color:rgba(166,217,87,.45);background:rgba(166,217,87,.06)}
.book .lcard.good .tw{color:var(--ccf-green)}
.book .lcard h3{color:#fff}
.book .lcard li{color:#C6D2DC}
  .book .lcard.good li::before{background:var(--ccf-green)}

  .method-source{margin-top:0;margin-bottom:30px}
  .method-wins{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:1px;
    border:1px solid var(--bk-line);
    background:var(--bk-line);
    margin-top:12px;
  }
  .method-win{
    background:rgba(255,255,255,.045);
    padding:clamp(18px,2vw,24px);
    min-height:190px;
  }
  .method-logo{
    height:38px;
    display:flex;
    align-items:center;
    gap:10px;
    margin-bottom:20px;
  }
  .method-logo .logo-mark{
    flex:none;
    width:34px;
    height:34px;
    display:grid;
    place-items:center;
    font-family:var(--font-display);
    font-weight:800;
    font-size:14px;
    line-height:1;
  }
  .method-logo .logo-text{
    width:max-content;
    max-width:calc(100% - 44px);
    border:1px solid rgba(255,255,255,.18);
    background:rgba(255,255,255,.055);
    color:#fff;
    padding:8px 11px;
    font-family:var(--font-display);
    font-size:18px;
    font-weight:800;
    letter-spacing:0;
    line-height:1;
  }
  .method-logo.logo-guidewheel .logo-mark{
    border-radius:50%;
    border:3px solid #A7D8F7;
    box-shadow:inset 0 0 0 6px #2D5669;
    background:#101923;
  }
  .method-logo.logo-guidewheel .logo-text{color:#F2F6F8}
  .method-logo.logo-linkedin .logo-mark{
    background:#0A66C2;
    color:#fff;
    border-radius:4px;
    align-items:end;
    padding-bottom:5px;
    font-size:18px;
  }
  .method-logo.logo-linkedin .logo-text{color:#6BB7F2}
  .method-logo.logo-predictive .logo-mark{
    border:1px solid rgba(255,255,255,.32);
    color:#0A0C0B;
    background:var(--ccf-green);
  }
  .method-logo.logo-predictive .logo-text{color:#E7EEF5}
  .method-logo.logo-salesforce .logo-mark{
    position:relative;
    width:42px;
    border-radius:999px;
    background:#2F9FEA;
  }
  .method-logo.logo-salesforce .logo-mark::before,
  .method-logo.logo-salesforce .logo-mark::after{
    content:"";
    position:absolute;
    background:#2F9FEA;
    border-radius:50%;
  }
  .method-logo.logo-salesforce .logo-mark::before{width:23px;height:23px;left:5px;top:-7px}
  .method-logo.logo-salesforce .logo-mark::after{width:26px;height:26px;right:3px;top:-9px}
  .method-logo.logo-salesforce .logo-text{color:#A9DAFF}
  .method-logo img{max-height:26px;max-width:120px;width:auto;object-fit:contain;filter:brightness(0) invert(1);opacity:.95;display:block}
  .method-win > span{
    display:block;
    font-size:12px;
    font-weight:700;
    letter-spacing:.06em;
    text-transform:uppercase;
    color:var(--ccf-green);
    margin-bottom:8px;
  }
  .method-win h4{font-size:22px;margin-bottom:9px;color:#fff}
  .method-win p{font-size:15px;line-height:1.45;color:#C6D2DC}

  .reveal{
    margin-top:22px;
    background:#0B1118;
    border:1px solid rgba(140,199,246,.38);
    color:#fff;
    padding:clamp(28px,4vw,48px);
    position:relative;
    overflow:hidden;
    isolation:isolate;
  }
  .reveal::after{
    content:"";
    position:absolute;
    right:clamp(-170px,-10vw,-90px);
    top:50%;
    width:clamp(280px,32vw,460px);
    aspect-ratio:1;
    border:32px solid rgba(23,111,181,.32);
    border-radius:50%;
    transform:translateY(-50%);
    z-index:0;
  }
  .reveal .eyebrow,.reveal h2,.reveal p,.reveal .tagline{position:relative;z-index:1}
  .reveal h2{
    font-size:clamp(44px,6vw,82px);
    line-height:.95;
    letter-spacing:-.025em;
    color:#fff;
    margin:16px 0 18px;
    max-width:11ch;
  }
  .reveal h2 span{color:#72BDF4}
  .reveal-word{display:inline-block;white-space:nowrap}
  .reveal p{font-size:clamp(17px,1.6vw,20px);max-width:62ch;color:#E2EAF1;line-height:1.5}
  .reveal .tagline{
    display:inline-flex;
    align-items:center;
    margin-top:24px;
    background:#72BDF4;
    color:#071018;
    border-radius:999px;
    padding:10px 15px;
    font-weight:800;
    font-size:14px;
  }

@page{size:A4;margin:12mm 0}
@media print{
  body{background:#fff}.doc{width:auto;box-shadow:none;margin:0}nav{position:static}.brk{break-before:page}section{break-inside:avoid}
  .dark,.pov,.alos,.cover,.as,.mband,.q.odin,.subhero,footer,.book,.book *,.relmap,.relmap *,details.mfull{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .snaprow{break-inside:avoid}
  .book,.book section{break-inside:auto}
  .steps,.syn,.arc,.two,.cases,.relmap{break-inside:auto}
  details.mfull{border:none;background:transparent;margin-top:14px}
  details.mfull>summary{display:none}
  details.mfull .mbody{padding:0}
  details.mfull::details-content{content-visibility:visible !important;display:block !important}
}

/* ===== SITE V2 DESIGN PASS: controlled industrial strategy surface ===== */
@font-face{font-family:"ODIN Display";src:url("../fonts/HelveticaNowDisplay-Bold.woff2") format("woff2");font-weight:700 800;font-style:normal;font-display:swap}
@font-face{font-family:"ODIN Display";src:url("../fonts/HelveticaNowDisplay-Medium.woff2") format("woff2");font-weight:500 600;font-style:normal;font-display:swap}
@font-face{font-family:"ODIN Display";src:url("../fonts/HelveticaNowDisplay-Regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Carbon Plus";src:url("../fonts/carbonplus-regular-bl.otf") format("opentype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Carbon Plus";src:url("../fonts/carbonplus-bold-bl.otf") format("opentype");font-weight:700;font-style:normal;font-display:swap}
:root{--font-display:"ODIN Display","Helvetica Now Display",Helvetica,Arial,system-ui,sans-serif;--font-tech:"Carbon Plus","IBM Plex Mono",ui-monospace,monospace}

@media screen{
  :root{
    --ink:#111418;
    --charcoal:#252B31;
    --blue:#176FB5;
    --blue-deep:#0B406F;
    --blue-soft:#E6F1FA;
    --red:#C62833;
    --red-deep:#842027;
    --paper:#FFFFFF;
    --fog:#F3F6F8;
    --line:#D8E0E6;
    --mute:#4D5862;
    --mute2:#717C86;
    --pad:clamp(24px,4.8vw,72px);
    --radius:8px;
    --radius-lg:12px;
    --site-width:1120px;
  }

  html{scroll-padding-top:74px}
  body{
    font-family:"ODIN Display","Inter",system-ui,sans-serif;
    background:#252B31;
    color:var(--ink);
    line-height:1.55;
    text-rendering:optimizeLegibility;
  }
  .doc{
    width:min(var(--site-width),calc(100% - 32px));
    margin:16px auto 28px;
    background:var(--paper);
    box-shadow:none;
    border:1px solid rgba(255,255,255,.14);
  }
  h1,h2,h3,h4,h5{
    font-family:var(--font-display);
    letter-spacing:-.018em;
    text-wrap:balance;
  }
  p,li,.mxsub,.shead p{font-family:"ODIN Display","Inter",system-ui,sans-serif;text-wrap:pretty}
  a{transition:color .18s var(--ease),background .18s var(--ease),border-color .18s var(--ease),transform .18s var(--ease)}
  section{padding:clamp(54px,7vw,92px) 0}
  .wrap{padding:0 var(--pad)}

  nav{background:rgba(255,255,255,.96);border-bottom:1px solid var(--line);backdrop-filter:saturate(150%) blur(12px)}
  nav .in{min-height:64px;height:auto;padding:10px var(--pad);gap:22px}
  nav img{height:28px}
  .nl{gap:8px 10px;font-size:12.5px}
  .nl a{border:1px solid transparent;border-radius:999px;padding:6px 9px;color:#36404A}
  .nl a:hover{background:var(--fog);border-color:var(--line);color:var(--blue-deep)}

  .eyebrow{
    display:inline-flex;
    align-items:center;
    gap:8px;
    width:max-content;
    max-width:100%;
    font-size:12px;
    letter-spacing:.06em;
    color:var(--blue-deep);
  }
  .eyebrow::before{
    content:"";
    width:18px;
    height:2px;
    background:currentColor;
    opacity:.72;
  }
  .cover .eyebrow::before,.subhero .eyebrow::before,.dark .eyebrow::before,.pov .eyebrow::before,.book .eyebrow::before{background:currentColor}
  .eyebrow.od{color:#8CC7F6}

  /* mini titles in Carbon Plus (technical/mono face): small uppercase kickers, tags, slot labels,
     axis labels, badge pills, metadata captions. Large headings and body stay Helvetica Now.
     Carbon Plus sets wider, so tracking is eased back to keep caps legible and crisp. */
  .ic .k,.asset .t,.lcard .tw,.col .lab,.q .ql,.mxX,.mxY,.ang .pl,.score thead th,.cc h4 .ax,
  .ly .k,.bdr .t2,.gc .gt,.method-win > span,.relmap .relhead,.v,.syc .fl,.as .pc{
    font-family:var(--font-tech) !important;
  }
  .mxY,.mxX,.q .ql,.gc .gt,.asset .t,.bdr .t2,.col .lab,.relmap .relhead,.ang .pl,.ic .k,.lcard .tw,
  .method-win > span{letter-spacing:.05em}

  .shead{margin-bottom:clamp(22px,3vw,34px)}
  .shead h2{font-size:clamp(32px,4vw,52px);line-height:.98;margin:14px 0 15px}
  .shead p{font-size:clamp(16px,1.55vw,18px);line-height:1.52;color:var(--charcoal);max-width:72ch}
  .alt .shead p{color:#3E4A54}
  .muted{color:var(--mute)}

  /* numbered section markers: the committed chapter grammar mirrored from the agent
     naming pack O-pack_v8. A Carbon Plus number in ODIN blue, an ink uppercase kicker,
     and a fading hairline rule. The marker is the first child of a .shead and replaces
     that section's old standalone eyebrow. Light variant by default; dark variant on
     dark bands; the cover carries it above the title. Markup lives only in pack.html,
     so pack_v2.html and the c-*.html pages are untouched. */
  .section-marker{display:flex;align-items:center;gap:16px;padding-bottom:16px;margin-bottom:clamp(18px,2.4vw,26px);border-bottom:1px solid rgba(23,111,181,.20)}
  .section-marker .mk-num{font-family:var(--font-tech);font-weight:700;font-size:clamp(28px,4vw,46px);line-height:1;letter-spacing:-.02em;color:var(--blue);flex:none}
  .section-marker .mk-kicker{font-family:var(--font-tech);font-weight:700;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink);flex:none}
  .section-marker .mk-rule{flex:1;height:2px;min-width:40px;background:linear-gradient(90deg,var(--blue) 0%,rgba(23,111,181,0) 100%)}

  /* dark variant: on the .dark category band and any dark surface (.book, .pov, .subhero,
     the cover), lift the number and kicker to the cover-blue family and soften the hairline
     to match. The kicker would otherwise be ink-on-dark and illegible. */
  .dark .section-marker,.book .section-marker,.pov .section-marker,.subhero .section-marker,.cover .section-marker{border-bottom:1px solid rgba(140,199,246,.24)}
  .dark .section-marker .mk-num,.book .section-marker .mk-num,.pov .section-marker .mk-num,.subhero .section-marker .mk-num,.cover .section-marker .mk-num{color:#72BDF4}
  .dark .section-marker .mk-kicker,.book .section-marker .mk-kicker,.pov .section-marker .mk-kicker,.subhero .section-marker .mk-kicker,.cover .section-marker .mk-kicker{color:#8CC7F6}

  /* cover variant: the marker rides the top of the dark cover, above the title. */
  .cover .section-marker{margin-bottom:clamp(20px,2.6vw,30px)}

  /* reveal marker: the same grammar carried into the in-section reveal block, sitting
     above the "Call it Enforced Assembly" line in cover-blue on the dark reveal panel. */
  .reveal .section-marker{margin-bottom:18px;border-bottom:1px solid rgba(140,199,246,.30)}
  .reveal .section-marker .mk-num{color:#72BDF4}
  .reveal .section-marker .mk-kicker{color:#8CC7F6}

  /* winner cards: the one place logos stay. Each mark sits in a fixed bone-tile square,
     centred and optically aligned, crisp greyscale, consistent across all six cards.
     Low-res marks read as intentional because the tile is small and uniform. */
  .ccd .tp{gap:11px;min-height:34px;margin-bottom:2px}
  .ccd .tp img{
    width:34px;height:34px;max-width:34px;flex:none;padding:6px;
    object-fit:contain;border-radius:7px;
    background:var(--fog);border:1px solid var(--line);
    filter:grayscale(1) contrast(1.04);opacity:.92;mix-blend-mode:multiply;
  }
  .ccd .tp .wname{font-size:15px;font-weight:700;letter-spacing:-.012em;color:var(--ink);line-height:1.12}

  .cover{
    min-height:min(82vh,820px);
    display:flex;
    align-items:center;
    padding:clamp(92px,11vw,140px) 0 clamp(74px,8vw,104px);
    background:#0B1118;
    isolation:isolate;
  }
  .cover::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:0;
    background:
      linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px),
      linear-gradient(180deg,rgba(255,255,255,.04) 1px,transparent 1px),
      radial-gradient(circle at 74% 26%,rgba(23,111,181,.42),transparent 34%),
      linear-gradient(135deg,#0A0E12 0%,#111923 52%,#0A243D 100%);
    background-size:56px 56px,56px 56px,auto,auto;
  }
  .cover .wrap{position:relative;z-index:1}
  .cover h1{
    font-size:clamp(70px,11vw,118px);
    letter-spacing:-.028em;
    line-height:.9;
    margin-top:18px;
    max-width:9ch;
  }
  .cover h1 .ac{color:#72BDF4}
  .cover .sub{font-size:clamp(20px,2.3vw,28px);line-height:1.22;max-width:27ch;color:#E7EEF5;margin-top:26px}
  .cover .tag{font-size:clamp(14px,1.4vw,17px);margin-top:34px;line-height:1.4;max-width:54ch}
  .cover .tag .dot{box-shadow:none;flex:none}
  .pills{gap:10px;margin-top:30px}
  .pill{border-color:rgba(255,255,255,.28);background:rgba(255,255,255,.06);color:#D9E5EE}
  .coverby{z-index:1;left:var(--pad);bottom:24px;color:#A3AFBA}
  .ap{right:clamp(-150px,-10vw,-60px);width:clamp(360px,42vw,560px);height:auto;opacity:.42;z-index:0}

  .decision-strip{background:#0B1118;color:#fff;padding:0 0 clamp(42px,5vw,68px)}
  .decision-grid{
    display:grid;
    grid-template-columns:minmax(280px,1.45fr) repeat(3,minmax(150px,1fr));
    gap:1px;
    border:1px solid rgba(140,199,246,.34);
    background:rgba(140,199,246,.22);
  }
  .decision-lead,.decision-item{background:#101923;padding:clamp(18px,2.2vw,28px)}
  .decision-lead h2{font-size:clamp(26px,3vw,40px);line-height:1.02;margin-top:12px;color:#fff;max-width:13ch}
  .decision-item{display:flex;flex-direction:column;justify-content:flex-end;min-height:156px}
  .decision-item span{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:#8CC7F6;font-weight:700}
  .decision-item strong{display:block;margin-top:10px;font-size:clamp(18px,1.8vw,24px);line-height:1.06;color:#fff}

  .intro2,.cases,.syn,.arc,.two,.cols,.rules,.angles,.cards,.cgrid,.crit,.alos .ab,.snaprow{
    gap:clamp(14px,2vw,24px);
  }
  .intro2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cols{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}
  .cards,.cgrid,.angles{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
  .two,.rules,.cases,.syn,.arc{grid-template-columns:repeat(auto-fit,minmax(270px,1fr))}

  .ic,.case,.step,.syc,.lcard,.col,.rule,.asset,.q,.ang,.cc,.tb,.br,.ccd,.opt,.alos .bx,.ly,.gc,.cmpr{
    border-radius:var(--radius) !important;
  }
  .ic,.case,.step,.syc,.col,.asset,.q,.ang,.cc,.tb,.br,.ccd,.opt,.ly,.gc,.cmpr{
    border-color:var(--line);
  }
  .ic p,.case,.step p,.syc,.lcard li,.col li,.asset p,.ang p,.cc p,.ccd .r,.opt p,.bdr p,.ly .vv,.next li{font-size:clamp(13.5px,1.25vw,15.5px)}
  .ic .k,.asset .t,.bdr .t2,.gc .gt{letter-spacing:.06em;color:var(--blue-deep)}
  .lcard{background:#fff}
  .lcard.bad{background:#FFF6F6;border-color:#E7BFC2}
  .lcard.good{background:#F4F9FD;border-color:#BCD8EE}
  .bad .tw{color:var(--red-deep)}
  .good .tw{color:var(--blue-deep)}

  .mband{border-radius:var(--radius-lg);box-shadow:none}
  .mband img{box-shadow:none}
  .mxcap{font-size:15px;margin:26px 0 6px;color:var(--ink)}
  .mxsub{font-size:15px;line-height:1.5;color:var(--charcoal);max-width:78ch}

  .score{border-radius:var(--radius);font-size:14px}
  .score th,.score td{padding:12px}
  .score th:first-child,.score td:first-child{font-size:14px}
  .score{display:table;overflow:visible;white-space:normal}
  .score tbody,.score thead,.score tr{width:auto}

  .pf{gap:0;border:1px solid var(--line);background:#fff}
  .st{padding:20px 16px;border-right:1px solid var(--line)}
  .st:last-child{border-right:none}
  .st .b{font-size:clamp(34px,4vw,54px);letter-spacing:-.03em;color:var(--blue-deep)}
  .st .l{font-size:13px;color:var(--charcoal)}

  .bdr,.bdr.ev,.bq2,.bq2.red{
    border-left:1px solid var(--line);
  }
  .bdr{
    border-color:var(--line);
    border-top:4px solid var(--blue);
    border-radius:var(--radius);
  }
  .bdr.ev{border-top-color:var(--red)}
  .bq2{
    padding:18px 20px;
    border-color:var(--line);
    border-top:4px solid var(--blue);
    background:var(--fog);
    border-radius:var(--radius);
  }
  .bq2.red{border-top-color:var(--red)}
  .cmpr,.cmpr.lo,.cmpr.med,.cmpr.emrg{
    border-left:1px solid var(--line) !important;
    border-top:4px solid var(--blue) !important;
  }
  .cmpr.lo{border-top-color:var(--mute2) !important}
  .cmpr.med{border-top-color:var(--amber) !important}
  .cmpr.emrg{border-top-color:var(--blue-deep) !important}

  .gc{box-shadow:none}
  .gc:hover{transform:translateY(-3px);box-shadow:none;border-color:#B9C7D2}
  .gc .thumb{height:clamp(132px,18vw,188px)}
  .gc h4{font-size:20px}
  .gc p{font-size:14.5px;color:var(--charcoal)}

  .pov{background:#0B1118}
  .povb{font-size:clamp(18px,1.8vw,22px);line-height:1.62;color:#E2EAF1;max-width:820px}
  .povb .turn,.povb .end{font-size:clamp(28px,3.4vw,46px);line-height:1.05}
  .povb .end{color:#8CC7F6}

  .book .eyebrow{color:var(--ccf-green)}
  .book .mxsub,.book .shead p,.book .muted{color:#C5CED6}
  .relmap{border-radius:var(--radius);background:rgba(255,255,255,.045)}
  details.mfull{border-radius:var(--radius)}

  footer .in{padding:0 var(--pad)}
}

@media screen and (max-width:820px){
  .doc{width:100%;margin:0;border:none}
  /* mobile header: one line. Bar stays sticky, brand lockup intact, the link row
     becomes a non-wrapping horizontal scroller with momentum, a hidden scrollbar
     and a right-edge fade mask. Mirrors the agent naming pack O-pack_v8. */
  nav{position:sticky;top:0}
  nav .in{flex-direction:row;align-items:center;gap:12px;min-height:56px;padding:8px var(--pad)}
  nav img{height:24px}
  .nl{flex:1 1 auto;min-width:0;width:auto;flex-wrap:nowrap;white-space:nowrap;gap:4px;font-size:12px;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none;mask-image:linear-gradient(90deg,#000 88%,transparent 100%);-webkit-mask-image:linear-gradient(90deg,#000 88%,transparent 100%)}
  .nl::-webkit-scrollbar{display:none}
  .nl a{flex:none;padding:6px 8px}
  .cover{min-height:auto}
  .cover h1{font-size:clamp(58px,18vw,86px)}
  .ap{opacity:.18;right:-210px;width:520px}
  .decision-grid{grid-template-columns:1fr}
  .decision-lead h2{font-size:clamp(25px,8vw,34px);max-width:14ch}
  .decision-item{min-height:auto}
  .relmap .relhead,.relmap .relrow{grid-template-columns:1fr;gap:7px}
  .relmap .relhead .ca,.relmap .relhead .pr{grid-column:auto}
  .relmap .arr{display:none}

  /* criteria grid: hardcoded 1fr 1fr cramps to ~150px cards on a phone, so stack it.
     Desktop stays two columns (the screen-level rule is untouched). */
  .crit{grid-template-columns:1fr}

  /* 2x2 competitor matrices: keep the true grid on mobile so spatial meaning survives.
     Compact the Y-axis label column, the quadrant padding, and the brand chips so the
     four quadrants and both axes still read on a phone. The .ql label inside each
     quadrant also states its axis position in words as a second safety net. */
  .mxwrap{grid-template-columns:13px 1fr;gap:6px}
  .mxgrid{grid-template-columns:1fr 1fr;gap:5px}
  .q{min-height:96px;padding:9px}
  .q .ql{margin-bottom:6px;line-height:1.25}
  .chip2{padding:2px 6px;gap:4px;margin:0 3px 3px 0}
  .chip2 .wlogo{width:12px;height:12px;max-width:12px}

  .pf{display:grid;grid-template-columns:1fr 1fr}
  .st{border-right:none;border-bottom:1px solid var(--line)}
  .st:nth-child(odd){border-right:1px solid var(--line)}
  footer .in{flex-direction:column;align-items:flex-start}
  footer .r{text-align:left}
}

@media screen and (max-width:640px){
  .intro2{grid-template-columns:1fr}
  .method-wins{grid-template-columns:1fr}
}

@media screen and (max-width:520px){
  :root{--pad:20px}
  section{padding:46px 0}
  .shead h2{font-size:31px}
  .cover .sub{font-size:19px}
  .pills{display:none}
  .reveal{padding:28px 22px}
  .reveal h2{font-size:clamp(31px,8.4vw,36px);max-width:none}
  .pf{grid-template-columns:1fr}
  .st:nth-child(odd){border-right:none}
  .score{margin-inline:calc(var(--pad) * -1);width:calc(100% + (var(--pad) * 2));border-radius:0;border-left:none;border-right:none;display:block;overflow-x:auto;white-space:nowrap}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition-duration:.001ms !important;animation-duration:.001ms !important;animation-iteration-count:1 !important}
}
