.elementor-22588 .elementor-element.elementor-element-2612168{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:space-between;--align-items:center;--margin-top:-80px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:12px;--padding-bottom:12px;--padding-left:30px;--padding-right:30px;}.elementor-22588 .elementor-element.elementor-element-0090e8e img{width:40px;}.elementor-22588 .elementor-element.elementor-element-a9d8d56{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;--gap:24px 24px;--row-gap:24px;--column-gap:24px;}.elementor-22588 .elementor-element.elementor-element-b0061d8{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--overlay-opacity:1;}.elementor-22588 .elementor-element.elementor-element-b0061d8::before, .elementor-22588 .elementor-element.elementor-element-b0061d8 > .elementor-background-video-container::before, .elementor-22588 .elementor-element.elementor-element-b0061d8 > .e-con-inner > .elementor-background-video-container::before, .elementor-22588 .elementor-element.elementor-element-b0061d8 > .elementor-background-slideshow::before, .elementor-22588 .elementor-element.elementor-element-b0061d8 > .e-con-inner > .elementor-background-slideshow::before, .elementor-22588 .elementor-element.elementor-element-b0061d8 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:transparent;--background-overlay:'';background-image:linear-gradient(180deg, #02080C52 1%, #02080C 90%);}.elementor-22588 .elementor-element.elementor-element-a0fcd76{--display:flex;--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--gap:28px 28px;--row-gap:28px;--column-gap:28px;}.elementor-22588 .elementor-element.elementor-element-eb7c069{--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-22588 .elementor-element.elementor-element-18b25f7.elementor-element{--align-self:flex-start;}.elementor-22588 .elementor-element.elementor-element-cc2acb5 > .elementor-widget-container{margin:16px 0px 0px 0px;}.elementor-22588 .elementor-element.elementor-element-c7563e2{--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;--gap:15px 15px;--row-gap:15px;--column-gap:15px;--flex-wrap:wrap;}.elementor-22588 .elementor-element.elementor-element-d180f93{--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-22588 .elementor-element.elementor-element-aafa56e{--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;--gap:24px 24px;--row-gap:24px;--column-gap:24px;}.elementor-22588 .elementor-element.elementor-element-2de913b{--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;--gap:20px 20px;--row-gap:20px;--column-gap:20px;}.elementor-22588 .elementor-element.elementor-element-aa6f045{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--overlay-opacity:1;}.elementor-22588 .elementor-element.elementor-element-aa6f045:not(.elementor-motion-effects-element-type-background), .elementor-22588 .elementor-element.elementor-element-aa6f045 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://fabbrica66.com/wp-content/uploads/2026/07/luxa.org-brightness-backstage-1.jpg");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-22588 .elementor-element.elementor-element-aa6f045::before, .elementor-22588 .elementor-element.elementor-element-aa6f045 > .elementor-background-video-container::before, .elementor-22588 .elementor-element.elementor-element-aa6f045 > .e-con-inner > .elementor-background-video-container::before, .elementor-22588 .elementor-element.elementor-element-aa6f045 > .elementor-background-slideshow::before, .elementor-22588 .elementor-element.elementor-element-aa6f045 > .e-con-inner > .elementor-background-slideshow::before, .elementor-22588 .elementor-element.elementor-element-aa6f045 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:#02080C;--background-overlay:'';}.elementor-22588 .elementor-element.elementor-element-47c440c{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-22588 .elementor-element.elementor-element-2cad69e{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-22588 .elementor-element.elementor-element-b161e8d{--display:flex;}.elementor-22588 .elementor-element.elementor-element-c7a493f{--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;--gap:16px 16px;--row-gap:16px;--column-gap:16px;}.elementor-22588 .elementor-element.elementor-element-2211b25{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-22588 .elementor-element.elementor-element-b29e780{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-22588 .elementor-element.elementor-element-679f835{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-22588 .elementor-element.elementor-element-582bac5{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-22588 .elementor-element.elementor-element-a1c4edf{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-22588 .elementor-element.elementor-element-171c16b.elementor-element{--align-self:center;}.elementor-22588 .elementor-element.elementor-element-d2dd13a{text-align:center;}.elementor-22588 .elementor-element.elementor-element-7b401a8{--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;--justify-content:center;}.elementor-22588 .elementor-element.elementor-element-82680d1 img{width:128px;}.elementor-22588 .elementor-element.elementor-element-82680d1 .widget-image-caption{color:var( --e-global-color-primary );background-color:#0A090300;}.elementor-22588 .elementor-element.elementor-element-2d58ec4{--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;--justify-content:flex-end;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:20px;--padding-bottom:20px;--padding-left:20px;--padding-right:20px;}.elementor-22588 .elementor-element.elementor-element-dbdd161 .elementor-repeater-item-19d60ab{left:10%;--hotspot-translate-x:10%;top:21%;--hotspot-translate-y:21%;}.elementor-22588 .elementor-element.elementor-element-dbdd161 .elementor-repeater-item-94b8820 .e-hotspot--tooltip-position{right:initial;bottom:initial;left:initial;top:calc(100% + 5px );}.elementor-22588 .elementor-element.elementor-element-dbdd161 .elementor-repeater-item-94b8820{left:50%;--hotspot-translate-x:50%;top:39%;--hotspot-translate-y:39%;}.elementor-22588 .elementor-element.elementor-element-dbdd161 .elementor-repeater-item-5aef9ef .e-hotspot--tooltip-position{right:calc(100% + 5px );bottom:initial;left:initial;top:initial;}.elementor-22588 .elementor-element.elementor-element-dbdd161 .elementor-repeater-item-5aef9ef{left:82%;--hotspot-translate-x:82%;top:42%;--hotspot-translate-y:42%;}.elementor-22588 .elementor-element.elementor-element-dbdd161 .elementor-repeater-item-671b49d .e-hotspot--tooltip-position{right:initial;bottom:initial;left:calc(100% + 5px );top:initial;}.elementor-22588 .elementor-element.elementor-element-dbdd161 .elementor-repeater-item-671b49d{left:50%;--hotspot-translate-x:50%;top:70%;--hotspot-translate-y:70%;}.elementor-22588 .elementor-element.elementor-element-dbdd161 .e-hotspot--tooltip-position{right:initial;bottom:initial;left:calc(100% + 5px );top:initial;}.elementor-22588 .elementor-element.elementor-element-dbdd161{--background-align:center;--container-width:100%;--image-width:100%;--opacity:0.8;--hotspot-color:#ECA72C;--hotspot-size:20px;--tooltip-text-color:#FFFFFF;--tooltip-align:left;--tooltip-padding:15px 15px 15px 15px;--tooltip-color:#000000D1;--tooltip-border-radius:12px 12px 12px 12px;}.elementor-22588 .elementor-element.elementor-element-dbdd161 .elementor-widget-container>img:hover{--opacity:1;}.elementor-22588 .elementor-element.elementor-element-dbdd161 img{transition-duration:0.5s;}.elementor-22588 .elementor-element.elementor-element-dbdd161 .e-hotspot__tooltip{font-family:"Overpass", Sans-serif;font-size:15px;font-weight:400;}.elementor-22588 .elementor-element.elementor-element-c824167 .elementor-repeater-item-eb86d1a{left:50%;--hotspot-translate-x:50%;top:21%;--hotspot-translate-y:21%;}.elementor-22588 .elementor-element.elementor-element-c824167 .elementor-repeater-item-5040032 .e-hotspot--tooltip-position{right:initial;bottom:calc(100% + 5px );left:initial;top:initial;}.elementor-22588 .elementor-element.elementor-element-c824167 .elementor-repeater-item-5040032{left:50%;--hotspot-translate-x:50%;top:70%;--hotspot-translate-y:70%;}.elementor-22588 .elementor-element.elementor-element-c824167 .e-hotspot--tooltip-position{right:calc(100% + 5px );bottom:initial;left:initial;top:initial;}.elementor-22588 .elementor-element.elementor-element-c824167 > .elementor-widget-container{padding:0px 0px 0px 20px;}.elementor-22588 .elementor-element.elementor-element-c824167{--opacity:0.8;--hotspot-color:#ECA72C;--hotspot-size:12px;--tooltip-text-color:#FFFFFF;--tooltip-align:left;--tooltip-padding:22px 22px 22px 22px;--tooltip-color:#000000D1;--tooltip-border-radius:12px 12px 12px 12px;}.elementor-22588 .elementor-element.elementor-element-c824167 .elementor-widget-container>img:hover{--opacity:1;}.elementor-22588 .elementor-element.elementor-element-c824167 img{transition-duration:0.5s;}.elementor-22588 .elementor-element.elementor-element-c824167 .e-hotspot__tooltip{font-family:"Overpass", Sans-serif;font-size:15px;font-weight:400;}.elementor-22588 .elementor-element.elementor-element-70b8f86{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-22588 .elementor-element.elementor-element-6b1ae13{--display:flex;}.elementor-22588 .elementor-element.elementor-element-7258bb8{--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;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-22588 .elementor-element.elementor-element-99ef7aa{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-22588 .elementor-element.elementor-element-914306e{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-22588 .elementor-element.elementor-element-da7ab13{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-22588 .elementor-element.elementor-element-76f4954{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-22588 .elementor-element.elementor-element-3bdd9bb{--spacer-size:50px;}.elementor-22588 .elementor-element.elementor-element-7e9dd9d.elementor-element{--align-self:center;}.elementor-22588 .elementor-element.elementor-element-6570e37{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-22588 .elementor-element.elementor-element-abb383c{--display:flex;}.elementor-22588 .elementor-element.elementor-element-d6d4a47{text-align:center;}.elementor-22588 .elementor-element.elementor-element-5779af2{text-align:center;}.elementor-22588 .elementor-element.elementor-element-542661e{--display:flex;}.elementor-22588 .elementor-element.elementor-element-acffbb8{--display:flex;}.elementor-22588 .elementor-element.elementor-element-52e6fe2 .elementor-icon-wrapper{text-align:center;}.elementor-22588 .elementor-element.elementor-element-d10fa2c{--display:flex;}.elementor-22588 .elementor-element.elementor-element-d4689f2 .elementor-icon-wrapper{text-align:center;}.elementor-22588 .elementor-element.elementor-element-9f235cc{--display:flex;}.elementor-22588 .elementor-element.elementor-element-92e21f4 .elementor-icon-wrapper{text-align:center;}.elementor-22588 .elementor-element.elementor-element-c029619{--display:flex;}.elementor-22588 .elementor-element.elementor-element-eb07e85 .elementor-icon-wrapper{text-align:center;}.elementor-22588 .elementor-element.elementor-element-fa474d8{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-22588 .elementor-element.elementor-element-619b79c{--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-22588 .elementor-element.elementor-element-b65279c{--display:flex;}.elementor-22588 .elementor-element.elementor-element-5fe6fd2 img{width:76%;border-radius:10px 10px 10px 10px;}.elementor-22588 .elementor-element.elementor-element-0c8e345{--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-22588 .elementor-element.elementor-element-469ae06{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-22588 .elementor-element.elementor-element-4236e8f{--display:flex;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-22588 .elementor-element.elementor-element-8c87cf2{--display:flex;}.elementor-22588 .elementor-element.elementor-element-77a2aac{--display:flex;}.elementor-22588 .elementor-element.elementor-element-ba37ca5 > .elementor-widget-container{margin:20px 0px 20px 0px;}.elementor-22588 .elementor-element.elementor-element-548c88d{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-22588 .elementor-element.elementor-element-5e15dea{--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;--justify-content:center;--align-items:center;}.elementor-22588 .elementor-element.elementor-element-c33d561{text-align:center;}.elementor-22588 .elementor-element.elementor-element-72fd556 .elementor-field-group{padding-right:calc( 10px/2 );padding-left:calc( 10px/2 );margin-bottom:10px;}.elementor-22588 .elementor-element.elementor-element-72fd556 .elementor-form-fields-wrapper{margin-left:calc( -10px/2 );margin-right:calc( -10px/2 );margin-bottom:-10px;}.elementor-22588 .elementor-element.elementor-element-72fd556 .elementor-field-group.recaptcha_v3-bottomleft, .elementor-22588 .elementor-element.elementor-element-72fd556 .elementor-field-group.recaptcha_v3-bottomright{margin-bottom:0;}body.rtl .elementor-22588 .elementor-element.elementor-element-72fd556 .elementor-labels-inline .elementor-field-group > label{padding-left:0px;}body:not(.rtl) .elementor-22588 .elementor-element.elementor-element-72fd556 .elementor-labels-inline .elementor-field-group > label{padding-right:0px;}body .elementor-22588 .elementor-element.elementor-element-72fd556 .elementor-labels-above .elementor-field-group > label{padding-bottom:0px;}.elementor-22588 .elementor-element.elementor-element-72fd556 .elementor-field-type-html{padding-bottom:0px;}.elementor-22588 .elementor-element.elementor-element-72fd556 .elementor-field-group .elementor-field:not(.elementor-select-wrapper){background-color:#ffffff;}.elementor-22588 .elementor-element.elementor-element-72fd556 .elementor-field-group .elementor-select-wrapper select{background-color:#ffffff;}.elementor-22588 .elementor-element.elementor-element-72fd556 .e-form__buttons__wrapper__button-next{color:#ffffff;}.elementor-22588 .elementor-element.elementor-element-72fd556 .elementor-button[type="submit"]{color:#ffffff;}.elementor-22588 .elementor-element.elementor-element-72fd556 .elementor-button[type="submit"] svg *{fill:#ffffff;}.elementor-22588 .elementor-element.elementor-element-72fd556 .e-form__buttons__wrapper__button-previous{color:#ffffff;}.elementor-22588 .elementor-element.elementor-element-72fd556 .e-form__buttons__wrapper__button-next:hover{color:#ffffff;}.elementor-22588 .elementor-element.elementor-element-72fd556 .elementor-button[type="submit"]:hover{color:#ffffff;}.elementor-22588 .elementor-element.elementor-element-72fd556 .elementor-button[type="submit"]:hover svg *{fill:#ffffff;}.elementor-22588 .elementor-element.elementor-element-72fd556 .e-form__buttons__wrapper__button-previous:hover{color:#ffffff;}.elementor-22588 .elementor-element.elementor-element-72fd556{--e-form-steps-indicators-spacing:20px;--e-form-steps-indicator-padding:30px;--e-form-steps-indicator-inactive-secondary-color:#ffffff;--e-form-steps-indicator-active-secondary-color:#ffffff;--e-form-steps-indicator-completed-secondary-color:#ffffff;--e-form-steps-divider-width:1px;--e-form-steps-divider-gap:10px;}.elementor-22588 .elementor-element.elementor-element-5f3e2f4{text-align:center;}.elementor-22588 .elementor-element.elementor-element-87512bd{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-22588 .elementor-element.elementor-element-d185d1f{--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;--justify-content:center;}.elementor-22588 .elementor-element.elementor-element-9ec044c img{width:40px;}.elementor-22588 .elementor-element.elementor-element-208d088{--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;--justify-content:center;}.elementor-22588 .elementor-element.elementor-element-a88bc0a img{width:128px;}.elementor-22588 .elementor-element.elementor-element-a88bc0a .widget-image-caption{color:var( --e-global-color-primary );background-color:var( --e-global-color-secondary );}.elementor-22588 .elementor-element.elementor-element-9e734d8.elementor-element{--align-self:center;}.elementor-22588 .elementor-element.elementor-element-2a5293e{--display:flex;}.elementor-22588 .elementor-element.elementor-element-5a3c887{text-align:center;}.elementor-22588 .elementor-element.elementor-element-0e11f75{text-align:center;}.elementor-22588 .elementor-element.elementor-element-3ad46d7{--display:flex;}body.elementor-page-22588:not(.elementor-motion-effects-element-type-background), body.elementor-page-22588 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#02080C;}@media(min-width:768px){.elementor-22588 .elementor-element.elementor-element-a0fcd76{--content-width:760px;}.elementor-22588 .elementor-element.elementor-element-aafa56e{--content-width:860px;}.elementor-22588 .elementor-element.elementor-element-aa6f045{--width:50%;}.elementor-22588 .elementor-element.elementor-element-47c440c{--width:50%;}.elementor-22588 .elementor-element.elementor-element-b161e8d{--content-width:1103px;}.elementor-22588 .elementor-element.elementor-element-2211b25{--width:25%;}.elementor-22588 .elementor-element.elementor-element-b29e780{--width:25%;}.elementor-22588 .elementor-element.elementor-element-679f835{--width:25%;}.elementor-22588 .elementor-element.elementor-element-582bac5{--width:25%;}}@media(max-width:1440px){.elementor-22588 .elementor-element.elementor-element-cc2acb5 > .elementor-widget-container{margin:16px 0px 0px 0px;}.elementor-22588 .elementor-element.elementor-element-dbdd161 .elementor-repeater-item-671b49d{top:82%;--hotspot-translate-y:82%;}.elementor-22588 .elementor-element.elementor-element-c824167 .elementor-repeater-item-5040032{top:82%;--hotspot-translate-y:82%;}.elementor-22588 .elementor-element.elementor-element-c824167 > .elementor-widget-container{padding:0px 0px 0px 0px;}}@media(max-width:1024px){.elementor-22588 .elementor-element.elementor-element-cc2acb5 > .elementor-widget-container{margin:16px 0px 0px 0px;}.elementor-22588 .elementor-element.elementor-element-2d58ec4{--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:40px;--padding-bottom:40px;--padding-left:40px;--padding-right:40px;}.elementor-22588 .elementor-element.elementor-element-dbdd161 .elementor-repeater-item-94b8820{top:51%;--hotspot-translate-y:51%;}.elementor-22588 .elementor-element.elementor-element-dbdd161 .elementor-repeater-item-5aef9ef .e-hotspot--tooltip-position{right:initial;bottom:initial;left:calc(100% + 5px );top:initial;}.elementor-22588 .elementor-element.elementor-element-dbdd161 .elementor-repeater-item-671b49d{top:90%;--hotspot-translate-y:90%;}.elementor-22588 .elementor-element.elementor-element-dbdd161 .e-hotspot__tooltip{font-size:14px;}.elementor-22588 .elementor-element.elementor-element-dbdd161{--tooltip-padding:10px 10px 10px 10px;}.elementor-22588 .elementor-element.elementor-element-c824167 .elementor-repeater-item-5040032{top:90%;--hotspot-translate-y:90%;}.elementor-22588 .elementor-element.elementor-element-c824167 .e-hotspot__tooltip{font-size:14px;}}@media(max-width:767px){.elementor-22588 .elementor-element.elementor-element-2612168{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-22588 .elementor-element.elementor-element-a9d8d56{--gap:24px 24px;--row-gap:24px;--column-gap:24px;}.elementor-22588 .elementor-element.elementor-element-cc2acb5 > .elementor-widget-container{margin:16px 0px 0px 0px;}.elementor-22588 .elementor-element.elementor-element-c7563e2{--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-22588 .elementor-element.elementor-element-8955f86{text-align:center;}.elementor-22588 .elementor-element.elementor-element-2d58ec4{--gap:20px 20px;--row-gap:20px;--column-gap:20px;}.elementor-22588 .elementor-element.elementor-element-dbdd161 .elementor-repeater-item-19d60ab{top:9%;--hotspot-translate-y:9%;}.elementor-22588 .elementor-element.elementor-element-dbdd161 .elementor-repeater-item-94b8820 .e-hotspot--tooltip-position{right:calc(100% + 5px );bottom:initial;left:initial;top:initial;}.elementor-22588 .elementor-element.elementor-element-dbdd161 .elementor-repeater-item-94b8820{left:82%;--hotspot-translate-x:82%;}.elementor-22588 .elementor-element.elementor-element-dbdd161 .elementor-repeater-item-5aef9ef .e-hotspot--tooltip-position{right:calc(100% + 5px );bottom:initial;left:initial;top:initial;}.elementor-22588 .elementor-element.elementor-element-dbdd161 .elementor-repeater-item-5aef9ef{top:38%;--hotspot-translate-y:38%;}.elementor-22588 .elementor-element.elementor-element-dbdd161 .elementor-repeater-item-671b49d .e-hotspot--tooltip-position{right:initial;bottom:initial;left:initial;top:calc(100% + 5px );}.elementor-22588 .elementor-element.elementor-element-dbdd161 .elementor-repeater-item-671b49d{top:75%;--hotspot-translate-y:75%;}.elementor-22588 .elementor-element.elementor-element-dbdd161 .e-hotspot--tooltip-position{right:initial;bottom:initial;left:calc(100% + 5px );top:initial;}.elementor-22588 .elementor-element.elementor-element-c824167 .elementor-repeater-item-eb86d1a .e-hotspot--tooltip-position{right:initial;bottom:initial;left:initial;top:calc(100% + 5px );}.elementor-22588 .elementor-element.elementor-element-4236e8f{--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-22588 .elementor-element.elementor-element-31683ae{text-align:start;}.elementor-22588 .elementor-element.elementor-element-c33d561{text-align:start;}}/* Start custom CSS *//* ============================================================================
   VX PRESS — design-system della landing
   DOVE VA:  Elementor → pagina 22137 → (ingranaggio) Impostazioni pagina →
             Avanzate → "CSS personalizzato".   Feature di Elementor Pro.
             NON in Code Snippets (versione free: solo PHP).  NON nel Kit.

   Scope: tutto sotto .vx-band (sul container-root di OGNI sezione).
   Classi container-root:  chiara → vx-band   ·   scura → vx-band vx-band--dark
   Classi sui widget (Avanzate → Classi CSS):  vx-h1, vx-lead, vx-cta, …

   Nota: niente clamp() né proprietà logiche — il linter di Elementor è vecchio
   e li segnala come "errori" pur essendo CSS valido. Qui il responsive è fatto
   con valori fissi + media query ai breakpoint di casa (1024 / 767, design.md §2).
   Valori: design.md §§2-6.
   ========================================================================== */

/* --- Font JOST caricato QUI, dai file sul server di fabbrica66 --------------
   Perché non basta scrivere "Jost": il foglio font di Elementor del sito
   (google-fonts/css/jost.css) punta al vecchio dominio fabbrica.proweb.it, che
   è spento (errore 522) → senza queste righe il browser non trova il font e usa
   un ripiego. I file veri sono su fabbrica66.com e rispondono (verificato
   2026-09-23). Jost è un font VARIABILE: un file copre tutti i pesi 100-900. */
@font-face{
  font-family:"Jost"; font-style:normal; font-weight:100 900; font-display:swap;
  src:url(https://fabbrica66.com/wp-content/uploads/elementor/google-fonts/fonts/jost-92zatbhpnqw73otd4g.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:"Jost"; font-style:normal; font-weight:100 900; font-display:swap;
  src:url(https://fabbrica66.com/wp-content/uploads/elementor/google-fonts/fonts/jost-92zatbhpnqw73ord4iyl.woff2) format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* --- Token: dichiarati una volta sola, sulla banda ------------------------ */
.vx-band{
  --gold:#ECA72C;
  --red:#DA1616;          /* rosso F66 (palette identità 2026-09-23; era #B61717) */
  --dark:#0A0903;          /* nero F66 «Smoky black» (palette identità; era #02080C, il nero-blu di Logica) */
  --light:#F5F2F2;
  --ink:#0A0903;
  --ink-soft:rgba(10,9,3,.88);
  --surface:#F5F2F2;
  --img-border:#2A2720;
  --r:15px;
  --r-pill:100px;
  --gap:20px;
  --t:.3s;
}

/* --- PALETTE F66 (revisione cliente 2026-09-23) -------------------------------
   Il nero della landing era #02080C (nero-blu di LOGICA) → ora #0A0903, il nero di
   Fabbrica66; i grigio-blu di card/bordi → grigi caldi derivati dallo stesso nero;
   il bianco dei testi → #F5F2F2 («White smoke» F66). Tre colori erano impostati nei
   PANNELLI di Elementor (sfondo pagina, velo della hero): li riallineo da qui, così
   non serve cercarli a mano. */
body.elementor-page-22137{ background-color:#0A0903 !important; }
.vx-hero::before,
.vx-hero > .elementor-background-video-container::before{
  background-image:linear-gradient(180deg,rgba(10,9,3,.32) 1%,#0A0903 90%) !important;
}

/* --- Banda: ritmo verticale e larghezza contenuto ------------------------- */
.vx-band{
  background:#F5F2F2;
  color:#0A0903;
  padding:100px 30px;
}
.vx-band--dark{
  background:#0A0903;
  color:#F5F2F2;
}
.vx-inner{
  max-width:1200px;
  margin-left:auto;
  margin-right:auto;
  width:100%;
}

/* --- Tipografia: JOST, il font di Fabbrica66 (identità F66, richiesta cliente 2026-09-23) --- */
/* rete di sicurezza: tutto il TESTO della landing in Jost, anche i widget senza una
   classe vx (tooltip hotspot, bottoni, campi del form). Non si usa ".vx-band *":
   romperebbe le icone, che sono anch'esse un font. */
.vx-band .elementor-heading-title, .vx-band p, .vx-band li, .vx-band label,
.vx-band .elementor-button, .vx-band .e-hotspot__tooltip, .vx-band figcaption,
.vx-band input, .vx-band select, .vx-band textarea,
.vx-header .elementor-heading-title, .vx-header p, .vx-header .elementor-button{
  font-family:"Jost",sans-serif;
}
/* didascalie dei widget Immagine («MADE IN ITALY»): il widget le imposta in Overpass con un
   selettore più forte → qui serve !important */
.vx-band figcaption{ font-family:"Jost",sans-serif !important; }
.vx-eyebrow .elementor-heading-title,
.vx-eyebrow p{
  font-family:"Jost",sans-serif;
  font-weight:700;
  font-size:20px;            /* desktop — un filo più grande, resta occhiello */
  line-height:1.2;
  letter-spacing:1.8px;
  text-transform:uppercase;
  color:#ECA72C;
  margin:0 0 .7em;
}
.vx-band:not(.vx-band--dark) .vx-eyebrow .elementor-heading-title,
.vx-band:not(.vx-band--dark) .vx-eyebrow p{
  color:#DA1616;
}

.vx-h1 .elementor-heading-title{
  font-family:"Jost",sans-serif;
  font-weight:900;
  font-size:70px;
  line-height:1.08;
  margin:0;
}
.vx-h2 .elementor-heading-title{
  font-family:"Jost",sans-serif;
  font-weight:700;
  font-size:45px;
  line-height:1.1;
  margin:0;
}
.vx-h3 .elementor-heading-title{
  font-family:"Jost",sans-serif;
  font-weight:700;
  font-size:30px;
  line-height:1.15;
  margin:0;
}

.vx-lead .elementor-widget-container,
.vx-lead p{
  font-family:"Jost",sans-serif;
  font-weight:400;
  font-size:25px;
  line-height:1.4;
  margin:0;
}
.vx-body .elementor-widget-container,
.vx-body p{
  font-family:"Jost",sans-serif;
  font-weight:400;
  font-size:17px;
  line-height:1.5;
  margin:0;
}
.vx-body p + p{margin-top:.9em;}
.vx-small .elementor-widget-container,
.vx-small p{
  font-family:"Jost",sans-serif;
  font-weight:400;
  font-size:15px;
  line-height:1.5;
  color:rgba(10,9,3,.88);
}
.vx-band--dark .vx-small .elementor-widget-container,
.vx-band--dark .vx-small p{color:rgba(245,242,242,.80);}

.vx-band:not(.vx-band--dark) .vx-emph strong,
.vx-band:not(.vx-band--dark) strong.vx-emph{color:#DA1616;}
.vx-band--dark .vx-emph strong,
.vx-band--dark strong.vx-emph{color:#ECA72C;}   /* su scuro l'enfasi è oro */

/* --- HALO GROTESK: il font «display» di F66, solo su ALCUNI titoli ----------
   Si attiva aggiungendo la classe  vx-halo  al widget Titolo (accanto a vx-h2…).
   ⚠️ Halo (v0.1) NON ha le lettere accentate (à è é ì ò ù …): usarlo SOLO su
   titoli senza accenti, altrimenti quelle lettere escono in Jost (font misto).
   Ha UN solo peso (Regular): peso 400 e niente grassetto finto del browser.
   Licenza CC BY 4.0 (autore: liccibeam / Roman Bobkov) → va citato nel footer.
   File caricato su fabbrica66 il 2026-09-23 (Elementor → Font personalizzati). */
@font-face{
  font-family:"Halo Grotesk"; font-style:normal; font-weight:400; font-display:swap;
  src:url(https://fabbrica66.com/wp-content/uploads/2026/09/HaloGrotesk-Regular.woff2) format("woff2");
}
.vx-halo .elementor-heading-title{
  font-family:"Halo Grotesk","Jost",sans-serif;
  font-weight:400;
  font-synthesis:none;
  letter-spacing:.2px;
}

/* Testo bianco sulle bande scure (l'occhiello resta oro) ------------------- */
.vx-band--dark .vx-h1 .elementor-heading-title,
.vx-band--dark .vx-h2 .elementor-heading-title,
.vx-band--dark .vx-h3 .elementor-heading-title,
.vx-band--dark .vx-lead .elementor-widget-container,
.vx-band--dark .vx-lead p,
.vx-band--dark .vx-body .elementor-widget-container,
.vx-band--dark .vx-body p{ color:#F5F2F2; }

/* Leggibilità del testo sopra il video (qualsiasi fotogramma) -------------- */
.vx-hero .elementor-heading-title,
.vx-hero .vx-lead p,
.vx-hero .vx-body p{ text-shadow:0 1px 14px rgba(0,0,0,.55); }

/* --- CTA (widget Pulsante standard). Glow SOLO in hover (design.md §6). ---- */
.vx-cta .elementor-button,
.vx-cta--ghost .elementor-button{
  font-family:"Jost",sans-serif;
  font-weight:700;
  font-size:17px;
  line-height:1;
  letter-spacing:.3px;
  border-radius:100px;
  padding:15px 35px;
  border:1px solid transparent;
  transition:background-color .15s ease-out,color .15s ease-out,box-shadow .15s ease-out,border-color .15s ease-out;
}
.vx-cta .elementor-button{
  background:#ECA72C;
  color:#0A0903;
}
.vx-cta .elementor-button:hover,
.vx-cta .elementor-button:focus{
  background:#0A0903;
  color:#ECA72C;
  box-shadow:0 3px 15px rgba(236,167,44,.45);
}
.vx-cta--ghost .elementor-button{
  background:transparent;
  color:#F5F2F2;
  border-color:#ECA72C;
}
.vx-cta--ghost .elementor-button:hover,
.vx-cta--ghost .elementor-button:focus{
  background:#ECA72C;
  color:#0A0903;
  box-shadow:0 3px 15px rgba(236,167,44,.45);
}

/* --- Riga badge (hero) ---------------------------------------------------- */
.vx-badges .elementor-widget-container,
.vx-badges p{
  font-family:"Jost",sans-serif;
  font-weight:700;
  font-size:13px;
  line-height:1.4;
  letter-spacing:1px;
  text-transform:uppercase;
  color:rgba(245,242,242,.70);
  margin:0;
}
/* separatori · fra i badge: oro, sottili, lampeggio delicato.
   Nel testo del widget avvolgi ogni · in <span class="vx-dot">·</span> */
.vx-badges .vx-dot{ color:#ECA72C; font-weight:400; font-size:1.9em; line-height:0; vertical-align:middle; animation:vx-blink 1.6s ease-in-out infinite; }
@keyframes vx-blink{ 0%,100%{ opacity:1; } 50%{ opacity:.18; } }
@media (prefers-reduced-motion:reduce){ .vx-badges .vx-dot{ animation:none; opacity:1; } }

/* --- Header sticky della landing ----------------------------------------- */
.vx-header{
  background:rgba(10,9,3,.82);            /* scuro semi-trasparente = leggibile ovunque */
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  border-bottom:1px solid rgba(245,242,242,.08);
}
/* link di navigazione: widget "Pulsante" reso link testuale */
.vx-navlink .elementor-button{
  background:transparent;
  color:#F5F2F2;
  font-family:"Jost",sans-serif;
  font-weight:600;
  font-size:15px;
  letter-spacing:.3px;
  padding:8px 8px;
  border:0;
  box-shadow:none;
}
.vx-navlink .elementor-button:hover,
.vx-navlink .elementor-button:focus{
  background:transparent;
  color:#ECA72C;
  box-shadow:none;
}
/* CTA compatta per l'header (si combina con .vx-cta) */
.vx-cta--sm .elementor-button{ padding:10px 22px; font-size:15px; }
/* co-branding header: Fabbrica66 × Logica — due loghi affiancati, × come separatore */
.vx-cobrand{ display:flex; align-items:center; gap:12px; }
.vx-cobrand img{ height:34px; width:auto; display:block; }
.vx-cobrand__x{ align-self:center; font-family:"Jost",sans-serif; font-weight:400; font-size:22px; line-height:1; }
.vx-cobrand__x, .vx-cobrand__x p, .vx-cobrand__x .elementor-widget-container{ color:#ECA72C !important; margin:0; }   /* × oro e centrata */
@media (max-width:767px){ .vx-cobrand{ justify-content:center; width:100%; } }   /* mobile: loghi centrati */
/* selettore lingua nell'header: UN link all'altra lingua, bandierina SVG + codice
   (vx-lang-it.html nella pagina IT, vx-lang-en.html nella pagina EN — widget HTML dopo la CTA). */
.vx-lang ul{ display:flex; align-items:center; gap:4px; list-style:none; margin:0; padding:0; }
.vx-lang li{ margin:0; padding:0; list-style:none; }
.vx-lang li::before{ content:none; }
.vx-lang a{
  display:flex; align-items:center; gap:7px; padding:7px 12px; border-radius:100px;
  font-family:"Jost",sans-serif; font-weight:600; font-size:13px; line-height:1; letter-spacing:.8px;
  text-decoration:none; color:#F5F2F2;
  border:1px solid rgba(245,242,242,.22); transition:color .15s ease-out,border-color .15s ease-out;
}
.vx-lang a:hover, .vx-lang a:focus{ color:#ECA72C; border-color:rgba(236,167,44,.6); }
.vx-lang svg{ width:21px; height:14px; border-radius:2px; display:block; flex:none;
  box-shadow:0 0 0 1px rgba(245,242,242,.15); }
/* logo VX (wordmark in tracciati, VX-logo-white.svg) su banda scura */
.vx-logo img{ display:block; width:auto; height:auto; }
.vx-logo-hero img{ height:44px; margin-bottom:14px; }   /* hero: marchio d'apertura, sopra il titolo */
.vx-logo-foot img{ height:24px; opacity:.9; }           /* footer: piccolo */

/* --- Riquadri 3D che seguono il mouse (§2) -------------------------------
   .vx-panel vx-tilt sul singolo riquadro. Lo script applica la rotazione.   */
.vx-panel{
  position:relative;
  background-color:rgba(26,24,17,.55);   /* fallback se NON c'è immagine di sfondo */
  background-size:cover;
  background-position:center;
  -webkit-backdrop-filter:blur(8px);
  backdrop-filter:blur(8px);
  border:1px solid rgba(245,242,242,0.11);
  border-radius:18px;
  padding:34px;
  height:100%;
  transform-style:preserve-3d;
  transition:border-color .3s,box-shadow .3s;   /* il transform lo anima lo script (lerp) */
  will-change:transform;
}
.vx-panel:hover{ border-color:rgba(236,167,44,.45); box-shadow:0 24px 60px rgba(0,0,0,.5); }
/* velo scuro SOPRA l'eventuale immagine di sfondo — per leggibilità, resta sempre */
.vx-panel::after{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:0;
  background:linear-gradient(180deg,rgba(10,9,3,.15),rgba(10,9,3,.55));
}
/* bagliore oro che segue il cursore ovunque (opacità guidata dallo script) */
.vx-panel::before{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:1;
  background:radial-gradient(360px circle at var(--mx,50%) var(--my,50%),rgba(236,167,44,.18),transparent 60%);
  opacity:var(--glow,0);transition:opacity .2s;
}
/* i contenuti (titolo, testo) sopra velo e bagliore */
.vx-panel > *{ position:relative; z-index:2; }
@media (max-width:767px){ .vx-panel{ transform:none !important; } }  /* niente tilt su touch */

/* --- Foto che volano (scroll-driven) — §3 -------------------------------- */
/* Le foto NON escono MAI dal flusso (niente position:absolute): il contenitore
   riserva sempre il loro spazio → impossibile finire sopra/sotto ad altro.
   Default = colonna. Desktop (.vx-fan) = riga a ventaglio, solo via transform. */
.vx-fly-scene{
  position:relative; max-width:1100px; margin:0 auto;
  display:flex; flex-direction:column; align-items:center; gap:18px;
  overflow:hidden; padding:16px 0;   /* contiene l'entrata laterale mobile, aria per le ombre */
}
.vx-fly{
  position:relative; width:100%; max-width:360px;   /* colonna mobile: un filo più piccole */
  border-radius:16px; overflow:hidden;
  border:1px solid rgba(236,167,44,.30);
  box-shadow:0 20px 50px rgba(0,0,0,.45);
  will-change:transform,opacity;
}
/* l'immagine è un OGGETTO reale: dà l'altezza, il layout la rispetta sempre */
.vx-fly img{ display:block; width:100%; height:auto; }
/* VENTAGLIO desktop: riga, foto affiancate e sovrapposte (margin negativo) + rotate.
   Restano nel flusso: il contenitore mantiene l'altezza di una foto. */
.vx-fly-scene.vx-fan{
  flex-direction:row; justify-content:center; align-items:center;
  gap:0; overflow:hidden;
  padding:60px 0;   /* aria verticale: le foto ruotate non vengono tagliate in alto/basso */
}
.vx-fly-scene.vx-fan .vx-fly{
  width:34%; max-width:400px; flex:0 0 auto; margin:0 -3.5%;
  aspect-ratio:16/10; will-change:transform,opacity;
}
.vx-fly-scene.vx-fan .vx-fly img{ height:100%; object-fit:cover; }
.vx-fly-scene.vx-fan .vx-fly:nth-child(1){ z-index:1; }
.vx-fly-scene.vx-fan .vx-fly:nth-child(2){ z-index:3; }
.vx-fly-scene.vx-fan .vx-fly:nth-child(3){ z-index:2; }

/* --- HERO: altezza a schermo e contenuto centrato ------------------------
   Il velo sul video lo fa l'Overlay sfondo NATIVO di Elementor (mette da solo
   il velo tra video e testo). Qui niente pseudo-overlay, per non interferire. */
.vx-hero{
  position:relative;
  min-height:88vh;
  display:flex;
  align-items:center;
  overflow:hidden;
}
/* solo per l'eventuale ripiego "video dentro un widget HTML" */
.vx-hero > video{
  position:absolute;
  top:0; left:0; right:0; bottom:0;
  width:100%;
  height:100%;
  object-fit:cover;
  z-index:0;
}

/* --- Reveal del titolo, parola per parola (effetto ia-sistemi) -----------
   Lo script (widget HTML) spezza il titolo in <span class="vx-word"> e
   aggiunge .is-in quando la hero entra in vista. Qui solo la coreografia.   */
.vx-reveal .vx-word{
  display:inline-block;
  opacity:0;
  transform:translateY(.5em);
  transition:opacity .6s ease, transform .6s cubic-bezier(.2,.7,.2,1);
  transition-delay:calc(var(--d,0) * .06s);   /* 60ms fra una parola e l'altra */
}
.vx-reveal.is-in .vx-word{ opacity:1; transform:translateY(0); }
@media (prefers-reduced-motion:reduce){
  .vx-reveal .vx-word{ opacity:1; transform:none; transition:none; }
}

/* --- Card e step: pronti per le sezioni 3-6 ------------------------------- */
.vx-card{
  background:#F5F2F2;
  color:#0A0903;
  border-radius:16px;
  padding:26px 24px;
  height:100%;
}
.vx-cards{ counter-reset:vxc; }
/* Elementor «boxed» infila un .e-con-inner tra il container e le card: prospettiva e
   layout vanno su quel wrapper (i figli diretti sono le card). Forzo una griglia
   uniforme: stessa larghezza, stesso gap, stessa altezza per tutte e 4. */
.vx-cards .e-con-inner{
  perspective:1000px;
  /* GRIGLIA esplicita (non flex-wrap: su tablet Elementor impone «nowrap» e la 4ª card
     usciva dallo schermo a 768 px — trovato nel controllo finale 2026-09-23) */
  display:grid !important; grid-template-columns:repeat(4,minmax(0,1fr));
  align-items:stretch !important;
  gap:20px !important;
}
.vx-cards .vx-card{
  flex:none !important; width:auto !important; max-width:none !important; min-width:0;
  align-self:stretch !important;
  height:auto !important;              /* l'altezza la dà lo stretch → tutte uguali */
}
@media (max-width:1024px){ .vx-cards .e-con-inner{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:600px){ .vx-cards .e-con-inner{ grid-template-columns:1fr; } }
.vx-band--dark .vx-card{
  counter-increment:vxc;
  position:relative; overflow:hidden;
  background:linear-gradient(180deg,rgba(30,27,20,.60),rgba(18,16,11,.50));
  color:#F5F2F2;
  border:1px solid rgba(245,242,242,0.1);
  transform-style:preserve-3d;
  transition:border-color .3s,box-shadow .3s;   /* il transform lo anima lo script */
  will-change:transform;
}
/* bagliore che segue il mouse — come i riquadri §2 */
.vx-band--dark .vx-card::before{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:0;
  background:radial-gradient(300px circle at var(--mx,50%) var(--my,50%),rgba(236,167,44,.18),transparent 60%);
  opacity:var(--glow,0);transition:opacity .2s;
}
/* numero 01–04, ben staccato in alto a destra */
.vx-band--dark .vx-card::after{
  content:"0" counter(vxc);position:absolute;top:18px;right:20px;z-index:2;
  font-family:"Jost",sans-serif; font-weight:600; font-variant-numeric:tabular-nums;   /* era monospace: solo i font F66 in pagina */
  font-size:13px;letter-spacing:1px;color:#ECA72C;opacity:.85;
}
.vx-band--dark .vx-card:hover{
  border-color:rgba(236,167,44,.45);
  box-shadow:0 24px 50px rgba(0,0,0,.5);
}
.vx-card > *{ position:relative; z-index:1; }   /* contenuto sopra il bagliore, sotto il numero */
.vx-card .elementor-heading-title{ font:700 20px/1.25 "Jost",sans-serif; margin:0 0 8px; padding-right:30px; }   /* spazio per il numero 01-04: i titoli inglesi, più lunghi, ci finivano sotto */
.vx-card p{ font:400 15px/1.55 "Jost",sans-serif; margin:0; }
.vx-band--dark .vx-card p{ color:rgba(245,242,242,.72); }

/* --- §5 Benefici: GRIGLIA 2×2, icona a lato, testo sempre visibile ----------
   Revisione cliente 2026-09-23 («scritte minuscole, il nero sovrasta»): via i
   pannelli alti che si espandevano. Stessa struttura Elementor di prima
   (vx-exp > 4× vx-exp__item > __ico / __t / __d): cambia SOLO questo CSS.
   Ogni riquadro è una griglia: icona nel cerchio a sinistra, titolo e testo a destra.
   !important su display: batte il flex che Elementor scrive sui container. */
.vx-exp{
  display:grid !important; grid-template-columns:1fr 1fr; gap:18px;
  max-width:1000px; width:100%; margin-left:auto; margin-right:auto;
}
.vx-exp__item{
  display:grid !important; grid-template-columns:64px 1fr; grid-template-rows:auto 1fr;
  gap:0 22px !important; align-items:start;   /* !important: batte il gap 20px che Elementor mette sui container */
  position:relative; overflow:hidden; border-radius:16px;
  background:linear-gradient(160deg,rgba(30,27,20,.7),rgba(18,16,11,.6));
  border:1px solid rgba(236,167,44,.22);
  padding:26px 28px; text-align:left;
  transition:border-color .4s, box-shadow .4s;
}
.vx-exp__item:hover{ border-color:rgba(236,167,44,.5); box-shadow:0 18px 44px rgba(0,0,0,.45); }
.vx-exp__item > .elementor-element{ margin-bottom:0 !important; }   /* niente spaziatura del Kit fra i widget */
/* bagliore oro che segue il mouse (desktop, lo guida vx-motion.js); contenuti sopra */
.vx-exp__item > *{ position:relative; z-index:1; }
.vx-exp__item::before{
  content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;pointer-events:none;border-radius:inherit;
  background:radial-gradient(320px circle at var(--mx,50%) var(--my,50%),rgba(236,167,44,.14),transparent 60%);
  opacity:var(--glow,0);transition:opacity .3s;
}
/* icona oro dentro un cerchio, a sinistra, alta quanto titolo + testo */
.vx-exp__ico{
  grid-column:1; grid-row:1 / span 2;
  width:64px !important; height:64px; border-radius:50%;
  border:1px solid rgba(236,167,44,.5); background:rgba(236,167,44,.08);
  display:flex; align-items:center; justify-content:center;
}
.vx-exp__ico > .elementor-widget-container{   /* Elementor lo stira in altezza: lo centro io */
  display:flex; align-items:center; justify-content:center; width:100%; height:100%;
}
.vx-exp__ico .elementor-icon-wrapper{ line-height:0; }
.vx-exp__ico .elementor-icon{ display:flex; }
.vx-exp__ico .elementor-icon{ font-size:28px; color:#ECA72C; }
.vx-exp__ico .elementor-icon i{ color:#ECA72C; }
.vx-exp__ico .elementor-icon svg{ width:28px; height:28px; fill:#ECA72C; }
/* titolo del beneficio */
.vx-exp__t{ grid-column:2; grid-row:1; }
.vx-exp__t .elementor-heading-title{
  font-family:"Jost",sans-serif; font-weight:700; font-size:24px; line-height:1.2;
  color:#F5F2F2; margin:4px 0 8px; text-align:left;
}
/* descrizione: sempre visibile */
.vx-exp__d{ grid-column:2; grid-row:2; }
.vx-exp__d .elementor-widget-container,
.vx-exp__d p{
  font-family:"Jost",sans-serif; font-weight:400; font-size:17px; line-height:1.5;
  color:rgba(245,242,242,.82); margin:0; text-align:left;
}
@media (max-width:767px){
  .vx-exp{ grid-template-columns:1fr; gap:14px; }
  .vx-exp__item{ grid-template-columns:52px 1fr; gap:0 16px !important; padding:22px 20px; }
  .vx-exp__ico{ width:52px !important; height:52px; }
  .vx-exp__ico .elementor-icon{ font-size:23px; }
  .vx-exp__ico .elementor-icon svg{ width:23px; height:23px; }
  .vx-exp__t .elementor-heading-title{ font-size:21px; }
  .vx-exp__d .elementor-widget-container, .vx-exp__d p{ font-size:16px; }
  /* scroll-driven: il riquadro centrato nel viewport si accende (.is-active dallo script) */
  .vx-exp__item.is-active{ border-color:rgba(236,167,44,.55); box-shadow:0 12px 34px rgba(0,0,0,.45); }
  .vx-exp__item.is-active .vx-exp__ico{ background:rgba(236,167,44,.18); }
}

/* --- §6 Qualità documentabile: il mini-report come OGGETTO -----------------
   Testo a sinistra, scheda-documento a destra (widget HTML vx-doc.html). Le 10
   righe COMPAIONO e SCOMPAIONO scrollando: l'opacità di ogni riga è modulata
   dalla sua posizione nel viewport (loop rAF in vx-motion.js) → onda reversibile.
   Nessun dato inventato: sono i CAMPI del report. */
.vx-doc-wrap{ display:flex !important; gap:48px; align-items:stretch; }   /* colonne alla stessa altezza */
.vx-doc-wrap > *{ flex:1 1 0; min-width:0; }
/* colonna testo: alta quanto la scheda, i 3 elementi distribuiti uniformemente */
.vx-doc-text{
  display:flex !important; flex-direction:column !important;
  justify-content:space-between !important;
  gap:18px;                                                /* stacco minimo se l'altezza è poca */
}
.vx-doc-text .vx-eyebrow .elementor-heading-title,
.vx-doc-text .vx-eyebrow p{ margin-bottom:0; }             /* l'occhiello non "stacca" da solo */
.vx-doc{
  background:linear-gradient(180deg,rgba(30,27,20,.6),rgba(18,16,11,.55));
  border:1px solid rgba(245,242,242,0.11);
  border-radius:16px; overflow:hidden;
  box-shadow:0 24px 60px rgba(0,0,0,.5);
}
.vx-doc__head{
  display:flex; justify-content:space-between; align-items:center;
  padding:16px 22px; border-bottom:1px solid rgba(245,242,242,.08);
}
.vx-doc__tag{ font:700 13px/1 "Jost",sans-serif; letter-spacing:1.4px; text-transform:uppercase; color:rgba(245,242,242,.6); }
.vx-doc__brand{ font:900 15px/1 "Jost",sans-serif; color:#ECA72C; }
.vx-doc__rows{ list-style:none; margin:0; padding:6px 0; }
.vx-doc__row{
  display:flex; align-items:center; gap:12px; padding:12px 22px;
  font:400 15px/1.4 "Jost",sans-serif; color:rgba(245,242,242,.82);
  will-change:opacity,transform;   /* opacità modulata dallo scroll (vx-motion.js) */
}
.vx-doc__row + .vx-doc__row{ border-top:1px solid rgba(245,242,242,.05); }
.vx-doc__row::before{
  content:"\2713"; flex:0 0 auto;
  width:22px; height:22px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:12px; font-weight:900; color:#0A0903; background:#ECA72C;
  box-shadow:0 0 10px rgba(236,167,44,.5);
}
@media (max-width:900px){ .vx-doc-wrap{ flex-direction:column !important; gap:28px; } }

/* --- §7 Chi ha scelto VX Press: prova sociale (foto reale) --------------------
   v1 leggera: occhiello + titolo + intro + la FOTO vera dell'installazione +
   chiusura. Predisposta a crescere (testimonianze/case study quando arriveranno
   dati autorizzati → si innestano sotto la foto). */
.vx-measure{ max-width:760px; margin-left:auto; margin-right:auto; }   /* testi centrati, riga leggibile */
.vx-proof{ max-width:920px; margin:40px auto 0; perspective:1000px; }  /* box + prospettiva per il tilt */
.vx-proof img{
  display:block; width:100%; height:auto;
  border-radius:16px; border:1px solid rgba(245,242,242,0.13);
  box-shadow:0 30px 70px rgba(0,0,0,.55);
  transition:transform .25s ease; will-change:transform; backface-visibility:hidden;   /* tilt 3D mouse-follow */
}
/* reveal allo scroll (one-shot): lo script aggiunge .is-in quando entra in vista */
.vx-rise{ opacity:0; transform:translateY(28px); transition:opacity .7s ease, transform .7s cubic-bezier(.2,.7,.2,1); }
.vx-rise.is-in{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){ .vx-rise{ opacity:1; transform:none; } }

/* --- §7 CASE STUDY LONGO -------------------------------------------------------
   (2026-09-23, al posto della foto vx-project.jpg). Testi NATIVI Elementor, foto
   in un widget HTML (vx-case-foto.html) con classe  vx-case__foto .
   IMPAGINAZIONE (rivista con Alessandro: «tutte su una linea, occupano meno»):
     in alto occhiello, titolo, sottotitolo, chip · sotto racconto | citazione
     affiancati · poi le 4 foto in UNA fila. Tutto in un riquadro leggero.
   Funziona sia con il widget foto DENTRO vx-case__txt, sia subito dopo.
   Le foto originali sono piccole (204-290 px): in fila misurano ~235 px → nitide.
   Non allargare la fila oltre i 1000 px. */
.vx-case{
  display:flex !important; flex-direction:column !important; align-items:stretch;
  gap:40px !important; max-width:1140px; width:100%; margin:48px auto 0; text-align:left;
  /* riquadro leggero: stacca il case study dal titolo della §7 */
  padding:48px 52px !important; border-radius:20px;
  background:linear-gradient(160deg,rgba(30,27,20,.55),rgba(18,16,11,.35));
  border:1px solid rgba(236,167,44,.18);
}
/* testo: occhiello, titolo, sottotitolo, chip a tutta larghezza; poi racconto | citazione affiancati */
.vx-case__txt{
  display:grid !important; grid-template-columns:1fr 1fr;
  gap:0 48px !important; align-items:start; width:100%; text-align:left;
}
.vx-case__txt > .elementor-element{ grid-column:1 / -1; margin-bottom:0 !important; }
.vx-case__txt > .vx-case__body{ grid-column:1; }
.vx-case__txt > .vx-case__quote{ grid-column:2; }
.vx-case__txt > .vx-case__foto,
.vx-case__txt > .elementor-element:has(.vx-case-grid){ margin-top:36px; }   /* widget foto dentro al testo: aria sopra */
.vx-case__txt > .vx-measure{ margin-top:30px; }   /* la riga finale della §7, se finisce dentro il riquadro */
.vx-case__txt .elementor-heading-title{ text-align:left; }
/* titolo (H3 per la gerarchia, grande come un H2; in Halo con vx-halo) */
.vx-case__t .elementor-heading-title{ font-size:45px; line-height:1.1; color:#F5F2F2; margin:0; }
.vx-case__t:not(.vx-halo) .elementor-heading-title{ font-weight:700; }
/* sottotitolo: «LONGO S.p.A. digitalizza…», il nome in <strong> */
/* stili sul contenitore del widget, non sul <p>: l'editor a volte salva il testo senza <p> */
.vx-case__sub .elementor-widget-container{ font-family:"Jost",sans-serif; font-size:22px; line-height:1.4; color:rgba(245,242,242,.85); margin:14px 0 0; text-align:left; }
.vx-case__sub p, .vx-case__body p, .vx-case__quote p{ font:inherit; color:inherit; margin:0; }
.vx-case__sub strong{ color:#F5F2F2; font-weight:700; }
/* chip dei fatti (vx-case-chip.html) */
.vx-chips{ display:flex; flex-wrap:wrap; gap:10px; margin:26px 0 0; }
.vx-chip{
  font-family:"Jost",sans-serif; font-weight:600; font-size:13px; line-height:1; letter-spacing:.8px;
  text-transform:uppercase; color:rgba(245,242,242,.8);
  border:1px solid rgba(236,167,44,.35); border-radius:100px; padding:9px 14px;
}
.vx-chip b{ color:#ECA72C; font-weight:700; }
/* racconto (le parole in <strong> diventano oro con vx-emph sul widget) */
/* racconto (sinistra) ed evidenza (destra): STESSO stile (richiesta di Alessandro,
   2026-09-23) — filetto oro, testo chiaro, parti in <strong> in oro. Sul telefono si impilano. */
.vx-case__body .elementor-widget-container,
.vx-case__quote .elementor-widget-container{
  font-family:"Jost",sans-serif; font-size:18px; line-height:1.55; color:rgba(245,242,242,.9); text-align:left;
  margin:30px 0 0; padding:4px 0 4px 20px; border-left:2px solid #ECA72C;
}
.vx-case__body strong, .vx-case__quote strong{ color:#ECA72C; font-weight:600; }
/* le 4 foto in fila */
.vx-case-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; max-width:1000px; margin:0 auto; }
.vx-case-ph{
  position:relative; aspect-ratio:4/5; border-radius:14px; overflow:hidden; background:#1A1812;
  border:1px solid rgba(236,167,44,.3); box-shadow:0 18px 40px rgba(0,0,0,.5);
}
.vx-case-ph img{ display:block; width:100%; height:100%; object-fit:cover; transition:transform .6s cubic-bezier(.2,.7,.2,1); }
.vx-case-ph::after{ content:""; position:absolute; top:0; right:0; bottom:0; left:0; pointer-events:none;
  background:linear-gradient(180deg,transparent 55%,rgba(10,9,3,.55)); }
.vx-case-ph:hover img{ transform:scale(1.04); }   /* leggerissimo: le foto sono piccole */
@media (max-width:900px){
  .vx-case__txt{ grid-template-columns:1fr; }
  .vx-case__txt > .vx-case__body, .vx-case__txt > .vx-case__quote{ grid-column:1; }
  .vx-case__body .elementor-widget-container{ margin-top:24px; }
  .vx-case__quote .elementor-widget-container{ margin-top:20px; }
  .vx-case{ gap:32px !important; padding:32px 22px !important; }
  .vx-case__txt > .vx-case__foto,
  .vx-case__txt > .elementor-element:has(.vx-case-grid){ margin-top:28px; }
}
@media (max-width:767px){
  .vx-case__t .elementor-heading-title{ font-size:34px; }
  .vx-case__sub .elementor-widget-container{ font-size:18px; }
  .vx-case-grid{ grid-template-columns:1fr 1fr; gap:12px; }   /* telefono: 2×2, in fila sarebbero francobolli */
}

/* --- §8 CTA + form (Elementor Pro Form) — stile scoped a .vx-form ------------
   Solo estetica: i campi dark col focus oro, il submit come CTA. La config
   (dove arriva il lead, reCAPTCHA, redirect) si fa nell'editor del widget Form. */
.vx-form .elementor-field-group > label,
.vx-form .elementor-field-subgroup label,
.vx-form .elementor-field-option{ color:#F5F2F2; font-family:"Jost",sans-serif; font-weight:600; }
.vx-form .elementor-field-textual,
.vx-form select.elementor-field-textual{
  background:rgba(245,242,242,.04) !important;
  border:1px solid rgba(245,242,242,0.17) !important;
  border-radius:10px !important;
  color:#F5F2F2 !important;
  padding:12px 14px !important;
  font-family:"Jost",sans-serif; font-size:15px;
  transition:border-color .2s, box-shadow .2s;
}
.vx-form .elementor-field-textual:focus{
  border-color:#ECA72C !important;
  box-shadow:0 0 0 3px rgba(236,167,44,.15) !important;
  outline:none;
}
.vx-form .elementor-field-textual::placeholder{ color:rgba(245,242,242,.4); }
.vx-form select.elementor-field-textual option{ color:#0A0903; background:#F5F2F2; }   /* opzioni del menu leggibili (evita bianco su bianco) */
.vx-form input[type=radio], .vx-form input[type=checkbox]{ accent-color:#ECA72C; }
.vx-form .elementor-button{
  background:#ECA72C; color:#0A0903;
  font-family:"Jost",sans-serif; font-weight:700; font-size:17px; letter-spacing:.3px;
  border-radius:100px; padding:15px 35px; border:0;
  transition:background-color .15s, color .15s, box-shadow .15s;
}
.vx-form .elementor-button:hover,
.vx-form .elementor-button:focus{ background:#0A0903; color:#ECA72C; box-shadow:0 3px 15px rgba(236,167,44,.45); }
.vx-form .elementor-field-type-acceptance .elementor-field-option{ color:rgba(245,242,242,.72); font-size:13px; line-height:1.5; }
.vx-form .elementor-field-type-acceptance a{ color:#ECA72C; }
/* nota sotto il form */
.vx-form-note .elementor-widget-container,
.vx-form-note p{ color:rgba(245,242,242,.70); font-family:"Jost",sans-serif; font-size:13px; line-height:1.6; }

/* --- Footer di pagina: disclaimer §6 + chiusura discreta --------------------
   Banda scura sottile PROPRIA della pagina (il footer del SITO è globale e non
   si tocca: il disclaimer va qui, altrimenti finirebbe su ogni pagina). */
.vx-pagefoot.vx-band{ padding-top:44px; padding-bottom:44px; border-top:1px solid rgba(245,242,242,.08); }
.vx-disclaimer .elementor-widget-container,
.vx-disclaimer p{ font-family:"Jost",sans-serif; font-size:13px; line-height:1.6; color:rgba(245,242,242,.5); max-width:760px; margin:0 auto; }
.vx-footmeta .elementor-widget-container,
.vx-footmeta p{ font-family:"Jost",sans-serif; font-size:13px; line-height:1.6; color:rgba(245,242,242,.6); margin:14px 0 0; }
.vx-footmeta a{ color:#ECA72C; }

/* --- §3-bis «Dentro VX Press»: hotspot importati da ia-sistemi, rivestiti coi
   nostri colori. Il widget Elementor Pro usa variabili CSS → le ridefiniamo:
   pallini ORO (l'originale era arancio Logica #FF7D08), tooltip dark nostro.
   Scoped a .vx-hotspots (sul container-root della sezione). !important mirato:
   batte lo stile che il template si porta dietro da Logica.                  */
.vx-hotspots .elementor-widget-hotspot{
  --hotspot-color:#ECA72C !important;            /* pallini oro, non arancio */
  --tooltip-color:rgba(10,9,3,.92) !important;   /* sfondo tooltip: nostro dark */
  --tooltip-text-color:#F5F2F2 !important;       /* testo tooltip */
  --white-space:normal !important;               /* IL FIX: il plugin è nowrap → il testo NON andava a capo */
  --tooltip-max-width:380px !important;          /* box più largo e spazioso da aperto */
  --tooltip-min-width:260px !important;
  --tooltip-padding:28px 32px 28px 32px !important;   /* più aria interna */
}
.vx-hotspots .e-hotspot__button{ filter:drop-shadow(0 0 6px rgba(236,167,44,.55)); }  /* bagliore oro */
.vx-hotspots .e-hotspot__tooltip{
  line-height:1.5; font-size:15px !important;    /* leggibile anche da mobile */
  border:1px solid rgba(236,167,44,.35);
  box-shadow:0 14px 34px rgba(0,0,0,.5);
  -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px);
}
.vx-hotspots .e-hotspot__tooltip p{ margin:0; }
.vx-hotspots .e-hotspot__tooltip p + p{ margin-top:10px; }   /* più respiro titolo→testo */
.vx-hotspots .e-hotspot__tooltip strong{ color:#ECA72C; }   /* il titolo del punto in oro */
/* SPOTLIGHT: alone oro che segue il cursore su TUTTA la banda (non sul singolo
   widget, così non si taglia ai bordi dell'immagine). Sta DIETRO il contenuto:
   illumina la scena senza velare testo e pin. Lo accende lo script (--spot). */
.vx-hotspots{ position:relative; overflow-x:clip; }   /* i tooltip nascosti sporgevano a destra → pagina più larga dello schermo su tablet */
.vx-hotspots > *{ position:relative; z-index:1; }   /* contenuto sopra l'alone */
.vx-hotspots::before{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(380px circle at var(--mx,50%) var(--my,50%),rgba(236,167,44,.18),transparent 66%);
  opacity:var(--spot,0);transition:opacity .4s ease;
}
/* mobile: il box non deve sforare lo schermo */
@media (max-width:767px){
  .vx-hotspots .elementor-widget-hotspot{
    --tooltip-max-width:90vw !important;
    --tooltip-min-width:0 !important;
    --tooltip-padding:24px 26px 24px 26px !important;   /* mobile: più largo e più aria */
  }
}

/* --- §4 Come funziona: timeline che si riempie sullo scroll ----------------
   MOBILE/TABLET (<900px): VERTICALE — linea dall'alto in basso, step in colonna
   che entrano da sinistra, nodo a sinistra.  DESKTOP (>=900px): ORIZZONTALE —
   4 colonne, linea SINISTRA→DESTRA che si riempie scrollando, nodo in cima a
   ogni colonna.  Numero via counter CSS (aggiungi/togli step senza rinumerare).
   --fill (px) e .is-done li dà lo script: in verticale --fill è altezza, in
   orizzontale è larghezza (stesso valore, il CSS sceglie quale).
   Nota copy (2026-07-24): in pagina 4 passaggi (5° escluso, duplicava la §3).  */
.vx-steps{
  counter-reset:vxs;
  position:relative;
  display:flex;
  flex-direction:column !important;   /* !important: batte la direzione che Elementor scrive sul container */
  max-width:820px;
  margin:44px auto 0;
  padding-left:8px;
}
/* traccia (grigia) + riempimento (oro, guidato dallo scroll), allineati ai nodi */
.vx-steps::before,
.vx-steps::after{
  content:"";position:absolute;left:31px;top:24px;bottom:24px;width:2px;border-radius:2px;
}
.vx-steps::before{ background:rgba(245,242,242,.12); }
.vx-steps::after{
  bottom:auto;height:var(--fill,0px);
  background:linear-gradient(180deg,#ECA72C,#B67912);
  box-shadow:0 0 18px rgba(236,167,44,.55);
}
.vx-step{
  counter-increment:vxs;
  position:relative;
  padding:0 0 46px 82px;                 /* spazio a sinistra per nodo + linea */
  opacity:0;transform:translateX(-38px);
  transition:opacity .6s ease,transform .6s cubic-bezier(.2,.7,.2,1);
}
.vx-step.is-in{ opacity:1;transform:none; }
.vx-step:last-child{ padding-bottom:0; }
/* nodo numerato */
.vx-step::before{
  content:"0" counter(vxs);
  position:absolute;left:8px;top:-2px;z-index:2;
  width:48px;height:48px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-family:"Jost",sans-serif;font-weight:900;font-size:18px;
  color:rgba(245,242,242,.55);
  background:#070E14;border:2px solid rgba(245,242,242,.16);
  transition:color .35s,border-color .35s,box-shadow .35s,background-color .35s;
}
/* nodo acceso quando lo scroll lo supera */
.vx-step.is-done::before{
  color:#0A0903;background:#ECA72C;border-color:#ECA72C;
  box-shadow:0 0 0 5px rgba(236,167,44,.14),0 0 22px rgba(236,167,44,.55);
}
.vx-step__t .elementor-heading-title{
  font-family:"Jost",sans-serif;font-weight:700;font-size:22px;line-height:1.2;
  margin:10px 0 8px;color:#F5F2F2;
}
.vx-step__d .elementor-widget-container,
.vx-step__d p{
  font-family:"Jost",sans-serif;font-weight:400;font-size:16px;line-height:1.55;
  color:rgba(245,242,242,.72);margin:0;
}
/* DESKTOP: timeline ORIZZONTALE, larga e spaziosa, si riempie sinistra→destra */
@media (min-width:900px){
  .vx-steps{
    flex-direction:row !important;
    align-items:flex-start;
    max-width:1140px;
    margin-top:72px;
    padding:70px 0 0;
  }
  .vx-steps::before,
  .vx-steps::after{
    left:12.5%;right:12.5%;top:29px;bottom:auto;width:auto;height:2px;   /* linea orizzontale, dal 1° all'ultimo nodo */
  }
  .vx-steps::after{ right:auto;width:var(--fill,0px);height:2px; }        /* fill = larghezza */
  .vx-step{
    flex:1 1 0;
    padding:0 26px;               /* gutter fra le colonne = aria */
    text-align:center;
    opacity:0;transform:translateY(34px);   /* su desktop entrano dal basso, a cascata */
  }
  .vx-step:last-child{ padding-bottom:0; }
  .vx-step:nth-child(2){ transition-delay:.08s; }
  .vx-step:nth-child(3){ transition-delay:.16s; }
  .vx-step:nth-child(4){ transition-delay:.24s; }
  .vx-step::before{                         /* nodo centrato in cima, centro sulla linea */
    left:50%;top:-64px;
    -webkit-transform:translateX(-50%);transform:translateX(-50%);
  }
  .vx-step__t .elementor-heading-title{ margin-top:24px;font-size:21px; }
  .vx-step__d .elementor-widget-container,
  .vx-step__d p{ font-size:15px; }
}

@media (max-width:767px){
  .vx-steps{ padding-left:2px; }
  .vx-steps::before,.vx-steps::after{ left:19px; }
  .vx-step{ padding-left:64px;padding-bottom:38px; }
  .vx-step::before{ left:0;width:40px;height:40px;font-size:16px; }
  .vx-step__t .elementor-heading-title{ font-size:20px; }
}
@media (prefers-reduced-motion:reduce){
  .vx-step{ opacity:1;transform:none; }
  .vx-steps::after{ display:none; }
}


/* --- Responsive: valori fissi ai breakpoint di casa ----------------------- */
@media (max-width:1024px){
  .vx-band{padding:76px 30px;}
  .vx-h1 .elementor-heading-title{font-size:54px;}
  .vx-h2 .elementor-heading-title{font-size:38px;}
}
@media (max-width:767px){
  .vx-band{padding:52px 20px;}
  .vx-eyebrow .elementor-heading-title,
  .vx-eyebrow p{font-size:16px;letter-spacing:1.5px;}
  .vx-h1 .elementor-heading-title{font-size:40px;}
  .vx-h2 .elementor-heading-title{font-size:30px;}
  .vx-h3 .elementor-heading-title{font-size:24px;}
  .vx-lead .elementor-widget-container,
  .vx-lead p{font-size:19px;}
}

/* --- Chi non vuole animazioni: resta il poster --------------------------- */
@media (prefers-reduced-motion:reduce){
  .vx-hero video{display:none;}
}/* End custom CSS */