/* ===== Gap assessment bento (Stripe-style asymmetric grid, attackless theme: white, black, orange, pixels) ===== */
.bento-sec{padding:clamp(72px,9vw,120px) var(--pad) clamp(56px,7vw,96px)}
.bento-head{text-align:center;margin-bottom:clamp(28px,4vw,48px)}
.bento-head .lede2{max-width:56ch;margin:14px auto 0;color:var(--mut);font-size:clamp(15px,1.5vw,18px)}
.bento{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px}
.bx{text-align:left;align-items:stretch;position:relative;padding:clamp(20px,2.4vw,32px);border:1px solid rgba(0,0,0,.16);background:#fff;display:flex;flex-direction:column;gap:14px;min-width:0;
  clip-path:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px);transition:background .15s steps(2)}
.bx h3{font-size:clamp(20px,2vw,28px);line-height:1;letter-spacing:-.03em;text-transform:uppercase}
.bx p{color:var(--mut);font-size:14.5px;max-width:46ch}
.bx .k{font-weight:500;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--dim);display:flex;align-items:center;gap:10px}
.bx .k::before{content:"";width:6px;height:6px;background:#f40009}
.bx .smp{margin-left:auto;font-size:10px;letter-spacing:.14em;border:1px solid rgba(0,0,0,.3);padding:2px 7px;color:#000}
.bx:hover{background:#fdeceb}
.b-map{grid-column:span 7;grid-row:span 2}
.b-fw{grid-column:span 5}
.b-rank{grid-column:span 5}
.b-plan{grid-column:span 7;background:#000;color:#fff;border-color:#000}
.b-plan p,.b-plan .k{color:rgba(255,255,255,.62)}
.b-plan .smp{border-color:rgba(255,255,255,.4);color:#fff}
.b-plan:hover{background:#0a0a0a}
.b-ev{grid-column:span 5}

/* pixel control map */
.pmap{display:grid;grid-template-columns:repeat(24,1fr);gap:4px;margin-top:auto;position:relative}
.pmap i{aspect-ratio:1;background:#000;display:block}
.pmap i.p{background:transparent;box-shadow:inset 0 0 0 2px #000}
.pmap i.g{background:#f40009}
.pmap i.scan{background:#000;box-shadow:0 0 0 2px #b80007;z-index:1}
.legend{display:flex;gap:18px;flex-wrap:wrap;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--mut)}
.legend span{display:inline-flex;align-items:center;gap:8px}
.legend b{width:10px;height:10px;display:inline-block;background:#000}
.legend b.p{background:transparent;box-shadow:inset 0 0 0 2px #000}
.legend b.g{background:#f40009}
.score{display:flex;align-items:baseline;gap:10px}
.score strong{font-size:clamp(40px,5vw,64px);letter-spacing:-.05em;line-height:.9}
.score span{color:var(--dim);font-size:12px;letter-spacing:.14em;text-transform:uppercase}

/* framework bars made of pixels */
.fw{display:grid;gap:12px;margin-top:4px}
.fw div{display:grid;grid-template-columns:92px 1fr 40px;gap:12px;align-items:center;font-size:12px;letter-spacing:.1em;text-transform:uppercase}
.fw .bar{height:14px;background:repeating-linear-gradient(90deg,rgba(0,0,0,.12) 0 8px,transparent 8px 10px)}
.fw .bar u{display:block;height:100%;text-decoration:none;background:repeating-linear-gradient(90deg,#f40009 0 8px,transparent 8px 10px)}
.fw em{font-style:normal;font-weight:700;text-align:right}

/* ranked gaps */
.rk{display:grid;gap:0}
.rk div{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:center;padding:12px 0;border-top:1px solid rgba(0,0,0,.16);font-size:14px}
.rk div:first-child{border-top:0}
.sev{font-size:10px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;padding:3px 8px;min-width:72px;text-align:center}
.sev.c{background:#f40009;color:#000}
.sev.h{border:1.5px solid #f40009;color:#000}
.sev.m{border:1.5px solid rgba(0,0,0,.3);color:var(--mut)}

/* plan: pixel staircase */
.stairs{display:flex;align-items:flex-end;gap:10px;margin-top:auto;height:120px}
.stairs div{flex:1;display:flex;flex-direction:column;justify-content:flex-end;gap:6px}
.stairs .blk{background:#f40009}
.stairs .blk.o2{background:transparent;box-shadow:inset 0 0 0 2px rgba(255,255,255,.5)}
.stairs span{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.7)}
.stairs .s1 .blk{height:28px}.stairs .s2 .blk{height:58px}.stairs .s3 .blk{height:92px}
.b-plan h3{color:#fff}

/* evidence tile */
.evs{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto}
.evs span{border:1.5px solid #000;padding:6px 12px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:600}
.evs span:first-child{background:#000;color:#fff}
.ev-shield{width:44px;height:auto}
.bento-cta{display:flex;justify-content:center;margin-top:clamp(28px,4vw,44px)}
.bento-note{text-align:center;margin-top:16px;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--dim)}

@media(max-width:900px){.b-map,.b-fw,.b-rank,.b-plan,.b-ev{grid-column:1/-1;grid-row:auto}.pmap{grid-template-columns:repeat(16,1fr)}}
@media(max-width:520px){.fw div{grid-template-columns:70px 1fr 36px}.pmap{grid-template-columns:repeat(12,1fr)}}
@media(prefers-reduced-motion:reduce){.pmap i.scan{transform:none}}

/* ===== Sticker style (option B): white tiles on a pixel dot grid, hard black border, orange pixel shadow ===== */
.bento-sec .bx{clip-path:none;border:2px solid #000;box-shadow:6px 6px 0 #b80007;
  background:#fff radial-gradient(rgba(0,0,0,.14) 1px,transparent 1.4px) 0 0/12px 12px;transition:transform .12s steps(2),box-shadow .12s steps(2)}
.bento-sec .bx:hover{background-color:#fff;transform:translate(3px,3px);box-shadow:3px 3px 0 #b80007}
.bento-sec .b-plan{background:#fff radial-gradient(rgba(0,0,0,.14) 1px,transparent 1.4px) 0 0/12px 12px;color:#000;border-color:#000}
.bento-sec .b-plan h3{color:#000}.bento-sec .b-plan p,.bento-sec .b-plan .k{color:var(--mut)}
.bento-sec .b-plan .smp{border-color:rgba(0,0,0,.3);color:#000}
.bento-sec .stairs span{color:#000}.bento-sec .stairs .blk.o2{box-shadow:inset 0 0 0 2px #000}
.bento-sec .pmap i{background:#e2e2e2}
.bento-sec .pmap i.p{background:#fff;box-shadow:inset 0 0 0 2px #000}
.bento-sec .pmap i.g{background:#f40009}
.bento-sec .pmap i.scan{background:#e2e2e2;box-shadow:0 0 0 2px #000}
.bento-sec .legend b{background:#e2e2e2}.bento-sec .legend b.p{background:#fff;box-shadow:inset 0 0 0 2px #000}.bento-sec .legend b.g{background:#f40009}
.bento-sec .evs span:first-child{background:#f40009;color:#000}

