/* QBC Systems — Page Sections */
.hero{position:relative;background:linear-gradient(128deg,var(--blue-hero-1) 0,var(--blue-hero-2) 52%,var(--blue-hero-3) 100%);color:#fff;overflow:hidden;padding:60px 0 116px}
.hero:before{inset:0;background:url(../images/hero-hq.jpg) right 40%/cover no-repeat;opacity:.55;mix-blend-mode:luminosity;-webkit-mask-image:linear-gradient(180deg,#000 70%,transparent 100%);mask-image:linear-gradient(180deg,#000 70%,transparent 100%)}
.hero:after,.hero:before{content:"";position:absolute;pointer-events:none}
.hero:after{inset:0;background-image:linear-gradient(90deg,rgba(8,24,88,.94) 0,rgba(8,24,88,.82) 42%,rgba(8,24,88,.30) 75%,rgba(8,24,88,.10) 100%),linear-gradient(hsla(0,0%,100%,.05) 1px,transparent 0),linear-gradient(90deg,hsla(0,0%,100%,.05) 1px,transparent 0);background-size:cover,56px 56px,56px 56px}
.hero .container{position:relative;z-index:1}
.hero-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);align-items:center;grid-gap:40px;gap:40px}
.hero-copy{max-width:620px}
.hero-visual{position:relative;min-width:0}
.hero-visual img,.hero-visual picture{display:block;width:100%;height:auto;max-width:720px;margin-left:auto;filter:drop-shadow(0 30px 46px rgba(4,12,44,.4))}
.hero-badge{display:inline-block;font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#cdddff;border:1px solid hsla(0,0%,100%,.28);border-radius:999px;padding:6px 14px;margin-bottom:22px;background:hsla(0,0%,100%,.06)}
.hero h1{font-family:var(--font, 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);font-weight:800;letter-spacing:-0.03em;color:#fff;font-size:clamp(2.2rem,3.2vw,2.85rem);line-height:1.14}
.hero h1 .gold{color:var(--gold)}
.hero-sub{margin-top:20px;max-width:470px;font-size:15.5px;line-height:1.65;color:hsla(0,0%,100%,.85)}
.hero-actions{display:flex;align-items:center;gap:26px;margin-top:32px}
.hero-products{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:20px 44px;gap:20px 44px;margin-top:40px;padding-top:30px;border-top:1px solid hsla(0,0%,100%,.16)}
.hero-product{display:flex;align-items:center;gap:13px}
.hero-product-mark{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;flex:none;font-size:21px;font-weight:800;font-style:italic;color:#fff;border:2px solid hsla(0,0%,100%,.92);box-shadow:0 6px 14px rgba(4,12,44,.3)}
.hero-product--tire .hero-product-mark{background:var(--red)}
.hero-product--shadow .hero-product-mark{background:var(--sblue)}
.hero-product--beauty .hero-product-mark{background:var(--purple)}
.hero-product .pname{font-size:15.5px;font-weight:700;color:#fff;line-height:1.3}
.hero-product .pdesc{margin-top:2px;font-size:12.5px;line-height:1.45;color:hsla(0,0%,100%,.72);max-width:160px}
@media (max-width:900px){.hero-top{grid-template-columns:1fr;gap:30px}.hero-copy{max-width:none}.hero-visual img{margin:0 auto;max-width:560px}.hero-products{gap:20px 24px}}
@media (max-width:520px){.hero-products{grid-template-columns:1fr}}
.ts-product-lockup{display:flex;align-items:center;gap:11px;margin-bottom:18px;color:#fff;font-size:18px;font-weight:800}
.ts-product-lockup .product-logo{width:43px;height:31px;filter:brightness(0) invert(1)}
.bs-product-lockup,.sh-product-lockup{display:flex;align-items:center;gap:11px;margin-bottom:18px;color:#fff;font-size:18px;font-weight:800}
.bs-product-lockup .product-logo,.sh-product-lockup .product-logo{width:37px;height:37px;object-fit:contain;filter:brightness(0) invert(1)}
.hero--page{padding:64px 0 76px}
.hero--page .eyebrow{color:hsla(0,0%,100%,.78)}
.hero--page h1{font-size:clamp(2rem,3.4vw,2.7rem);max-width:720px}
.hero--page .hero-sub{max-width:560px}
.hero--overlap{padding-bottom:176px}
.hero-iconrow{display:flex;gap:30px;margin-top:38px;color:hsla(0,0%,100%,.82)}
.hero-iconrow svg{width:28px;height:28px}
.hwhero{position:relative;overflow:hidden;color:#fff;padding:76px 0 88px;background:radial-gradient(760px 420px at 82% 0,rgba(29,81,226,.4),transparent 70%),var(--navy-900)}
.hwhero:after{content:"";position:absolute;inset:0;background-image:linear-gradient(hsla(0,0%,100%,.045) 1px,transparent 0),linear-gradient(90deg,hsla(0,0%,100%,.045) 1px,transparent 0);background-size:56px 56px;pointer-events:none}
.hwhero .container{position:relative;z-index:1}
.hwhero-grid{display:grid;grid-template-columns:1fr 1fr;grid-gap:clamp(32px,5vw,72px);gap:clamp(32px,5vw,72px);align-items:center}
.hwhero h1{color:#fff;font-size:clamp(2rem,3.1vw,2.6rem)}
.hwhero-illustration{position:relative;width:min(100%,620px);margin-left:auto;isolation:isolate}
.hwhero-illustration:after{content:"";position:absolute;z-index:-1;left:12%;right:4%;bottom:4%;height:18%;border-radius:50%;background:rgba(3,15,48,.44);filter:blur(26px)}
.hwhero-illustration img{display:block;width:100%;height:auto;filter:drop-shadow(0 22px 28px rgba(2,10,34,.3));transform:scale(1.08) translateX(2%);transform-origin:center}
.hw-diagram{display:grid;grid-template-columns:1fr 1fr;grid-gap:16px;gap:16px;max-width:520px;margin-left:auto;color:#fff}
.hw-panel{border:1.5px solid rgba(143,176,255,.32);border-radius:12px;padding:16px;background:hsla(0,0%,100%,.03)}
.hw-panel-head{display:flex;align-items:center;gap:9px;margin-bottom:14px;color:#9db9ff;font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.hw-panel-head svg{width:20px;height:20px;color:#8fb0ff;flex:none}
.hw-panel-body{display:flex;flex-direction:column;gap:9px}
.hw-line{display:block;height:7px;border-radius:4px;background:hsla(0,0%,100%,.12)}
.hw-line:first-child{background:rgba(143,176,255,.5)}
.hw-partners{margin-top:44px;display:flex;flex-direction:column;align-items:center;gap:14px}
.hw-partners-label{font-size:11.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.hw-partners ul{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.hw-chip{padding:8px 18px;border:1px solid var(--line);border-radius:999px;background:#fbfcfe;font-size:13.5px;font-weight:600;color:#3c465e}
.about-story{background:#fff;padding:76px 0 88px}
.about-grid{display:grid;grid-template-columns:1.1fr .9fr;grid-gap:clamp(36px,5vw,72px);gap:clamp(36px,5vw,72px);align-items:start}
.about-grid h2{font-size:clamp(1.6rem,2.4vw,2.1rem);max-width:480px}
.about-media{display:flex;flex-direction:column;gap:22px}
.contact-wrap{background:#fff;padding:56px 0 88px}
.contact-grid{display:grid;grid-template-columns:1.02fr .98fr;grid-gap:clamp(32px,4vw,60px);gap:clamp(32px,4vw,60px);align-items:start}
.contact-side h2{font-size:clamp(1.35rem,2vw,1.6rem);margin-bottom:20px}
.contact-list{display:flex;flex-direction:column;gap:16px;margin-bottom:28px}
.contact-list li{display:flex;align-items:center;gap:14px;font-size:15px;font-weight:600;color:#3c465e}
.contact-list a:hover{color:var(--blue)}
.contact-list address{font-style:normal;line-height:1.5}
.contact-ico{width:42px;height:42px;border-radius:12px;background:#e8effc;color:var(--blue);display:grid;place-items:center;flex:none}
.contact-ico svg{width:19px;height:19px}
@media (max-width:1020px){.hwhero-grid{grid-template-columns:1fr}.hw-diagram{margin:8px 0 0;max-width:560px}.hwhero-illustration{width:min(100%,620px);margin:8px auto -24px}.hwhero-illustration img{transform:none}.about-grid,.contact-grid{grid-template-columns:1fr}}
@media (max-width:760px){.hero--page{padding:48px 0 60px}.hero--overlap{padding-bottom:156px}.hero-iconrow{flex-wrap:wrap;gap:22px}.hwhero{padding:56px 0 64px}.hwhero-illustration{margin-bottom:-12px}}
@media (max-width:540px){.fact-chips,.hw-diagram{grid-template-columns:1fr}}
.hwband{position:relative;overflow:hidden;background:var(--bg-soft);padding:58px 0 52px}
.hwband-grid{position:relative;min-height:330px}
.hwband-copy{position:relative;z-index:2;width:100%;margin-left:0;padding-top:2px}
.hwband h2{max-width:680px;margin-left:0;font-size:clamp(2.1rem,3vw,2.7rem);line-height:1.06;letter-spacing:-.038em}
.hwband h2 span{display:block}
.hwband-copy p{margin-top:28px;margin-left:0;max-width:550px;font-size:15.5px;line-height:1.68;text-wrap:pretty}
.hwband-copy .link-arrow{margin-top:24px;margin-left:0}
.hwband-visual{position:absolute;z-index:1;top:48%;right:clamp(-38px,-1.5vw,-12px);width:100%;max-width:535px;margin:0;pointer-events:none;transform:translateY(-50%)}
.hwband-image{position:relative;aspect-ratio:16/9}
.hwband-image img{filter:contrast(1.1) saturate(1.08);object-fit:contain;transform:scale(1.04);transform-origin:center}
.hwband-proof{position:absolute;z-index:2;left:24px;right:24px;bottom:0;display:flex;align-items:center;gap:18px}
.hwband-proof:after{content:"";height:1px;min-width:72px;flex:1 1;margin-left:4px;background:rgba(16,34,90,.14)}
.hwband-proof li{display:flex;align-items:center;gap:9px;color:var(--ink);font-size:10px;font-weight:700;letter-spacing:.08em;line-height:1.35;text-transform:uppercase}
.hwband-proof .partner-mark{width:116px;height:32px;padding:6px 9px;border-color:rgba(16,34,90,.08)}
.hwband-proof .partner-mark--arista{padding:8px 11px;border-color:#11265f}
.hwband-proof .partner-mark--nordic-backup{width:126px}
.hwband-proof li:not(:last-child):after{content:"";width:4px;height:4px;border-radius:50%;background:var(--blue)}
@media (min-width:861px) and (max-width:1350px){.hwband-visual{right:-28px}}
.pdive{background:#fff;padding:72px 0 80px}
.pdive .eyebrow{color:var(--accent)}
.pdive-head{max-width:720px;margin-bottom:32px}
.pdive-head h2{font-size:clamp(1.6rem,2.4vw,2.05rem)}
.pdive-head p{margin-top:14px;max-width:640px;font-size:15.5px;line-height:1.7}
.pdive-grid{display:grid;grid-template-columns:1.12fr .88fr;grid-gap:clamp(28px,4vw,56px);gap:clamp(28px,4vw,56px);align-items:start}
.pdive-list{display:flex;flex-direction:column;gap:12px}
.pdive details{border:1px solid var(--line);border-radius:12px;background:#fff;box-shadow:0 8px 26px rgba(16,34,90,.05)}
.pdive summary{display:flex;align-items:center;gap:14px;padding:15px 18px;cursor:pointer;list-style:none;border-radius:12px}
.pdive summary::-webkit-details-marker{display:none}
.pdive summary:hover .pdive-sum h3{color:var(--blue)}
.pdive summary:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.pdive-ico{width:38px;height:38px;border-radius:10px;background:var(--accent-tint);display:grid;place-items:center;flex:none}
.pdive-ico svg{width:19px;height:19px;color:var(--accent)}
.pdive-sum h3{font-size:15.5px;letter-spacing:-.01em;transition:color .15s ease}
.pdive-sum p{margin-top:2px;font-size:13px;line-height:1.5}
.pdive-chev{margin-left:auto;flex:none;width:16px;height:16px;color:var(--muted);transition:transform .18s ease}
.pdive details[open] .pdive-chev{transform:rotate(180deg)}
.pdive-body{padding:2px 18px 16px 70px}
.pdive-body li{display:flex;align-items:flex-start;gap:10px;padding:5px 0;font-size:14px;line-height:1.55;color:#3c465e}
.pdive-body svg{width:16px;height:16px;color:var(--accent);flex:none;margin-top:3px}
.pdive-media{position:-webkit-sticky;position:sticky;top:96px;display:flex;flex-direction:column;gap:18px}
@media (max-width:1020px){.hwband-grid,.pcheck-grid,.pdive-grid,.svc-grid{grid-template-columns:1fr}.hwband-grid{min-height:340px}.hwband-copy{max-width:none}.hwband h2{max-width:610px;font-size:clamp(2.1rem,4.6vw,2.65rem)}.hwband-visual{right:-42px;max-width:480px}.pdive-media{position:static;max-width:560px}.trust-grid{grid-template-columns:1fr;gap:36px}.trust-summary{display:grid;grid-template-columns:minmax(280px,1fr) auto;align-items:end;grid-gap:34px;gap:34px}.trust-summary h2:after{margin-top:18px}.trust-tenure{margin-top:0}}
@media (max-width:860px){.hwband-grid{min-height:0}.hwband h2{max-width:620px;transform:none}.hwband h2,.hwband-copy,.hwband-copy .link-arrow,.hwband-copy p{margin-left:0}.hwband-copy p,.hwband-proof{transform:none}.hwband-visual{position:relative;top:auto;right:auto;max-width:560px;margin:-34px -12px -18px auto;transform:none}.hwband-proof{position:static;margin-top:8px}}
@media (max-width:760px){.trust{padding:50px 0 54px}.trust-summary{display:block}.trust-summary h2{font-size:clamp(2rem,9vw,2.65rem)}.trust-tenure{margin-top:22px}.trust-row{grid-template-columns:34px 1fr;gap:4px 16px;padding:18px 0}.trust-row svg{grid-row:1/span 2;width:27px;height:27px}.trust-row p{margin-top:4px}.hwband{padding:48px 0 50px}.hwband h2{font-size:clamp(2rem,8vw,2.6rem);line-height:1.05}.hwband-copy p{margin-top:30px;font-size:15.5px}.hwband-copy .link-arrow,.hwband-proof{margin-top:24px}.hwband-proof{left:auto;right:auto;flex-wrap:wrap;gap:8px 18px}.hwband-proof:after{display:none}.hwband-image img{transform:scale(1.05)}.hwband-proof li{gap:8px}.hwband-proof li:before{content:"";width:4px;height:4px;flex:none;border-radius:50%;background:var(--blue)}.hwband-proof li:not(:last-child):after{display:none}.pcheck-list{grid-template-columns:1fr}.pdive-body{padding-left:18px}}
.hero--center{text-align:center}
.hero--center .hero-sub,.hero--center h1{margin-left:auto;margin-right:auto}
.hwp-panel{border:1px solid var(--line);border-radius:var(--radius);background:#fbfcfe;padding:26px 28px;box-shadow:0 8px 26px rgba(16,34,90,.05)}
.hwp-panel h3{font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.hwp-list{margin-top:10px}
.hwp-list li{display:flex;align-items:flex-start;gap:10px;padding:11px 0;border-bottom:1px solid var(--line);font-size:14.5px;font-weight:500;color:#3c465e;line-height:1.5}
.hwp-list svg{width:17px;height:17px;color:var(--blue);flex:none;margin-top:2px}
.hw-partners--start{margin-top:22px;align-items:flex-start;gap:10px}
.hw-partners--start ul{justify-content:flex-start}
.hw-partner-mark{display:flex}
.hw-partners--start .partner-mark{width:150px;height:44px;background-color:#fff}
.hw-partners--start .partner-mark--arista{background-color:#11265f}
@media (max-width:1020px){.co-grid{grid-template-columns:1fr}.co-grid .hwband-panel,.hwp-panel{max-width:560px}.data-center-visual{width:min(100%,560px);margin:0}}


.product-hero { padding: 4rem 0; }
.erp-features { display: grid; gap: 2rem; }
.spec-table { width: 100%; border-collapse: collapse; }
.timeline { display: flex; flex-direction: column; gap: 1.5rem; }
.leadership { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 2rem; }
.contact-card { background: #fff; border-radius: var(--radius); padding: 2rem; }
.post-card { background: #fff; border-radius: var(--radius); overflow: hidden; }

.blog-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 24px; }