.elementor-9275 .elementor-element.elementor-element-e52fed2{--display:flex;--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--padding-top:110px;--padding-bottom:96px;--padding-left:24px;--padding-right:24px;}.elementor-9275 .elementor-element.elementor-element-e52fed2:not(.elementor-motion-effects-element-type-background), .elementor-9275 .elementor-element.elementor-element-e52fed2 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#001B36;}.elementor-9275 .elementor-element.elementor-element-9993a04{--display:flex;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-9275 .elementor-element.elementor-element-532f2f5{--display:flex;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-9275 .elementor-element.elementor-element-336bf3e{--display:flex;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-9275 .elementor-element.elementor-element-9f969b6{--display:flex;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-9275 .elementor-element.elementor-element-1da5bb7{--display:flex;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-9275 .elementor-element.elementor-element-975c3f8 .elementor-heading-title{font-family:"Manrope", Sans-serif;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:2px;color:#7FB3FF;}.elementor-9275 .elementor-element.elementor-element-da0dc0c > .elementor-widget-container{margin:18px 0px 0px 0px;}.elementor-9275 .elementor-element.elementor-element-da0dc0c .elementor-heading-title{font-family:"Sora", Sans-serif;font-size:48px;font-weight:700;line-height:1.12em;color:#FFFFFF;}.elementor-9275 .elementor-element.elementor-element-bca70df > .elementor-widget-container{margin:22px 0px 0px 0px;}.elementor-9275 .elementor-element.elementor-element-bca70df{font-family:"Manrope", Sans-serif;font-size:17px;line-height:1.7em;color:#C4D6EC;}.elementor-9275 .elementor-element.elementor-element-c1ed57f > .elementor-widget-container{margin:20px 0px 26px 0px;}.elementor-9275 .elementor-element.elementor-element-c1ed57f{font-family:"Manrope", Sans-serif;font-size:14px;line-height:1.8em;color:#C4D6EC;}.elementor-9275 .elementor-element.elementor-element-a454232{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--padding-top:8px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-9275 .elementor-element.elementor-element-fa98781{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:center;}.elementor-9275 .elementor-element.elementor-element-b5ee622 .elementor-button{background-color:#F55349;font-family:"Manrope", Sans-serif;font-size:15px;font-weight:700;fill:#FFFFFF;color:#FFFFFF;border-radius:100px 100px 100px 100px;}.elementor-9275 .elementor-element.elementor-element-9e31176{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:center;}.elementor-9275 .elementor-element.elementor-element-524ea01 .elementor-button{background-color:#00000000;font-family:"Manrope", Sans-serif;font-size:15px;font-weight:700;fill:#FFFFFF;color:#FFFFFF;border-style:solid;border-width:1px 1px 1px 1px;border-color:#9FB4D4;border-radius:100px 100px 100px 100px;}.elementor-9275 .elementor-element.elementor-element-0f6b46a{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-9275 .elementor-element.elementor-element-0f6b46a:not(.elementor-motion-effects-element-type-background), .elementor-9275 .elementor-element.elementor-element-0f6b46a > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#00152B;}.elementor-9275 .elementor-element.elementor-element-583d27b{--display:flex;--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--padding-top:0px;--padding-bottom:0px;--padding-left:24px;--padding-right:24px;}.elementor-9275 .elementor-element.elementor-element-583d27b:not(.elementor-motion-effects-element-type-background), .elementor-9275 .elementor-element.elementor-element-583d27b > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#F6F9FC;}.elementor-9275 .elementor-element.elementor-element-a87b2bf .elementor-heading-title{font-family:"Manrope", Sans-serif;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:2px;color:#004F9E;}.elementor-9275 .elementor-element.elementor-element-ee8550f > .elementor-widget-container{margin:16px 0px 0px 0px;}.elementor-9275 .elementor-element.elementor-element-ee8550f .elementor-heading-title{font-family:"Sora", Sans-serif;font-size:38px;font-weight:700;line-height:1.15em;color:#001B36;}.elementor-9275 .elementor-element.elementor-element-0b5950e > .elementor-widget-container{margin:18px 0px 0px 0px;}.elementor-9275 .elementor-element.elementor-element-0b5950e{font-family:"Manrope", Sans-serif;font-size:16px;line-height:1.8em;color:#66727E;}.elementor-9275 .elementor-element.elementor-element-bc84b06{--display:flex;--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--padding-top:0px;--padding-bottom:0px;--padding-left:24px;--padding-right:24px;}.elementor-9275 .elementor-element.elementor-element-bc84b06:not(.elementor-motion-effects-element-type-background), .elementor-9275 .elementor-element.elementor-element-bc84b06 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-9275 .elementor-element.elementor-element-40e22a6 .elementor-heading-title{font-family:"Manrope", Sans-serif;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:2px;color:#004F9E;}.elementor-9275 .elementor-element.elementor-element-2b633a0 > .elementor-widget-container{margin:16px 0px 0px 0px;}.elementor-9275 .elementor-element.elementor-element-2b633a0 .elementor-heading-title{font-family:"Sora", Sans-serif;font-size:38px;font-weight:700;color:#001B36;}.elementor-9275 .elementor-element.elementor-element-1f3ed93 > .elementor-widget-container{margin:16px 0px 0px 0px;}.elementor-9275 .elementor-element.elementor-element-1f3ed93{font-family:"Manrope", Sans-serif;font-size:17px;line-height:1.7em;color:#66727E;}.elementor-9275 .elementor-element.elementor-element-4e0e003 > .elementor-widget-container{margin:18px 0px 0px 0px;}.elementor-9275 .elementor-element.elementor-element-4e0e003{font-family:"Manrope", Sans-serif;font-size:15px;line-height:1.7em;color:#66727E;}.elementor-9275 .elementor-element.elementor-element-9b7650e{--display:flex;}.elementor-9275 .elementor-element.elementor-element-7940eb5{--display:flex;}.elementor-9275 .elementor-element.elementor-element-2066945{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-9275 .elementor-element.elementor-element-1f7080c{--display:flex;}.elementor-9275 .elementor-element.elementor-element-4f10cb7 .elementor-icon-list-icon i{transition:color 0.3s;}.elementor-9275 .elementor-element.elementor-element-4f10cb7 .elementor-icon-list-icon svg{transition:fill 0.3s;}.elementor-9275 .elementor-element.elementor-element-4f10cb7{--e-icon-list-icon-size:14px;--icon-vertical-offset:0px;}.elementor-9275 .elementor-element.elementor-element-4f10cb7 .elementor-icon-list-text{transition:color 0.3s;}.elementor-9275 .elementor-element.elementor-element-67c9dda{--display:flex;}.elementor-9275 .elementor-element.elementor-element-5029d4b{--display:flex;}.elementor-9275 .elementor-element.elementor-element-7392860{--display:flex;}.elementor-9275 .elementor-element.elementor-element-924c598{--display:flex;}.elementor-9275 .elementor-element.elementor-element-59e8ab3{--display:flex;}.elementor-9275 .elementor-element.elementor-element-f68142e{--display:flex;}.elementor-9275 .elementor-element.elementor-element-4481216{--display:flex;}.elementor-9275 .elementor-element.elementor-element-70c3ded{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-9275 .elementor-element.elementor-element-a32cef7{--display:flex;}.elementor-9275 .elementor-element.elementor-element-faf9d2e .elementor-button{background-color:#00000000;font-family:"Manrope", Sans-serif;font-size:15px;font-weight:700;fill:#FFFFFF;color:#FFFFFF;border-style:solid;border-width:1px 1px 1px 1px;border-color:#9FB4D4;border-radius:100px 100px 100px 100px;}.elementor-9275 .elementor-element.elementor-element-4c6a880 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-9275 .elementor-element.elementor-element-4c6a880{font-family:"Manrope", Sans-serif;font-size:16px;line-height:1.8em;color:#C4D6EC;}.elementor-9275 .elementor-element.elementor-element-baac5bc{--display:flex;--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--padding-top:84px;--padding-bottom:84px;--padding-left:24px;--padding-right:24px;}.elementor-9275 .elementor-element.elementor-element-baac5bc:not(.elementor-motion-effects-element-type-background), .elementor-9275 .elementor-element.elementor-element-baac5bc > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#F6F9FC;}.elementor-9275 .elementor-element.elementor-element-b9bf943 .elementor-heading-title{font-family:"Manrope", Sans-serif;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:2px;color:#004F9E;}.elementor-9275 .elementor-element.elementor-element-f4978d2 > .elementor-widget-container{margin:16px 0px 0px 0px;}.elementor-9275 .elementor-element.elementor-element-f4978d2 .elementor-heading-title{font-family:"Sora", Sans-serif;font-size:38px;font-weight:700;color:#001B36;}.elementor-9275 .elementor-element.elementor-element-89f83ea{--display:flex;}.elementor-9275 .elementor-element.elementor-element-1298e4f .elementor-icon-list-icon i{transition:color 0.3s;}.elementor-9275 .elementor-element.elementor-element-1298e4f .elementor-icon-list-icon svg{transition:fill 0.3s;}.elementor-9275 .elementor-element.elementor-element-1298e4f{--e-icon-list-icon-size:14px;--icon-vertical-offset:0px;}.elementor-9275 .elementor-element.elementor-element-1298e4f .elementor-icon-list-text{transition:color 0.3s;}.elementor-9275 .elementor-element.elementor-element-5ef16fe{--display:flex;}.elementor-9275 .elementor-element.elementor-element-876f5bc{--display:flex;}.elementor-9275 .elementor-element.elementor-element-42813c7{--display:flex;}.elementor-9275 .elementor-element.elementor-element-68d22c5{--display:flex;}.elementor-9275 .elementor-element.elementor-element-6ebdf39{--display:flex;}.elementor-9275 .elementor-element.elementor-element-39fa2bf{--display:flex;}.elementor-9275 .elementor-element.elementor-element-c0e08a8{--display:flex;}.elementor-9275 .elementor-element.elementor-element-6a309fa{--display:flex;--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--padding-top:84px;--padding-bottom:84px;--padding-left:24px;--padding-right:24px;}.elementor-9275 .elementor-element.elementor-element-6a309fa:not(.elementor-motion-effects-element-type-background), .elementor-9275 .elementor-element.elementor-element-6a309fa > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-9275 .elementor-element.elementor-element-68b67aa .elementor-heading-title{font-family:"Manrope", Sans-serif;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:2px;color:#004F9E;}.elementor-9275 .elementor-element.elementor-element-d9c8d1f > .elementor-widget-container{margin:16px 0px 0px 0px;}.elementor-9275 .elementor-element.elementor-element-d9c8d1f .elementor-heading-title{font-family:"Sora", Sans-serif;font-size:38px;font-weight:700;color:#001B36;}.elementor-9275 .elementor-element.elementor-element-5c264e8{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--padding-top:30px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-9275 .elementor-element.elementor-element-488a130{--display:flex;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--border-radius:16px 16px 16px 16px;--padding-top:26px;--padding-bottom:26px;--padding-left:24px;--padding-right:24px;}.elementor-9275 .elementor-element.elementor-element-488a130:not(.elementor-motion-effects-element-type-background), .elementor-9275 .elementor-element.elementor-element-488a130 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#F6F9FC;}.elementor-9275 .elementor-element.elementor-element-06a1096 .elementor-heading-title{font-family:"Sora", Sans-serif;font-size:20px;font-weight:600;color:#004F9E;}.elementor-9275 .elementor-element.elementor-element-93b79df{font-family:"Manrope", Sans-serif;font-size:15px;line-height:1.7em;color:#66727E;}.elementor-9275 .elementor-element.elementor-element-a00ae7d{--display:flex;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--border-radius:16px 16px 16px 16px;--padding-top:26px;--padding-bottom:26px;--padding-left:24px;--padding-right:24px;}.elementor-9275 .elementor-element.elementor-element-a00ae7d:not(.elementor-motion-effects-element-type-background), .elementor-9275 .elementor-element.elementor-element-a00ae7d > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#F6F9FC;}.elementor-9275 .elementor-element.elementor-element-71385a7 .elementor-heading-title{font-family:"Sora", Sans-serif;font-size:20px;font-weight:600;color:#004F9E;}.elementor-9275 .elementor-element.elementor-element-cdd6b1a{font-family:"Manrope", Sans-serif;font-size:15px;line-height:1.7em;color:#66727E;}.elementor-9275 .elementor-element.elementor-element-16aa4b0{--display:flex;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--border-radius:16px 16px 16px 16px;--padding-top:26px;--padding-bottom:26px;--padding-left:24px;--padding-right:24px;}.elementor-9275 .elementor-element.elementor-element-16aa4b0:not(.elementor-motion-effects-element-type-background), .elementor-9275 .elementor-element.elementor-element-16aa4b0 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#F6F9FC;}.elementor-9275 .elementor-element.elementor-element-a456a3a .elementor-heading-title{font-family:"Sora", Sans-serif;font-size:20px;font-weight:600;color:#004F9E;}.elementor-9275 .elementor-element.elementor-element-24c53f7{font-family:"Manrope", Sans-serif;font-size:15px;line-height:1.7em;color:#66727E;}.elementor-9275 .elementor-element.elementor-element-7ce0ac3{--display:flex;--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--padding-top:84px;--padding-bottom:84px;--padding-left:24px;--padding-right:24px;}.elementor-9275 .elementor-element.elementor-element-7ce0ac3:not(.elementor-motion-effects-element-type-background), .elementor-9275 .elementor-element.elementor-element-7ce0ac3 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#F6F9FC;}.elementor-9275 .elementor-element.elementor-element-7827a04 .elementor-heading-title{font-family:"Manrope", Sans-serif;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:2px;color:#004F9E;}.elementor-9275 .elementor-element.elementor-element-1c19eec > .elementor-widget-container{margin:16px 0px 0px 0px;}.elementor-9275 .elementor-element.elementor-element-1c19eec .elementor-heading-title{font-family:"Sora", Sans-serif;font-size:38px;font-weight:700;color:#001B36;}.elementor-9275 .elementor-element.elementor-element-2d4b1af > .elementor-widget-container{margin:18px 0px 0px 0px;}.elementor-9275 .elementor-element.elementor-element-2d4b1af{font-family:"Manrope", Sans-serif;font-size:16px;line-height:1.8em;color:#66727E;}.elementor-9275 .elementor-element.elementor-element-d907f35{--display:flex;--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--padding-top:84px;--padding-bottom:84px;--padding-left:24px;--padding-right:24px;}.elementor-9275 .elementor-element.elementor-element-d907f35:not(.elementor-motion-effects-element-type-background), .elementor-9275 .elementor-element.elementor-element-d907f35 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-9275 .elementor-element.elementor-element-94edec2 .elementor-heading-title{font-family:"Manrope", Sans-serif;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:2px;color:#004F9E;}.elementor-9275 .elementor-element.elementor-element-d6527f5 > .elementor-widget-container{margin:16px 0px 0px 0px;}.elementor-9275 .elementor-element.elementor-element-d6527f5 .elementor-heading-title{font-family:"Sora", Sans-serif;font-size:38px;font-weight:700;line-height:1.15em;color:#001B36;}.elementor-9275 .elementor-element.elementor-element-c360139 > .elementor-widget-container{margin:18px 0px 0px 0px;}.elementor-9275 .elementor-element.elementor-element-c360139{font-family:"Manrope", Sans-serif;font-size:16px;line-height:1.8em;color:#66727E;}.elementor-9275 .elementor-element.elementor-element-947203c{--display:flex;}.elementor-9275 .elementor-element.elementor-element-0b26846{--display:flex;}.elementor-9275 .elementor-element.elementor-element-3a4679a{--display:flex;}.elementor-9275 .elementor-element.elementor-element-8c8fddd{--display:flex;}.elementor-9275 .elementor-element.elementor-element-218bd34{--display:flex;}.elementor-9275 .elementor-element.elementor-element-435d4df{--display:flex;}.elementor-9275 .elementor-element.elementor-element-6b1a4d5{--display:flex;}.elementor-9275 .elementor-element.elementor-element-2cd7be2{--display:flex;--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--padding-top:84px;--padding-bottom:84px;--padding-left:24px;--padding-right:24px;}.elementor-9275 .elementor-element.elementor-element-2cd7be2:not(.elementor-motion-effects-element-type-background), .elementor-9275 .elementor-element.elementor-element-2cd7be2 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#F6F9FC;}.elementor-9275 .elementor-element.elementor-element-0eb64fe .elementor-heading-title{font-family:"Manrope", Sans-serif;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:2px;color:#004F9E;}.elementor-9275 .elementor-element.elementor-element-80b58d6 > .elementor-widget-container{margin:16px 0px 0px 0px;}.elementor-9275 .elementor-element.elementor-element-80b58d6 .elementor-heading-title{font-family:"Sora", Sans-serif;font-size:36px;font-weight:700;line-height:1.18em;color:#001B36;}.elementor-9275 .elementor-element.elementor-element-7c22cb5 > .elementor-widget-container{margin:18px 0px 0px 0px;}.elementor-9275 .elementor-element.elementor-element-7c22cb5{font-family:"Manrope", Sans-serif;font-size:16px;line-height:1.85em;color:#66727E;}.elementor-9275 .elementor-element.elementor-element-7cf4c32{--display:flex;--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--padding-top:84px;--padding-bottom:84px;--padding-left:24px;--padding-right:24px;}.elementor-9275 .elementor-element.elementor-element-7cf4c32:not(.elementor-motion-effects-element-type-background), .elementor-9275 .elementor-element.elementor-element-7cf4c32 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-9275 .elementor-element.elementor-element-8762c44 .elementor-heading-title{font-family:"Sora", Sans-serif;font-size:34px;font-weight:700;color:#001B36;}.elementor-9275 .elementor-element.elementor-element-8901aa8{width:var( --container-widget-width, 900px );max-width:900px;--container-widget-width:900px;--container-widget-flex-grow:0;}.elementor-9275 .elementor-element.elementor-element-9683782{--display:flex;--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--padding-top:84px;--padding-bottom:84px;--padding-left:24px;--padding-right:24px;}.elementor-9275 .elementor-element.elementor-element-9683782:not(.elementor-motion-effects-element-type-background), .elementor-9275 .elementor-element.elementor-element-9683782 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#003468;}.elementor-9275 .elementor-element.elementor-element-f98603f .elementor-heading-title{font-family:"Manrope", Sans-serif;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:2px;color:#7FB3FF;}.elementor-9275 .elementor-element.elementor-element-9cf94bf > .elementor-widget-container{margin:16px 0px 0px 0px;}.elementor-9275 .elementor-element.elementor-element-9cf94bf .elementor-heading-title{font-family:"Sora", Sans-serif;font-size:36px;font-weight:700;line-height:1.18em;color:#FFFFFF;}.elementor-9275 .elementor-element.elementor-element-17a8228 > .elementor-widget-container{margin:16px 0px 0px 0px;}.elementor-9275 .elementor-element.elementor-element-17a8228{font-family:"Manrope", Sans-serif;font-size:17px;line-height:1.7em;color:#C4D6EC;}.elementor-9275 .elementor-element.elementor-element-8859c68{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--padding-top:10px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-9275 .elementor-element.elementor-element-cf85ce7{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:center;}.elementor-9275 .elementor-element.elementor-element-dcc6e26 .elementor-button{background-color:#F55349;font-family:"Manrope", Sans-serif;font-size:15px;font-weight:700;fill:#FFFFFF;color:#FFFFFF;border-radius:100px 100px 100px 100px;}.elementor-9275 .elementor-element.elementor-element-5d0b11c{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:center;}.elementor-9275 .elementor-element.elementor-element-06b0f49 .elementor-button{background-color:#00000000;font-family:"Manrope", Sans-serif;font-size:15px;font-weight:700;fill:#FFFFFF;color:#FFFFFF;border-style:solid;border-width:1px 1px 1px 1px;border-color:#9FB4D4;border-radius:100px 100px 100px 100px;}:root{--page-title-display:none;}@media(max-width:767px){.elementor-9275 .elementor-element.elementor-element-8901aa8{width:100%;max-width:100%;}}@media(min-width:768px){.elementor-9275 .elementor-element.elementor-element-fa98781{--width:50%;}.elementor-9275 .elementor-element.elementor-element-9e31176{--width:50%;}.elementor-9275 .elementor-element.elementor-element-488a130{--width:33.33%;}.elementor-9275 .elementor-element.elementor-element-a00ae7d{--width:33.33%;}.elementor-9275 .elementor-element.elementor-element-16aa4b0{--width:33.33%;}.elementor-9275 .elementor-element.elementor-element-cf85ce7{--width:50%;}.elementor-9275 .elementor-element.elementor-element-5d0b11c{--width:50%;}}/* Start custom CSS for text-editor, class: .elementor-element-0b5950e */#gp-body#gp-body#gp-body ul > li.gp-cta{background:linear-gradient(150deg,#E8524B 0%,#8A4657 26%,#4A3D5F 52%,#0A3466 80%,#003366 100%) !important;border-color:transparent !important;color:rgba(255,255,255,.94) !important;box-shadow:0 34px 66px -26px rgba(232,82,75,.45) !important;display:flex !important;flex-direction:column !important}
#gp-body#gp-body#gp-body ul > li.gp-cta strong{color:#fff !important;font-size:18px !important}
#gp-body#gp-body#gp-body ul > li.gp-cta::before{transform:scaleX(1) !important;background:rgba(255,255,255,.62) !important}
#gp-body#gp-body#gp-body ul > li.gp-cta a{margin-top:auto !important;padding-top:18px !important;align-self:flex-start !important;color:#fff !important;font-weight:700 !important;text-decoration:none !important;border-bottom:1px solid rgba(255,255,255,.5) !important;padding-bottom:3px !important}
#gp-body#gp-body#gp-body ul > li.gp-cta a:hover{border-bottom-color:#fff !important}
#gp-body#gp-body#gp-body ul > li.gp-cta:hover{border-color:transparent !important;box-shadow:0 34px 66px -26px rgba(232,82,75,.58) !important}/* End custom CSS */
/* Start custom CSS *//* ================================================================
InfraTech service page system. Crayon Digital, 23 Aug 2026.
The same block sits on every service page. Keep the naming when
adding sections:
#svc-cards-N a card ROW container. Its child containers
become case study style cards: a coloured
head carrying the first heading, white body
underneath.
#svc-cards-ai-N same card, coral head instead of cobalt.
#svc-btns-N a row of side by side buttons, kept together
at the left rather than spread across the row.
.it-creds the hero credentials list, turned into pills.
Two traps found on 23 Aug. Elementor 4 containers do NOT render
the CSS Classes field, so rows are hooked by ID and not by class.
And something in the stack sets widget backgrounds with
!important, so every background here needs it too.
================================================================ */
body.elementor-page-9275 [id^="svc-cards"] > .e-con-inner{align-items:stretch;gap:18px}
body.elementor-page-9275 [id^="svc-cards"] > .e-con-inner > .e-con{position:relative;overflow:hidden;background:#fff!important;border:1px solid #E3EAF2;border-radius:16px!important;padding:0!important;gap:0!important;align-items:stretch!important;transition:transform .45s cubic-bezier(.22,1,.36,1),box-shadow .45s cubic-bezier(.22,1,.36,1),border-color .45s}
body.elementor-page-9275 [id^="svc-cards"] > .e-con-inner > .e-con:hover{transform:translateY(-7px);box-shadow:0 26px 56px rgba(0,52,104,.14);border-color:transparent}
/* coloured head, carries the first heading like the case study cards */
body.elementor-page-9275 [id^="svc-cards"] > .e-con-inner > .e-con > .elementor-widget-heading:first-child{margin:0!important;padding:24px 24px 20px;min-height:92px;display:flex;align-items:flex-end;background:radial-gradient(rgba(255,255,255,.5) 1.4px,transparent 1.4px) 0 0/16px 16px,linear-gradient(140deg,#004F9E,#0A5DB5)!important}
body.elementor-page-9275 [id^="svc-cards-ai"] > .e-con-inner > .e-con > .elementor-widget-heading:first-child{background:radial-gradient(rgba(255,255,255,.5) 1.4px,transparent 1.4px) 0 0/16px 16px,linear-gradient(140deg,#F55349,#FF9387)!important}
body.elementor-page-9275 [id^="svc-cards"] > .e-con-inner > .e-con > .elementor-widget-heading:first-child .elementor-heading-title,
body.elementor-page-9275 [id^="svc-cards"] > .e-con-inner > .e-con > .elementor-widget-heading:first-child .elementor-heading-title a{color:#fff!important;text-align:left;font-size:19px;line-height:1.28;letter-spacing:-.01em;transition:opacity .25s}
body.elementor-page-9275 [id^="svc-cards"] > .e-con-inner > .e-con > .elementor-widget-heading:first-child .elementor-heading-title a:hover{opacity:.82}
/* second heading, where the card has an eyebrow plus a title */
body.elementor-page-9275 [id^="svc-cards"] > .e-con-inner > .e-con > .elementor-widget-heading:not(:first-child){margin:0!important;padding:22px 24px 0;text-align:left}
/* white body */
body.elementor-page-9275 [id^="svc-cards"] > .e-con-inner > .e-con > .elementor-widget-text-editor{margin:0!important;padding:20px 24px 26px;text-align:left}
body.elementor-page-9275 [id^="svc-cards"] > .e-con-inner > .e-con > .elementor-widget-heading:not(:first-child) + .elementor-widget-text-editor{padding-top:10px}
/* button rows stay together at the left */
body.elementor-page-9275 [id^="svc-btns"] > .e-con-inner{justify-content:flex-start;align-items:center;gap:14px;flex-wrap:wrap}
body.elementor-page-9275 [id^="svc-btns"] > .e-con-inner > .e-con{width:auto!important;flex:0 0 auto;padding:0!important}
/* hero credential pills, matching the homepage */
body.elementor-page-9275 .it-creds ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:9px}
body.elementor-page-9275 .it-creds ul li{margin:0;padding:8px 15px;border-radius:999px;line-height:1.2!important;background:rgba(127,179,255,.10)!important;border:1px solid rgba(127,179,255,.28)}
@media(max-width:900px){
body.elementor-page-9275 [id^="svc-cards"] > .e-con-inner > .e-con{width:calc(50% - 9px)!important}
}
@media(max-width:600px){
body.elementor-page-9275 [id^="svc-cards"] > .e-con-inner > .e-con{width:100%!important}
}
/* ---------- SECTION DESIGN SYSTEM. Crayon Digital, 23 Aug 2026. ----------
Ads, 23 Aug: the service pages read as basic next to the homepage. This
block gives every section the homepage rhythm with no content edits at all:
a numbered eyebrow with a pill and a hairline rule, a ghost numeral
watermark, a measured prose column, and real treatment for the bullet and
numbered lists the copy is full of. Identical on every service page.
Three guards worth keeping.
1. In PAGE settings, Elementor expands "body.elementor-page-9275" to body.elementor-page-N,
not to the page wrapper, so "body.elementor-page-9275 > .e-con" matches nothing. Scoping
through .page-content > .elementor is what reaches the sections, and it
also keeps the header and footer templates out of the numbering.
2. The eyebrow rules target div.elementor-heading-title only, so a section
that opens with a real H2 rather than an eyebrow is left alone.
3. The list rules skip .it-creds so the hero credential pills survive.
Colours use currentColor, so the same rules work on the light and the dark
bands without needing to know which is which. */
body.elementor-page-9275 .page-content > .elementor{counter-reset:sec}
body.elementor-page-9275 .page-content > .elementor > .e-con{counter-increment:sec;position:relative}
body.elementor-page-9275 .page-content > .elementor > .e-con:first-child{counter-increment:none}
body.elementor-page-9275 .page-content > .elementor > .e-con > .e-con-inner{position:relative;z-index:1}
body.elementor-page-9275 .page-content > .elementor > .e-con:not(:first-child)::after{content:counter(sec,decimal-leading-zero);position:absolute;top:6px;right:44px;font-family:'Sora',sans-serif;font-size:180px;font-weight:700;line-height:1;letter-spacing:-.05em;color:#7FB3FF;opacity:.09;pointer-events:none;z-index:0}
/* numbered eyebrow: pill, label, hairline rule */
body.elementor-page-9275 .page-content > .elementor > .e-con:not(:first-child) > .e-con-inner > .elementor-widget-heading:first-child{width:100%;align-self:stretch}
body.elementor-page-9275 .page-content > .elementor > .e-con:not(:first-child) > .e-con-inner > .elementor-widget-heading:first-child div.elementor-heading-title{display:flex;align-items:center;gap:14px;width:100%}
body.elementor-page-9275 .page-content > .elementor > .e-con:not(:first-child) > .e-con-inner > .elementor-widget-heading:first-child div.elementor-heading-title::before{content:counter(sec,decimal-leading-zero);flex:0 0 auto;border:1px solid currentColor;border-radius:999px;padding:5px 11px;font-size:11px;font-weight:700;letter-spacing:1.4px;opacity:.9}
body.elementor-page-9275 .page-content > .elementor > .e-con:not(:first-child) > .e-con-inner > .elementor-widget-heading:first-child div.elementor-heading-title::after{content:"";flex:1 1 auto;height:1px;background:currentColor;opacity:.22}
/* measured columns, so prose stops running the full 1400 */
body.elementor-page-9275 .page-content > .elementor > .e-con > .e-con-inner > .elementor-widget-heading:nth-child(2) .elementor-heading-title{max-width:1040px}
body.elementor-page-9275 .page-content > .elementor > .e-con > .e-con-inner > .elementor-widget-text-editor:not(.it-creds){max-width:900px}
/* numbered lists become steps */
body.elementor-page-9275 .page-content > .elementor > .e-con > .e-con-inner > .elementor-widget-text-editor:not(.it-creds) ol{list-style:none;counter-reset:step;margin:24px 0 0;padding:0}
body.elementor-page-9275 .page-content > .elementor > .e-con > .e-con-inner > .elementor-widget-text-editor:not(.it-creds) ol > li{counter-increment:step;position:relative;margin:0;padding:17px 0 17px 68px;border-bottom:1px solid rgba(127,179,255,.24)}
body.elementor-page-9275 .page-content > .elementor > .e-con > .e-con-inner > .elementor-widget-text-editor:not(.it-creds) ol > li:last-child{border-bottom:0}
body.elementor-page-9275 .page-content > .elementor > .e-con > .e-con-inner > .elementor-widget-text-editor:not(.it-creds) ol > li::before{content:counter(step,decimal-leading-zero);position:absolute;left:0;top:15px;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(140deg,#F55349,#FF9387);color:#fff;font-family:'Manrope',sans-serif;font-size:12px;font-weight:700;letter-spacing:.5px}
/* bullet lists become feature rows */
body.elementor-page-9275 .page-content > .elementor > .e-con > .e-con-inner > .elementor-widget-text-editor:not(.it-creds) ul{list-style:none;margin:24px 0 0;padding:0}
body.elementor-page-9275 .page-content > .elementor > .e-con > .e-con-inner > .elementor-widget-text-editor:not(.it-creds) ul > li{position:relative;margin:0;padding:15px 0 15px 30px;border-bottom:1px solid rgba(127,179,255,.20)}
body.elementor-page-9275 .page-content > .elementor > .e-con > .e-con-inner > .elementor-widget-text-editor:not(.it-creds) ul > li:last-child{border-bottom:0}
body.elementor-page-9275 .page-content > .elementor > .e-con > .e-con-inner > .elementor-widget-text-editor:not(.it-creds) ul > li::before{content:"";position:absolute;left:2px;top:23px;width:9px;height:9px;border-radius:50%;background:linear-gradient(140deg,#F55349,#FF9387)}
body.elementor-page-9275 .page-content > .elementor > .e-con > .e-con-inner > .elementor-widget-text-editor:not(.it-creds) li strong{display:block;margin-bottom:3px;font-weight:700;letter-spacing:-.01em}
@media(max-width:900px){
body.elementor-page-9275 .page-content > .elementor > .e-con:not(:first-child)::after{font-size:110px;right:18px;opacity:.07}
body.elementor-page-9275 .page-content > .elementor > .e-con > .e-con-inner > .elementor-widget-text-editor:not(.it-creds) ol > li{padding-left:58px}
}
/* ================================================================
B-CRAFT, Crayon Digital, 28 Aug 2026.
Brings the Digital Engineering page up to the AI Transformation Hub's standard.
Mayank, 27 Aug: the hub is the benchmark, and the white / blue
alternation has to be consistent across the service pages too.
Nothing structural changed. Every device below is driven off the
markup that was already here: sections carry _element_id, and the
copy is already Title. body, which is
the exact shape the hub's card grids target.
================================================================ */
/* ---------- 1. BANDS ----------
Light and dark alternate strictly after the hero. Because the band
colour is being forced, the text colour has to be forced with it,
or a section that flips from white to navy keeps its dark type and
becomes unreadable. */
body.elementor-page-9275 #de-problem,
body.elementor-page-9275 #de-platform,
body.elementor-page-9275 #de-pathways,
body.elementor-page-9275 #de-outcomes,
body.elementor-page-9275 #de-why{background-color:#F6F9FC!important}
body.elementor-page-9275 #de-delivers,
body.elementor-page-9275 #de-how,
body.elementor-page-9275 #de-deliverables,
body.elementor-page-9275 #de-industries,
body.elementor-page-9275 #de-faq{background-color:#001B36!important}
/* light band type */
body.elementor-page-9275 #de-problem .elementor-heading-title,
body.elementor-page-9275 #de-platform .elementor-heading-title,
body.elementor-page-9275 #de-pathways .elementor-heading-title,
body.elementor-page-9275 #de-outcomes .elementor-heading-title,
body.elementor-page-9275 #de-why .elementor-heading-title{color:#0B1F38!important}
body.elementor-page-9275 #de-problem > .e-con-inner > .elementor-widget-heading:first-child div.elementor-heading-title,
body.elementor-page-9275 #de-platform > .e-con-inner > .elementor-widget-heading:first-child div.elementor-heading-title,
body.elementor-page-9275 #de-pathways > .e-con-inner > .elementor-widget-heading:first-child div.elementor-heading-title,
body.elementor-page-9275 #de-outcomes > .e-con-inner > .elementor-widget-heading:first-child div.elementor-heading-title,
body.elementor-page-9275 #de-why > .e-con-inner > .elementor-widget-heading:first-child div.elementor-heading-title{color:#01417F!important}
body.elementor-page-9275 #de-problem .elementor-widget-text-editor,
body.elementor-page-9275 #de-platform .elementor-widget-text-editor,
body.elementor-page-9275 #de-pathways .elementor-widget-text-editor,
body.elementor-page-9275 #de-outcomes .elementor-widget-text-editor,
body.elementor-page-9275 #de-why .elementor-widget-text-editor{color:#3E4C5A!important}
/* dark band type */
body.elementor-page-9275 #de-delivers .elementor-heading-title,
body.elementor-page-9275 #de-how .elementor-heading-title,
body.elementor-page-9275 #de-deliverables .elementor-heading-title,
body.elementor-page-9275 #de-industries .elementor-heading-title,
body.elementor-page-9275 #de-faq .elementor-heading-title{color:#FFFFFF!important}
body.elementor-page-9275 #de-delivers > .e-con-inner > .elementor-widget-heading:first-child div.elementor-heading-title,
body.elementor-page-9275 #de-how > .e-con-inner > .elementor-widget-heading:first-child div.elementor-heading-title,
body.elementor-page-9275 #de-deliverables > .e-con-inner > .elementor-widget-heading:first-child div.elementor-heading-title,
body.elementor-page-9275 #de-industries > .e-con-inner > .elementor-widget-heading:first-child div.elementor-heading-title,
body.elementor-page-9275 #de-faq > .e-con-inner > .elementor-widget-heading:first-child div.elementor-heading-title{color:#7FB3FF!important}
body.elementor-page-9275 #de-delivers .elementor-widget-text-editor,
body.elementor-page-9275 #de-how .elementor-widget-text-editor,
body.elementor-page-9275 #de-deliverables .elementor-widget-text-editor,
body.elementor-page-9275 #de-industries .elementor-widget-text-editor,
body.elementor-page-9275 #de-faq .elementor-widget-text-editor{color:#C4D6EC!important}
body.elementor-page-9275 #de-delivers::after,
body.elementor-page-9275 #de-how::after,
body.elementor-page-9275 #de-deliverables::after,
body.elementor-page-9275 #de-industries::after,
body.elementor-page-9275 #de-faq::after{color:#7FB3FF;opacity:.07}
/* THE CASE STUDY SECTION IS HIDDEN, 28 Aug 2026.
It is still seven bracketed placeholders (Challenge, Connected
solution, Measurable outcome and so on) waiting on Mayank. Ads asked
for it out of sight rather than deleted.
This is a CSS override, and the cost is that the Elementor panel's
own responsive-hide toggles will NOT bring it back. To restore the
section once the copy lands, delete these two lines and nothing else.
The panel toggles were tried first and are unreliable on this site:
with all three hidden-desktop / tablet / mobile classes set, the
section still rendered at 768, 800, 1025 and 1200px, because the
custom breakpoints leave gaps between the ranges. */
body.elementor-page-9275 #de-casestudy{display:none!important;counter-increment:none}
/* ---------- 2. HERO ---------- */
body.elementor-page-9275 #de-hero{
background:radial-gradient(1100px 620px at 78% -10%,#01417F 0%,rgba(1,65,127,0) 62%),
linear-gradient(158deg,#001B36 0%,#00284F 46%,#001B36 100%)!important;
overflow:hidden;position:relative}
body.elementor-page-9275 #de-hero::before,
body.elementor-page-9275 #de-hero::after{content:"";position:absolute;z-index:0;border-radius:34px;pointer-events:none}
body.elementor-page-9275 #de-hero::before{
width:330px;height:330px;top:34px;right:96px;
background:linear-gradient(150deg,rgba(127,179,255,.15),rgba(127,179,255,.03));
border:1px solid rgba(127,179,255,.16);
animation:svcDrift 17s ease-in-out infinite}
body.elementor-page-9275 #de-hero::after{
width:210px;height:210px;bottom:52px;right:320px;
background:linear-gradient(150deg,rgba(245,83,73,.16),rgba(245,83,73,.02));
border:1px solid rgba(245,83,73,.16);
animation:svcDrift 21s ease-in-out infinite reverse}
@keyframes svcDrift{
0%,100%{transform:translate3d(0,0,0) rotate(0deg)}
50%{transform:translate3d(-16px,22px,0) rotate(4deg)}
}
body.elementor-page-9275 #de-hero > .e-con-inner > .elementor-widget-heading:first-child .elementor-heading-title{
display:inline-flex!important;align-items:center;gap:10px;width:auto!important;
padding:7px 17px 7px 14px;border-radius:999px;
background:rgba(127,179,255,.10);border:1px solid rgba(127,179,255,.30);
color:#7FB3FF!important;font-size:11.5px;letter-spacing:1.5px}
body.elementor-page-9275 #de-hero > .e-con-inner > .elementor-widget-heading:first-child .elementor-heading-title::before{
content:"";width:7px;height:7px;border-radius:50%;background:#F55349;flex:0 0 auto}
body.elementor-page-9275 #de-hero .elementor-button{border-radius:999px!important;padding:15px 27px!important;
font-weight:600;letter-spacing:.1px;transition:transform .3s cubic-bezier(.22,1,.36,1),box-shadow .3s}
body.elementor-page-9275 #de-hero .elementor-widget-button:first-child .elementor-button{
background:linear-gradient(152deg,#F55349 0%,#E04A40 55%,#C4372E 100%)!important;
color:#fff!important;box-shadow:0 16px 34px -16px rgba(245,83,73,.7)}
/* Each button widget is the only child of its own sub-container, so
.elementor-widget-button:first-child matches BOTH of them. The
second button has to be keyed off its container's position. */
body.elementor-page-9275 #de-hero .e-con .e-con:nth-child(2) .elementor-button{
background:transparent!important;background-image:none!important;color:#EAF1F9!important;
border:1px solid rgba(127,179,255,.42)!important;box-shadow:none!important}
body.elementor-page-9275 #de-hero .elementor-button:hover{transform:translateY(-2px)}
body.elementor-page-9275 #de-hero .it-creds ul{gap:10px;margin-top:6px}
/* ---------- 3. JUMP TILES ----------
Same device as the hub. #de-jt is a text-editor the client can edit
like any other. It must not eat a section number, and it has no
eyebrow or ghost numeral of its own. */
/* the jump row carries the page gutter itself so its tiles line up with
every other section at every width */
body.elementor-page-9275 #de-jt{background:#00152B!important;padding:0 24px;counter-increment:none}
body.elementor-page-9275 #de-jt::after{display:none!important}
body.elementor-page-9275 .page-content > .elementor > .e-con{scroll-margin-top:26px}
body.elementor-page-9275 #de-jt > .e-con-inner{max-width:1400px;padding:26px 0 30px}
body.elementor-page-9275 #de-jt .elementor-widget-text-editor{max-width:none!important;margin:0!important}
/* the old five-tile ul.jt-row rules lived here. Removed 28 Aug when the
jump menu was rebuilt as the hub's white .jt-grid panel. */
/* ---------- 4. CARD GRIDS ----------
The section system renders every as a hairline-separated feature
row. On the sections below that becomes a card grid instead. Counts
run 6 to 8, so the last card stretches to fill whatever the final row
leaves over and no grid is ever left with an empty slot. */
body.elementor-page-9275 #de-problem .elementor-widget-text-editor :is(ul,ol),
body.elementor-page-9275 #de-platform .elementor-widget-text-editor :is(ul,ol),
body.elementor-page-9275 #de-deliverables .elementor-widget-text-editor :is(ul,ol),
body.elementor-page-9275 #de-outcomes .elementor-widget-text-editor :is(ul,ol),
body.elementor-page-9275 #de-industries .elementor-widget-text-editor :is(ul,ol),
body.elementor-page-9275 #de-why .elementor-widget-text-editor :is(ul,ol){display:grid!important;grid-template-columns:repeat(3,1fr);gap:18px;
margin-top:28px!important;max-width:none!important}
body.elementor-page-9275 #de-problem .elementor-widget-text-editor,
body.elementor-page-9275 #de-platform .elementor-widget-text-editor,
body.elementor-page-9275 #de-deliverables .elementor-widget-text-editor,
body.elementor-page-9275 #de-outcomes .elementor-widget-text-editor,
body.elementor-page-9275 #de-industries .elementor-widget-text-editor,
body.elementor-page-9275 #de-why .elementor-widget-text-editor{max-width:none!important}
body.elementor-page-9275 #de-problem .elementor-widget-text-editor :is(ul,ol) > li,
body.elementor-page-9275 #de-platform .elementor-widget-text-editor :is(ul,ol) > li,
body.elementor-page-9275 #de-deliverables .elementor-widget-text-editor :is(ul,ol) > li,
body.elementor-page-9275 #de-outcomes .elementor-widget-text-editor :is(ul,ol) > li,
body.elementor-page-9275 #de-industries .elementor-widget-text-editor :is(ul,ol) > li,
body.elementor-page-9275 #de-why .elementor-widget-text-editor :is(ul,ol) > li{margin:0!important;padding:24px 24px 26px!important;border:1px solid transparent;
border-bottom:1px solid transparent!important;border-radius:18px;position:relative;overflow:hidden;
transition:transform .45s cubic-bezier(.22,1,.36,1),box-shadow .45s,border-color .45s}
body.elementor-page-9275 #de-problem .elementor-widget-text-editor :is(ul,ol) > li::before,
body.elementor-page-9275 #de-platform .elementor-widget-text-editor :is(ul,ol) > li::before,
body.elementor-page-9275 #de-deliverables .elementor-widget-text-editor :is(ul,ol) > li::before,
body.elementor-page-9275 #de-outcomes .elementor-widget-text-editor :is(ul,ol) > li::before,
body.elementor-page-9275 #de-industries .elementor-widget-text-editor :is(ul,ol) > li::before,
body.elementor-page-9275 #de-why .elementor-widget-text-editor :is(ul,ol) > li::before{display:none!important}
body.elementor-page-9275 #de-problem .elementor-widget-text-editor :is(ul,ol) > li strong,
body.elementor-page-9275 #de-platform .elementor-widget-text-editor :is(ul,ol) > li strong,
body.elementor-page-9275 #de-deliverables .elementor-widget-text-editor :is(ul,ol) > li strong,
body.elementor-page-9275 #de-outcomes .elementor-widget-text-editor :is(ul,ol) > li strong,
body.elementor-page-9275 #de-industries .elementor-widget-text-editor :is(ul,ol) > li strong,
body.elementor-page-9275 #de-why .elementor-widget-text-editor :is(ul,ol) > li strong{display:block!important;margin-bottom:7px!important;font-size:17px;
line-height:1.3;letter-spacing:-.015em}
/* square the last row off */
body.elementor-page-9275 #de-problem .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(5),
body.elementor-page-9275 #de-platform .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(5),
body.elementor-page-9275 #de-deliverables .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(5),
body.elementor-page-9275 #de-outcomes .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(5),
body.elementor-page-9275 #de-industries .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(5),
body.elementor-page-9275 #de-why .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(5),
body.elementor-page-9275 #de-problem .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(8),
body.elementor-page-9275 #de-platform .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(8),
body.elementor-page-9275 #de-deliverables .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(8),
body.elementor-page-9275 #de-outcomes .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(8),
body.elementor-page-9275 #de-industries .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(8),
body.elementor-page-9275 #de-why .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(8){grid-column:span 2}
body.elementor-page-9275 #de-problem .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(4),
body.elementor-page-9275 #de-platform .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(4),
body.elementor-page-9275 #de-deliverables .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(4),
body.elementor-page-9275 #de-outcomes .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(4),
body.elementor-page-9275 #de-industries .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(4),
body.elementor-page-9275 #de-why .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(4),
body.elementor-page-9275 #de-problem .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(7),
body.elementor-page-9275 #de-platform .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(7),
body.elementor-page-9275 #de-deliverables .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(7),
body.elementor-page-9275 #de-outcomes .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(7),
body.elementor-page-9275 #de-industries .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(7),
body.elementor-page-9275 #de-why .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(7){grid-column:span 3}
/* card skin follows the band it sits on */
body.elementor-page-9275 #de-problem .elementor-widget-text-editor :is(ul,ol) > li,
body.elementor-page-9275 #de-platform .elementor-widget-text-editor :is(ul,ol) > li,
body.elementor-page-9275 #de-outcomes .elementor-widget-text-editor :is(ul,ol) > li,
body.elementor-page-9275 #de-why .elementor-widget-text-editor :is(ul,ol) > li{background:#FFFFFF;border-color:#E1E9F3;
box-shadow:0 2px 5px rgba(0,27,54,.05)}
body.elementor-page-9275 #de-problem .elementor-widget-text-editor :is(ul,ol) > li:hover,
body.elementor-page-9275 #de-platform .elementor-widget-text-editor :is(ul,ol) > li:hover,
body.elementor-page-9275 #de-outcomes .elementor-widget-text-editor :is(ul,ol) > li:hover,
body.elementor-page-9275 #de-why .elementor-widget-text-editor :is(ul,ol) > li:hover{transform:translateY(-6px);border-color:transparent;
box-shadow:0 26px 54px -24px rgba(0,52,104,.34)}
body.elementor-page-9275 #de-deliverables .elementor-widget-text-editor :is(ul,ol) > li,
body.elementor-page-9275 #de-industries .elementor-widget-text-editor :is(ul,ol) > li{background:linear-gradient(158deg,#0C3A70 0%,#0C3060 52%,#152F55 100%);
border-color:rgba(127,179,255,.36);box-shadow:inset 0 1px 0 rgba(255,255,255,.07)}
body.elementor-page-9275 #de-deliverables .elementor-widget-text-editor :is(ul,ol) > li:hover,
body.elementor-page-9275 #de-industries .elementor-widget-text-editor :is(ul,ol) > li:hover{transform:translateY(-6px);border-color:rgba(245,83,73,.5);
box-shadow:0 26px 54px -24px rgba(0,10,24,.8)}
/* card titles need the full contrast, the body copy colour is too soft */
body.elementor-page-9275 #de-problem .elementor-widget-text-editor :is(ul,ol) > li strong,
body.elementor-page-9275 #de-platform .elementor-widget-text-editor :is(ul,ol) > li strong,
body.elementor-page-9275 #de-outcomes .elementor-widget-text-editor :is(ul,ol) > li strong,
body.elementor-page-9275 #de-why .elementor-widget-text-editor :is(ul,ol) > li strong{color:#0B1F38}
body.elementor-page-9275 #de-deliverables .elementor-widget-text-editor :is(ul,ol) > li strong,
body.elementor-page-9275 #de-industries .elementor-widget-text-editor :is(ul,ol) > li strong{color:#FFFFFF}
/* a coral rule across the top of a card on hover, as on the hub */
body.elementor-page-9275 #de-problem .elementor-widget-text-editor :is(ul,ol) > li::after,
body.elementor-page-9275 #de-platform .elementor-widget-text-editor :is(ul,ol) > li::after,
body.elementor-page-9275 #de-deliverables .elementor-widget-text-editor :is(ul,ol) > li::after,
body.elementor-page-9275 #de-outcomes .elementor-widget-text-editor :is(ul,ol) > li::after,
body.elementor-page-9275 #de-industries .elementor-widget-text-editor :is(ul,ol) > li::after,
body.elementor-page-9275 #de-why .elementor-widget-text-editor :is(ul,ol) > li::after{content:"";position:absolute;top:0;left:0;right:0;height:3px;
background:linear-gradient(95deg,#7FB3FF,#F55349 68%,#FFB4A8);
opacity:0;transition:opacity .4s}
body.elementor-page-9275 #de-problem .elementor-widget-text-editor :is(ul,ol) > li:hover::after,
body.elementor-page-9275 #de-platform .elementor-widget-text-editor :is(ul,ol) > li:hover::after,
body.elementor-page-9275 #de-deliverables .elementor-widget-text-editor :is(ul,ol) > li:hover::after,
body.elementor-page-9275 #de-outcomes .elementor-widget-text-editor :is(ul,ol) > li:hover::after,
body.elementor-page-9275 #de-industries .elementor-widget-text-editor :is(ul,ol) > li:hover::after,
body.elementor-page-9275 #de-why .elementor-widget-text-editor :is(ul,ol) > li:hover::after{opacity:1}
/* ---------- 5. STEPPER ----------
How it works is a sequence, not a set, so it gets the hub's lifecycle
treatment instead of a grid: numbered nodes joined by a rule that
runs down the left. */
body.elementor-page-9275 #de-how .elementor-widget-text-editor ol{list-style:none!important;counter-reset:svcstep;margin:30px 0 0!important;
padding:0!important;position:relative;max-width:940px!important}
body.elementor-page-9275 #de-how .elementor-widget-text-editor ol::before{content:"";position:absolute;left:19px;top:14px;bottom:14px;width:2px;
background:linear-gradient(180deg,#7FB3FF,#F55349);opacity:.42}
body.elementor-page-9275 #de-how .elementor-widget-text-editor ol > li{counter-increment:svcstep;position:relative;margin:0!important;
padding:14px 0 24px 66px!important;border:0!important}
body.elementor-page-9275 #de-how .elementor-widget-text-editor ol > li::before{content:counter(svcstep,decimal-leading-zero)!important;
position:absolute!important;left:0!important;top:12px!important;
width:40px!important;height:40px!important;border-radius:50%!important;
display:grid!important;place-items:center!important;
background:linear-gradient(150deg,#F55349,#C4372E)!important;color:#fff!important;
font-family:'Manrope',sans-serif;font-size:12px;font-weight:700;letter-spacing:.5px}
body.elementor-page-9275 #de-how .elementor-widget-text-editor ol > li strong{display:block!important;margin-bottom:5px!important;font-size:18px;
letter-spacing:-.015em}
/* ---------- 6. CTA ---------- */
body.elementor-page-9275 #de-cta{background:radial-gradient(880px 460px at 20% 0%,#01417F 0%,rgba(1,65,127,0) 60%),
linear-gradient(152deg,#001B36 0%,#00284F 52%,#001B36 100%)!important}
body.elementor-page-9275 #de-cta .elementor-heading-title{color:#FFFFFF!important}
body.elementor-page-9275 #de-cta .elementor-widget-text-editor{color:#C4D6EC!important}
body.elementor-page-9275 #de-cta .elementor-button{border-radius:999px!important;padding:15px 27px!important}
body.elementor-page-9275 #de-cta .elementor-widget-button:first-child .elementor-button{
background:linear-gradient(152deg,#F55349 0%,#E04A40 55%,#C4372E 100%)!important;color:#fff!important}
/* ---------- 7. RESPONSIVE ---------- */
@media(max-width:1080px){
body.elementor-page-9275 #de-problem .elementor-widget-text-editor :is(ul,ol),
body.elementor-page-9275 #de-platform .elementor-widget-text-editor :is(ul,ol),
body.elementor-page-9275 #de-deliverables .elementor-widget-text-editor :is(ul,ol),
body.elementor-page-9275 #de-outcomes .elementor-widget-text-editor :is(ul,ol),
body.elementor-page-9275 #de-industries .elementor-widget-text-editor :is(ul,ol),
body.elementor-page-9275 #de-why .elementor-widget-text-editor :is(ul,ol){grid-template-columns:repeat(2,1fr)}
body.elementor-page-9275 #de-problem .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(5),
body.elementor-page-9275 #de-platform .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(5),
body.elementor-page-9275 #de-deliverables .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(5),
body.elementor-page-9275 #de-outcomes .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(5),
body.elementor-page-9275 #de-industries .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(5),
body.elementor-page-9275 #de-why .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(5),
body.elementor-page-9275 #de-problem .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(7),
body.elementor-page-9275 #de-platform .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(7),
body.elementor-page-9275 #de-deliverables .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(7),
body.elementor-page-9275 #de-outcomes .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(7),
body.elementor-page-9275 #de-industries .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(7),
body.elementor-page-9275 #de-why .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(7){grid-column:span 2}
body.elementor-page-9275 #de-problem .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(4),
body.elementor-page-9275 #de-platform .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(4),
body.elementor-page-9275 #de-deliverables .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(4),
body.elementor-page-9275 #de-outcomes .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(4),
body.elementor-page-9275 #de-industries .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(4),
body.elementor-page-9275 #de-why .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(4),
body.elementor-page-9275 #de-problem .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(8),
body.elementor-page-9275 #de-platform .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(8),
body.elementor-page-9275 #de-deliverables .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(8),
body.elementor-page-9275 #de-outcomes .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(8),
body.elementor-page-9275 #de-industries .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(8),
body.elementor-page-9275 #de-why .elementor-widget-text-editor :is(ul,ol) > li:last-child:nth-child(8){grid-column:auto}
body.elementor-page-9275 #de-jt ul.jt-row{grid-template-columns:repeat(2,1fr)}
body.elementor-page-9275 #de-hero::before{width:210px;height:210px;right:24px}
body.elementor-page-9275 #de-hero::after{display:none}
}
@media(max-width:760px){
body.elementor-page-9275 #de-problem .elementor-widget-text-editor :is(ul,ol),
body.elementor-page-9275 #de-platform .elementor-widget-text-editor :is(ul,ol),
body.elementor-page-9275 #de-deliverables .elementor-widget-text-editor :is(ul,ol),
body.elementor-page-9275 #de-outcomes .elementor-widget-text-editor :is(ul,ol),
body.elementor-page-9275 #de-industries .elementor-widget-text-editor :is(ul,ol),
body.elementor-page-9275 #de-why .elementor-widget-text-editor :is(ul,ol){grid-template-columns:1fr}
body.elementor-page-9275 #de-problem .elementor-widget-text-editor :is(ul,ol) > li:last-child,
body.elementor-page-9275 #de-platform .elementor-widget-text-editor :is(ul,ol) > li:last-child,
body.elementor-page-9275 #de-deliverables .elementor-widget-text-editor :is(ul,ol) > li:last-child,
body.elementor-page-9275 #de-outcomes .elementor-widget-text-editor :is(ul,ol) > li:last-child,
body.elementor-page-9275 #de-industries .elementor-widget-text-editor :is(ul,ol) > li:last-child,
body.elementor-page-9275 #de-why .elementor-widget-text-editor :is(ul,ol) > li:last-child{grid-column:auto!important}
body.elementor-page-9275 #de-jt ul.jt-row{grid-template-columns:1fr}
body.elementor-page-9275 #de-jt a.jt{padding:18px 16px 19px}
body.elementor-page-9275 #de-hero::before{display:none}
}
@media(max-width:620px){
body.elementor-page-9275 .page-content > .elementor > .e-con{padding-left:18px!important;padding-right:18px!important}
body.elementor-page-9275 #de-how .elementor-widget-text-editor ol > li{padding-left:56px!important}
}
/* ================================================================
B-CRAFT-2, the uniformity pass. Crayon Digital, 28 Aug 2026.
Ads, on the two pages: "they're looking okay, but they're not quite
the exact sort of design as the hub page. It needs to be more
uniform." He was right, and it was measurable. Every number below
was read off the live AI Transformation Hub at 1440px and copied
across, not eyeballed:
section rhythm hub 104px outer + 84px inner. These pages had 0 + 84,
so every band was half the hub's height
h1 hub 66px / -0.03em. Was 48px here, no tracking
h2 hub 46px / -0.028em. Was 38px, no tracking
h3 hub 25px / -0.026em. Was 19px
eyebrow hub w600 / 1.5px tracking. Was w700 / 2px
cards hub r20, pad 26 26 28, 14.5px. Was r18, pad 24 24 26, 16px
jump menu the hub's is ONE white panel of eight tiles in four
columns, no gaps, rounded bottom corners, coral
numeral, blue uppercase title, grey sub-line and a
round arrow badge. Ours was five separate navy
cards. Rebuilt from scratch to match.
The type is set in clamp() rather than fixed px so the longer
headlines on these two pages do not blow up at narrow widths. Each
clamp resolves to the hub's exact figure at 1440.
================================================================ */
/* ---------- section rhythm ---------- */
body.elementor-page-9275 .page-content > .elementor > .e-con{padding-top:104px!important;padding-bottom:104px!important}
body.elementor-page-9275 #de-hero{padding:26px 24px 40px!important}
body.elementor-page-9275 #de-hero > .e-con-inner{padding:110px 0 96px!important}
body.elementor-page-9275 #de-jt{padding:46px 24px 58px!important}
body.elementor-page-9275 #de-cta{padding:104px 24px 88px!important}
/* ---------- type scale, matched to the hub ---------- */
body.elementor-page-9275 .page-content h1{font-size:clamp(40px,4.6vw,66px)!important;letter-spacing:-.03em!important;line-height:1.08!important}
body.elementor-page-9275 .page-content h2{font-size:clamp(30px,3.2vw,46px)!important;letter-spacing:-.028em!important;line-height:1.12!important}
body.elementor-page-9275 .page-content h3{font-size:clamp(20px,1.75vw,25px)!important;font-weight:700!important;letter-spacing:-.026em!important}
body.elementor-page-9275 .page-content > .elementor > .e-con > .e-con-inner > .elementor-widget-heading:first-child div.elementor-heading-title{font-weight:600!important;letter-spacing:1.5px!important}
/* ---------- cards, matched to the hub ---------- */
body.elementor-page-9275 #de-problem .elementor-widget-text-editor :is(ul,ol) > li,
body.elementor-page-9275 #de-platform .elementor-widget-text-editor :is(ul,ol) > li,
body.elementor-page-9275 #de-deliverables .elementor-widget-text-editor :is(ul,ol) > li,
body.elementor-page-9275 #de-outcomes .elementor-widget-text-editor :is(ul,ol) > li,
body.elementor-page-9275 #de-industries .elementor-widget-text-editor :is(ul,ol) > li,
body.elementor-page-9275 #de-why .elementor-widget-text-editor :is(ul,ol) > li{border-radius:20px!important;padding:26px 26px 28px!important;font-size:14.5px}
body.elementor-page-9275 #de-problem .elementor-widget-text-editor :is(ul,ol) > li strong,
body.elementor-page-9275 #de-platform .elementor-widget-text-editor :is(ul,ol) > li strong,
body.elementor-page-9275 #de-deliverables .elementor-widget-text-editor :is(ul,ol) > li strong,
body.elementor-page-9275 #de-outcomes .elementor-widget-text-editor :is(ul,ol) > li strong,
body.elementor-page-9275 #de-industries .elementor-widget-text-editor :is(ul,ol) > li strong,
body.elementor-page-9275 #de-why .elementor-widget-text-editor :is(ul,ol) > li strong{font-size:16px!important}
/* ---------- jump menu, rebuilt as the hub's white panel ----------
The markup is now a plain .jt-grid of rather than a
list, so the section system's bullet rules never touch it. The span
rules carry the "a.jt" ancestor deliberately: without it they lose on
specificity to the older five-tile rules earlier in this file. */
body.elementor-page-9275 #de-jt{background:#00152B!important;counter-increment:none}
body.elementor-page-9275 #de-jt::after{display:none!important}
body.elementor-page-9275 #de-jt > .e-con-inner{max-width:1400px;padding:0}
body.elementor-page-9275 #de-jt .elementor-widget-text-editor{max-width:none!important;margin:0!important}
body.elementor-page-9275 #de-jt .jt-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0;
background:#FFFFFF;border-radius:0 0 20px 20px;overflow:hidden}
body.elementor-page-9275 #de-jt a.jt{display:block;background:#FFFFFF;padding:24px 52px 26px 22px;
position:relative;overflow:hidden;text-decoration:none!important;
transition:background .35s cubic-bezier(.22,.8,.26,1)}
body.elementor-page-9275 #de-jt a.jt:hover{background:#F6F9FC}
body.elementor-page-9275 #de-jt a.jt::before{content:"→";position:absolute;top:18px;right:16px;
width:28px;height:28px;border-radius:50%;background:#EAF1F9;color:#004F9E;
font-size:14px;display:grid;place-items:center}
body.elementor-page-9275 #de-jt a.jt::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;
background:linear-gradient(95deg,#7FB3FF,#F55349 65%,#FFB4A8);
transform:scaleX(0);transform-origin:left;transition:transform .35s cubic-bezier(.22,.8,.26,1)}
body.elementor-page-9275 #de-jt a.jt:hover::after{transform:scaleX(1)}
body.elementor-page-9275 #de-jt a.jt .jt-n{display:block;font-size:11px;font-weight:700;letter-spacing:1.5px;color:#F55349;margin-bottom:8px}
body.elementor-page-9275 #de-jt a.jt .jt-t{display:block;font-size:16.5px;font-weight:700;line-height:1.3;
text-transform:uppercase;letter-spacing:.66px;color:#004F9E}
body.elementor-page-9275 #de-jt a.jt .jt-s{display:block;margin-top:6px;font-size:12.8px;line-height:1.45;color:#66727E}
@media(max-width:1080px){
body.elementor-page-9275 #de-jt .jt-grid{grid-template-columns:repeat(2,1fr)}
body.elementor-page-9275 .page-content > .elementor > .e-con{padding-top:76px!important;padding-bottom:76px!important}
body.elementor-page-9275 #de-hero > .e-con-inner{padding:66px 0 58px!important}
}
@media(max-width:620px){
body.elementor-page-9275 #de-jt .jt-grid{grid-template-columns:1fr}
body.elementor-page-9275 #de-hero,body.elementor-page-9275 #de-jt,body.elementor-page-9275 #de-cta{padding-left:18px!important;padding-right:18px!important}
}
/* ================================================================
B-CRAFT-3, matching the hub properly. Crayon Digital, 28 Aug 2026.
Ads, third look: "the hero section isn't really matching what we've
got with the hub page. Even the orange button's not right, and then
the pills underneath. And the jump-to menu looks completely
different." Right on all three. The reason the first two passes
missed it: they matched MEASUREMENTS without ever putting the two
pages side by side. Doing that turned up three DEVICES the hub has
that these pages did not.
1 the jump menu has a HEADER BAR above the grid, hairline
dividers between tiles and a deep soft shadow. Without those
it reads as a plain white block, not a component
2 the hero headline is held to 740px and the lede to 690px,
about half the column. Ours ran the full 1400, which is most
of why the hero felt loose next to the hub's
3 the strapline under the buttons sits below a 70px coral-to-blue
rule. Ours had no rule and five loud pills instead
Every value below was read off the live hub, not invented.
================================================================ */
/* ---------- hero: hold the headline and lede to the hub's measure ---------- */
body.elementor-page-9275 #de-hero h1{max-width:740px}
body.elementor-page-9275 #de-hero > .e-con-inner > .elementor-widget-text-editor{max-width:690px!important}
/* ---------- hero eyebrow pill, the hub's exact figures ---------- */
body.elementor-page-9275 #de-hero > .e-con-inner > .elementor-widget-heading:first-child .elementor-heading-title{
padding:8px 16px!important;font-size:12px!important;font-weight:600!important;letter-spacing:1.6px!important;
background:rgba(127,179,255,.09)!important;border:1px solid rgba(127,179,255,.34)!important;gap:9px!important}
body.elementor-page-9275 #de-hero > .e-con-inner > .elementor-widget-heading:first-child .elementor-heading-title::before{
width:6px!important;height:6px!important}
/* ---------- hero buttons ----------
The hub's coral runs 120deg from #F55349 into the LIGHTER #FF9387,
not down into a darker red, and the secondary is a white hairline
ghost rather than a blue one. That is the "orange button's not
right" Ads spotted. Deliberately NOT the deepened coral used on the
section 06 and 07 cards: that was darkened because those cards are
large blocks of colour. A small button wants the light gradient. */
body.elementor-page-9275 #de-hero .elementor-button{border-radius:999px!important;padding:15px 28px!important;
font-size:15px!important;font-weight:600!important;letter-spacing:normal!important;
transition:transform .3s cubic-bezier(.22,1,.36,1),box-shadow .3s}
body.elementor-page-9275 #de-hero .elementor-widget-button:first-child .elementor-button{
background:linear-gradient(120deg,#F55349,#FF9387)!important;color:#fff!important;
border:0!important;box-shadow:0 12px 30px -12px rgba(245,83,73,.72)!important}
body.elementor-page-9275 #de-hero .e-con .e-con:nth-child(2) .elementor-button{
background:transparent!important;background-image:none!important;color:#fff!important;
border:1px solid rgba(255,255,255,.32)!important;box-shadow:0 0 10px rgba(0,0,0,.5)!important}
body.elementor-page-9275 #de-hero .elementor-button:hover{transform:translateY(-2px)}
/* ---------- hero strapline, with the hub's 70px gradient rule ----------
#h-credlbl on the hub is position:relative with padding-top:22px and a
70x2 gradient bar on ::before. On this page the strapline is the last
child of the hero inner, so it is keyed off :last-child rather than
:nth-last-child(3) as on the Advisory page. */
body.elementor-page-9275 #de-hero > .e-con-inner > .elementor-widget-heading:last-child{
position:relative;padding-top:22px;margin-top:32px!important}
body.elementor-page-9275 #de-hero > .e-con-inner > .elementor-widget-heading:last-child::before{
content:"";position:absolute;top:0;left:0;width:70px;height:2px;display:block;
background:linear-gradient(90deg,#7FB3FF,#F55349)}
body.elementor-page-9275 #de-hero > .e-con-inner > .elementor-widget-heading:last-child .elementor-heading-title{
font-size:12.5px!important;font-weight:700!important;color:#9FB4D4!important;
letter-spacing:2.1px!important;text-transform:uppercase!important}
/* ---------- the credential pills ---------- */
body.elementor-page-9275 #de-hero .it-creds ul{gap:8px!important;margin-top:14px!important}
body.elementor-page-9275 #de-hero .it-creds ul li{padding:6px 13px!important;font-size:12.5px!important;
line-height:1.35!important;color:#9FB4D4!important;
background:rgba(127,179,255,.06)!important;border:1px solid rgba(127,179,255,.18)!important}
/* ---------- jump menu: the header bar, dividers and shadow ---------- */
body.elementor-page-9275 #de-jt .jt-head{display:flex;align-items:center;justify-content:space-between;gap:24px;
padding:15px 24px;background:linear-gradient(120deg,#001B36,#01417F 70%,#123063);
border:1px solid rgba(127,179,255,.24);border-bottom:0;border-radius:20px 20px 0 0}
body.elementor-page-9275 #de-jt .jt-hl{display:flex;align-items:baseline;gap:13px}
body.elementor-page-9275 #de-jt .jt-hl b{font-size:11px;font-weight:700;color:#FF9387;letter-spacing:2px;text-transform:uppercase}
body.elementor-page-9275 #de-jt .jt-hl em{font-size:15px;font-weight:700;color:#FFFFFF;letter-spacing:-.015em;font-style:normal}
body.elementor-page-9275 #de-jt .jt-hr{font-size:13px;color:#9FB4D4}
body.elementor-page-9275 #de-jt .jt-grid{box-shadow:0 34px 76px -34px rgba(0,0,0,.8)}
body.elementor-page-9275 #de-jt a.jt{display:flex;flex-direction:column;align-items:flex-start;gap:7px;
border-right:1px solid #E6EDF6;border-bottom:1px solid #E6EDF6}
body.elementor-page-9275 #de-jt a.jt .jt-n{margin-bottom:0!important}
body.elementor-page-9275 #de-jt a.jt .jt-s{margin-top:0!important}
@media(max-width:760px){
body.elementor-page-9275 #de-jt .jt-head{flex-direction:column;align-items:flex-start;gap:8px;padding:14px 18px}
body.elementor-page-9275 #de-jt .jt-hl{flex-direction:column;align-items:flex-start;gap:3px}
body.elementor-page-9275 #de-hero h1,body.elementor-page-9275 #de-hero > .e-con-inner > .elementor-widget-text-editor{max-width:none!important}
}
/* ---------- B-CRAFT-3a, two corrections for this page only, 28 Aug ----------
1 This hero has NO strapline heading. Unlike the Advisory page, the
capability list and the "Build faster. Run safer. Govern always."
line both sit inside the last text-editor, so the :last-child
heading rule above matched nothing. The 70px rule hangs off that
text-editor instead, and only its final paragraph takes the
strapline treatment.
2 This headline is 13 words against the hub's 9, so at the hub's
740px measure it ran to five lines and towered over everything.
Widened to 900px, which brings it to four. The alternative is to
cut the copy, which is Ads' call, not mine. */
body.elementor-page-9275 #de-hero h1{max-width:900px}
body.elementor-page-9275 #de-hero > .e-con-inner > .elementor-widget-text-editor:last-child{
position:relative;padding-top:22px;margin-top:32px!important}
body.elementor-page-9275 #de-hero > .e-con-inner > .elementor-widget-text-editor:last-child::before{
content:"";position:absolute;top:0;left:0;width:70px;height:2px;display:block;
background:linear-gradient(90deg,#7FB3FF,#F55349)}
body.elementor-page-9275 #de-hero > .e-con-inner > .elementor-widget-text-editor:last-child p:last-child{
font-size:12.5px!important;font-weight:700!important;color:#9FB4D4!important;
letter-spacing:2.1px!important;text-transform:uppercase!important;margin-top:14px!important}
body.elementor-page-9275 #de-hero > .e-con-inner > .elementor-widget-text-editor:last-child p:first-child{
font-size:13px!important;font-weight:500!important;color:#8FA9C9!important;line-height:1.6!important}
/* ================================================================
B-CRAFT-4, the real design pass. Crayon Digital, 28 Aug 2026.
Same block as the Advisory page, so the two cannot drift apart.
================================================================ */
/* ---------- 0. THE READABILITY DEFECT, and it was mine ----------
#de-delivers holds TWO svc-cards rows from the old service page
system: WHITE cards. My band rule in B-CRAFT painted every
text-editor inside a dark section with the dark-band body colour,
which put #C4D6EC text on a white card. The card interior must
never inherit the band colour. */
body.elementor-page-9275 [id^="svc-cards"] .elementor-widget-text-editor,
body.elementor-page-9275 [id^="svc-cards"] .elementor-heading-title{color:inherit!important}
/* ---------- 1. svc-cards rebuilt in the hub's card language ----------
The hub's section 02 cards are a gradient panel with a CORAL
CIRCULAR NUMBERED BADGE at the top, then a bold title, then body.
The old system had a flat coral header block with a dotted pattern. */
body.elementor-page-9275 [id^="svc-cards"] > .e-con-inner{counter-reset:svcc;gap:18px}
body.elementor-page-9275 [id^="svc-cards"] > .e-con-inner > .e-con{
counter-increment:svcc;position:relative;overflow:hidden;
flex-direction:column!important;align-items:stretch!important;flex-wrap:nowrap!important;
border-radius:20px!important;padding:26px 26px 28px!important;gap:0!important;
border:1px solid rgba(127,179,255,.36)!important;
background:linear-gradient(158deg,#0C3A70 0%,#0C3060 52%,#152F55 100%)!important;
box-shadow:inset 0 1px 0 rgba(255,255,255,.07)!important;
transition:transform .45s cubic-bezier(.22,1,.36,1),box-shadow .45s,border-color .45s}
body.elementor-page-9275 [id^="svc-cards"] > .e-con-inner > .e-con:hover{
transform:translateY(-6px);border-color:rgba(245,83,73,.5)!important;
box-shadow:0 26px 54px -24px rgba(0,10,24,.8)!important}
/* something earlier in the cascade puts every .e-con::before at
position:absolute;top:0;left:0, which threw the badge into the
card's corner under the title. Forced back into normal flow. */
body.elementor-page-9275 [id^="svc-cards"] > .e-con-inner > .e-con::before{
content:counter(svcc,decimal-leading-zero);display:grid;place-items:center;
position:static!important;top:auto!important;left:auto!important;
align-self:flex-start!important;flex:0 0 auto;
width:40px;height:40px;border-radius:50%;margin-bottom:16px;
background:linear-gradient(150deg,#F55349,#FF9387);color:#fff;
font-family:'Manrope',sans-serif;font-size:12px;font-weight:700;letter-spacing:.5px}
/* kill the old coral head block */
body.elementor-page-9275 [id^="svc-cards"] > .e-con-inner > .e-con > .elementor-widget-heading:first-child{
background:none!important;padding:0!important;min-height:0!important;display:block!important}
body.elementor-page-9275 [id^="svc-cards"] > .e-con-inner > .e-con > .elementor-widget-heading:first-child .elementor-heading-title{
color:#FFFFFF!important;font-size:19px!important;line-height:1.3;letter-spacing:-.02em;text-align:left}
body.elementor-page-9275 [id^="svc-cards"] > .e-con-inner > .e-con > .elementor-widget-text-editor{
padding:10px 0 0!important;color:#C4D6EC!important;font-size:14.5px}
/* the light-band row flips to a white card so it still reads */
body.elementor-page-9275 #de-pathways [id^="svc-cards"] > .e-con-inner > .e-con{
background:#FFFFFF!important;border-color:#E1E9F3!important;
box-shadow:0 2px 5px rgba(0,27,54,.05)!important}
body.elementor-page-9275 #de-pathways [id^="svc-cards"] > .e-con-inner > .e-con > .elementor-widget-heading:first-child .elementor-heading-title{color:#0B1F38!important}
body.elementor-page-9275 #de-pathways [id^="svc-cards"] > .e-con-inner > .e-con > .elementor-widget-text-editor{color:#3E4C5A!important}
/* the second row on #de-delivers must keep counting from 04, not restart */
body.elementor-page-9275 #de-delivers [id^="svc-cards-ai-2"] > .e-con-inner{counter-reset:svcc 3}
/* ---------- 2. the hero headline takes the hub's gradient span ---------- */
.hg{background:linear-gradient(95deg,#7FB3FF,#F55349 65%,#FFB4A8) text;color:transparent}
@media(max-width:1080px){
body.elementor-page-9275 [id^="svc-cards"] > .e-con-inner > .e-con{width:calc(50% - 9px)!important}
}
@media(max-width:620px){
body.elementor-page-9275 [id^="svc-cards"] > .e-con-inner > .e-con{width:100%!important}
}
/* ================================================================
B-CRAFT-5, photography. Crayon Digital, 28 Aug 2026.
Mayank on the 28 Aug call, on this section: "white on white is
looking very blunt in this particular section. If we can utilise
some pictures." So the three engagement pathways stop being white
cards and become photographs under the same navy scrim used on the
Advisory page, which also puts them back in the hub's language.
All Unsplash Licence, free for commercial use, licence checked per
photo. Unsplash+ and Getty results were excluded because those need
a paid subscription. Attribution is on each attachment in the
Media Library.
Card order is New Digital Products, Active Delivery Programmes,
Legacy Modernisation, checked against the live page before mapping.
================================================================ */
body.elementor-page-9275 #de-pathways [id^="svc-cards"] > .e-con-inner > .e-con{
background-size:cover!important;background-position:center!important;
background-repeat:no-repeat!important;min-height:290px;
border-color:rgba(127,179,255,.36)!important;
box-shadow:inset 0 1px 0 rgba(255,255,255,.07)!important;
transition:transform .45s cubic-bezier(.22,1,.36,1),box-shadow .45s,
border-color .45s,background-size .8s cubic-bezier(.22,1,.36,1)}
body.elementor-page-9275 #de-pathways [id^="svc-cards"] > .e-con-inner > .e-con:hover{
background-size:auto,112%!important}
body.elementor-page-9275 #de-pathways [id^="svc-cards"] > .e-con-inner > .e-con:nth-child(1){
background-image:linear-gradient(168deg,rgba(0,27,54,.72) 0%,rgba(0,27,54,.90) 55%,rgba(0,27,54,.96) 100%),url("/wp-content/uploads/2026/08/photo-1532622785990-d2c36a76f5a6.jpg")!important}
body.elementor-page-9275 #de-pathways [id^="svc-cards"] > .e-con-inner > .e-con:nth-child(2){
background-image:linear-gradient(168deg,rgba(0,27,54,.72) 0%,rgba(0,27,54,.90) 55%,rgba(0,27,54,.96) 100%),url("/wp-content/uploads/2026/08/photo-1629904853893-c2c8981a1dc5.jpg")!important}
body.elementor-page-9275 #de-pathways [id^="svc-cards"] > .e-con-inner > .e-con:nth-child(3){
background-image:linear-gradient(168deg,rgba(0,27,54,.72) 0%,rgba(0,27,54,.90) 55%,rgba(0,27,54,.96) 100%),url("/wp-content/uploads/2026/08/photo-1695668548342-c0c1ad479aee.jpg")!important}
/* these were the white light-band cards, so the type has to flip back
to the dark-card colours or it disappears against the scrim */
body.elementor-page-9275 #de-pathways [id^="svc-cards"] > .e-con-inner > .e-con > .elementor-widget-heading:first-child .elementor-heading-title{color:#FFFFFF!important}
body.elementor-page-9275 #de-pathways [id^="svc-cards"] > .e-con-inner > .e-con > .elementor-widget-text-editor{color:#C4D6EC!important}
/* ================================================================
B-CRAFT-6, the sectors row, cloned from the hub.
Crayon Digital, 28 Aug 2026. Same block as the Advisory page.
Mayank, 30:15: "I don't think we should vary the industry
everywhere we go. Whatever we have on the hub page, we just copy
it here." Property management became Real estate, confirmed by
Will, renamed on the hub before the clone.
#de-industries is hidden rather than deleted: it held six
InfraTech-written industry blurbs which are now superseded by the
hub's five, but the copy is still there in the editor if wanted.
================================================================ */
body.elementor-page-9275 #de-industries{display:none!important;counter-increment:none}
body.elementor-page-9275 #gd-sec{background-color:#001B36!important}
body.elementor-page-9275 #gd-sec .elementor-heading-title{color:#FFFFFF!important}
body.elementor-page-9275 #gd-sec > .e-con-inner > .elementor-widget-heading:first-child div.elementor-heading-title{color:#7FB3FF!important}
body.elementor-page-9275 #gd-sec .elementor-widget-text-editor{color:#C4D6EC!important}
body.elementor-page-9275 #gd-sec::after{color:#7FB3FF;opacity:.07}
body.elementor-page-9275 #se-row{display:grid!important;grid-template-columns:repeat(6,1fr);gap:16px;
margin-top:40px!important;padding:0!important;background:transparent!important;
max-width:none!important;width:100%}
body.elementor-page-9275 #se-row > .e-con{grid-column:span 2}
body.elementor-page-9275 #se-row > .e-con:nth-child(4):nth-last-child(2){grid-column:2/span 2}
body.elementor-page-9275 #se-row > .e-con{position:relative;overflow:hidden;border-radius:22px;
padding:0!important;gap:0!important;min-height:250px;
background:linear-gradient(150deg,#00274E,#01417F)!important;
border:1px solid rgba(127,179,255,.2);
transition:transform .45s cubic-bezier(.22,1,.36,1),box-shadow .45s}
body.elementor-page-9275 #se-row > .e-con:hover{transform:translateY(-5px);box-shadow:0 32px 66px -30px rgba(0,0,0,.7)}
body.elementor-page-9275 [id^="se-img-"]{position:absolute!important;inset:0;margin:0!important;padding:0!important;z-index:0}
body.elementor-page-9275 [id^="se-img-"] .elementor-widget-container,
body.elementor-page-9275 [id^="se-img-"] figure,
body.elementor-page-9275 [id^="se-img-"] .elementor-image{height:100%}
body.elementor-page-9275 [id^="se-img-"] img{width:100%!important;height:100%!important;object-fit:cover;display:block;
filter:saturate(.6) contrast(1.05);opacity:.62;
transition:opacity .5s,transform .8s cubic-bezier(.22,.8,.26,1)}
body.elementor-page-9275 #se-row > .e-con:hover [id^="se-img-"] img{opacity:.78;transform:scale(1.05)}
body.elementor-page-9275 #se-row > .e-con::before{content:"";position:absolute;inset:0;z-index:1;
background:linear-gradient(170deg,rgba(0,21,43,.18) 0%,rgba(0,27,54,.62) 52%,rgba(0,27,54,.93) 100%);
pointer-events:none;transition:box-shadow .45s ease}
body.elementor-page-9275 #se-row > .e-con:hover::before{box-shadow:inset 0 0 0 9999px rgba(245,83,73,.38)}
body.elementor-page-9275 #se-row > .e-con::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;z-index:3;
background:linear-gradient(95deg,#7FB3FF,#F55349 65%,#FFB4A8);
transform:scaleX(0);transform-origin:left;transition:transform .45s cubic-bezier(.22,.8,.26,1)}
body.elementor-page-9275 #se-row > .e-con:hover::after{transform:scaleX(1)}
body.elementor-page-9275 [id^="se-k-"]{position:relative;z-index:2;margin:0!important;padding:26px 26px 0!important;margin-top:auto!important}
body.elementor-page-9275 [id^="se-k-"] .elementor-heading-title,
body.elementor-page-9275 [id^="se-k-"] .elementor-heading-title a{font-size:21px;font-weight:700;letter-spacing:-.026em;
line-height:1.22;color:#fff!important;text-decoration:none;text-align:left;max-width:none}
body.elementor-page-9275 [id^="se-k-"] .elementor-heading-title a::after{content:"";position:absolute;inset:0;z-index:4}
body.elementor-page-9275 [id^="se-p-"]{position:relative;z-index:2;margin:0!important;padding:10px 26px 26px!important;max-width:none!important}
body.elementor-page-9275 [id^="se-p-"] p{font-size:13.8px;line-height:1.6;color:#B7CCE4;margin:0;max-width:none}
@media(max-width:1080px){
body.elementor-page-9275 #se-row{grid-template-columns:repeat(2,1fr)}
body.elementor-page-9275 #se-row > .e-con{grid-column:auto}
body.elementor-page-9275 #se-row > .e-con:nth-child(4):nth-last-child(2){grid-column:auto}
body.elementor-page-9275 #se-row > .e-con:last-child:nth-child(5){grid-column:span 2}
}
@media(max-width:620px){
body.elementor-page-9275 #se-row{grid-template-columns:1fr}
body.elementor-page-9275 #se-row > .e-con:last-child:nth-child(5){grid-column:auto}
}
/* ================================================================
B-CRAFT-7, the outcome stat cards. Crayon Digital, 28 Aug 2026.
Mayank, 30:03: "Software delivery with greater speed, this is fine
again. These numbers, I think if we can bring up Adam, that will be
nice to have. It's hiding behind the scene at the moment." Then:
"Do the same. The same as the other one", meaning the hub's
section 06 stat cards.
CSS alone could not do it: every figure was buried mid-sentence
inside "Indicative outcome: 20 to 30% reduction in...". The copy
was restructured so the figure leads, with the word Indicative kept
directly beneath it as a small label.
THAT LABEL IS DELIBERATE AND MUST STAY. These are indicative
figures, not measured results, and making them large makes the
claim louder. Sourcing is still outstanding, same as the hub's
leverage stats.
================================================================ */
body.elementor-page-9275 #de-outcomes .elementor-widget-text-editor :is(ul,ol) > li{
display:flex;flex-direction:column;align-items:flex-start;
padding:26px 26px 28px!important}
body.elementor-page-9275 #de-outcomes .elementor-widget-text-editor :is(ul,ol) > li .stat{
display:block;font-family:'Sora','Poppins',sans-serif;
font-size:clamp(30px,3.1vw,42px);font-weight:700;letter-spacing:-.03em;line-height:1;
background:linear-gradient(95deg,#7FB3FF,#F55349 68%,#FFB4A8);
-webkit-background-clip:text;background-clip:text;color:transparent}
body.elementor-page-9275 #de-outcomes .elementor-widget-text-editor :is(ul,ol) > li .statlab{
display:block;margin:9px 0 14px;font-size:10.5px;font-weight:700;
letter-spacing:1.6px;text-transform:uppercase;color:#7FB3FF;opacity:.85}
body.elementor-page-9275 #de-outcomes .elementor-widget-text-editor :is(ul,ol) > li strong{
display:block;margin-bottom:7px!important;font-size:16.5px;line-height:1.3;
letter-spacing:-.015em;color:#0B1F38}
/* a hairline above the figure, the way the hub's stat cards carry one */
body.elementor-page-9275 #de-outcomes .elementor-widget-text-editor :is(ul,ol) > li::before{
content:""!important;display:block!important;position:static!important;
width:44px!important;height:2px!important;margin-bottom:18px!important;
border-radius:0!important;background:linear-gradient(90deg,#7FB3FF,#F55349)!important}
/* ----------------------------------------------------------------
The sectors section cloned from the hub (#gd-sec) arrived with no
padding settings of its own, so it fell back to Elementor's
container defaults, 10px, instead of the page's rhythm: 24px at the
sides and 84px inside. Measured at 768px it started 14px further
out than every other section. Put it back on the grid.
Crayon Digital, 28 Aug 2026.
---------------------------------------------------------------- */
body.elementor-page-9275 #gd-sec{padding-left:24px!important;padding-right:24px!important}
body.elementor-page-9275 #gd-sec > .e-con-inner{padding:84px 0!important}
/* ================================================================
B-CRAFT-9, the per-service Purple Cortex panel.
Crayon Digital, 29 Aug 2026.
Mayank on the 28 August call, modelled on SAP's site: the platform
should appear on every service page, framed for THAT service, with
the modules that apply, and the hub should show the areas it serves.
Ads chose the slim treatment: one panel per service page, the deep
interactive cockpit stays on the hub and everything links to it.
The module copy is Mayank's own, unchanged. It was one text editor
holding the intro, the list and the integration note; it is now
three widgets so the list can stand as a panel of its own. Nothing
was reworded.
NOTE the hairline grid is done with a 1px grid gap over a tinted
background, not with per-cell borders. Per-cell borders leave a
stray line on the last row whenever the item count is not a clean
multiple of the column count, and this list is six here and seven
on Advisory.
================================================================ */
body.elementor-page-9275 #de-cx-head{margin-top:34px!important}
body.elementor-page-9275 #de-cx-head .elementor-heading-title{
display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;
background:linear-gradient(120deg,#001B36,#01417F 70%,#123063);
border:1px solid rgba(127,179,255,.24);border-bottom:0;
border-radius:20px 20px 0 0;padding:15px 24px;margin:0}
body.elementor-page-9275 #de-cx-head b{font-size:11px;font-weight:700;letter-spacing:2px;
text-transform:uppercase;color:#FF9387!important}
body.elementor-page-9275 #de-cx-head em{font-style:normal;font-size:15px;font-weight:700;color:#FFFFFF!important}
body.elementor-page-9275 #de-cx-mods{margin-top:0!important;counter-reset:cxm}
body.elementor-page-9275 #de-cx-mods > .elementor-widget-container{
border:1px solid rgba(127,179,255,.24);border-top:0;border-radius:0 0 20px 20px;
overflow:hidden;box-shadow:0 34px 76px -34px rgba(0,0,0,.8)}
body.elementor-page-9275 #de-cx-mods ul{display:grid!important;grid-template-columns:repeat(3,1fr);
gap:1px;background:rgba(127,179,255,.18);
margin:0!important;padding:0!important;list-style:none!important}
body.elementor-page-9275 #de-cx-mods ul > li{
counter-increment:cxm;list-style:none!important;margin:0!important;
padding:24px 22px 26px!important;background:#00203F!important;
font-size:14px!important;line-height:1.6!important;color:#A9C2E0!important;
transition:background .38s cubic-bezier(.22,.8,.26,1)}
body.elementor-page-9275 #de-cx-mods ul > li:hover{background:#062B4E!important}
body.elementor-page-9275 #de-cx-mods ul > li::marker{content:""}
body.elementor-page-9275 #de-cx-mods ul > li::before{
content:counter(cxm,decimal-leading-zero)!important;
position:static!important;top:auto!important;left:auto!important;
display:block!important;width:auto!important;height:auto!important;
margin:0 0 12px 0!important;padding:0!important;background:none!important;
border-radius:0!important;
font-family:'Manrope',sans-serif;font-size:11px;font-weight:700;
letter-spacing:1.6px;color:#FF9387!important}
body.elementor-page-9275 #de-cx-mods ul > li strong{display:block;margin-bottom:8px;
font-size:16px;font-weight:700;letter-spacing:-.015em;line-height:1.3;color:#FFFFFF!important}
body.elementor-page-9275 #de-cx-mods ul > li:last-child:nth-child(7){grid-column:1/-1;
background:radial-gradient(620px 240px at 88% 0%,rgba(245,83,73,.15),rgba(245,83,73,0) 66%),#00203F!important}
body.elementor-page-9275 #de-cx-go{margin-top:24px!important}
body.elementor-page-9275 #de-cx-go .elementor-heading-title a{display:inline-flex;align-items:center;gap:9px;
font-size:14px;font-weight:700;letter-spacing:.2px;color:#7FB3FF!important;
text-decoration:none;transition:color .3s ease}
body.elementor-page-9275 #de-cx-go .elementor-heading-title a::after{content:"\2192";
transition:transform .32s cubic-bezier(.22,.8,.26,1)}
body.elementor-page-9275 #de-cx-go .elementor-heading-title a:hover{color:#FF9387!important}
body.elementor-page-9275 #de-cx-go .elementor-heading-title a:hover::after{transform:translateX(5px)}
@media(max-width:1024px){
body.elementor-page-9275 #de-cx-mods ul{grid-template-columns:repeat(2,1fr)}
body.elementor-page-9275 #de-cx-mods ul > li:last-child:nth-child(7){grid-column:1/-1}
}
@media(max-width:620px){
body.elementor-page-9275 #de-cx-mods ul{grid-template-columns:1fr}
body.elementor-page-9275 #de-cx-head .elementor-heading-title{padding:14px 18px}
body.elementor-page-9275 #de-cx-mods ul > li{padding:20px 18px 22px!important}
}
/* ---- B-CRAFT-9a, specificity and the light band ----------------
The service page system's card rule is keyed on the SECTION id, so
it outranks anything keyed on the widget id alone: it was still
winning on padding, border and radius, which broke the flush grid,
and it sets display:none on li::before. Match its shape. Measured,
not guessed: li padding read 26/26/28 against the 24/22/26 asked
for, and the ul kept a 28px top margin that pushed the panel body
off its header bar.
Both platform sections are #F6F9FC, a LIGHT band, so the link out
cannot use the dark-band blue. Contrast on #7FB3FF over #F6F9FC is
about 2.1:1. #004F9E is 7.6:1.
A numeral would imply these modules run in an order. They do not.
The hub's stat cards mark a non-sequential item with a short
gradient hairline, so use that instead.
---------------------------------------------------------------- */
body.elementor-page-9275 #de-platform #de-cx-head{width:100%}
body.elementor-page-9275 #de-platform #de-cx-mods > .elementor-widget-container{margin-top:0!important}
body.elementor-page-9275 #de-platform #de-cx-mods ul{margin:0!important}
body.elementor-page-9275 #de-platform #de-cx-mods ul > li{
padding:24px 22px 26px!important;border:0!important;border-radius:0!important;
box-shadow:none!important;transform:none!important}
body.elementor-page-9275 #de-platform #de-cx-mods ul > li:hover{background:#062B4E!important;
transform:none!important;box-shadow:none!important}
body.elementor-page-9275 #de-platform #de-cx-mods ul > li::before{
content:""!important;display:block!important;
width:34px!important;height:2px!important;margin:0 0 16px 0!important;
padding:0!important;border-radius:0!important;
background:linear-gradient(90deg,#7FB3FF,#F55349)!important}
body.elementor-page-9275 #de-platform #de-cx-go .elementor-heading-title a{color:#004F9E!important}
body.elementor-page-9275 #de-platform #de-cx-go .elementor-heading-title a:hover{color:#F55349!important}
/* ================================================================
B-CRAFT-10, FAQ on Elementor's native accordion.
Crayon Digital, 31 Aug 2026.
Ads, screen walkthrough 12:35 on this page: "randomly we've got
frequently asked questions. It's not even a burger menu. It doesn't
look anything like anything else on the website."
It was nine questions in one text editor, no accordion at all. Now
the same widget and the same CSS as the home page and the hub, so
every FAQ on the site is one device. faq_schema is on, so this page
emits FAQPage structured data it did not have before.
================================================================ */
body.elementor-page-9275 #de-faq{background-color:#F6F9FC!important}
body.elementor-page-9275 #de-faq .elementor-heading-title{color:#003468!important}
body.elementor-page-9275 #de-faq > .e-con-inner > .elementor-widget-heading:first-child div.elementor-heading-title{color:#F55349!important}
body.elementor-page-9275 #de-faq::after{color:#003468;opacity:.05}
body.elementor-page-9275 #faq-acc{max-width:900px}
body.elementor-page-9275 #faq-acc .elementor-accordion-item{border:1px solid #E3EAF2!important;border-radius:16px;background:#fff;margin-bottom:12px;overflow:hidden;transition:border-color .35s,box-shadow .35s}
body.elementor-page-9275 #faq-acc .elementor-accordion-item:hover{border-color:#C4D6EC!important;box-shadow:0 18px 40px -28px rgba(0,27,54,.45)}
body.elementor-page-9275 #faq-acc .elementor-tab-title{padding:22px 26px!important;background:transparent!important;border:0!important;display:flex;align-items:center;justify-content:space-between;gap:18px;flex-direction:row-reverse;margin:0}
body.elementor-page-9275 #faq-acc .elementor-accordion-title{font-family:'Sora',sans-serif;font-weight:600!important;font-size:17px!important;color:#003468!important;letter-spacing:-.01em!important;line-height:1.35!important}
body.elementor-page-9275 #faq-acc .elementor-accordion-icon{flex:0 0 26px;width:26px;height:26px;border-radius:50%;background:#FFE8E4;color:#F55349;display:grid;place-items:center;margin:0;padding:0;transition:transform .4s cubic-bezier(.22,1,.36,1),background .3s,color .3s}
body.elementor-page-9275 #faq-acc .elementor-accordion-icon i{font-size:12px;line-height:1}
body.elementor-page-9275 #faq-acc .elementor-accordion-icon svg{width:12px;height:12px;fill:currentColor}
body.elementor-page-9275 #faq-acc .elementor-tab-title.elementor-active .elementor-accordion-icon{background:#F55349;color:#fff;transform:rotate(45deg)}
body.elementor-page-9275 #faq-acc .elementor-tab-content{padding:0 26px 24px!important;border:0!important;background:transparent!important;font-family:'Manrope',sans-serif;font-size:15px;line-height:1.65;color:#66727E!important;max-width:72ch}
body.elementor-page-9275 #faq-acc .elementor-tab-content a{color:#004F9E;text-decoration:underline;text-underline-offset:3px}
body.elementor-page-9275 #faq-acc .elementor-tab-content a:hover{color:#F55349}
/* ---- The CTA button rule ---------------------------------------
Ads, walkthrough 3:25 and 9:56: "these call to action should be two
different colours" and "you've got two, two orange... why is it not
married up?" The hub's closing CTA is one coral primary plus one
ghost. Both service pages had two coral, so the eye had nowhere to
go and the booking lost its emphasis.
Each button sits in its own sub-container here, so the secondary
cannot be keyed on :nth-child of the button widget. It is keyed on
the second child container instead.
---------------------------------------------------------------- */
body.elementor-page-9275 #svc-btns-2 > .e-con-inner > .e-con:nth-child(2) .elementor-button{
background-color:transparent!important;background-image:none!important;
color:#FFFFFF!important;border:1px solid rgba(255,255,255,.32)!important;
box-shadow:0 0 10px rgba(0,0,0,.5)!important;
transition:background-color .32s ease,border-color .32s ease}
body.elementor-page-9275 #svc-btns-2 > .e-con-inner > .e-con:nth-child(2) .elementor-button:hover{
background-color:rgba(255,255,255,.09)!important;border-color:rgba(255,255,255,.62)!important}
/* ================================================================
B-CRAFT-11, the hero brought onto the hub's shape system.
Crayon Digital, 31 Aug 2026.
Ads, walkthrough 10:21, same fault as Advisory: "we've got the
silly animation on the left hand side where it should be here."
The hub's hero carries FOUR shapes in two layers: two large blurred
colour blooms bleeding off the top-right and bottom-left corners,
and two glass rounded squares drifting over them. This page had
only the two glass squares, tucked into a corner, so it read as two
stray boxes rather than a field.
Blooms take the hero's own pseudo-elements. Glass squares move onto
the inner wrapper's pseudo-elements at z-index -1, behind the copy
but in front of the blooms, matching the hub's stacking. No new
markup. Values read from the hub's page CSS, not eyeballed.
================================================================ */
body.elementor-page-9275 #de-hero{
background:linear-gradient(158deg,#001B36 0%,#003468 55%,#01417F 100%)!important;
position:relative;overflow:clip}
body.elementor-page-9275 #de-hero::before,
body.elementor-page-9275 #de-hero::after{
content:""!important;position:absolute;border-radius:50%!important;
filter:blur(72px);pointer-events:none;z-index:0;border:0!important}
body.elementor-page-9275 #de-hero::before{
width:640px!important;height:640px!important;top:-220px!important;right:-140px!important;
bottom:auto!important;left:auto!important;
background:radial-gradient(circle,rgba(127,179,255,.5),transparent 68%)!important;
animation:svcAur 22s ease-in-out infinite}
body.elementor-page-9275 #de-hero::after{
width:520px!important;height:520px!important;bottom:-240px!important;left:-120px!important;
top:auto!important;right:auto!important;
background:radial-gradient(circle,rgba(245,83,73,.4),transparent 66%)!important;
animation:svcAur2 27s ease-in-out infinite}
body.elementor-page-9275 #de-hero > .e-con-inner{position:relative;z-index:1}
body.elementor-page-9275 #de-hero > .e-con-inner::before,
body.elementor-page-9275 #de-hero > .e-con-inner::after{
content:"";position:absolute;z-index:-1;pointer-events:none;
border:1px solid rgba(159,180,212,.26);
background:linear-gradient(145deg,rgba(255,255,255,.13),rgba(255,255,255,.02));
backdrop-filter:blur(3px);box-shadow:0 36px 90px rgba(0,12,28,.4);
animation:svcDriftShape linear infinite}
body.elementor-page-9275 #de-hero > .e-con-inner::before{
top:6%;right:3%;width:250px;height:250px;border-radius:28px;animation-duration:21s}
body.elementor-page-9275 #de-hero > .e-con-inner::after{
bottom:2%;right:26%;width:330px;height:330px;border-radius:28px;animation-duration:31s;
background:linear-gradient(145deg,rgba(255,147,135,.26),rgba(245,83,73,.05));
border-color:rgba(255,147,135,.34)}
@keyframes svcAur{0%,100%{transform:translate3d(0,0,0) scale(1)}33%{transform:translate3d(-56px,42px,0) scale(1.12)}66%{transform:translate3d(38px,-32px,0) scale(.94)}}
@keyframes svcAur2{0%,100%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(64px,-48px,0) scale(1.16)}}
@keyframes svcDriftShape{0%{transform:translate3d(0,0,0) rotate(0deg)}25%{transform:translate3d(14px,-18px,0) rotate(2deg)}50%{transform:translate3d(-10px,12px,0) rotate(-1.5deg)}75%{transform:translate3d(8px,16px,0) rotate(1deg)}100%{transform:translate3d(0,0,0) rotate(0deg)}}
@media(max-width:1024px){
body.elementor-page-9275 #de-hero > .e-con-inner::before{width:170px;height:170px;top:2%;right:1%}
body.elementor-page-9275 #de-hero > .e-con-inner::after{width:200px;height:200px;bottom:1%;right:6%}
}
@media(max-width:768px){
body.elementor-page-9275 #de-hero > .e-con-inner::before,
body.elementor-page-9275 #de-hero > .e-con-inner::after{display:none}
}
@media(prefers-reduced-motion:reduce){
body.elementor-page-9275 #de-hero::before,body.elementor-page-9275 #de-hero::after,
body.elementor-page-9275 #de-hero > .e-con-inner::before,body.elementor-page-9275 #de-hero > .e-con-inner::after{animation:none!important}
}
/* ---- Band alternation ------------------------------------------
Ads, walkthrough 9:12: "it should go navy then white. Anyway, you
should alternate."
Audited every section on all three pages. The hub already alternates
cleanly the whole way down. This page had ONE clash: two light bands
touching, #de-why followed by #de-faq.
The section count makes perfect alternation impossible, because the
closing CTA must stay navy and the FAQ must be light. So the "why
us" section takes the hub's own df-sec band, a white to pale blue
gradient. Same treatment the hub gives the same kind of section, and
the two light bands are now different tones rather than the same
flat grey. Advisory carries the identical rule.
---------------------------------------------------------------- */
body.elementor-page-9275 #de-why{background:linear-gradient(180deg,#FFFFFF,#EAF1F9)!important}
body.elementor-page-9275 #de-why .elementor-heading-title{color:#17222E!important}
body.elementor-page-9275 #de-why > .e-con-inner > .elementor-widget-heading:first-child div.elementor-heading-title{color:#004F9E!important}
body.elementor-page-9275 #de-why .elementor-widget-text-editor,
body.elementor-page-9275 #de-why .elementor-widget-text-editor p,
body.elementor-page-9275 #de-why .elementor-widget-text-editor li{color:#48545F!important}
body.elementor-page-9275 #de-why .elementor-widget-text-editor strong{color:#17222E!important}
body.elementor-page-9275 #de-why::after{color:#004F9E!important;opacity:.06!important}
/* ================================================================
B-CRAFT-12, How it works rebuilt on the hub's lifecycle stepper.
Crayon Digital, 31 Aug 2026.
Two asks answered at once. Mayank on the 28 August call wanted this
section mapped like the hub's lifecycle including its outputs, and
Ads on the 31 August walkthrough wanted the walls of text broken:
"it's a block, it's a wall of text all the time. You look at it and
it breaks your soul."
It was six numbered paragraphs in one ordered list, 1590px tall for
225 words. The content was already the right shape, every stage had
an explicit "Outputs:" clause, so it maps onto the hub's rail plus
two-panel card with nothing invented and nothing lost.
Two differences from Advisory's copy of the same device. Six steps
not four, so the rail insets are 8.333% (half of one sixth) rather
than 12.5%. And this band is navy, where the hub's is #F6F9FC, so
the rail and the closing line are recoloured for a dark ground. The
panels stay white cards, which reads well on navy.
================================================================ */
body.elementor-page-9275 #lc-wrap{margin-top:44px!important;padding:0!important;max-width:none!important;width:100%;display:block}
body.elementor-page-9275 #lc-rail{max-width:none!important;margin:0!important;position:relative}
body.elementor-page-9275 #lc-rail .elementor-icon-list-icon{display:none!important}
body.elementor-page-9275 #lc-rail ul.elementor-icon-list-items{display:grid;grid-template-columns:repeat(6,1fr);gap:0;margin:0;padding:0;position:relative}
body.elementor-page-9275 #lc-rail ul.elementor-icon-list-items::before{content:"";position:absolute;left:8.333%;right:8.333%;top:18px;height:2px;background:rgba(127,179,255,.26);border-radius:2px}
body.elementor-page-9275 #lc-rail ul.elementor-icon-list-items::after{content:"";position:absolute;left:8.333%;top:18px;height:2px;width:calc((100% - 16.666%) * var(--lc-fill,0) / 100%);background:linear-gradient(90deg,#7FB3FF,#F55349);border-radius:2px;transition:width .55s cubic-bezier(.22,.8,.26,1)}
body.elementor-page-9275 #lc-rail li.elementor-icon-list-item{display:block;margin:0;padding:0;position:relative;z-index:2}
body.elementor-page-9275 #lc-rail li.elementor-icon-list-item span.elementor-icon-list-text{display:flex;flex-direction:column;align-items:center;gap:12px;padding:0 6px;font-size:13px;font-weight:600;color:#9FB4D4;text-align:center;line-height:1.28;cursor:pointer;letter-spacing:-.01em;transition:.35s cubic-bezier(.22,.8,.26,1)}
body.elementor-page-9275 #lc-rail li.elementor-icon-list-item span.elementor-icon-list-text::before{content:"";width:38px;height:38px;border-radius:50%;background:#001B36;border:2px solid rgba(127,179,255,.4);flex:0 0 auto;transition:.4s cubic-bezier(.22,.8,.26,1)}
body.elementor-page-9275 #lc-rail li.elementor-icon-list-item:hover span.elementor-icon-list-text::before{border-color:#7FB3FF;transform:scale(1.08)}
body.elementor-page-9275 #lc-rail li.elementor-icon-list-item.lc-on span.elementor-icon-list-text{color:#FFFFFF;font-weight:700}
body.elementor-page-9275 #lc-rail li.elementor-icon-list-item.lc-on span.elementor-icon-list-text::before{background:linear-gradient(140deg,#F55349,#FF9387);border-color:transparent;transform:scale(1.18);box-shadow:0 10px 26px -8px rgba(245,83,73,.7)}
body.elementor-page-9275 #lc-panels{margin-top:38px!important;padding:0!important;max-width:none!important;width:100%;display:block}
body.elementor-page-9275 #lc-panels > .e-con{display:none!important;padding:0!important;max-width:none!important;width:100%;border-radius:26px;overflow:hidden;border:1px solid rgba(127,179,255,.28);background:#fff!important;box-shadow:0 34px 74px -40px rgba(0,0,0,.75)}
body.elementor-page-9275 #lc-panels > .e-con.lc-on{display:grid!important;grid-template-columns:1.15fr .85fr;gap:0;animation:lcrise .5s cubic-bezier(.22,.8,.26,1) both}
@keyframes lcrise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
body.elementor-page-9275 #lc-panels > .e-con > .elementor-widget-heading{grid-column:1;padding:40px 44px 0!important;margin:0!important}
body.elementor-page-9275 #lc-panels > .e-con > .elementor-widget-heading .elementor-heading-title{color:#17222E!important;font-size:clamp(26px,3vw,38px)!important;font-weight:700!important;letter-spacing:-.03em!important;line-height:1.1!important;max-width:none}
body.elementor-page-9275 #lc-panels > .e-con > .elementor-widget-text-editor:not([id^="lc-o-"]){grid-column:1;padding:0 44px 40px!important;margin:0!important;max-width:none!important}
body.elementor-page-9275 #lc-panels > .e-con > .elementor-widget-text-editor:not([id^="lc-o-"]) p{color:#48545F!important;font-size:16px;line-height:1.7;margin:18px 0 0;max-width:52ch}
body.elementor-page-9275 [id^="lc-o-"]{grid-column:2;grid-row:1 / span 2;margin:0!important;padding:40px 44px!important;max-width:none!important;background:linear-gradient(150deg,#001B36,#01417F)!important;display:flex;flex-direction:column;justify-content:center}
body.elementor-page-9275 [id^="lc-o-"] p.lc-ok{margin:0;font-size:11.5px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;color:#7FB3FF!important}
body.elementor-page-9275 [id^="lc-o-"] p.lc-ov{margin:14px 0 0;font-size:clamp(17px,1.9vw,21px);font-weight:600;letter-spacing:-.02em;line-height:1.4;color:#FFFFFF!important}
body.elementor-page-9275 #lc-close{margin-top:40px!important}
body.elementor-page-9275 #lc-close .elementor-heading-title{text-align:center;font-size:clamp(17px,1.9vw,21px)!important;font-weight:600!important;letter-spacing:-.02em;color:#DCE9F8!important;max-width:62ch;margin:0 auto;line-height:1.45}
body.elementor-page-9275 #de-js{display:none!important}
@media(max-width:1100px){
body.elementor-page-9275 #lc-rail ul.elementor-icon-list-items{grid-template-columns:repeat(3,1fr);gap:22px 0}
body.elementor-page-9275 #lc-rail ul.elementor-icon-list-items::before,
body.elementor-page-9275 #lc-rail ul.elementor-icon-list-items::after{display:none}
}
@media(max-width:900px){
body.elementor-page-9275 #lc-rail ul.elementor-icon-list-items{grid-template-columns:repeat(2,1fr)}
body.elementor-page-9275 #lc-panels > .e-con.lc-on{grid-template-columns:1fr}
body.elementor-page-9275 [id^="lc-o-"]{grid-column:1;grid-row:auto;padding:28px 26px!important}
body.elementor-page-9275 #lc-panels > .e-con > .elementor-widget-heading{padding:30px 26px 0!important}
body.elementor-page-9275 #lc-panels > .e-con > .elementor-widget-text-editor:not([id^="lc-o-"]){padding:0 26px 30px!important}
}
/* --- Purple Cortex cockpit styles (restored from Hub 9272) --- */
/* ================ B5. 04 PURPLE CORTEX COCKPIT ================ */
#cx-sec{background:radial-gradient(140% 100% at 50% 0%,#01417F 0%,#003468 42%,#001B36 100%)!important;padding:104px 0 108px!important;overflow:clip}
#cx-sec > .e-con-inner{max-width:1400px;gap:0}
#cx-sec::after{color:#7FB3FF;opacity:.07}
#cx-eyebrow,#cx-h2,#cx-lede{max-width:800px;margin-left:auto!important;margin-right:auto!important;width:100%}
#cx-eyebrow div.elementor-heading-title{justify-content:center;color:#7FB3FF;font-size:12px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase}
#cx-eyebrow div.elementor-heading-title::after{display:none}
#cx-h2 .elementor-heading-title{text-align:center;color:#fff;font-size:clamp(30px,3.4vw,44px);font-weight:700;letter-spacing:-.028em;line-height:1.12;margin-top:18px;max-width:none}
#cx-lede{margin-top:18px!important;max-width:800px!important}
#cx-lede p{text-align:center;color:#C4D6EC;font-size:17px;line-height:1.68;margin:0}
#cx-win{margin-top:46px!important;background:#04101F!important;border:1px solid rgba(127,179,255,.3);border-radius:18px;overflow:hidden;padding:0!important;gap:0!important;display:flex;flex-direction:column;width:100%}
#cx-bar{margin:0!important;padding:13px 20px 13px 74px!important;background:#081A2E!important;border-bottom:1px solid rgba(127,179,255,.18);position:relative;max-width:none!important;width:100%}
#cx-bar::before{content:"";position:absolute;left:20px;top:50%;transform:translateY(-50%);width:38px;height:10px;background:radial-gradient(circle 5px at 5px 5px,rgba(127,179,255,.32) 98%,transparent 0),radial-gradient(circle 5px at 19px 5px,rgba(127,179,255,.32) 98%,transparent 0),radial-gradient(circle 5px at 33px 5px,rgba(127,179,255,.32) 98%,transparent 0)}
#cx-bar p{margin:0;display:flex;align-items:center;gap:12px;flex-wrap:wrap;max-width:none}
#cx-bar .cx-ttl{font-size:13px;color:#B7CCE4;font-weight:500}
#cx-bar .cx-ttl b{color:#fff;font-weight:600}
#cx-bar .cx-chip{margin-left:auto;font-size:10.5px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;color:#FFC466;border:1px dashed rgba(255,196,102,.5);border-radius:999px;padding:4px 12px}
#cx-body{display:flex;flex-direction:row;align-items:stretch;flex-wrap:nowrap;gap:0!important;padding:0!important;max-width:none!important;width:100%}
#cx-nav{flex:0 0 272px;width:272px!important;max-width:272px!important;padding:16px 13px!important;background:#061625!important;border-right:1px solid rgba(127,179,255,.16);gap:0!important;display:block}
#cx-grp div.elementor-heading-title{display:block;font-size:10.5px;font-weight:700;letter-spacing:1.4px;text-transform:uppercase;color:#5E7591;padding:8px 12px 12px;max-width:none}
#cx-grp div.elementor-heading-title::before,#cx-grp div.elementor-heading-title::after{display:none}
#cx-list .elementor-icon-list-icon,#lc-rail .elementor-icon-list-icon{display:none!important}
#cx-list ul.elementor-icon-list-items{display:block;margin:0;padding:0}
#cx-list li.elementor-icon-list-item{display:block;margin:0;padding:0}
#cx-list li.elementor-icon-list-item span.elementor-icon-list-text{display:flex;align-items:center;gap:11px;padding:11px 12px;border-radius:9px;font-size:13.5px;font-weight:500;color:#9FBADA;line-height:1.3;cursor:pointer;transition:.28s cubic-bezier(.22,.8,.26,1)}
#cx-list li.elementor-icon-list-item span.elementor-icon-list-text::before{content:"";flex:0 0 auto;width:7px;height:7px;border-radius:50%;background:rgba(127,179,255,.4);transition:.3s}
#cx-list li.elementor-icon-list-item:hover span.elementor-icon-list-text{background:rgba(127,179,255,.09);color:#fff}
#cx-list li.elementor-icon-list-item.cx-on span.elementor-icon-list-text{background:rgba(245,83,73,.17);color:#fff;font-weight:600}
#cx-list li.elementor-icon-list-item.cx-on span.elementor-icon-list-text::before{background:#F55349;box-shadow:0 0 0 3px rgba(245,83,73,.24)}
#cx-main{flex:1 1 auto;min-width:0;max-width:none!important;display:flex;flex-direction:column;padding:30px 34px 26px!important;min-height:424px;gap:0!important}
#cx-main > .e-con{display:none!important;padding:0!important;max-width:none!important;width:100%;gap:0!important}
#cx-main > .e-con.cx-on{display:flex!important;flex-direction:column;animation:cxrise .5s cubic-bezier(.22,.8,.26,1) both}
#cx-main .elementor-widget-heading .elementor-heading-title{color:#fff;font-size:clamp(23px,2.4vw,30px);font-weight:700;letter-spacing:-.03em;line-height:1.15;text-align:left;max-width:none}
#cx-main .elementor-widget-heading .elementor-heading-title::before,#cx-main .elementor-widget-heading .elementor-heading-title::after{display:none}
#cx-main .elementor-widget-text-editor{max-width:none!important}
#cx-main .elementor-widget-text-editor p{color:#B7CCE4;font-size:15.5px;line-height:1.66;margin:13px 0 0;max-width:72ch}
.cx-tile{padding:17px 18px;border-radius:12px;background:rgba(127,179,255,.06)!important;border:1px solid rgba(127,179,255,.18);transition:.35s cubic-bezier(.22,.8,.26,1)}
.cx-tile:hover{background:rgba(127,179,255,.11)!important;border-color:rgba(127,179,255,.4)}
.cx-tile .tk{display:block;font-size:10.5px;font-weight:700;letter-spacing:1.3px;text-transform:uppercase;color:#7FB3FF}
.cx-tile .tv{display:block;margin-top:10px;font-size:13.5px;color:#DCE9F8;font-weight:500;line-height:1.45}
.cx-spark{display:block;margin-top:13px;height:30px;background:repeating-linear-gradient(90deg,#7FB3FF 0 4px,transparent 4px 10px);-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 100%);mask-image:linear-gradient(180deg,transparent 0,#000 100%);opacity:.6}
#cx-main #cx-foot{margin-top:auto!important;padding-top:22px!important;border-top:1px solid rgba(127,179,255,.14);max-width:none!important;width:100%}
#cx-main #cx-foot p{display:flex;flex-wrap:wrap;gap:10px 22px;margin:0;max-width:none;font-size:11.5px;line-height:1.5;color:#5E7591;letter-spacing:.3px}
#cx-main #cx-foot p span{display:inline-block}
#cx-main #cx-foot p b{color:#9FBADA;font-weight:600}
#cx-lede2{margin-top:44px!important;max-width:none!important}
#cx-lede2 p{color:#C4D6EC;font-size:17px;line-height:1.68;margin:0;max-width:96ch}
#cx-mem{margin-top:34px!important;display:flex;flex-direction:row;gap:20px;align-items:stretch;padding:0!important;max-width:none!important;width:100%}
#cx-mem-a,#cx-mem-b{flex:1 1 0;min-width:0;padding:30px 32px!important;border-radius:22px;max-width:none!important;margin:0!important}
#cx-mem-a{background:rgba(127,179,255,.07)!important;border:1px solid rgba(127,179,255,.22)}
#cx-mem-a p{color:#B7CCE4;font-size:15px;line-height:1.65;margin:12px 0 0}
#cx-mem-a p.cx-mk{color:#fff;font-size:17px;font-weight:700;letter-spacing:-.02em;margin:0}
#cx-mem-b{background:linear-gradient(130deg,rgba(245,83,73,.16),rgba(127,179,255,.08))!important;border:1px solid rgba(245,83,73,.3);display:grid;place-items:center;text-align:center}
#cx-mem-b p.cx-big{margin:0;font-size:clamp(20px,2.3vw,27px);font-weight:700;letter-spacing:-.025em;color:#fff;line-height:1.25}
#cx-mem-b p.cx-big em{font-style:normal;background:linear-gradient(95deg,#7FB3FF,#F55349 65%,#FFB4A8);-webkit-background-clip:text;background-clip:text;color:transparent}
@media(max-width:980px){
#cx-body{flex-direction:column}
#cx-nav{flex:1 1 auto;width:100%!important;max-width:none!important;border-right:0;border-bottom:1px solid rgba(127,179,255,.16)}
#cx-main{padding:26px 22px 22px!important;min-height:0}
[id^="cx-tiles-"] .elementor-widget-container{grid-template-columns:1fr}
#cx-mem{flex-direction:column}
#lc-rail ul.elementor-icon-list-items{grid-template-columns:repeat(4,1fr);gap:18px 0}
#lc-rail ul.elementor-icon-list-items::before,#lc-rail ul.elementor-icon-list-items::after{display:none}
#lc-panels > .e-con.lc-on{grid-template-columns:1fr}
[id^="lc-o-"]{grid-column:1;grid-row:auto}
#lc-panels > .e-con > .elementor-widget-heading,#lc-panels > .e-con > .elementor-widget-text-editor:not([id^="lc-o-"]){grid-column:1;padding-left:26px!important;padding-right:26px!important}
[id^="lc-o-"]{padding:28px 26px!important}
}
/* ================= B8 post-review pass, 27 Aug ================= */
/* Ads' screenshot review. Boxed: #h-hero #ba-sec #cp-sec #cx-sec #lc-sec
#lv-sec #df-sec #fq-sec #gd-sec #cta-sec. Everything else FULL. */
/* --- HERO strapline --- */
#h-credlbl{margin:32px 0 0!important;padding:22px 0 0!important;position:relative;max-width:none!important}
/* --- 04 PURPLE CORTEX: purple through the cockpit chrome --- */
#cx-sec{background:radial-gradient(120% 92% at 84% 10%,rgba(127,179,255,.32),transparent 58%),radial-gradient(105% 85% at 10% 90%,rgba(245,83,73,.26),transparent 60%),linear-gradient(160deg,#001B36 0%,#0A2A5C 52%,#123063 100%)!important}
#cx-bar{background:linear-gradient(120deg,#3B2A5E,#5A3A72 62%,#6E4478)!important;border-bottom:1px solid rgba(196,168,224,.3)!important}
#cx-nav{background:linear-gradient(180deg,rgba(150,116,182,.24),rgba(90,58,114,.16))!important;border-right:1px solid rgba(196,168,224,.2)!important}
#cx-list li.elementor-icon-list-item.cx-on span.elementor-icon-list-text{background:rgba(196,168,224,.24)!important}
#cx-list li.elementor-icon-list-item:hover span.elementor-icon-list-text{background:rgba(196,168,224,.15)!important}
#cx-main .cx-tile,[id^="cx-tiles-"] .cx-tile{background:linear-gradient(155deg,rgba(150,116,182,.26),rgba(90,58,114,.14))!important;border:1px solid rgba(196,168,224,.3)!important}
#cx-mem-b{display:flex!important;align-items:center;justify-content:center;text-align:center}
#cx-mem-b p{font-size:clamp(22px,2.5vw,32px)!important;line-height:1.22!important;text-align:center!important;max-width:none!important;margin:0!important}
#cx-cta{margin-top:26px!important;padding:0!important;gap:0!important;background:transparent!important;align-items:center!important;max-width:none!important;width:100%}
#cx-cta-btn .elementor-button{padding:15px 30px}
#cx-cta-btn .elementor-button:hover{background:rgba(255,255,255,.1)!important;border-color:#fff!important}
on specificity. */
#jt-sec,#ba-sec,#ap-sec,#cp-sec,#cx-sec,#lc-sec,#lv-sec,#df-sec,#fq-sec,#gd-sec,#cta-sec{padding-left:24px!important;padding-right:24px!important}
@media(max-width:620px){
#jt-sec,#ba-sec,#ap-sec,#cp-sec,#cx-sec,#lc-sec,#lv-sec,#df-sec,#fq-sec,#gd-sec,#cta-sec{padding-left:18px!important;padding-right:18px!important}
}
/* ----------------------------------------------------------------
The three areas Purple Cortex serves, under the cockpit.
Crayon Digital, 29 Aug 2026.
The other half of Mayank's SAP-style ask: the service pages carry
the platform framed for their service, and the hub names the areas
it serves and links to each. Three, matching section 03's three
capabilities, not four. The AI Operations page exists but is not
presented as a Purple Cortex area on the hub, so it is not claimed
as one here.
---------------------------------------------------------------- */
#cx-serves{margin-top:30px!important}
#cx-serves .cxs{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
#cx-serves .cxs-k{margin-right:6px;font-size:11px;font-weight:700;letter-spacing:2px;
text-transform:uppercase;color:#7FB3FF}
#cx-serves .cxs a{display:inline-flex;align-items:center;gap:8px;padding:9px 16px;
border-radius:999px;border:1px solid rgba(127,179,255,.32);
background:rgba(127,179,255,.06);font-size:13.5px;font-weight:600;
color:#DCE9F8;text-decoration:none;
transition:background .34s cubic-bezier(.22,.8,.26,1),border-color .34s,color .34s}
#cx-serves .cxs a::after{content:"\2192";color:#FF9387;
transition:transform .3s cubic-bezier(.22,.8,.26,1)}
#cx-serves .cxs a:hover{background:rgba(245,83,73,.12);border-color:rgba(245,83,73,.5);color:#FFFFFF}
#cx-serves .cxs a:hover::after{transform:translateX(4px)}
@media(max-width:620px){
#cx-serves .cxs{gap:8px}
#cx-serves .cxs a{width:100%;justify-content:space-between}
}/* End custom CSS */