/* ===================== IT & HARDWARE v2 - dark tech theme (page-hw2, .dx-*) ===================== */
.page-hw2{--dx-bg:#0b0d10;--dx-s1:#13161b;--dx-s2:#1a1e24;--dx-line:rgba(255,255,255,.09);--dx-blue:#0672cb;--dx-blue2:#0063b8;--dx-cyan:#41b6e6;--dx-tx:#f4f6f8;--dx-mut:#a3abb5;background:var(--dx-bg);color:var(--dx-tx)}
.page-hw2 main,.page-hw2 #main{background:var(--dx-bg)}
.page-hw2 .header,.page-hw2 .header.is-scrolled{background:#fff;box-shadow:0 1px 0 #e6e8eb;backdrop-filter:none;-webkit-backdrop-filter:none}
.page-hw2 .nav__link.is-active,.page-hw2 .header .btn--blue{background:var(--dx-blue);border-radius:4px}
.page-hw2 .cursor__dot{background:var(--dx-cyan)}
.page-hw2 .cursor__ring{border-color:rgba(65,182,230,.5)}
.dx-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:48px;padding:0 26px;border-radius:3px;background:var(--dx-blue);color:#fff;font-weight:700;font-size:15px;letter-spacing:.01em;overflow:hidden;isolation:isolate;transition:background .25s,color .25s,box-shadow .25s,transform .25s}
.dx-btn::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.28) 50%,transparent 70%);translate:-120% 0;transition:translate .7s}
.dx-btn:hover{background:var(--dx-blue2);color:#fff;box-shadow:0 12px 30px -12px rgba(6,114,203,.8)}
.dx-btn:hover::after{translate:120% 0}
.dx-btn--ghost{background:transparent;border:1.5px solid rgba(255,255,255,.55);color:#fff}
.dx-btn--ghost:hover{background:#fff;color:#0b0d10;box-shadow:none}
.dx-btn--white{background:#fff;color:var(--dx-blue)}
.dx-btn--white:hover{background:#eaf4fc;color:var(--dx-blue2)}
.dx-btn--sm{min-height:42px;padding:0 20px;font-size:14px}
.dx-btns{display:flex;flex-wrap:wrap;gap:12px}
.dx-link{display:inline-flex;align-items:center;gap:8px;color:var(--dx-cyan);font-weight:700;font-size:15px}
.dx-link i{font-size:11px;transition:translate .25s}
.dx-link:hover{color:#fff}.dx-link:hover i{translate:4px 0}
.dx-eyebrow{display:inline-flex;align-items:center;gap:9px;margin:0 0 12px;font-size:13px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--dx-cyan)}
.dx-dot{width:8px;height:8px;border-radius:50%;background:var(--dx-cyan);box-shadow:0 0 0 0 rgba(65,182,230,.6);animation:dxPulse 2.2s infinite}
@keyframes dxPulse{70%{box-shadow:0 0 0 10px rgba(65,182,230,0)}100%{box-shadow:0 0 0 0 rgba(65,182,230,0)}}
.dx-title{margin:0;font-size:clamp(28px,3vw,42px);font-weight:800;letter-spacing:-.025em;line-height:1.12;color:#fff}
.dx-title span{color:var(--dx-cyan)}
.dx-title--sm{font-size:clamp(24px,2.2vw,30px);margin-bottom:18px}
.dx-lead{margin:0;max-width:520px;font-size:16.5px;line-height:1.7;color:var(--dx-mut)}
.dx-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-bottom:36px}
.dx-sec{position:relative;padding:clamp(64px,7vw,100px) 0;background:var(--dx-bg)}
.dx-sec--alt{background:linear-gradient(180deg,#0e1115,#0b0d10)}
.dx-sec--tiles{padding-top:56px}
/* hero */
.dx-hero{position:relative;overflow:hidden;isolation:isolate;min-height:clamp(560px,46vw,700px);display:flex;align-items:center;padding:150px 0 80px;background:#05070a}
.dx-hero__bg{position:absolute;inset:108px 0 0 0;z-index:-2}
.dx-hero__bg img{width:100%;height:100%;object-fit:cover;object-position:62% 50%;animation:dxZoom 22s ease-in-out infinite alternate;transform-origin:70% 50%}
@keyframes dxZoom{from{transform:scale(1.02)}to{transform:scale(1.14)}}
.dx-hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#05070a 0%,rgba(5,7,10,.94) 30%,rgba(5,7,10,.55) 58%,rgba(5,7,10,.15) 100%),linear-gradient(0deg,#0b0d10 0%,transparent 30%)}
.dx-hero__line{position:absolute;left:0;right:0;bottom:0;height:3px;background:linear-gradient(90deg,transparent,var(--dx-blue),var(--dx-cyan),transparent);background-size:200% 100%;animation:dxLine 4s linear infinite}
@keyframes dxLine{from{background-position:100% 0}to{background-position:-100% 0}}
.dx-hero__in{position:relative;width:100%}
.dx-hero__title{max-width:640px;margin:0 0 18px;font-size:clamp(38px,4.6vw,66px);font-weight:800;line-height:1.04;letter-spacing:-.035em;color:#fff}
.dx-hero__title span{display:block;background:linear-gradient(90deg,#fff 0%,var(--dx-cyan) 60%,var(--dx-blue) 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.dx-hero__text{max-width:520px;margin:0 0 30px;font-size:18px;line-height:1.65;color:#c7cdd4}
.dx-hero__brands{display:flex;align-items:center;gap:14px;margin-top:36px;font-size:12.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#8e96a0}
.dx-hero__brands img{width:44px;height:44px;padding:7px;border-radius:50%;background:#fff;object-fit:contain}
.dx-up{opacity:0;transform:translateY(26px);animation:dxUp .9s cubic-bezier(.22,.8,.26,1) forwards;animation-delay:calc(.15s + var(--d) * .12s)}
@keyframes dxUp{to{opacity:1;transform:none}}
/* tiles */
.dx-tiles{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.dx-tile{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;padding:26px 14px 22px;border-radius:6px;background:var(--dx-s1);border:1px solid var(--dx-line);color:#fff;overflow:hidden;transition:transform .35s,border-color .35s,background .35s}
.dx-tile::after{content:"";position:absolute;left:0;bottom:0;height:3px;width:100%;background:var(--dx-blue);transform:scaleX(0);transform-origin:left;transition:transform .45s}
.dx-tile__icon{display:grid;place-items:center;width:64px;height:64px;margin-bottom:8px;border-radius:50%;background:radial-gradient(circle at 30% 25%,#23406a,#10233d);color:var(--dx-cyan);font-size:24px;transition:transform .45s,background .35s,color .35s}
.dx-tile b{font-size:15px;font-weight:700}
.dx-tile small{font-size:12.5px;color:var(--dx-mut)}
.dx-tile:hover{transform:translateY(-6px);border-color:rgba(65,182,230,.4);background:var(--dx-s2);color:#fff}
.dx-tile:hover::after{transform:scaleX(1)}
.dx-tile:hover .dx-tile__icon{transform:scale(1.08) rotate(-6deg);background:var(--dx-blue);color:#fff}
/* brands */
.dx-brands{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.dx-brand{position:relative;padding:30px 28px;border-radius:8px;background:var(--dx-s1);border:1px solid var(--dx-line);transition:transform .4s,border-color .4s,box-shadow .4s}
.dx-brand::before{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:1px;background:linear-gradient(135deg,var(--dx-cyan),transparent 40%,transparent 60%,var(--dx-blue));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .4s;pointer-events:none}
.dx-brand:hover{transform:translateY(-6px);box-shadow:0 30px 60px -30px rgba(6,114,203,.6)}
.dx-brand:hover::before{opacity:1}
.dx-brand__logo{display:grid;place-items:center;width:72px;height:72px;margin-bottom:20px;border-radius:14px;background:#fff}
.dx-brand__logo img{width:52px;height:52px;object-fit:contain}
.dx-brand h3{margin:0 0 8px;font-size:22px;font-weight:800;color:#fff}
.dx-brand p{margin:0 0 18px;font-size:15px;line-height:1.65;color:var(--dx-mut)}
.dx-tags{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px}
.dx-tags span{padding:6px 11px;border-radius:3px;background:rgba(65,182,230,.1);border:1px solid rgba(65,182,230,.22);font-size:12.5px;font-weight:600;color:#cfe9f7}
/* showcase cards */
.dx-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.dx-card{display:flex;flex-direction:column;padding:28px;border-radius:8px;background:var(--dx-s1);border:1px solid var(--dx-line);scroll-margin-top:130px;transition:transform .4s,border-color .4s,background .4s}
.dx-card:hover{transform:translateY(-5px);border-color:rgba(6,114,203,.55);background:var(--dx-s2)}
.dx-card:target{border-color:var(--dx-cyan);box-shadow:0 0 0 3px rgba(65,182,230,.25)}
.dx-card__top{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}
.dx-card__icon{display:grid;place-items:center;width:50px;height:50px;border-radius:6px;background:linear-gradient(135deg,var(--dx-blue),#0a4a8a);color:#fff;font-size:20px;box-shadow:0 10px 24px -10px rgba(6,114,203,.9)}
.dx-card__top small{font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--dx-cyan)}
.dx-card h3{margin:0 0 10px;font-size:21px;font-weight:800;color:#fff}
.dx-card p{margin:0 0 16px;font-size:15px;line-height:1.65;color:var(--dx-mut)}
.dx-card ul{list-style:none;margin:0 0 24px;padding:0;display:grid;gap:9px}
.dx-card li{display:flex;align-items:center;gap:10px;font-size:14.5px;font-weight:600;color:#dfe3e8}
.dx-card li i{color:var(--dx-cyan);font-size:12px}
.dx-card__btns{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:auto}
/* feature band */
.dx-feature{display:grid;grid-template-columns:1.1fr 1fr;align-items:stretch;background:#05070a;border-top:1px solid var(--dx-line);border-bottom:1px solid var(--dx-line)}
.dx-feature__pic{position:relative;overflow:hidden;min-height:440px}
.dx-feature__pic img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:88% 50%;transition:transform 1.2s cubic-bezier(.22,.8,.26,1)}
.dx-feature:hover .dx-feature__pic img{transform:scale(1.05)}
.dx-feature__pic::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 60%,#05070a)}
.dx-feature__copy{padding:clamp(48px,6vw,90px) clamp(24px,5vw,80px)}
.dx-feature__copy .dx-lead{margin:16px 0 28px}
.dx-points{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.dx-point{display:grid;gap:4px;padding:18px;border-radius:6px;background:var(--dx-s1);border:1px solid var(--dx-line);border-left:3px solid var(--dx-blue);transition:border-color .3s,background .3s}
.dx-point:hover{background:var(--dx-s2);border-left-color:var(--dx-cyan)}
.dx-point i{color:var(--dx-cyan);font-size:18px;margin-bottom:6px}
.dx-point b{font-size:15.5px;color:#fff}
.dx-point small{font-size:13.5px;color:var(--dx-mut)}
/* support + business */
.dx-duo{display:grid;grid-template-columns:1fr 1.15fr;gap:22px}
.dx-support,.dx-biz{padding:clamp(26px,3vw,40px);border-radius:8px;background:var(--dx-s1);border:1px solid var(--dx-line)}
.dx-support ul{list-style:none;margin:0;padding:0}
.dx-support li+li{border-top:1px solid var(--dx-line)}
.dx-support a{display:flex;align-items:center;gap:16px;padding:16px 4px;color:#fff;transition:padding .3s,color .3s}
.dx-support a>i:first-child{width:22px;text-align:center;color:var(--dx-cyan);font-size:18px}
.dx-support a span{display:grid;gap:2px;flex:1}
.dx-support a b{font-size:15.5px}
.dx-support a small{font-size:13.5px;color:var(--dx-mut)}
.dx-support__go{font-size:12px;color:#6b7480;transition:translate .3s,color .3s}
.dx-support a:hover{padding-left:12px;color:#fff}
.dx-support a:hover .dx-support__go{translate:4px 0;color:var(--dx-cyan)}
.dx-biz{position:relative;overflow:hidden;background:radial-gradient(120% 90% at 100% 0%,rgba(6,114,203,.35),transparent 55%),var(--dx-s1)}
.dx-biz .dx-lead{margin:14px 0 22px}
.dx-biz__feats{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:28px}
.dx-biz__feats span{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border-radius:3px;background:rgba(255,255,255,.06);border:1px solid var(--dx-line);font-size:14px;font-weight:600}
.dx-biz__feats i{color:var(--dx-cyan)}
/* who we serve */
.dx-serve{background:var(--dx-blue);background:linear-gradient(90deg,#0559a3,#0672cb 50%,#0a83d8)}
.dx-serve__in{display:grid;grid-template-columns:repeat(4,1fr)}
.dx-serve__item{display:flex;align-items:center;justify-content:center;gap:12px;padding:30px 12px;color:#fff;font-size:15.5px}
.dx-serve__item+.dx-serve__item{border-left:1px solid rgba(255,255,255,.2)}
.dx-serve__item i{font-size:22px;color:#cdeafa}
/* cta */
.dx-cta{display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap;padding:clamp(30px,4vw,52px);border-radius:8px;background:radial-gradient(100% 140% at 0% 0%,#0a83d8,#0559a3 55%,#03396b);box-shadow:0 40px 80px -40px rgba(6,114,203,.7)}
.dx-cta h2{margin:0 0 8px;font-size:clamp(24px,2.6vw,34px);font-weight:800;color:#fff}
.dx-cta p{margin:0;max-width:560px;color:#d6ebfa;font-size:16px;line-height:1.6}
/* modal accents */
.page-hw2 .amodal__icon{background:var(--dx-blue);color:#fff}
.page-hw2 .amodal__submit{background:var(--dx-blue);border-radius:4px}
.page-hw2 .amodal__submit:hover{background:var(--dx-blue2)}
/* responsive */
@media (prefers-reduced-motion:reduce){.dx-hero__bg img,.dx-hero__line,.dx-dot{animation:none}.dx-up{animation:none;opacity:1;transform:none}}
@media (max-width:1180px){.dx-tiles{grid-template-columns:repeat(3,1fr)}.dx-grid{grid-template-columns:repeat(2,1fr)}.dx-feature{grid-template-columns:1fr}.dx-feature__pic{min-height:300px}.dx-feature__pic::after{background:linear-gradient(0deg,#05070a,transparent 50%)}.dx-duo{grid-template-columns:1fr}}
@media (max-width:860px){.dx-brands,.dx-grid{grid-template-columns:1fr}.dx-serve__in{grid-template-columns:1fr 1fr}.dx-serve__item:nth-child(3){border-left:0}.dx-serve__item:nth-child(n+3){border-top:1px solid rgba(255,255,255,.2)}}
@media (max-width:600px){.dx-hero{padding:130px 0 60px;min-height:0}.dx-hero::before{background:linear-gradient(0deg,#05070a 10%,rgba(5,7,10,.8) 55%,rgba(5,7,10,.45))}.dx-hero__bg{inset:90px 0 0 0}.dx-tiles{grid-template-columns:1fr 1fr}.dx-points{grid-template-columns:1fr}.dx-btns .dx-btn{flex:1 1 100%}.dx-serve__item{font-size:13.5px;padding:22px 8px;flex-direction:column;text-align:center}}
.page-hw2 .dx-title,.page-hw2 .dx-hero__title,.page-hw2 .dx-card h3,.page-hw2 .dx-brand h3,.page-hw2 .dx-cta h2{font-family:var(--f-body);letter-spacing:-.02em}
.page-hw2 .header{color:var(--ink,#0b0d10)}
.menu-open .page-hw2 .header,.page-hw2.menu-open .header,.menu-open.page-hw2 .header{background:transparent;box-shadow:none}
.page-hw2 .header .btn--blue{color:#fff}
/* "Why Buy From Us" band: whole portrait photo beside the text */
.page-hw2 .dx-feature{display:block;padding:clamp(70px,8vw,110px) 0}
.dx-feature__in{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(36px,5vw,80px);align-items:center}
.page-hw2 .dx-feature__pic{position:relative;min-height:0;aspect-ratio:952/1269;max-width:460px;width:100%;justify-self:center;border-radius:20px;overflow:hidden;box-shadow:0 40px 70px -40px rgba(0,0,0,.9),0 0 0 1px rgba(255,255,255,.07)}
.page-hw2 .dx-feature__pic::after{display:none}
.page-hw2 .dx-feature__pic img,.page-hw2 .dx-feature:hover .dx-feature__pic img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%;transform:none}
.page-hw2 .dx-feature__copy{padding:0}
@media (max-width:1180px){.dx-feature__in{grid-template-columns:1fr}.page-hw2 .dx-feature__pic{max-width:420px;justify-self:start;min-height:0}}
/* landscape photo (4 laptops) - whole picture visible */
.dx-feature__in{grid-template-columns:1.1fr 1fr}
.page-hw2 .dx-feature__pic{aspect-ratio:3/2;max-width:none}
@media (max-width:1180px){.dx-feature__in{grid-template-columns:1fr}.page-hw2 .dx-feature__pic{max-width:640px}}
.page-hw2 .dx-feature__pic{aspect-ratio:1677/938}
.dx-hero__bg img{object-position:58% 42%;transform-origin:75% 50%}
.dx-hero::before{background:linear-gradient(90deg,#05070a 0%,rgba(5,7,10,.9) 28%,rgba(5,7,10,.45) 52%,rgba(5,7,10,.05) 100%),linear-gradient(0deg,#0b0d10 0%,transparent 28%)}
/* header photo: wide (landscape) picture - laptops whole and clear on the right, dark on the left */
.dx-hero__bg img{object-fit:cover;object-position:100% 50%;animation:none;transform:none}
.dx-hero::before{background:linear-gradient(90deg,#05070a 0%,rgba(5,7,10,.9) 28%,rgba(5,7,10,.45) 44%,rgba(5,7,10,0) 58%),linear-gradient(0deg,#0b0d10 0%,transparent 14%)}
@media (max-width:1180px){.dx-hero__bg img{object-position:88% 50%}}
@media (max-width:600px){.dx-hero__bg img{object-position:82% 50%}.dx-hero::before{background:linear-gradient(0deg,#05070a 10%,rgba(5,7,10,.82) 55%,rgba(5,7,10,.55))}}
/* header photo: comes in with an animation, then a soft light sweep */
.dx-hero__bg{overflow:hidden}
.dx-hero__bg img{opacity:0;transform:translateX(80px) scale(1.06);filter:blur(6px) brightness(.7);animation:dxPicIn 1.6s cubic-bezier(.22,.8,.26,1) .1s forwards}
@keyframes dxPicIn{to{opacity:1;transform:none;filter:none}}
.dx-hero__bg::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(105deg,transparent 40%,rgba(170,215,255,.20) 49%,rgba(255,255,255,.08) 52%,transparent 62%);background-size:260% 100%;background-position:130% 0;animation:dxSweep2 7s ease-in-out 1.8s infinite}
@keyframes dxSweep2{0%{background-position:130% 0}40%,100%{background-position:-130% 0}}
@media (prefers-reduced-motion:reduce){.dx-hero__bg img{animation:none;opacity:1;transform:none;filter:none}.dx-hero__bg::after{display:none}}
/* store photo: full width landscape, whole scene visible */
.dx-hero__bg img{object-position:50% 40%}
.dx-hero::before{background:linear-gradient(90deg,#05070a 0%,rgba(5,7,10,.85) 26%,rgba(5,7,10,.4) 46%,rgba(5,7,10,.05) 62%,rgba(5,7,10,0) 100%),linear-gradient(0deg,#0b0d10 0%,transparent 16%)}
@media (max-width:600px){.dx-hero__bg img{object-position:60% 50%}.dx-hero::before{background:linear-gradient(0deg,#05070a 10%,rgba(5,7,10,.8) 55%,rgba(5,7,10,.5))}}
.dx-hero::before{background:linear-gradient(90deg,#05070a 0%,rgba(5,7,10,.9) 30%,rgba(5,7,10,.6) 48%,rgba(5,7,10,.1) 66%,rgba(5,7,10,0) 100%),linear-gradient(0deg,#0b0d10 0%,transparent 16%)}
@media (max-width:600px){.dx-hero::before{background:linear-gradient(0deg,#05070a 10%,rgba(5,7,10,.8) 55%,rgba(5,7,10,.5))}}
/* widened store photo: same header size, whole store visible on the right */
.dx-hero__bg img{object-position:100% 50%}
@media (max-width:1180px){.dx-hero__bg img{object-position:85% 50%}}
@media (max-width:600px){.dx-hero__bg img{object-position:78% 50%}}
.page-hw2 .dx-feature__pic{aspect-ratio:16/9}
/* portrait photo (Lenovo) - whole picture visible */
.dx-feature__in{grid-template-columns:.8fr 1.2fr}
.page-hw2 .dx-feature__pic{aspect-ratio:952/1269;max-width:460px}
@media (max-width:1180px){.dx-feature__in{grid-template-columns:1fr}.page-hw2 .dx-feature__pic{max-width:420px}}
/* square photo - whole picture visible */
.dx-feature__in{grid-template-columns:.9fr 1.1fr}
.page-hw2 .dx-feature__pic{aspect-ratio:1/1;max-width:540px}
@media (max-width:1180px){.dx-feature__in{grid-template-columns:1fr}.page-hw2 .dx-feature__pic{max-width:480px}}
/* ===== hero: one picture cut into slanted strips (like the Services page), opening from the centre ===== */
.dx-hero{background:radial-gradient(60% 80% at 75% 45%,rgba(6,114,203,.18),transparent 70%),#05070a}
.dx-hero::before{display:none}
.dx-hero__bg{display:none}
.dx-strips{--g:10px;--sk:12deg;--ext:calc(var(--h) * .2126);--h:clamp(380px,32vw,520px);position:absolute;z-index:0;right:clamp(16px,3vw,60px);top:50%;width:min(58%,980px);height:var(--h);margin-top:calc(var(--h) / -2 + 30px);display:flex;gap:var(--g)}
.dx-strip{position:relative;flex:1 1 0;transform:skewX(calc(var(--sk) * -1));border-radius:6px;overflow:hidden;box-shadow:0 30px 60px -30px rgba(0,0,0,.9)}
.dx-strip__clip{position:absolute;inset:0;overflow:hidden;clip-path:inset(50% 0 50% 0);animation:dxStripOpen 1.1s cubic-bezier(.77,0,.18,1) forwards;animation-delay:calc(.2s + var(--d) * .16s)}
.dx-strip__clip img{position:absolute;top:0;height:100%;max-width:none;object-fit:cover;width:calc(var(--n) * 100% + (var(--n) - 1) * var(--g) + var(--ext) * 2);left:calc(var(--i) * -1 * (100% + var(--g)) - var(--ext));transform:skewX(var(--sk)) scale(1.12);transform-origin:50% 50%;animation:dxStripImg 1.6s cubic-bezier(.22,.8,.26,1) forwards;animation-delay:calc(.2s + var(--d) * .16s);transition:scale .6s}
.dx-strip:hover .dx-strip__clip img{scale:1.04}
.dx-strip::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,transparent 60%,rgba(5,7,10,.45));transform:none}
@keyframes dxStripOpen{to{clip-path:inset(0 0 0 0)}}
@keyframes dxStripImg{to{transform:skewX(var(--sk)) scale(1)}}
.dx-hero__in{position:relative;z-index:2}
.page-hw2 .dx-hero__title{max-width:520px;font-size:clamp(36px,3.7vw,58px)}
.page-hw2 .dx-hero__text{max-width:440px}
@media (prefers-reduced-motion:reduce){.dx-strip__clip{animation:none;clip-path:none}.dx-strip__clip img{animation:none;transform:skewX(var(--sk))}}
@media (max-width:1180px){.dx-strips{position:relative;right:auto;top:auto;margin:0 auto 36px;width:calc(100% - 48px);--h:clamp(260px,46vw,420px)}.dx-hero{flex-direction:column;align-items:stretch;padding-top:130px}}
@media (max-width:600px){.dx-strips{--g:6px;--sk:9deg;width:calc(100% - 28px);--h:240px;margin-bottom:28px}.dx-hero{padding-top:110px}}
@media (max-width:1180px){.dx-strips{box-sizing:border-box;padding:0 calc(var(--h) * .11)}}
@media (min-width:1181px){.dx-strips{--h:clamp(380px,30vw,470px)}}
/* strips sit inside the page width (end where the other sections end) */
.dx-hero__in{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(30px,4vw,64px);align-items:center}
.dx-strips{position:relative;right:auto;top:auto;margin:0;width:100%;box-sizing:border-box;padding:0 calc(var(--h) * .107)}
@media (max-width:1180px){.dx-hero__in{grid-template-columns:1fr}.dx-strips{order:-1;margin:0 0 30px}}
/* wider strips: picture moves left and fills the space next to the text */
@media (min-width:1181px){
  .dx-hero__in{grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr);gap:clamp(10px,1.5vw,28px)}
  .dx-strips{--h:clamp(420px,34vw,540px);--g:8px;margin-left:calc(var(--h) * -.06)}
  .page-hw2 .dx-hero__title{font-size:clamp(34px,3.4vw,54px)}
}
@media (min-width:1181px){
  .dx-hero__in{grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr)}
  .dx-strips{margin-left:0;padding:0 calc(var(--h) * .107) 0 calc(var(--h) * .107)}
  .page-hw2 .dx-hero__title{max-width:none;font-size:clamp(32px,3vw,50px)}
}
/* strips: thicker, and the bottom of the last strip ends exactly where the page content ends */
@media (min-width:1181px){
  .dx-strips{--g:7px;padding:0 0 0 calc(var(--h) * .107);margin-right:calc(var(--h) * -.1063)}
  .dx-hero{overflow:hidden}
}
@media (min-width:1181px){.dx-strips{margin-right:calc(var(--h) * -.2126 / 2 - var(--h) * .2126 / 2)}}
@media (min-width:1181px){.dx-strips{margin-right:0;width:calc(100% + var(--h) * .2126 / 2)}}

/* ===== Hero: photo behind the text (soft blur), like the home page ===== */
.dx-hero--photo{min-height:clamp(620px,43vw,720px);padding:140px 0 60px}
.dx-hero__photo{position:absolute;inset:108px 0 0 0;z-index:-1;overflow:hidden;background:#05070a}
.dx-hero__photo img{position:absolute;inset:-12px;width:calc(100% + 24px);height:calc(100% + 24px);max-width:none;object-fit:cover;object-position:center 70%;filter:blur(1.5px) saturate(1.08);opacity:0;transform:scale(1.12);animation:dxPhotoIn 1.4s cubic-bezier(.2,.8,.2,1) .05s forwards,dxPhotoZoom 14s ease-in-out 1.45s infinite alternate}
.dx-hero__photo::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,7,10,.92) 0%,rgba(5,7,10,.78) 38%,rgba(5,7,10,.45) 65%,rgba(5,7,10,.35) 100%),linear-gradient(0deg,#0b0d10 0%,rgba(11,13,16,0) 30%)}
@keyframes dxPhotoIn{to{opacity:1;transform:scale(1.04)}}
@keyframes dxPhotoZoom{from{transform:scale(1.04)}to{transform:scale(1.12)}}
@media (max-width:600px){.dx-hero--photo{padding:130px 0 60px;min-height:0}.dx-hero__photo{inset:90px 0 0 0}.dx-hero__photo::after{background:linear-gradient(0deg,#05070a 10%,rgba(5,7,10,.8) 55%,rgba(5,7,10,.55))}}
@media (prefers-reduced-motion:reduce){.dx-hero__photo img{animation:none;opacity:1;transform:none}}
.dx-hero__photo::after{background:linear-gradient(90deg,rgba(5,7,10,.92) 0%,rgba(5,7,10,.75) 34%,rgba(5,7,10,.25) 58%,rgba(5,7,10,.1) 100%),linear-gradient(0deg,#0b0d10 0%,rgba(11,13,16,0) 22%)}
@keyframes dxPhotoIn{to{opacity:1;transform:scale(1)}}
@keyframes dxPhotoZoom{from{transform:scale(1)}to{transform:scale(1.06)}}
.dx-hero__photo img{object-position:right center;filter:saturate(1.08)}
.dx-hero__photo::after{background:linear-gradient(90deg,rgba(5,7,10,.92) 0%,rgba(5,7,10,.7) 34%,rgba(5,7,10,.15) 58%,rgba(5,7,10,0) 100%),linear-gradient(0deg,#0b0d10 0%,rgba(11,13,16,0) 18%)}
@media (max-width:600px){.dx-hero__photo img{object-position:80% center}}
/* full-width clear photo, laptops in view */
.dx-hero__photo img{object-position:center 72%;filter:none}
.dx-hero__photo::after{background:linear-gradient(90deg,rgba(5,7,10,.85) 0%,rgba(5,7,10,.6) 30%,rgba(5,7,10,.15) 55%,rgba(5,7,10,0) 100%),linear-gradient(0deg,#0b0d10 0%,rgba(11,13,16,0) 18%)}
@media (max-width:600px){.dx-hero__photo img{object-position:65% 70%}.dx-hero__photo::after{background:linear-gradient(0deg,#05070a 8%,rgba(5,7,10,.75) 55%,rgba(5,7,10,.5))}}
.dx-hero__photo img{object-position:center 55%}
.dx-hero__photo img{object-position:center 22%}
.dx-hero__photo img{object-position:center 40%}
/* "Get Started" in the header: same as the other pages */
.page-hw2 .header .btn--blue{background:#1b2f8f;border-radius:50px;color:#fff}
