.banner{position:relative;min-height:380px;border-radius:0;display:flex;align-items:center;background:linear-gradient(120deg,#0B1437 0%,#13205a 60%,#1a2e7a 100%);background-size:var(--hero-bg-size,cover);background-position:var(--hero-bg-position,center);background-repeat:no-repeat;overflow:hidden}
.banner--qsr{--hero-bg-position:right center;--hero-bg-size:140% auto}
.banner--retail{--hero-bg-position:left center;--hero-bg-size:150% auto}
.banner--warehouse{--hero-bg-position:left center;--hero-bg-size:140% auto}
.banner--healthcare{--hero-bg-position:left center;--hero-bg-size:132% auto}
.banner--hospitality{--hero-bg-position:left center;--hero-bg-size:122% auto}
.banner--multi{--hero-bg-position:left center;--hero-bg-size:120% auto}
.banner--logistics{--hero-bg-position:right center;--hero-bg-size:122% auto}
.banner::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,9,26,.78) 0%,rgba(5,9,26,.54) 46%,rgba(5,9,26,.28) 100%),repeating-linear-gradient(45deg,rgba(255,255,255,.03),rgba(255,255,255,.03) 14px,rgba(255,255,255,0) 14px,rgba(255,255,255,0) 28px);pointer-events:none}
.banner .blabel{position:absolute;z-index:1;top:14px;right:18px;font-family:"Space Mono",monospace;font-size:.62rem;letter-spacing:.08em;color:rgba(255,255,255,.5);border:1px dashed rgba(255,255,255,.3);border-radius:6px;padding:.25rem .6rem}
.banner .inner{position:relative;z-index:1;padding-top:54px;padding-bottom:54px}
.banner .eyebrow{color:#8ea0ff}
.banner h1{color:#fff;font-size:clamp(2.3rem,4.8vw,3.6rem);font-weight:800;margin:14px 0 0;max-width:18ch}
.banner p{color:#c4cae6;font-size:1.15rem;margin:18px 0 26px;max-width:46ch}
.banner .icon{font-size:2.4rem}
section.block{padding:var(--sec-pad) 0}
.lead{max-width:720px}
.lead h2{font-size:clamp(1.8rem,3.4vw,2.4rem);font-weight:800;margin-top:12px}
.lead p{color:var(--muted);font-size:1.08rem;margin-top:14px}
.why{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:8px}
.wc{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:26px}
.wc .ic{width:46px;height:46px;border-radius:12px;background:var(--paper-2);display:grid;place-items:center;font-size:1.2rem;margin-bottom:14px}
.wc h3{font-size:1.12rem;font-weight:700}
.wc p{color:var(--muted);font-size:.92rem;margin-top:7px}
@media(max-width:820px){.why{grid-template-columns:1fr}}
.sec-head{text-align:center;max-width:620px;margin:0 auto 34px}
.sec-head h2{font-size:clamp(1.8rem,3.4vw,2.4rem);font-weight:800;margin-top:12px}
.checks{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.chk{display:flex;gap:14px;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:22px;transition:border-color .15s}
.chk:hover{border-color:var(--blue)}
.chk .ic{width:42px;height:42px;border-radius:11px;background:var(--paper-2);display:grid;place-items:center;font-size:1.15rem;flex:none}
.chk h3{font-size:1.02rem;font-weight:700}
.chk p{color:var(--muted);font-size:.86rem;margin-top:3px}
.chk .lk{font-size:.78rem;font-weight:600;color:var(--blue);margin-top:7px;display:inline-block}
@media(max-width:820px){.checks{grid-template-columns:1fr}}
.two-box{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.bx{background:var(--paper-2);border-radius:18px;padding:28px}
.bx .h{font-family:"Space Mono",monospace;font-size:.64rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:14px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips span{background:#fff;border:1px solid var(--line);border-radius:999px;padding:.4rem .8rem;font-size:.86rem;font-weight:500}
@media(max-width:680px){.two-box{grid-template-columns:1fr}}
.statband{background:var(--ink);color:#fff;border-radius:24px;padding:40px;display:grid;grid-template-columns:.8fr 1.2fr;gap:30px;align-items:center}
.statband .n{font-family:"Bricolage Grotesque";font-weight:800;font-size:clamp(2.4rem,5vw,3.4rem);color:#7be0b3;line-height:1}
.statband .l{color:#b9bccb;margin-top:8px}
.statband .q{font-family:"Bricolage Grotesque";font-weight:600;font-size:clamp(1.2rem,2.4vw,1.6rem);line-height:1.3}
.statband .by{font-family:"Space Mono",monospace;font-size:.72rem;color:#8ea0ff;margin-top:14px;letter-spacing:.04em}
@media(max-width:680px){.statband{grid-template-columns:1fr;padding:30px}}
.final{background:linear-gradient(120deg,#1A3CF2 0%,#3b2bd0 60%,#6c2bb0 100%);color:#fff;border-radius:28px;padding:54px 48px;text-align:center}
.final h2{color:#fff;font-size:clamp(2rem,4vw,2.6rem);font-weight:800}
.final p{color:rgba(255,255,255,.88);margin:16px auto 26px;font-size:1.08rem;max-width:48ch}
.final-cta{display:flex;gap:.8rem;justify-content:center;flex-wrap:wrap}
/* On narrow screens the framed percentage sizing leaves the tall banner
   under-filled; switch every hero to cover so the image fills it cleanly. */
@media(max-width:820px){.banner{--hero-bg-size:cover;--hero-bg-position:center}}