.vx-solutions-design { color: #15191f; margin-block-start: 0; }
.vx-solutions-design > section { margin-block: 0; }
.vx-solutions-design h2 { font-size: clamp(28px,3.34vw,48px); font-weight: 600; line-height: 1.3; letter-spacing: -.025em; margin: 0 0 16px; }
.vx-solutions-design p { font-size: 16px; color: #737980; line-height: 1.5; margin: 0; }
.vx-solutions-design .vx-solutions-eyebrow { color: #075bf0; font-size: 20px; font-weight: 700; letter-spacing: .05em; margin-bottom: 12px; }
.vx-solutions-design svg { width: 28px; height: 28px; flex-shrink: 0; color: #0760ff; }
.vx-solutions-design a { color: #075bea; font-size: 16px; font-weight: 700; }
.vx-solutions-design a:focus-visible,.vx-solutions-design summary:focus-visible { outline: 3px solid #075bea; outline-offset: 5px; }
.vx-solutions-banner { position: relative; overflow: hidden; padding: 60px max(44px,calc((100% - 1232px)/2)) 72px; text-align: center; background: radial-gradient(ellipse at 0% 45%,#71b7ff55,transparent 50%),radial-gradient(ellipse at 100% 75%,#94c5ff44,transparent 45%),linear-gradient(145deg,#1559af,#4b9af0); }
.vx-solutions-banner::before { content: ''; position: absolute; inset: -25%; pointer-events: none; opacity: .24; background: repeating-conic-gradient(from 15deg at 40% 55%,transparent 0deg 12deg,#93caff44 18deg 20deg,transparent 25deg 50deg); filter: blur(15px); }
.vx-solutions-banner > * { position: relative; }
.vx-solutions-banner .vx-solutions-eyebrow { color: #bfd6fa; }
.vx-solutions-banner h1 { font-size: clamp(30px,3.34vw,48px); color: #fff; font-weight: 600; line-height: 1.35; letter-spacing: -.01em; margin: 16px 0 58px; }
.vx-solutions-diagram { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 32px; align-items: center; position: relative; }
.vx-solutions-diagram::before { content: ''; position: absolute; left: 10%; right: 10%; top: 50%; border-top: 1px solid #b8d7ff66; }
.vx-solutions-node { position: relative; border: 1px solid #b0d2ff66; border-radius: 8px; }
.vx-solutions-node-side { color: #eff6ff; background: #acd1ff17; padding: 24px; text-align: left; }
.vx-solutions-node-side > span { color: #bfdbff; font-size: 12px; }
.vx-solutions-node-side h2 { display: flex; align-items: center; gap: 7px; font-size: 20px; color: #fff; letter-spacing: 0; margin: 6px 0 12px; }
.vx-solutions-node-side svg { width: 20px; height: 20px; color: inherit; }
.vx-solutions-node-side p { color: #d1e4ff; font-size: 14px; }
.vx-solutions-node-side small { display: block; color: #b8d6ff; font-size: 10px; margin-top: -8px; margin-bottom: 12px; }
.vx-solutions-node-core { background: #fff; padding: 40px 24px; box-shadow: 0 24px 30px #174d7e38; }
.vx-solutions-node-core h2 { font-size: 24px; line-height: 1.3; margin: 22px 0 10px; }
.vx-solutions-icon { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 8px; background: #eff6ff; flex-shrink: 0; }
.vx-solutions-node-core .vx-solutions-icon { width: 80px; height: 80px; margin: auto; }
.vx-solutions-core-pill { font-size: 12px; color: #858b93; background: #f1f2f3; border-radius: 20px; padding: 4px 12px; }
.vx-solutions-node-core p { font-size: 10px; color: #b8c0cc; margin-top: 18px; }
.vx-solutions-summary,.vx-solutions-insights { background: #eaf3ff; padding: 112px max(44px,calc((100% - 1352px)/2)); }
.vx-solutions-heading { text-align: center; margin-bottom: 72px; }
.vx-solutions-heading > p:last-child { font-size: 18px; }
.vx-solutions-accordions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 32px; padding-inline: 36px; align-items: start; }
.vx-solutions-accordions details { background: white; border-radius: 8px; border: 1px solid #e3e8f0; }
.vx-solutions-accordions summary { cursor: pointer; padding: 40px 48px; list-style: none; display: flex; align-items: center; gap: 24px; font-size: 30px; font-weight: 600; }
.vx-solutions-accordions summary::-webkit-details-marker { display: none; }
.vx-solutions-accordions summary::after { content: ''; border-right: 2px solid #8995a6; border-bottom: 2px solid #8995a6; width: 12px; height: 12px; transform: rotate(45deg); margin-left: auto; flex-shrink: 0; }
.vx-solutions-accordions details[open] summary::after { transform: rotate(225deg); }
.vx-solutions-summary-body { padding: 0 48px 32px; }
.vx-solutions-summary-body ul { color: #737980; padding-left: 20px; margin: 20px 0; }
.vx-solutions-insights { padding-top: 80px; }
.vx-solutions-insights .vx-solutions-heading { margin-bottom: 60px; }
.vx-solutions-card-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 32px; }
.vx-solutions-card { background: white; padding: 32px; border: 1px solid #dce3ed; border-radius: 12px; }
.vx-solutions-card header { display: flex; align-items: center; gap: 16px; margin-bottom: 26px; }
.vx-solutions-card h3 { font-size: 20px; margin: 0; line-height: 1.4; }
.vx-solutions-card header p { font-size: 12px; }
.vx-solutions-card > p { line-height: 1.6; }
.vx-solutions-tags { display: flex; flex-wrap: wrap; list-style: none; gap: 8px; padding: 0; margin: 22px 0 32px; }
.vx-solutions-tags li { background: #f0f3f7; color: #606b7b; border: 1px solid #e5eaf0; border-radius: 20px; font-size: 10px; padding: 4px 10px; }
.vx-solutions-card > img { display: block; width: 100%; height: auto; aspect-ratio: 593/158; object-fit: cover; border-radius: 8px; margin-bottom: 26px; }
.vx-solutions-integration { display: grid; grid-template-columns: 1.08fr 1fr; gap: 52px; align-items: center; background: #f5f8fc; padding: 136px max(44px,calc((100% - 1352px)/2)); }
.vx-solutions-integration figure { position: relative; margin: 0; border-radius: 24px; overflow: hidden; }
.vx-solutions-integration figure::after { content: ''; position: absolute; inset: 40% 0 0; background: linear-gradient(transparent,#000b); }
.vx-solutions-integration img { width: 100%; aspect-ratio: 672/598; object-fit: cover; display: block; }
.vx-solutions-integration figcaption { position: absolute; bottom: 32px; left: 32px; right: 24px; z-index: 1; color: #fff; }
.vx-solutions-integration figcaption span { display: block; font-size: 16px; letter-spacing: .08em; color: #c4c9cc; margin-bottom: 8px; }
.vx-solutions-integration figcaption strong { font-size: 24px; font-weight: 500; }
.vx-solutions-integration-copy .vx-solutions-eyebrow { font-size: 16px; }
.vx-solutions-integration-copy h2 { margin-bottom: 34px; }
.vx-solutions-integration-copy article { display: flex; gap: 16px; margin-top: 30px; }
.vx-solutions-feature-icon { width: 48px; height: 48px; border-radius: 50%; background: #eaeef4; display: grid; place-items: center; flex-shrink: 0; }
.vx-solutions-feature-icon svg { color: #343b42; width: 24px; height: 24px; }
.vx-solutions-integration-copy h3 { font-size: 20px; font-weight: 500; margin: 0 0 10px; }
.vx-solutions-expertise { background: #f5f8fc; border-top: 1px solid #e7edf5; padding: 120px max(44px,calc((100% - 1352px)/2)); }
.vx-solutions-expertise > h2 { text-align: center; margin-bottom: 56px; }
.vx-solutions-expertise-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 32px; }
.vx-solutions-expertise-grid article { border: 1px solid #e0e7ef; border-radius: 16px; padding: 32px; }
.vx-solutions-expertise-grid h3 { font-size: 20px; margin: 16px 0 10px; }
.vx-solutions-expertise-grid p { font-size: 15px; line-height: 1.4; }
body:has(.vx-solutions-design) .vx-footer { background: linear-gradient(#e3efff,#fff); border: 0; padding-block: 60px 28px; }
body:has(.vx-solutions-design) .vx-footer-title,body:has(.vx-solutions-design) .vx-footer-link,body:has(.vx-solutions-design) .vx-footer-brand p,body:has(.vx-solutions-design) .vx-footer-bottom { color: #475461; }
body:has(.vx-solutions-design) .vx-footer-bottom { border-color: #dae5f0; }
body:has(.vx-solutions-design) .vx-footer-brand > a img { filter: none !important; }
body:has(.vx-solutions-design) .wp-site-blocks > footer { margin-block-start: 0; }
@media(max-width:1100px) { .vx-solutions-accordions { padding-inline: 0; } .vx-solutions-accordions summary { padding: 30px 24px; font-size: 24px; } .vx-solutions-diagram { gap: 20px; } .vx-solutions-node-side { padding: 20px; } .vx-solutions-node-side h2 { font-size: 16px; } .vx-solutions-expertise-grid { gap: 16px; } .vx-solutions-expertise-grid article { padding: 24px; } }
@media(max-width:760px) { .vx-solutions-banner { padding: 40px 20px; } .vx-solutions-banner h1 { margin-bottom: 32px; } .vx-solutions-design .vx-solutions-eyebrow { font-size: 14px; } .vx-solutions-diagram { grid-template-columns: 1fr; max-width: 420px; margin: auto; gap: 20px; } .vx-solutions-diagram::before { left: 50%; right: auto; top: 0; bottom: 0; border-left: 1px solid #b8d7ff66; } .vx-solutions-node-core { grid-row: 1; padding: 24px; } .vx-solutions-node-core .vx-solutions-icon { width: 56px; height: 56px; } .vx-solutions-summary,.vx-solutions-insights,.vx-solutions-integration,.vx-solutions-expertise { padding: 56px 20px; } .vx-solutions-insights { padding-top: 24px; } .vx-solutions-heading,.vx-solutions-insights .vx-solutions-heading { margin-bottom: 32px; } .vx-solutions-heading > p:last-child { font-size: 16px; } .vx-solutions-accordions,.vx-solutions-card-grid,.vx-solutions-integration { grid-template-columns: 1fr; gap: 24px; } .vx-solutions-accordions summary { padding: 26px 24px; font-size: 22px; gap: 16px; } .vx-solutions-summary-body { padding: 0 24px 24px; } .vx-solutions-card { padding: 24px; } .vx-solutions-integration figcaption strong { font-size: 19px; } .vx-solutions-integration figcaption span { font-size: 12px; } .vx-solutions-integration-copy h2 br { display: none; } .vx-solutions-expertise-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } .vx-solutions-expertise-grid article { padding: 20px; } .vx-solutions-expertise-grid h3 { font-size: 17px; } }
@media(prefers-reduced-motion:reduce) { .vx-solutions-design * { scroll-behavior: auto; } }
