/* Everything below the hero: Cloud White fading to Sky Blue, dark cards on top. */
.engine-section{background:linear-gradient(180deg,#F8FBFF 0%,#E4F3FB 30%,#BFE7F7 62%,#8FD6F2 100%)!important;border-top:0!important}
.engine-section::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse 55% 25% at 88% 3%,rgba(0,194,255,.22),transparent 70%),radial-gradient(ellipse 50% 28% at 6% 52%,rgba(255,255,255,.65),transparent 72%)}
.engine-grid-bg{display:none!important}.engine-orbit{opacity:.2!important;mix-blend-mode:multiply}
.engine-section .engine-kicker,.engine-section .engine-kicker span{color:#0089b5!important}
.engine-section .engine-kicker span{background:#00A9E0!important}
.engine-section .engine-intro h2{color:#243444!important;text-shadow:none!important}
.engine-section .engine-intro h2 em{color:#00A9E0!important;text-shadow:none!important}
.engine-section .engine-intro-copy p{color:#46586a!important}
.engine-section .engine-intro-copy strong{color:#243444!important}
.engine-section .demo-industry-title h3,.engine-section .demo-showcase-header span,.engine-section .demo-gallery-hint{color:#243444!important}
.engine-section .demo-industry-title span,.engine-section .demo-showcase-header i{background:linear-gradient(90deg,transparent,rgba(0,137,181,.55))!important}
.engine-section .demo-showcase-header span:last-child{color:#0089b5!important}
.engine-section .demo-browser p,.engine-section .demo-instruction,.engine-section .demo-browser .demo-hint{color:#46586a!important}
.engine-section .demo-industry-tab{background:#243444!important;color:#F8FBFF!important;border-color:rgba(36,52,68,.9)!important;box-shadow:0 10px 24px -14px rgba(36,52,68,.7)!important}
.engine-section .demo-industry-tab span,.engine-section .demo-industry-tab svg{color:inherit!important}
.engine-section .demo-industry-tab.is-active{background:linear-gradient(90deg,#2ee0ff,#0aa8ff)!important;color:#04202e!important;border-color:#00C2FF!important;box-shadow:0 12px 30px -10px rgba(0,194,255,.7)!important}
.engine-section .demo-gallery-label{color:#243444!important}
.engine-section .demo-gallery-head p,.engine-section .demo-gallery-head a{color:#0089b5!important}
.engine-section .demo-gallery-head i{background:linear-gradient(90deg,rgba(0,137,181,.6),transparent)!important}.engine-section .solutions-industry-tab{background:#243444!important;color:#F8FBFF!important;border-color:rgba(36,52,68,.9)!important}.engine-section .solutions-industry-tab svg,.engine-section .solutions-industry-tab span{color:inherit!important}.engine-section .solutions-industry-title h2,.engine-section .solutions-showcase-header span,.engine-section .solutions-orbit-instruction{color:#243444!important}.engine-section .solutions-showcase-header span:last-child{color:#0089b5!important}.engine-section .solutions-industry-title span{background:linear-gradient(90deg,transparent,rgba(0,137,181,.55))!important}
.engine-close p{color:#2d4052!important}.engine-close p strong,.engine-close p span{color:#243444!important}
/* Contrast fixes: dark text variants on the light background, light text restored inside dark cards. */
.engine-section .engine-kicker,.engine-section .engine-kicker span{color:#00718f!important}
.engine-section .engine-intro h2 em{color:#0086b3!important}
.engine-section .demo-gallery-head p,.engine-section .demo-gallery-head a,.engine-section .solutions-showcase-header span:last-child{color:#006b8c!important}
.engine-section .demo-tile-meta p,.engine-section .demo-tile-meta .demo-tile-desc{color:#c3d6e6!important}
.engine-section .demo-tile-meta h3,.engine-section .demo-tile-meta strong{color:#fff!important}
.engine-section .console-row time{color:#8aa3b8!important}
/* Business Flow: same blue glass and cyan edges as the Referral Rewards panel, lighter than before. */
.engine-section .engine-live{border:1.5px solid rgba(65,215,255,.88);border-radius:clamp(22px,2.9vw,39px);
 background:radial-gradient(ellipse 56% 52% at 98% 0%,rgba(11,151,255,.34),transparent 78%),radial-gradient(ellipse 45% 62% at 0% 98%,rgba(13,88,187,.26),transparent 75%),linear-gradient(150deg,#0f2d52 0%,#0b2342 43%,#081b36 100%);
 box-shadow:0 0 0 5px rgba(0,150,255,.05),0 0 37px rgba(0,186,255,.16),0 30px 75px rgba(0,60,120,.30),inset 0 0 14px rgba(3,193,255,.11),inset 0 1px rgba(222,252,255,.4)}
.engine-section .engine-live-top{background:rgba(8,30,58,.55);border-bottom:1px solid rgba(102,200,255,.28)}
.engine-section .engine-node{border:1.4px solid rgba(51,209,255,.6);
 background:radial-gradient(ellipse 95% 63% at 114% -12%,rgba(36,180,255,.36),transparent 75%),linear-gradient(153deg,rgba(36,145,237,.19),transparent 47%),radial-gradient(ellipse 97% 43% at 103% 108%,rgba(4,103,251,.5),transparent 73%),linear-gradient(154deg,#123660 0%,#0b2748 52%,#091f3b 100%);
 box-shadow:inset 0 1px rgba(232,251,255,.3),inset 0 -4px 17px rgba(0,95,239,.2),0 14px 30px rgba(0,40,90,.22),0 0 16px rgba(0,190,255,.12)}
.engine-section .engine-console{border:1.4px solid rgba(75,219,255,.5);background:linear-gradient(140deg,#0f2f55,#0b2646 60%,#0f3358);box-shadow:inset 0 1px rgba(226,249,255,.25),0 14px 30px rgba(0,40,90,.2)}
.engine-section .console-row{border-bottom-color:rgba(118,200,245,.16)}
.engine-section .console-row,.engine-section .console-row b{color:#eaf4fc}
.engine-section .console-row small{color:#a9c4da}
.engine-section .console-head{background:rgba(8,30,58,.5);color:#9fd6f0}
/* Step numbers: clearly visible. */
.engine-section .engine-node::before{color:rgba(150,225,255,.62)!important;text-shadow:0 0 18px rgba(0,194,255,.35)}

/* Shared blue glass (same as the Business Flow and Referral Rewards panels). */
.engine-section .solutions-detail{border:1.5px solid rgba(65,215,255,.88)!important;
 background:radial-gradient(ellipse 56% 52% at 98% 0%,rgba(11,151,255,.34),transparent 78%),radial-gradient(ellipse 45% 62% at 0% 98%,rgba(13,88,187,.26),transparent 75%),linear-gradient(150deg,#0f2d52 0%,#0b2342 43%,#081b36 100%)!important;
 box-shadow:0 0 0 5px rgba(0,150,255,.05),0 0 37px rgba(0,186,255,.16),0 30px 75px rgba(0,60,120,.30),inset 0 0 14px rgba(3,193,255,.11),inset 0 1px rgba(222,252,255,.4)!important}
.engine-section .solutions-tile{border:1.4px solid rgba(51,209,255,.6)!important;
 background:radial-gradient(ellipse 95% 63% at 114% -12%,rgba(36,180,255,.30),transparent 75%),radial-gradient(ellipse 97% 43% at 103% 108%,rgba(4,103,251,.40),transparent 73%),linear-gradient(154deg,#123660 0%,#0b2748 52%,#091f3b 100%)!important;
 box-shadow:inset 0 1px rgba(232,251,255,.3),0 14px 30px rgba(0,40,90,.22),0 0 16px rgba(0,190,255,.12)!important}
.engine-section .demo-tile,.engine-section .solutions-orbit-frame{border:1.4px solid rgba(51,209,255,.6)!important;
 background:radial-gradient(ellipse 95% 63% at 114% -12%,rgba(36,180,255,.30),transparent 75%),radial-gradient(ellipse 97% 43% at 103% 108%,rgba(4,103,251,.40),transparent 73%),linear-gradient(154deg,#123660 0%,#0b2748 52%,#091f3b 100%)!important;
 box-shadow:inset 0 1px rgba(232,251,255,.3),0 14px 30px rgba(0,40,90,.22),0 0 16px rgba(0,190,255,.12)!important}
.engine-section .demo-tile-meta p,.engine-section .solutions-card-desc,.engine-section .solutions-tile p{color:#cfe2f1!important}

/* AI, Automation, Reporting buttons: same cyan glow as the business type tabs when active, hovered or pressed. */
.engine-section .solutions-industry-tab,.engine-section .solutions-tabs button{transition:background .2s,box-shadow .2s,color .2s,border-color .2s}
.engine-section .solutions-industry-tab:hover,.engine-section .solutions-industry-tab:focus-visible,.engine-section .solutions-industry-tab:active,
.engine-section .solutions-tabs button:hover,.engine-section .solutions-tabs button[aria-pressed="true"]{background:linear-gradient(90deg,#2ee0ff,#0aa8ff)!important;color:#04202e!important;border-color:#00C2FF!important;box-shadow:0 12px 30px -10px rgba(0,194,255,.75),0 0 18px rgba(0,194,255,.35)!important}
.engine-section .solutions-industry-tab:hover svg,.engine-section .solutions-industry-tab:hover span,.engine-section .solutions-tabs button:hover span,.engine-section .solutions-tabs button[aria-pressed="true"] span{color:#04202e!important}
/* Card bodies and inactive buttons: let the blue glass show through instead of near-black layers. */
.engine-section .solutions-tile-front,.engine-section .solutions-tile-back,.engine-section .solutions-tile-body{background:transparent!important}
.engine-section .solutions-tile-visual{background:rgba(8,40,80,.55)!important}
.engine-section .solutions-tile-state{background:rgba(6,34,70,.55)!important}
.engine-section .demo-tile-meta{background:transparent!important}
.engine-section .demo-view,.engine-section .solutions-card-view,.engine-section .solutions-tile .solutions-tile-cta,.engine-section .solutions-tile button{background:rgba(0,194,255,.14)!important;border-color:rgba(75,219,255,.7)!important;color:#fff!important}
.engine-section .demo-view:hover,.engine-section .solutions-card-view:hover,.engine-section .solutions-tile button:hover{background:linear-gradient(90deg,#2ee0ff,#0aa8ff)!important;color:#04202e!important}
.engine-section .solutions-tabs button,.engine-section .solutions-industry-tab:not(:hover):not(:focus-visible){background:rgba(10,48,92,.72);border-color:rgba(75,219,255,.55);color:#eaf6ff}
/* Top pills (business type, AI/Automation/Reporting): blue glass at rest, cyan glow on hover, focus and press. */
.engine-section .solutions-industry-tab:not(:hover):not(:focus-visible):not(:active):not(.is-active),.engine-section .demo-industry-tab:not(:hover):not(:focus-visible):not(:active):not(.is-active){background:rgba(10,48,92,.82)!important;border-color:rgba(75,219,255,.6)!important;color:#f2faff!important;box-shadow:0 10px 24px -14px rgba(0,60,120,.7),inset 0 1px rgba(226,249,255,.18)!important}
.engine-section .demo-industry-tab:hover,.engine-section .demo-industry-tab:focus-visible,.engine-section .demo-industry-tab:active{background:linear-gradient(90deg,#2ee0ff,#0aa8ff)!important;color:#04202e!important;border-color:#00C2FF!important;box-shadow:0 12px 30px -10px rgba(0,194,255,.75),0 0 18px rgba(0,194,255,.35)!important}
.engine-section .demo-industry-tab:hover svg,.engine-section .demo-industry-tab:hover span{color:#04202e!important}
/* QA fixes: readable "more demos" card text, Explore tab hover gradient wins over the resting glass, no clipped glow seam under the ring. */
.engine-section .demo-coming p,.engine-section .demo-coming-inner p{color:#c3d6e6!important}
.engine-section .demo-coming h3,.engine-section .demo-coming h4,.engine-section .demo-coming strong{color:#fff!important}
.engine-section .solutions-tabs button:not([aria-pressed="true"]):not(:hover):not(:focus-visible){background:rgba(10,48,92,.72)!important;border-color:rgba(75,219,255,.55)!important}
.engine-section .solutions-tabs button:not([aria-pressed="true"]):hover,.engine-section .solutions-tabs button:not([aria-pressed="true"]):focus-visible{background:linear-gradient(90deg,#2ee0ff,#0aa8ff)!important;color:#04202e!important;border-color:#00C2FF!important}
.engine-section .demo-gallery.is-orbit::before{display:none!important}

/* Flip cards (AI, Automation, Reporting): the faces were see-through glass, so on iPhone the hidden face's text showed through, mirrored.
   Give both faces the same glass gradient as the tile, solid, so the look is identical but nothing can show through. No change to the flip motion. */
.engine-section .solutions-tile-front,.engine-section .solutions-tile-back{background:radial-gradient(ellipse 95% 63% at 114% -12%,rgba(36,180,255,.30),transparent 75%),radial-gradient(ellipse 97% 43% at 103% 108%,rgba(4,103,251,.40),transparent 73%),linear-gradient(154deg,#123660 0%,#0b2748 52%,#091f3b 100%)!important}
