.elementor-13 .elementor-element.elementor-element-3c4bd21{--display:flex;--min-height:100vh;--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;--gap:18px 0px;--row-gap:18px;--column-gap:0px;--overlay-opacity:0.3;--padding-top:100px;--padding-bottom:100px;--padding-left:40px;--padding-right:40px;}.elementor-13 .elementor-element.elementor-element-3c4bd21:not(.elementor-motion-effects-element-type-background), .elementor-13 .elementor-element.elementor-element-3c4bd21 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://andreagnelli.com/wp-content/uploads/2026/10/Salone-moderno-Kevin.Murphy-dai-toni-rosso-bianco-e-nero.png");background-position:top center;background-repeat:no-repeat;background-size:cover;}.elementor-13 .elementor-element.elementor-element-3c4bd21::before, .elementor-13 .elementor-element.elementor-element-3c4bd21 > .elementor-background-video-container::before, .elementor-13 .elementor-element.elementor-element-3c4bd21 > .e-con-inner > .elementor-background-video-container::before, .elementor-13 .elementor-element.elementor-element-3c4bd21 > .elementor-background-slideshow::before, .elementor-13 .elementor-element.elementor-element-3c4bd21 > .e-con-inner > .elementor-background-slideshow::before, .elementor-13 .elementor-element.elementor-element-3c4bd21 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:transparent;--background-overlay:'';background-image:linear-gradient(110deg, #ffffff 0%, #18303000 0%);}.elementor-13 .elementor-element.elementor-element-68c50c3 > .elementor-widget-container{margin:40px 0px 0px 0px;}.elementor-13 .elementor-element.elementor-element-68c50c3 .elementor-icon-box-wrapper{align-items:center;text-align:start;gap:6px;}.elementor-13 .elementor-element.elementor-element-68c50c3 .elementor-icon-box-title{margin-block-end:0px;color:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-68c50c3.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-68c50c3.elementor-view-framed .elementor-icon, .elementor-13 .elementor-element.elementor-element-68c50c3.elementor-view-default .elementor-icon{fill:var( --e-global-color-astglobalcolor2 );color:var( --e-global-color-astglobalcolor2 );border-color:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-68c50c3 .elementor-icon{font-size:15px;}.elementor-13 .elementor-element.elementor-element-68c50c3 .elementor-icon-box-title, .elementor-13 .elementor-element.elementor-element-68c50c3 .elementor-icon-box-title a{font-weight:500;text-transform:uppercase;letter-spacing:1px;}.elementor-13 .elementor-element.elementor-element-f5aae62 > .elementor-widget-container{padding:0% 39% 0% 0%;}.elementor-13 .elementor-element.elementor-element-f5aae62 .elementor-heading-title{color:var( --e-global-color-astglobalcolor5 );}.elementor-13 .elementor-element.elementor-element-b09ce85{--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 16px;--row-gap:0px;--column-gap:16px;--margin-top:40px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-13 .elementor-element.elementor-element-05ef6a6{width:auto;max-width:auto;}.elementor-13 .elementor-element.elementor-element-de66673 .elementor-button{background-color:#02010100;fill:var( --e-global-color-astglobalcolor5 );color:var( --e-global-color-astglobalcolor5 );border-style:solid;border-width:2px 2px 2px 2px;border-color:var( --e-global-color-astglobalcolor5 );}.elementor-13 .elementor-element.elementor-element-de66673 .elementor-button:hover, .elementor-13 .elementor-element.elementor-element-de66673 .elementor-button:focus{background-color:var( --e-global-color-astglobalcolor1 );color:var( --e-global-color-astglobalcolor2 );border-color:var( --e-global-color-astglobalcolor1 );}.elementor-13 .elementor-element.elementor-element-de66673{width:auto;max-width:auto;}.elementor-13 .elementor-element.elementor-element-de66673 .elementor-button:hover svg, .elementor-13 .elementor-element.elementor-element-de66673 .elementor-button:focus svg{fill:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-e583e06{--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;--align-items:center;--gap:48px 48px;--row-gap:48px;--column-gap:48px;--padding-top:120px;--padding-bottom:120px;--padding-left:40px;--padding-right:40px;}.elementor-13 .elementor-element.elementor-element-1b604d5{--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;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-13 .elementor-element.elementor-element-8e95596 > .elementor-widget-container{margin:0px 20px 0px 0px;}.elementor-13 .elementor-element.elementor-element-8e95596 img{border-radius:24px 24px 24px 24px;}.elementor-13 .elementor-element.elementor-element-afd65a8 > .elementor-widget-container{margin:-100px 0px 0px 0px;}.elementor-13 .elementor-element.elementor-element-afd65a8{text-align:end;}.elementor-13 .elementor-element.elementor-element-afd65a8 img{border-style:solid;border-width:8px 0px 0px 8px;border-color:var( --e-global-color-astglobalcolor5 );border-radius:24px 24px 24px 24px;}.elementor-13 .elementor-element.elementor-element-b800ee8{--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;--gap:12px 0px;--row-gap:12px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-13 .elementor-element.elementor-element-02a1434 .elementor-icon-box-wrapper{align-items:center;text-align:start;gap:6px;}.elementor-13 .elementor-element.elementor-element-02a1434 .elementor-icon-box-title{margin-block-end:0px;color:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-02a1434.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-02a1434.elementor-view-framed .elementor-icon, .elementor-13 .elementor-element.elementor-element-02a1434.elementor-view-default .elementor-icon{fill:var( --e-global-color-astglobalcolor2 );color:var( --e-global-color-astglobalcolor2 );border-color:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-02a1434 .elementor-icon{font-size:15px;}.elementor-13 .elementor-element.elementor-element-02a1434 .elementor-icon-box-title, .elementor-13 .elementor-element.elementor-element-02a1434 .elementor-icon-box-title a{font-weight:500;text-transform:uppercase;letter-spacing:1px;}.elementor-13 .elementor-element.elementor-element-ad0840b > .elementor-widget-container{margin:0px 0px 6px 0px;}.elementor-13 .elementor-element.elementor-element-489bfc9 > .elementor-widget-container{margin:24px 0px 24px 0px;}.elementor-13 .elementor-element.elementor-element-489bfc9 .elementor-icon-list-icon i{color:var( --e-global-color-astglobalcolor1 );transition:color 0.3s;}.elementor-13 .elementor-element.elementor-element-489bfc9 .elementor-icon-list-icon svg{fill:var( --e-global-color-astglobalcolor1 );transition:fill 0.3s;}.elementor-13 .elementor-element.elementor-element-489bfc9{--e-icon-list-icon-size:16px;--icon-vertical-offset:0px;}.elementor-13 .elementor-element.elementor-element-489bfc9 .elementor-icon-list-item > .elementor-icon-list-text, .elementor-13 .elementor-element.elementor-element-489bfc9 .elementor-icon-list-item > a{font-size:18px;font-weight:500;}.elementor-13 .elementor-element.elementor-element-489bfc9 .elementor-icon-list-text{color:var( --e-global-color-astglobalcolor2 );transition:color 0.3s;}.elementor-13 .elementor-element.elementor-element-d08195b .elementor-button{background-color:#02010100;fill:var( --e-global-color-astglobalcolor2 );color:var( --e-global-color-astglobalcolor2 );border-style:solid;border-width:2px 2px 2px 2px;border-color:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-d08195b .elementor-button:hover, .elementor-13 .elementor-element.elementor-element-d08195b .elementor-button:focus{background-color:var( --e-global-color-astglobalcolor1 );color:var( --e-global-color-astglobalcolor2 );border-color:var( --e-global-color-astglobalcolor1 );}.elementor-13 .elementor-element.elementor-element-d08195b .elementor-button-content-wrapper{flex-direction:row-reverse;}.elementor-13 .elementor-element.elementor-element-d08195b .elementor-button .elementor-button-content-wrapper{gap:8px;}.elementor-13 .elementor-element.elementor-element-d08195b .elementor-button:hover svg, .elementor-13 .elementor-element.elementor-element-d08195b .elementor-button:focus svg{fill:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-b537ed1{--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;--align-items:center;--gap:48px 48px;--row-gap:48px;--column-gap:48px;--padding-top:120px;--padding-bottom:120px;--padding-left:40px;--padding-right:40px;}.elementor-13 .elementor-element.elementor-element-5f6b8ca{--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;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-13 .elementor-element.elementor-element-dd795e4 > .elementor-widget-container{margin:0px 20px 0px 0px;}.elementor-13 .elementor-element.elementor-element-dd795e4 img{border-radius:24px 24px 24px 24px;}.elementor-13 .elementor-element.elementor-element-f551d8a > .elementor-widget-container{margin:-100px 0px 0px 0px;}.elementor-13 .elementor-element.elementor-element-f551d8a{text-align:end;}.elementor-13 .elementor-element.elementor-element-f551d8a img{border-style:solid;border-width:8px 0px 0px 8px;border-color:var( --e-global-color-astglobalcolor5 );border-radius:24px 24px 24px 24px;}.elementor-13 .elementor-element.elementor-element-751c2dd{--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;--gap:12px 0px;--row-gap:12px;--column-gap:0px;--padding-top:120px;--padding-bottom:120px;--padding-left:40px;--padding-right:40px;}.elementor-13 .elementor-element.elementor-element-751c2dd:not(.elementor-motion-effects-element-type-background), .elementor-13 .elementor-element.elementor-element-751c2dd > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-80ca850.elementor-element{--align-self:center;}.elementor-13 .elementor-element.elementor-element-80ca850 .elementor-icon-box-wrapper{align-items:center;text-align:start;gap:6px;}.elementor-13 .elementor-element.elementor-element-80ca850 .elementor-icon-box-title{margin-block-end:0px;color:var( --e-global-color-astglobalcolor5 );}.elementor-13 .elementor-element.elementor-element-80ca850.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-astglobalcolor5 );}.elementor-13 .elementor-element.elementor-element-80ca850.elementor-view-framed .elementor-icon, .elementor-13 .elementor-element.elementor-element-80ca850.elementor-view-default .elementor-icon{fill:var( --e-global-color-astglobalcolor5 );color:var( --e-global-color-astglobalcolor5 );border-color:var( --e-global-color-astglobalcolor5 );}.elementor-13 .elementor-element.elementor-element-80ca850 .elementor-icon{font-size:15px;}.elementor-13 .elementor-element.elementor-element-80ca850 .elementor-icon-box-title, .elementor-13 .elementor-element.elementor-element-80ca850 .elementor-icon-box-title a{font-weight:500;text-transform:uppercase;letter-spacing:1px;}.elementor-13 .elementor-element.elementor-element-a8bf121 > .elementor-widget-container{padding:1% 8% 0% 8%;}.elementor-13 .elementor-element.elementor-element-a8bf121{text-align:center;}.elementor-13 .elementor-element.elementor-element-a8bf121 .elementor-heading-title{color:var( --e-global-color-astglobalcolor5 );}.elementor-13 .elementor-element.elementor-element-06de91d{--display:grid;--e-con-grid-template-columns:repeat(4, 1fr);--e-con-grid-template-rows:repeat(1, 1fr);--grid-auto-flow:row;--margin-top:68px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-13 .elementor-element.elementor-element-b675f89{--display:flex;--border-radius:24px 24px 24px 24px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:24px;--padding-bottom:24px;--padding-left:24px;--padding-right:24px;}.elementor-13 .elementor-element.elementor-element-b675f89:not(.elementor-motion-effects-element-type-background), .elementor-13 .elementor-element.elementor-element-b675f89 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-astglobalcolor5 );}.elementor-13 .elementor-element.elementor-element-64093cc .elementor-icon-box-wrapper{text-align:start;gap:8px;}.elementor-13 .elementor-element.elementor-element-64093cc .elementor-icon-box-title{margin-block-end:12px;}.elementor-13 .elementor-element.elementor-element-64093cc.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-64093cc.elementor-view-framed .elementor-icon, .elementor-13 .elementor-element.elementor-element-64093cc.elementor-view-default .elementor-icon{fill:var( --e-global-color-astglobalcolor2 );color:var( --e-global-color-astglobalcolor2 );border-color:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-64093cc .elementor-icon{font-size:38px;}.elementor-13 .elementor-element.elementor-element-3a89d96 img{border-radius:12px 12px 12px 12px;}.elementor-13 .elementor-element.elementor-element-18e5f5e{--display:flex;--border-radius:24px 24px 24px 24px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:24px;--padding-bottom:24px;--padding-left:24px;--padding-right:24px;}.elementor-13 .elementor-element.elementor-element-18e5f5e:not(.elementor-motion-effects-element-type-background), .elementor-13 .elementor-element.elementor-element-18e5f5e > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-astglobalcolor5 );}.elementor-13 .elementor-element.elementor-element-a6fc8f3 .elementor-icon-box-wrapper{text-align:start;gap:8px;}.elementor-13 .elementor-element.elementor-element-a6fc8f3 .elementor-icon-box-title{margin-block-end:12px;}.elementor-13 .elementor-element.elementor-element-a6fc8f3.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-a6fc8f3.elementor-view-framed .elementor-icon, .elementor-13 .elementor-element.elementor-element-a6fc8f3.elementor-view-default .elementor-icon{fill:var( --e-global-color-astglobalcolor2 );color:var( --e-global-color-astglobalcolor2 );border-color:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-a6fc8f3 .elementor-icon{font-size:38px;}.elementor-13 .elementor-element.elementor-element-ed47f8a img{border-radius:12px 12px 12px 12px;}.elementor-13 .elementor-element.elementor-element-473e9a2{--display:flex;--border-radius:24px 24px 24px 24px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:24px;--padding-bottom:24px;--padding-left:24px;--padding-right:24px;}.elementor-13 .elementor-element.elementor-element-473e9a2:not(.elementor-motion-effects-element-type-background), .elementor-13 .elementor-element.elementor-element-473e9a2 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-astglobalcolor5 );}.elementor-13 .elementor-element.elementor-element-903a6d2 .elementor-icon-box-wrapper{text-align:start;gap:8px;}.elementor-13 .elementor-element.elementor-element-903a6d2 .elementor-icon-box-title{margin-block-end:12px;}.elementor-13 .elementor-element.elementor-element-903a6d2.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-903a6d2.elementor-view-framed .elementor-icon, .elementor-13 .elementor-element.elementor-element-903a6d2.elementor-view-default .elementor-icon{fill:var( --e-global-color-astglobalcolor2 );color:var( --e-global-color-astglobalcolor2 );border-color:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-903a6d2 .elementor-icon{font-size:38px;}.elementor-13 .elementor-element.elementor-element-93f2848 img{border-radius:12px 12px 12px 12px;}.elementor-13 .elementor-element.elementor-element-a65f806{--display:flex;--border-radius:24px 24px 24px 24px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:24px;--padding-bottom:24px;--padding-left:24px;--padding-right:24px;}.elementor-13 .elementor-element.elementor-element-a65f806:not(.elementor-motion-effects-element-type-background), .elementor-13 .elementor-element.elementor-element-a65f806 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-astglobalcolor5 );}.elementor-13 .elementor-element.elementor-element-063d529 .elementor-icon-box-wrapper{text-align:start;gap:8px;}.elementor-13 .elementor-element.elementor-element-063d529 .elementor-icon-box-title{margin-block-end:12px;}.elementor-13 .elementor-element.elementor-element-063d529.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-063d529.elementor-view-framed .elementor-icon, .elementor-13 .elementor-element.elementor-element-063d529.elementor-view-default .elementor-icon{fill:var( --e-global-color-astglobalcolor2 );color:var( --e-global-color-astglobalcolor2 );border-color:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-063d529 .elementor-icon{font-size:38px;}.elementor-13 .elementor-element.elementor-element-d35b00e img{border-radius:12px 12px 12px 12px;}.elementor-13 .elementor-element.elementor-element-38f0272 .elementor-button{background-color:#02010100;fill:var( --e-global-color-astglobalcolor2 );color:var( --e-global-color-astglobalcolor2 );border-style:solid;border-width:2px 2px 2px 2px;border-color:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-38f0272 .elementor-button:hover, .elementor-13 .elementor-element.elementor-element-38f0272 .elementor-button:focus{background-color:var( --e-global-color-astglobalcolor1 );color:var( --e-global-color-astglobalcolor2 );border-color:var( --e-global-color-astglobalcolor1 );}.elementor-13 .elementor-element.elementor-element-38f0272 > .elementor-widget-container{margin:30px 0px 0px 0px;}.elementor-13 .elementor-element.elementor-element-38f0272 .elementor-button-content-wrapper{flex-direction:row-reverse;}.elementor-13 .elementor-element.elementor-element-38f0272 .elementor-button .elementor-button-content-wrapper{gap:8px;}.elementor-13 .elementor-element.elementor-element-38f0272 .elementor-button:hover svg, .elementor-13 .elementor-element.elementor-element-38f0272 .elementor-button:focus svg{fill:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-94f67b1 .elementor-button{background-color:#02010100;fill:var( --e-global-color-astglobalcolor2 );color:var( --e-global-color-astglobalcolor2 );border-style:solid;border-width:2px 2px 2px 2px;border-color:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-94f67b1 .elementor-button:hover, .elementor-13 .elementor-element.elementor-element-94f67b1 .elementor-button:focus{background-color:var( --e-global-color-astglobalcolor1 );color:var( --e-global-color-astglobalcolor2 );border-color:var( --e-global-color-astglobalcolor1 );}.elementor-13 .elementor-element.elementor-element-94f67b1 > .elementor-widget-container{margin:10px 0px 0px 0px;}.elementor-13 .elementor-element.elementor-element-94f67b1 .elementor-button-content-wrapper{flex-direction:row-reverse;}.elementor-13 .elementor-element.elementor-element-94f67b1 .elementor-button .elementor-button-content-wrapper{gap:8px;}.elementor-13 .elementor-element.elementor-element-94f67b1 .elementor-button:hover svg, .elementor-13 .elementor-element.elementor-element-94f67b1 .elementor-button:focus svg{fill:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-ebdb668{--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;--align-items:center;--gap:0px 48px;--row-gap:0px;--column-gap:48px;--margin-top:-50px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:120px;--padding-bottom:120px;--padding-left:40px;--padding-right:40px;}.elementor-13 .elementor-element.elementor-element-ebdb668:not(.elementor-motion-effects-element-type-background), .elementor-13 .elementor-element.elementor-element-ebdb668 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-astglobalcolor5 );}.elementor-13 .elementor-element.elementor-element-bc40ce0{--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;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-13 .elementor-element.elementor-element-8f2abce.elementor-element{--align-self:flex-start;}.elementor-13 .elementor-element.elementor-element-8f2abce .elementor-icon-box-wrapper{align-items:center;text-align:start;gap:6px;}.elementor-13 .elementor-element.elementor-element-8f2abce .elementor-icon-box-title{margin-block-end:0px;color:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-8f2abce.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-8f2abce.elementor-view-framed .elementor-icon, .elementor-13 .elementor-element.elementor-element-8f2abce.elementor-view-default .elementor-icon{fill:var( --e-global-color-astglobalcolor2 );color:var( --e-global-color-astglobalcolor2 );border-color:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-8f2abce .elementor-icon{font-size:15px;}.elementor-13 .elementor-element.elementor-element-8f2abce .elementor-icon-box-title, .elementor-13 .elementor-element.elementor-element-8f2abce .elementor-icon-box-title a{font-weight:500;text-transform:uppercase;letter-spacing:1px;}.elementor-13 .elementor-element.elementor-element-346d282 > .elementor-widget-container{margin:12px 0px 45px 0px;}.elementor-13 .elementor-element.elementor-element-346d282 .elementor-heading-title{color:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-624cef0 .elementor-icon-box-wrapper{text-align:start;}.elementor-13 .elementor-element.elementor-element-624cef0 .elementor-icon-box-title{margin-block-end:6px;color:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-624cef0 .elementor-icon-box-description{color:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-245b142{--divider-border-style:solid;--divider-color:#D7EFE233;--divider-border-width:1px;}.elementor-13 .elementor-element.elementor-element-245b142 > .elementor-widget-container{margin:5px 0px 5px 0px;}.elementor-13 .elementor-element.elementor-element-245b142 .elementor-divider-separator{width:100%;}.elementor-13 .elementor-element.elementor-element-245b142 .elementor-divider{padding-block-start:30px;padding-block-end:30px;}.elementor-13 .elementor-element.elementor-element-09fdde9 .elementor-icon-box-wrapper{text-align:start;}.elementor-13 .elementor-element.elementor-element-09fdde9 .elementor-icon-box-title{margin-block-end:6px;color:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-09fdde9 .elementor-icon-box-description{color:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-3a55c67{--divider-border-style:solid;--divider-color:#D7EFE233;--divider-border-width:1px;}.elementor-13 .elementor-element.elementor-element-3a55c67 > .elementor-widget-container{margin:5px 0px 5px 0px;}.elementor-13 .elementor-element.elementor-element-3a55c67 .elementor-divider-separator{width:100%;}.elementor-13 .elementor-element.elementor-element-3a55c67 .elementor-divider{padding-block-start:30px;padding-block-end:30px;}.elementor-13 .elementor-element.elementor-element-2c1d378 .elementor-icon-box-wrapper{text-align:start;}.elementor-13 .elementor-element.elementor-element-2c1d378 .elementor-icon-box-title{margin-block-end:6px;color:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-2c1d378 .elementor-icon-box-description{color:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-f844a9b{width:auto;max-width:auto;}.elementor-13 .elementor-element.elementor-element-f844a9b > .elementor-widget-container{margin:50px 0px 0px 0px;}.elementor-13 .elementor-element.elementor-element-d06c7f0{--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;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-13 .elementor-element.elementor-element-27c1929 img{border-radius:24px 24px 24px 24px;}.elementor-13 .elementor-element.elementor-element-25fdf77{--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;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:75px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-13 .elementor-element.elementor-element-25fdf77:not(.elementor-motion-effects-element-type-background), .elementor-13 .elementor-element.elementor-element-25fdf77 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-a4be1a6.elementor-element{--align-self:center;}.elementor-13 .elementor-element.elementor-element-a4be1a6 .elementor-icon-box-wrapper{align-items:center;text-align:start;gap:6px;}.elementor-13 .elementor-element.elementor-element-a4be1a6 .elementor-icon-box-title{margin-block-end:0px;color:var( --e-global-color-astglobalcolor5 );}.elementor-13 .elementor-element.elementor-element-a4be1a6.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-astglobalcolor5 );}.elementor-13 .elementor-element.elementor-element-a4be1a6.elementor-view-framed .elementor-icon, .elementor-13 .elementor-element.elementor-element-a4be1a6.elementor-view-default .elementor-icon{fill:var( --e-global-color-astglobalcolor5 );color:var( --e-global-color-astglobalcolor5 );border-color:var( --e-global-color-astglobalcolor5 );}.elementor-13 .elementor-element.elementor-element-a4be1a6 .elementor-icon{font-size:15px;}.elementor-13 .elementor-element.elementor-element-a4be1a6 .elementor-icon-box-title, .elementor-13 .elementor-element.elementor-element-a4be1a6 .elementor-icon-box-title a{font-weight:500;text-transform:uppercase;letter-spacing:1px;}.elementor-13 .elementor-element.elementor-element-101c00e > .elementor-widget-container{padding:0px 0px 45px 0px;}.elementor-13 .elementor-element.elementor-element-101c00e{text-align:center;}.elementor-13 .elementor-element.elementor-element-101c00e .elementor-heading-title{color:var( --e-global-color-astglobalcolor5 );}.elementor-13 .elementor-element.elementor-element-c499392{--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;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:100px;--padding-left:150px;--padding-right:150px;}.elementor-13 .elementor-element.elementor-element-c499392:not(.elementor-motion-effects-element-type-background), .elementor-13 .elementor-element.elementor-element-c499392 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-54b15cf{--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;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:50px;}.elementor-13 .elementor-element.elementor-element-4f2cf12 img{width:100%;border-radius:15px 15px 15px 15px;}.elementor-13 .elementor-element.elementor-element-9774241 > .elementor-widget-container{padding:20px 0px 0px 0px;}.elementor-13 .elementor-element.elementor-element-2707808{--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-13 .elementor-element.elementor-element-a4e779f img{width:100%;border-radius:15px 15px 15px 15px;}.elementor-13 .elementor-element.elementor-element-4f8ccfa > .elementor-widget-container{padding:20px 0px 0px 0px;}.elementor-13 .elementor-element.elementor-element-9887c8a{--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;--gap:12px 0px;--row-gap:12px;--column-gap:0px;--padding-top:120px;--padding-bottom:120px;--padding-left:40px;--padding-right:40px;}.elementor-13 .elementor-element.elementor-element-9887c8a:not(.elementor-motion-effects-element-type-background), .elementor-13 .elementor-element.elementor-element-9887c8a > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-astglobalcolor4 );}.elementor-13 .elementor-element.elementor-element-12a8db9.elementor-element{--align-self:center;}.elementor-13 .elementor-element.elementor-element-12a8db9 .elementor-icon-box-wrapper{align-items:center;text-align:start;gap:6px;}.elementor-13 .elementor-element.elementor-element-12a8db9 .elementor-icon-box-title{margin-block-end:0px;color:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-12a8db9.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-12a8db9.elementor-view-framed .elementor-icon, .elementor-13 .elementor-element.elementor-element-12a8db9.elementor-view-default .elementor-icon{fill:var( --e-global-color-astglobalcolor2 );color:var( --e-global-color-astglobalcolor2 );border-color:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-12a8db9 .elementor-icon{font-size:15px;}.elementor-13 .elementor-element.elementor-element-12a8db9 .elementor-icon-box-title, .elementor-13 .elementor-element.elementor-element-12a8db9 .elementor-icon-box-title a{font-weight:500;text-transform:uppercase;letter-spacing:1px;}.elementor-13 .elementor-element.elementor-element-3cd7462{text-align:center;}.elementor-13 .elementor-element.elementor-element-fab24e0{--display:grid;--e-con-grid-template-columns:repeat(3, 1fr);--e-con-grid-template-rows:repeat(1, 1fr);--grid-auto-flow:row;--margin-top:68px;--margin-bottom:48px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-13 .elementor-element.elementor-element-892f78f img{border-radius:24px 24px 24px 24px;}.elementor-13 .elementor-element.elementor-element-4ded513{--display:flex;--justify-content:center;--overlay-opacity:0.64;--border-radius:24px 24px 24px 24px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-13 .elementor-element.elementor-element-4ded513::before, .elementor-13 .elementor-element.elementor-element-4ded513 > .elementor-background-video-container::before, .elementor-13 .elementor-element.elementor-element-4ded513 > .e-con-inner > .elementor-background-video-container::before, .elementor-13 .elementor-element.elementor-element-4ded513 > .elementor-background-slideshow::before, .elementor-13 .elementor-element.elementor-element-4ded513 > .e-con-inner > .elementor-background-slideshow::before, .elementor-13 .elementor-element.elementor-element-4ded513 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:var( --e-global-color-astglobalcolor7 );--background-overlay:'';}.elementor-13 .elementor-element.elementor-element-4ded513:not(.elementor-motion-effects-element-type-background), .elementor-13 .elementor-element.elementor-element-4ded513 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-13 .elementor-element.elementor-element-f5b1ff3 img{border-radius:24px 24px 24px 24px;}.elementor-13 .elementor-element.elementor-element-45850a8 .elementor-button{background-color:#02010100;fill:var( --e-global-color-astglobalcolor2 );color:var( --e-global-color-astglobalcolor2 );border-style:solid;border-width:2px 2px 2px 2px;border-color:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-45850a8 .elementor-button:hover, .elementor-13 .elementor-element.elementor-element-45850a8 .elementor-button:focus{background-color:var( --e-global-color-astglobalcolor1 );color:var( --e-global-color-astglobalcolor2 );border-color:var( --e-global-color-astglobalcolor1 );}.elementor-13 .elementor-element.elementor-element-45850a8 .elementor-button-content-wrapper{flex-direction:row-reverse;}.elementor-13 .elementor-element.elementor-element-45850a8 .elementor-button .elementor-button-content-wrapper{gap:8px;}.elementor-13 .elementor-element.elementor-element-45850a8 .elementor-button:hover svg, .elementor-13 .elementor-element.elementor-element-45850a8 .elementor-button:focus svg{fill:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-d10e28f{--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;--gap:12px 0px;--row-gap:12px;--column-gap:0px;--padding-top:120px;--padding-bottom:50px;--padding-left:40px;--padding-right:40px;}.elementor-13 .elementor-element.elementor-element-209e0e3.elementor-element{--align-self:center;}.elementor-13 .elementor-element.elementor-element-209e0e3 .elementor-icon-box-wrapper{align-items:center;text-align:start;gap:6px;}.elementor-13 .elementor-element.elementor-element-209e0e3 .elementor-icon-box-title{margin-block-end:0px;color:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-209e0e3.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-209e0e3.elementor-view-framed .elementor-icon, .elementor-13 .elementor-element.elementor-element-209e0e3.elementor-view-default .elementor-icon{fill:var( --e-global-color-astglobalcolor2 );color:var( --e-global-color-astglobalcolor2 );border-color:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-209e0e3 .elementor-icon{font-size:15px;}.elementor-13 .elementor-element.elementor-element-209e0e3 .elementor-icon-box-title, .elementor-13 .elementor-element.elementor-element-209e0e3 .elementor-icon-box-title a{font-weight:500;text-transform:uppercase;letter-spacing:1px;}.elementor-13 .elementor-element.elementor-element-2070755 > .elementor-widget-container{padding:0% 18% 0% 18%;}.elementor-13 .elementor-element.elementor-element-2070755{text-align:center;}.elementor-13 .elementor-element.elementor-element-e2be913{--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;--margin-top:0px;--margin-bottom:50px;--margin-left:0px;--margin-right:0px;--padding-top:30px;--padding-bottom:050px;--padding-left:0px;--padding-right:030px;}.elementor-13 .elementor-element.elementor-element-b195bbe > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-13 .elementor-element.elementor-element-7b9470ef{--display:grid;--e-con-grid-template-columns:repeat(2, 1fr);--e-con-grid-template-rows:repeat(1, 1fr);--gap:0px 48px;--row-gap:0px;--column-gap:48px;--grid-auto-flow:row;--align-items:center;--overlay-opacity:0;--padding-top:120px;--padding-bottom:120px;--padding-left:40px;--padding-right:40px;}.elementor-13 .elementor-element.elementor-element-7b9470ef:not(.elementor-motion-effects-element-type-background), .elementor-13 .elementor-element.elementor-element-7b9470ef > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-7b9470ef::before, .elementor-13 .elementor-element.elementor-element-7b9470ef > .elementor-background-video-container::before, .elementor-13 .elementor-element.elementor-element-7b9470ef > .e-con-inner > .elementor-background-video-container::before, .elementor-13 .elementor-element.elementor-element-7b9470ef > .elementor-background-slideshow::before, .elementor-13 .elementor-element.elementor-element-7b9470ef > .e-con-inner > .elementor-background-slideshow::before, .elementor-13 .elementor-element.elementor-element-7b9470ef > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:var( --e-global-color-astglobalcolor2 );--background-overlay:'';}.elementor-13 .elementor-element.elementor-element-1cad15d1 > .elementor-widget-container{border-radius:0px 0px 0px 0px;}.elementor-13 .elementor-element.elementor-element-1cad15d1 img{border-radius:25px 25px 25px 25px;}.elementor-13 .elementor-element.elementor-element-66c16dcc{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-13 .elementor-element.elementor-element-d5763d6.elementor-element{--align-self:flex-start;}.elementor-13 .elementor-element.elementor-element-d5763d6 .elementor-icon-box-wrapper{align-items:center;gap:6px;}.elementor-13 .elementor-element.elementor-element-d5763d6 .elementor-icon-box-title{margin-block-end:0px;color:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-d5763d6.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-d5763d6.elementor-view-framed .elementor-icon, .elementor-13 .elementor-element.elementor-element-d5763d6.elementor-view-default .elementor-icon{fill:var( --e-global-color-astglobalcolor2 );color:var( --e-global-color-astglobalcolor2 );border-color:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-d5763d6 .elementor-icon{font-size:15px;}.elementor-13 .elementor-element.elementor-element-d5763d6 .elementor-icon-box-title, .elementor-13 .elementor-element.elementor-element-d5763d6 .elementor-icon-box-title a{font-weight:500;text-transform:uppercase;letter-spacing:1px;}.elementor-13 .elementor-element.elementor-element-309abf5b{color:var( --e-global-color-astglobalcolor5 );}.elementor-13 .elementor-element.elementor-element-35bc481f > .elementor-widget-container{margin:10px 0px 24px 0px;}.elementor-13 .elementor-element.elementor-element-35bc481f .elementor-icon-list-icon i{color:var( --e-global-color-astglobalcolor1 );transition:color 0.3s;}.elementor-13 .elementor-element.elementor-element-35bc481f .elementor-icon-list-icon svg{fill:var( --e-global-color-astglobalcolor1 );transition:fill 0.3s;}.elementor-13 .elementor-element.elementor-element-35bc481f{--e-icon-list-icon-size:16px;--icon-vertical-offset:0px;}.elementor-13 .elementor-element.elementor-element-35bc481f .elementor-icon-list-item > .elementor-icon-list-text, .elementor-13 .elementor-element.elementor-element-35bc481f .elementor-icon-list-item > a{font-size:18px;font-weight:500;}.elementor-13 .elementor-element.elementor-element-35bc481f .elementor-icon-list-text{color:var( --e-global-color-astglobalcolor2 );transition:color 0.3s;}.elementor-13 .elementor-element.elementor-element-22a2eee > .elementor-widget-container{border-radius:0px 0px 0px 0px;}.elementor-13 .elementor-element.elementor-element-22a2eee img{border-radius:25px 25px 25px 25px;}.elementor-13 .elementor-element.elementor-element-dde326f .elementor-button{background-color:#02010100;fill:var( --e-global-color-astglobalcolor2 );color:var( --e-global-color-astglobalcolor2 );border-style:solid;border-width:2px 2px 2px 2px;border-color:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-dde326f .elementor-button:hover, .elementor-13 .elementor-element.elementor-element-dde326f .elementor-button:focus{background-color:var( --e-global-color-astglobalcolor1 );color:var( --e-global-color-astglobalcolor2 );border-color:var( --e-global-color-astglobalcolor1 );}.elementor-13 .elementor-element.elementor-element-dde326f > .elementor-widget-container{margin:10px 0px 0px 0px;}.elementor-13 .elementor-element.elementor-element-dde326f .elementor-button-content-wrapper{flex-direction:row-reverse;}.elementor-13 .elementor-element.elementor-element-dde326f .elementor-button .elementor-button-content-wrapper{gap:8px;}.elementor-13 .elementor-element.elementor-element-dde326f .elementor-button:hover svg, .elementor-13 .elementor-element.elementor-element-dde326f .elementor-button:focus svg{fill:var( --e-global-color-astglobalcolor2 );}.elementor-13 .elementor-element.elementor-element-2ad92b8{--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:flex-end;--overlay-opacity:0.15;--padding-top:120px;--padding-bottom:120px;--padding-left:40px;--padding-right:40px;}.elementor-13 .elementor-element.elementor-element-2ad92b8:not(.elementor-motion-effects-element-type-background), .elementor-13 .elementor-element.elementor-element-2ad92b8 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://andreagnelli.com/wp-content/uploads/2026/09/SALONE-1.png");background-repeat:no-repeat;background-size:cover;}.elementor-13 .elementor-element.elementor-element-2ad92b8::before, .elementor-13 .elementor-element.elementor-element-2ad92b8 > .elementor-background-video-container::before, .elementor-13 .elementor-element.elementor-element-2ad92b8 > .e-con-inner > .elementor-background-video-container::before, .elementor-13 .elementor-element.elementor-element-2ad92b8 > .elementor-background-slideshow::before, .elementor-13 .elementor-element.elementor-element-2ad92b8 > .e-con-inner > .elementor-background-slideshow::before, .elementor-13 .elementor-element.elementor-element-2ad92b8 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:transparent;--background-overlay:'';background-image:linear-gradient(0deg, var( --e-global-color-astglobalcolor3 ) 0%, var( --e-global-color-astglobalcolor3 ) 0%);}.elementor-13 .elementor-element.elementor-element-dc9ade3{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-13 .elementor-element.elementor-element-47196a3 .elementor-heading-title{color:var( --e-global-color-astglobalcolor5 );}.elementor-13 .elementor-element.elementor-element-c0c0ccf > .elementor-widget-container{margin:20px 0px 0px 0px;}:root{--page-title-display:none;}@media(max-width:1024px){.elementor-13 .elementor-element.elementor-element-3c4bd21{--padding-top:130px;--padding-bottom:100px;--padding-left:32px;--padding-right:32px;}.elementor-13 .elementor-element.elementor-element-b09ce85{--margin-top:24px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-13 .elementor-element.elementor-element-e583e06{--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--gap:0px 35px;--row-gap:0px;--column-gap:35px;--padding-top:80px;--padding-bottom:80px;--padding-left:32px;--padding-right:32px;}.elementor-13 .elementor-element.elementor-element-afd65a8 > .elementor-widget-container{margin:-50px 0px 0px 0px;}.elementor-13 .elementor-element.elementor-element-489bfc9 > .elementor-widget-container{margin:20px 0px 20px 0px;}.elementor-13 .elementor-element.elementor-element-b537ed1{--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--gap:0px 35px;--row-gap:0px;--column-gap:35px;--padding-top:80px;--padding-bottom:80px;--padding-left:32px;--padding-right:32px;}.elementor-13 .elementor-element.elementor-element-f551d8a > .elementor-widget-container{margin:-50px 0px 0px 0px;}.elementor-13 .elementor-element.elementor-element-751c2dd{--padding-top:80px;--padding-bottom:80px;--padding-left:32px;--padding-right:32px;}.elementor-13 .elementor-element.elementor-element-06de91d{--e-con-grid-template-columns:repeat(2, 1fr);--e-con-grid-template-rows:repeat(2, 1fr);--grid-auto-flow:row;--align-items:stretch;--margin-top:48px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-13 .elementor-element.elementor-element-b675f89{--justify-content:flex-start;}.elementor-13 .elementor-element.elementor-element-18e5f5e{--justify-content:flex-start;}.elementor-13 .elementor-element.elementor-element-473e9a2{--justify-content:flex-start;}.elementor-13 .elementor-element.elementor-element-a65f806{--justify-content:flex-start;}.elementor-13 .elementor-element.elementor-element-38f0272 > .elementor-widget-container{margin:30px 0px 0px 0px;}.elementor-13 .elementor-element.elementor-element-94f67b1 > .elementor-widget-container{margin:30px 0px 0px 0px;}.elementor-13 .elementor-element.elementor-element-ebdb668{--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--padding-top:80px;--padding-bottom:80px;--padding-left:32px;--padding-right:32px;}.elementor-13 .elementor-element.elementor-element-346d282 > .elementor-widget-container{margin:12px 0px 40px 0px;}.elementor-13 .elementor-element.elementor-element-9887c8a{--padding-top:80px;--padding-bottom:80px;--padding-left:32px;--padding-right:32px;}.elementor-13 .elementor-element.elementor-element-fab24e0{--grid-auto-flow:row;--margin-top:48px;--margin-bottom:24px;--margin-left:0px;--margin-right:0px;}.elementor-13 .elementor-element.elementor-element-4ded513{--padding-top:0px;--padding-bottom:0px;--padding-left:20px;--padding-right:20px;}.elementor-13 .elementor-element.elementor-element-d10e28f{--padding-top:80px;--padding-bottom:80px;--padding-left:32px;--padding-right:32px;}.elementor-13 .elementor-element.elementor-element-7b9470ef{--gap:0px 24px;--row-gap:0px;--column-gap:24px;--grid-auto-flow:row;--padding-top:80px;--padding-bottom:80px;--padding-left:32px;--padding-right:32px;}.elementor-13 .elementor-element.elementor-element-35bc481f > .elementor-widget-container{margin:20px 0px 20px 0px;}.elementor-13 .elementor-element.elementor-element-dde326f > .elementor-widget-container{margin:30px 0px 0px 0px;}.elementor-13 .elementor-element.elementor-element-2ad92b8{--padding-top:80px;--padding-bottom:80px;--padding-left:32px;--padding-right:32px;}.elementor-13 .elementor-element.elementor-element-c0c0ccf > .elementor-widget-container{margin:10px 0px 0px 0px;}}@media(max-width:767px){.elementor-13 .elementor-element.elementor-element-3c4bd21{--min-height:0vh;--padding-top:130px;--padding-bottom:80px;--padding-left:24px;--padding-right:24px;}.elementor-13 .elementor-element.elementor-element-3c4bd21:not(.elementor-motion-effects-element-type-background), .elementor-13 .elementor-element.elementor-element-3c4bd21 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-position:-412px -30px;background-size:1000px auto;}.elementor-13 .elementor-element.elementor-element-68c50c3 > .elementor-widget-container{margin:-15px 0px 0px 0px;}.elementor-13 .elementor-element.elementor-element-f5aae62 > .elementor-widget-container{padding:0% 0% 10% 0%;}.elementor-13 .elementor-element.elementor-element-b09ce85{--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-start;--gap:15px 15px;--row-gap:15px;--column-gap:15px;--margin-top:12px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-13 .elementor-element.elementor-element-e583e06{--gap:45px 0px;--row-gap:45px;--column-gap:0px;--padding-top:20px;--padding-bottom:64px;--padding-left:24px;--padding-right:24px;}.elementor-13 .elementor-element.elementor-element-afd65a8 > .elementor-widget-container{margin:-30px 0px 0px 0px;}.elementor-13 .elementor-element.elementor-element-b800ee8{--margin-top:-10px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-13 .elementor-element.elementor-element-02a1434 > .elementor-widget-container{margin:-50px 0px 0px 0px;}.elementor-13 .elementor-element.elementor-element-b537ed1{--gap:45px 0px;--row-gap:45px;--column-gap:0px;--padding-top:20px;--padding-bottom:40px;--padding-left:24px;--padding-right:24px;}.elementor-13 .elementor-element.elementor-element-f551d8a > .elementor-widget-container{margin:-20px 0px 0px 20px;}.elementor-13 .elementor-element.elementor-element-751c2dd{--padding-top:64px;--padding-bottom:64px;--padding-left:24px;--padding-right:24px;}.elementor-13 .elementor-element.elementor-element-a8bf121 > .elementor-widget-container{padding:0% 0% 0% 0%;}.elementor-13 .elementor-element.elementor-element-06de91d{--e-con-grid-template-columns:repeat(1, 1fr);--gap:30px 0px;--row-gap:30px;--column-gap:0px;--grid-auto-flow:row;--margin-top:32px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-13 .elementor-element.elementor-element-b675f89{--border-radius:12px 12px 12px 12px;}.elementor-13 .elementor-element.elementor-element-3a89d96{text-align:start;}.elementor-13 .elementor-element.elementor-element-3a89d96 img{border-radius:8px 8px 8px 8px;}.elementor-13 .elementor-element.elementor-element-18e5f5e{--border-radius:12px 12px 12px 12px;}.elementor-13 .elementor-element.elementor-element-ed47f8a img{border-radius:8px 8px 8px 8px;}.elementor-13 .elementor-element.elementor-element-473e9a2{--border-radius:12px 12px 12px 12px;}.elementor-13 .elementor-element.elementor-element-93f2848 img{border-radius:8px 8px 8px 8px;}.elementor-13 .elementor-element.elementor-element-a65f806{--border-radius:12px 12px 12px 12px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-13 .elementor-element.elementor-element-d35b00e img{border-radius:8px 8px 8px 8px;}.elementor-13 .elementor-element.elementor-element-94f67b1 > .elementor-widget-container{margin:0px 0px 15px 0px;}.elementor-13 .elementor-element.elementor-element-ebdb668{--gap:44px 0px;--row-gap:44px;--column-gap:0px;--padding-top:64px;--padding-bottom:64px;--padding-left:24px;--padding-right:24px;}.elementor-13 .elementor-element.elementor-element-346d282 > .elementor-widget-container{margin:20px 0px 040px 0px;padding:0px 0px 0px 0px;}.elementor-13 .elementor-element.elementor-element-c499392{--padding-top:20px;--padding-bottom:20px;--padding-left:20px;--padding-right:20px;}.elementor-13 .elementor-element.elementor-element-9774241 > .elementor-widget-container{padding:50px 0px 0px 0px;}.elementor-13 .elementor-element.elementor-element-4f8ccfa > .elementor-widget-container{padding:50px 0px 25px 0px;}.elementor-13 .elementor-element.elementor-element-9887c8a{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:64px;--padding-bottom:65px;--padding-left:24px;--padding-right:24px;}.elementor-13 .elementor-element.elementor-element-12a8db9 .elementor-icon-box-wrapper{align-items:center;}.elementor-13 .elementor-element.elementor-element-fab24e0{--e-con-grid-template-columns:repeat(1, 1fr);--gap:30px 0px;--row-gap:30px;--column-gap:0px;--grid-auto-flow:row;--margin-top:33px;--margin-bottom:30px;--margin-left:0px;--margin-right:0px;}.elementor-13 .elementor-element.elementor-element-4ded513{--padding-top:124px;--padding-bottom:124px;--padding-left:20px;--padding-right:20px;}.elementor-13 .elementor-element.elementor-element-d10e28f{--padding-top:64px;--padding-bottom:64px;--padding-left:24px;--padding-right:24px;}.elementor-13 .elementor-element.elementor-element-209e0e3 .elementor-icon-box-wrapper{align-items:center;}.elementor-13 .elementor-element.elementor-element-2070755 > .elementor-widget-container{padding:0% 0% 0% 0%;}.elementor-13 .elementor-element.elementor-element-e2be913{--margin-top:0px;--margin-bottom:40px;--margin-left:0px;--margin-right:0px;--padding-top:18px;--padding-bottom:40px;--padding-left:10px;--padding-right:10px;}.elementor-13 .elementor-element.elementor-element-b195bbe > .elementor-widget-container{margin:0px 10px 0px 10px;padding:0px 0px 0px 0px;}.elementor-13 .elementor-element.elementor-element-7b9470ef{--e-con-grid-template-columns:repeat(1, 1fr);--e-con-grid-template-rows:repeat(1, 1fr);--gap:40px 0px;--row-gap:40px;--column-gap:0px;--grid-auto-flow:row;--padding-top:64px;--padding-bottom:64px;--padding-left:24px;--padding-right:24px;}.elementor-13 .elementor-element.elementor-element-66c16dcc{--gap:12px 0px;--row-gap:12px;--column-gap:0px;}.elementor-13 .elementor-element.elementor-element-163372f1 > .elementor-widget-container{margin:11px 0px 6px 0px;}.elementor-13 .elementor-element.elementor-element-309abf5b > .elementor-widget-container{margin:0px 0px -15px 0px;}.elementor-13 .elementor-element.elementor-element-dde326f > .elementor-widget-container{margin:10px 0px 0px 0px;}.elementor-13 .elementor-element.elementor-element-2ad92b8{--padding-top:64px;--padding-bottom:64px;--padding-left:24px;--padding-right:24px;}.elementor-13 .elementor-element.elementor-element-dc9ade3{--gap:15px 0px;--row-gap:15px;--column-gap:0px;}.elementor-13 .elementor-element.elementor-element-c0c0ccf > .elementor-widget-container{margin:12px 0px 0px 0px;}}@media(min-width:768px){.elementor-13 .elementor-element.elementor-element-3c4bd21{--content-width:1200px;}.elementor-13 .elementor-element.elementor-element-e583e06{--content-width:1200px;}.elementor-13 .elementor-element.elementor-element-1b604d5{--width:50%;}.elementor-13 .elementor-element.elementor-element-b800ee8{--width:50%;}.elementor-13 .elementor-element.elementor-element-5f6b8ca{--width:50%;}.elementor-13 .elementor-element.elementor-element-751c2dd{--content-width:1200px;}.elementor-13 .elementor-element.elementor-element-ebdb668{--content-width:1200px;}.elementor-13 .elementor-element.elementor-element-bc40ce0{--width:50%;}.elementor-13 .elementor-element.elementor-element-d06c7f0{--width:50%;}.elementor-13 .elementor-element.elementor-element-54b15cf{--width:50%;}.elementor-13 .elementor-element.elementor-element-2707808{--width:50%;}.elementor-13 .elementor-element.elementor-element-9887c8a{--content-width:1200px;}.elementor-13 .elementor-element.elementor-element-d10e28f{--content-width:1200px;}.elementor-13 .elementor-element.elementor-element-7b9470ef{--content-width:1200px;}.elementor-13 .elementor-element.elementor-element-2ad92b8{--content-width:1200px;}.elementor-13 .elementor-element.elementor-element-dc9ade3{--width:50%;}}@media(min-width:1025px){.elementor-13 .elementor-element.elementor-element-3c4bd21:not(.elementor-motion-effects-element-type-background), .elementor-13 .elementor-element.elementor-element-3c4bd21 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-attachment:fixed;}.elementor-13 .elementor-element.elementor-element-2ad92b8:not(.elementor-motion-effects-element-type-background), .elementor-13 .elementor-element.elementor-element-2ad92b8 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-attachment:fixed;}}/* Start custom CSS for icon-box, class: .elementor-element-68c50c3 *//* ========================================== RIQUADRO ICONA – ABOUT US Non modifica il font ========================================== */ .elementor-13 .elementor-element.elementor-element-68c50c3 .elementor-icon-box-wrapper { position: relative; display: inline-flex; align-items: center; width: auto; padding: 10px 17px; border: 1px solid rgba(255, 53, 88, 0.42); border-radius: 999px; background: linear-gradient( 115deg, rgba(200, 16, 46, 0.18), rgba(255, 255, 255, 0.045), rgba(115, 0, 24, 0.15) ); box-shadow: 0 10px 30px rgba(0, 0, 0, 0.30), inset 0 1px 0 rgba(255, 255, 255, 0.12), 0 0 18px rgba(200, 16, 46, 0.10); overflow: hidden; transition: border-color 0.5s ease, background 0.5s ease, box-shadow 0.5s ease; } /* Riflesso luminoso */ .elementor-13 .elementor-element.elementor-element-68c50c3 .elementor-icon-box-wrapper::before { content: ""; position: absolute; top: 0; left: -75%; width: 45%; height: 100%; background: linear-gradient( 90deg, transparent, rgba(255, 255, 255, 0.20), rgba(255, 53, 88, 0.14), transparent ); transform: skewX(-18deg); animation: agnelli-about-light 6s ease-in-out infinite; pointer-events: none; } /* Icona */ .elementor-13 .elementor-element.elementor-element-68c50c3 .elementor-icon-box-icon { position: relative; z-index: 2; margin-bottom: 0 !important; } .elementor-13 .elementor-element.elementor-element-68c50c3 .elementor-icon { color: #FF3558 !important; filter: drop-shadow(0 0 5px rgba(255, 53, 88, 0.50)); } /* Testo */ .elementor-13 .elementor-element.elementor-element-68c50c3 .elementor-icon-box-content { position: relative; z-index: 2; } .elementor-13 .elementor-element.elementor-element-68c50c3 .elementor-icon-box-title, .elementor-13 .elementor-element.elementor-element-68c50c3 .elementor-icon-box-title a { color: #FFFFFF !important; margin: 0 !important; } /* Hover */ .elementor-13 .elementor-element.elementor-element-68c50c3 .elementor-icon-box-wrapper:hover { border-color: #FF3558; background: linear-gradient( 115deg, rgba(200, 16, 46, 0.30), rgba(255, 255, 255, 0.06), rgba(115, 0, 24, 0.22) ); box-shadow: 0 14px 35px rgba(0, 0, 0, 0.38), inset 0 1px 0 rgba(255, 255, 255, 0.16), 0 0 25px rgba(200, 16, 46, 0.22); } @keyframes agnelli-about-light { 0%, 25% { left: -75%; opacity: 0; } 35% { opacity: 1; } 65% { left: 135%; opacity: 1; } 75%, 100% { left: 135%; opacity: 0; } } @media (prefers-reduced-motion: reduce) { .elementor-13 .elementor-element.elementor-element-68c50c3 .elementor-icon-box-wrapper::before { animation: none; } }/* End custom CSS */ /* Start custom CSS for heading, class: .elementor-element-f5aae62 *//* ========================================== TITOLO HERO – ROSSO LUMINOSO ANIMATO Non modifica font, peso o dimensioni ========================================== */ .elementor-13 .elementor-element.elementor-element-f5aae62 .elementor-heading-title { display: inline-block; color: #FF1744; background-image: linear-gradient( 105deg, #FF1744 0%, #FF4964 14%, #FFFFFF 25%, #FF2A4F 36%, #C9002F 50%, #FF1744 64%, #FF7588 76%, #FFFFFF 86%, #FF1744 100% ); background-size: 320% 100%; background-position: 0% 50%; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; filter: drop-shadow(0 0 5px rgba(255, 23, 68, 0.40)) drop-shadow(0 0 14px rgba(200, 16, 46, 0.20)); animation: agnelli-hero-title 6s ease-in-out infinite; will-change: background-position, filter; } .elementor-13 .elementor-element.elementor-element-f5aae62 .elementor-heading-title a { color: inherit; -webkit-text-fill-color: inherit; } @keyframes agnelli-hero-title { 0% { background-position: 0% 50%; filter: drop-shadow(0 0 4px rgba(255, 23, 68, 0.35)) drop-shadow(0 0 12px rgba(200, 16, 46, 0.18)); } 50% { background-position: 100% 50%; filter: drop-shadow(0 0 7px rgba(255, 55, 85, 0.55)) drop-shadow(0 0 20px rgba(200, 16, 46, 0.30)); } 100% { background-position: 0% 50%; filter: drop-shadow(0 0 4px rgba(255, 23, 68, 0.35)) drop-shadow(0 0 12px rgba(200, 16, 46, 0.18)); } } @media (prefers-reduced-motion: reduce) { .elementor-13 .elementor-element.elementor-element-f5aae62 .elementor-heading-title { animation: none; background-position: 45% 50%; } }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-05ef6a6 *//* ================================================== PULSANTE PRINCIPALE ANDREA AGNELLI EFFETTO ORIGINALE + COLORI BLOCCATI ================================================== */ .elementor-13 .elementor-element.elementor-element-05ef6a6 .elementor-button { position: relative; isolation: isolate; overflow: hidden; /* COLORI BLOCCATI - STATO INIZIALE */ color: #ffffff !important; background-color: #B11226 !important; border-color: #B11226 !important; box-shadow: 0 10px 25px rgba(177, 18, 38, 0.22), inset 0 0 0 1px rgba(255, 255, 255, 0.10); transition: color 1.1s ease, transform 0.65s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.65s ease, border-color 0.8s ease; } /* ================================================== TESTO SEMPRE SOPRA ALL’ANIMAZIONE ================================================== */ .elementor-13 .elementor-element.elementor-element-05ef6a6 .elementor-button-content-wrapper { position: relative; z-index: 5; } /* COLORE TESTO BLOCCATO */ .elementor-13 .elementor-element.elementor-element-05ef6a6 .elementor-button-text { color: #ffffff !important; transition: color 1.1s ease; } /* ================================================== PASSAGGIO DAL ROSSO AL BIANCO IDENTICO ALL'ORIGINALE ================================================== */ .elementor-13 .elementor-element.elementor-element-05ef6a6 .elementor-button::before { content: ""; position: absolute; inset: 0; z-index: 2; border-radius: inherit; background: linear-gradient( to bottom, #ffffff 0%, #ffffff calc(100% - 7px), rgba(177, 18, 38, 0.15) calc(100% - 7px), rgba(177, 18, 38, 0.15) calc(100% - 5px), #ffffff calc(100% - 5px) ); transform: scaleX(0); transform-origin: left center; transition: transform 0.7s ease; } /* ================================================== FORBICI COMPLETE IN UN UNICO SVG ================================================== */ .elementor-13 .elementor-element.elementor-element-05ef6a6 .elementor-button::after { content: ""; position: absolute; z-index: 7; width: 31px; height: 31px; left: 8px; bottom: -1px; /* BIANCHE SUL ROSSO */ background-color: #ffffff; -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 3.5c-.614-.884-.074-1.962.858-2.5L8 7.226 11.642 1c.932.538 1.472 1.616.858 2.5L8.81 8.61l1.556 2.661a2.5 2.5 0 1 1-.794.637L8 9.73l-1.572 2.177a2.5 2.5 0 1 1-.794-.637L7.19 8.61zm2.5 10a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0m7 0a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0'/%3E%3C/svg%3E"); -webkit-mask-repeat: no-repeat; -webkit-mask-position: center; -webkit-mask-size: contain; mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 3.5c-.614-.884-.074-1.962.858-2.5L8 7.226 11.642 1c.932.538 1.472 1.616.858 2.5L8.81 8.61l1.556 2.661a2.5 2.5 0 1 1-.794.637L8 9.73l-1.572 2.177a2.5 2.5 0 1 1-.794-.637L7.19 8.61zm2.5 10a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0m7 0a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0'/%3E%3C/svg%3E"); mask-repeat: no-repeat; mask-position: center; mask-size: contain; opacity: 0; pointer-events: none; filter: drop-shadow(0 2px 2px rgba(0, 0, 0, 0.14)); transition: opacity 0.35s ease, filter 0.35s ease; } /* ================================================== HOVER ================================================== */ .elementor-13 .elementor-element.elementor-element-05ef6a6 .elementor-button:hover { /* NON CAMBIAMO LO SFONDO QUI: IL BIANCO DEVE ENTRARE CON L'ANIMAZIONE */ color: #111111 !important; border-color: #ffffff !important; transform: translateY(-2px); box-shadow: 0 16px 34px rgba(0, 0, 0, 0.18), 0 0 0 1px rgba(177, 18, 38, 0.10); } /* TESTO DA BIANCO A NERO IN MODO FLUIDO */ .elementor-13 .elementor-element.elementor-element-05ef6a6 .elementor-button:hover .elementor-button-text { color: #111111 !important; } /* ================================================== PASSAGGIO BIANCO FLUIDO ================================================== */ .elementor-13 .elementor-element.elementor-element-05ef6a6 .elementor-button:hover::before { animation: aa-passaggio-bianco 1.6s cubic-bezier(0.45, 0, 0.15, 1) forwards; } /* ================================================== SCORRIMENTO DELLE FORBICI ================================================== */ .elementor-13 .elementor-element.elementor-element-05ef6a6 .elementor-button:hover::after { animation: aa-forbici-bicolore 1.6s cubic-bezier(0.45, 0, 0.15, 1) forwards; } /* ================================================== ANIMAZIONE DELLO SFONDO ================================================== */ @keyframes aa-passaggio-bianco { 0% { transform: scaleX(0); } 100% { transform: scaleX(1); } } /* ================================================== ANIMAZIONE FLUIDA DELLE FORBICI ================================================== */ @keyframes aa-forbici-bicolore { 0% { left: 8px; opacity: 0; background-color: #ffffff; transform: rotate(90deg) scale(0.92); filter: blur(0.8px) drop-shadow(0 2px 2px rgba(0, 0, 0, 0.12)); } /* COMPARSA MORBIDA SUL ROSSO */ 10% { opacity: 1; background-color: #ffffff; transform: rotate(90deg) scale(1); filter: blur(0) drop-shadow(0 2px 2px rgba(0, 0, 0, 0.14)); } /* ANCORA BIANCHE */ 22% { opacity: 1; background-color: #ffffff; } /* PASSAGGIO GRADUALE AL ROSSO */ 42% { opacity: 1; background-color: #B11226; } /* MOVIMENTO CENTRALE */ 78% { opacity: 1; background-color: #B11226; transform: rotate(90deg) scale(1); filter: blur(0) drop-shadow(0 2px 2px rgba(0, 0, 0, 0.14)); } /* INIZIO DISSOLVENZA */ 90% { left: calc(100% - 48px); opacity: 0.55; background-color: #B11226; transform: rotate(90deg) scale(0.97); filter: blur(0.3px) drop-shadow(0 2px 2px rgba(0, 0, 0, 0.10)); } /* SCOMPARSA PRIMA DEL BORDO */ 100% { left: calc(100% - 37px); opacity: 0; background-color: #B11226; transform: rotate(90deg) scale(0.90); filter: blur(1.4px); } } /* ================================================== TELEFONO ================================================== */ @media (max-width: 767px) { .elementor-13 .elementor-element.elementor-element-05ef6a6 .elementor-button::after { width: 27px; height: 27px; bottom: 0; } } /* ================================================== RIDUZIONE MOVIMENTO SE RICHIESTA ================================================== */ @media (prefers-reduced-motion: reduce) { .elementor-13 .elementor-element.elementor-element-05ef6a6 .elementor-button, .elementor-13 .elementor-element.elementor-element-05ef6a6 .elementor-button::before, .elementor-13 .elementor-element.elementor-element-05ef6a6 .elementor-button::after, .elementor-13 .elementor-element.elementor-element-05ef6a6 .elementor-button-text { animation: none !important; transition-duration: 0.2s; } }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-de66673 *//* ================================================== PULSANTE PRINCIPALE ANDREA AGNELLI EFFETTO ORIGINALE + COLORI BLOCCATI ================================================== */ .elementor-13 .elementor-element.elementor-element-de66673 .elementor-button { position: relative; isolation: isolate; overflow: hidden; /* COLORI BLOCCATI - STATO INIZIALE */ color: #ffffff !important; background-color: #B11226 !important; border-color: #B11226 !important; box-shadow: 0 10px 25px rgba(177, 18, 38, 0.22), inset 0 0 0 1px rgba(255, 255, 255, 0.10); transition: color 1.1s ease, transform 0.65s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.65s ease, border-color 0.8s ease; } /* ================================================== TESTO SEMPRE SOPRA ALL’ANIMAZIONE ================================================== */ .elementor-13 .elementor-element.elementor-element-de66673 .elementor-button-content-wrapper { position: relative; z-index: 5; } /* COLORE TESTO BLOCCATO */ .elementor-13 .elementor-element.elementor-element-de66673 .elementor-button-text { color: #ffffff !important; transition: color 1.1s ease; } /* ================================================== PASSAGGIO DAL ROSSO AL BIANCO IDENTICO ALL'ORIGINALE ================================================== */ .elementor-13 .elementor-element.elementor-element-de66673 .elementor-button::before { content: ""; position: absolute; inset: 0; z-index: 2; border-radius: inherit; background: linear-gradient( to bottom, #ffffff 0%, #ffffff calc(100% - 7px), rgba(177, 18, 38, 0.15) calc(100% - 7px), rgba(177, 18, 38, 0.15) calc(100% - 5px), #ffffff calc(100% - 5px) ); transform: scaleX(0); transform-origin: left center; transition: transform 0.7s ease; } /* ================================================== FORBICI COMPLETE IN UN UNICO SVG ================================================== */ .elementor-13 .elementor-element.elementor-element-de66673 .elementor-button::after { content: ""; position: absolute; z-index: 7; width: 31px; height: 31px; left: 8px; bottom: -1px; /* BIANCHE SUL ROSSO */ background-color: #ffffff; -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 3.5c-.614-.884-.074-1.962.858-2.5L8 7.226 11.642 1c.932.538 1.472 1.616.858 2.5L8.81 8.61l1.556 2.661a2.5 2.5 0 1 1-.794.637L8 9.73l-1.572 2.177a2.5 2.5 0 1 1-.794-.637L7.19 8.61zm2.5 10a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0m7 0a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0'/%3E%3C/svg%3E"); -webkit-mask-repeat: no-repeat; -webkit-mask-position: center; -webkit-mask-size: contain; mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 3.5c-.614-.884-.074-1.962.858-2.5L8 7.226 11.642 1c.932.538 1.472 1.616.858 2.5L8.81 8.61l1.556 2.661a2.5 2.5 0 1 1-.794.637L8 9.73l-1.572 2.177a2.5 2.5 0 1 1-.794-.637L7.19 8.61zm2.5 10a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0m7 0a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0'/%3E%3C/svg%3E"); mask-repeat: no-repeat; mask-position: center; mask-size: contain; opacity: 0; pointer-events: none; filter: drop-shadow(0 2px 2px rgba(0, 0, 0, 0.14)); transition: opacity 0.35s ease, filter 0.35s ease; } /* ================================================== HOVER ================================================== */ .elementor-13 .elementor-element.elementor-element-de66673 .elementor-button:hover { /* NON CAMBIAMO LO SFONDO QUI: IL BIANCO DEVE ENTRARE CON L'ANIMAZIONE */ color: #111111 !important; border-color: #ffffff !important; transform: translateY(-2px); box-shadow: 0 16px 34px rgba(0, 0, 0, 0.18), 0 0 0 1px rgba(177, 18, 38, 0.10); } /* TESTO DA BIANCO A NERO IN MODO FLUIDO */ .elementor-13 .elementor-element.elementor-element-de66673 .elementor-button:hover .elementor-button-text { color: #111111 !important; } /* ================================================== PASSAGGIO BIANCO FLUIDO ================================================== */ .elementor-13 .elementor-element.elementor-element-de66673 .elementor-button:hover::before { animation: aa-passaggio-bianco 1.6s cubic-bezier(0.45, 0, 0.15, 1) forwards; } /* ================================================== SCORRIMENTO DELLE FORBICI ================================================== */ .elementor-13 .elementor-element.elementor-element-de66673 .elementor-button:hover::after { animation: aa-forbici-bicolore 1.6s cubic-bezier(0.45, 0, 0.15, 1) forwards; } /* ================================================== ANIMAZIONE DELLO SFONDO ================================================== */ @keyframes aa-passaggio-bianco { 0% { transform: scaleX(0); } 100% { transform: scaleX(1); } } /* ================================================== ANIMAZIONE FLUIDA DELLE FORBICI ================================================== */ @keyframes aa-forbici-bicolore { 0% { left: 8px; opacity: 0; background-color: #ffffff; transform: rotate(90deg) scale(0.92); filter: blur(0.8px) drop-shadow(0 2px 2px rgba(0, 0, 0, 0.12)); } /* COMPARSA MORBIDA SUL ROSSO */ 10% { opacity: 1; background-color: #ffffff; transform: rotate(90deg) scale(1); filter: blur(0) drop-shadow(0 2px 2px rgba(0, 0, 0, 0.14)); } /* ANCORA BIANCHE */ 22% { opacity: 1; background-color: #ffffff; } /* PASSAGGIO GRADUALE AL ROSSO */ 42% { opacity: 1; background-color: #B11226; } /* MOVIMENTO CENTRALE */ 78% { opacity: 1; background-color: #B11226; transform: rotate(90deg) scale(1); filter: blur(0) drop-shadow(0 2px 2px rgba(0, 0, 0, 0.14)); } /* INIZIO DISSOLVENZA */ 90% { left: calc(100% - 48px); opacity: 0.55; background-color: #B11226; transform: rotate(90deg) scale(0.97); filter: blur(0.3px) drop-shadow(0 2px 2px rgba(0, 0, 0, 0.10)); } /* SCOMPARSA PRIMA DEL BORDO */ 100% { left: calc(100% - 37px); opacity: 0; background-color: #B11226; transform: rotate(90deg) scale(0.90); filter: blur(1.4px); } } /* ================================================== TELEFONO ================================================== */ @media (max-width: 767px) { .elementor-13 .elementor-element.elementor-element-de66673 .elementor-button::after { width: 27px; height: 27px; bottom: 0; } } /* ================================================== RIDUZIONE MOVIMENTO SE RICHIESTA ================================================== */ @media (prefers-reduced-motion: reduce) { .elementor-13 .elementor-element.elementor-element-de66673 .elementor-button, .elementor-13 .elementor-element.elementor-element-de66673 .elementor-button::before, .elementor-13 .elementor-element.elementor-element-de66673 .elementor-button::after, .elementor-13 .elementor-element.elementor-element-de66673 .elementor-button-text { animation: none !important; transition-duration: 0.2s; } }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-3c4bd21 *//* ===================================================== ANDREA AGNELLI — HERO CINEMATIC + AMBIENT MOTION Applicare direttamente al contenitore HERO con immagine impostata come sfondo ===================================================== */ .elementor-13 .elementor-element.elementor-element-3c4bd21 { position: relative; overflow: hidden; isolation: isolate; animation: aa-hero-open 1.5s cubic-bezier(.22,.61,.36,1) both, aa-hero-breathe 14s ease-in-out 1.5s infinite alternate; } /* ===================================================== VELO CINEMATICO ===================================================== */ .elementor-13 .elementor-element.elementor-element-3c4bd21::before { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient( 110deg, rgba(7, 7, 9, .68) 0%, rgba(7, 7, 9, .34) 40%, rgba(115, 0, 24, .15) 68%, rgba(7, 7, 9, .10) 100% ); animation: aa-overlay-open 1.6s ease forwards; } /* ===================================================== LAMA DI LUCE Prima apparizione + ritorno periodico ===================================================== */ .elementor-13 .elementor-element.elementor-element-3c4bd21::after { content: ""; position: absolute; top: -35%; left: -45%; width: 24%; height: 175%; z-index: 2; pointer-events: none; transform: skewX(-18deg); background: linear-gradient( 90deg, transparent 0%, rgba(177, 18, 38, .04) 18%, rgba(255, 255, 255, .34) 48%, rgba(255, 53, 88, .22) 62%, transparent 100% ); filter: blur(2px); opacity: 0; animation: aa-light-first 1.35s .25s cubic-bezier(.22,.61,.36,1) forwards, aa-light-loop 9s 3s ease-in-out infinite; } /* ===================================================== CONTENUTI HERO SEMPRE SOPRA GLI EFFETTI ===================================================== */ .elementor-13 .elementor-element.elementor-element-3c4bd21 > * { position: relative; z-index: 3; } /* ===================================================== APERTURA CINEMATOGRAFICA ===================================================== */ @keyframes aa-hero-open { 0% { transform: scale(1.055); filter: brightness(.78) saturate(.88); } 100% { transform: scale(1); filter: brightness(1) saturate(1); } } /* ===================================================== MOVIMENTO CONTINUO LENTO Micro "respiro" ===================================================== */ @keyframes aa-hero-breathe { 0% { transform: scale(1); } 50% { transform: scale(1.018); } 100% { transform: scale(1.026); } } /* ===================================================== VELO IN APERTURA ===================================================== */ @keyframes aa-overlay-open { 0% { opacity: 1; } 100% { opacity: .56; } } /* ===================================================== PRIMO PASSAGGIO DELLA LUCE ===================================================== */ @keyframes aa-light-first { 0% { left: -45%; opacity: 0; } 15% { opacity: .80; } 75% { opacity: .70; } 100% { left: 125%; opacity: 0; } } /* ===================================================== PASSAGGIO LUCE PERIODICO Molto delicato ===================================================== */ @keyframes aa-light-loop { 0%, 72% { left: -45%; opacity: 0; } 78% { opacity: .18; } 88% { opacity: .28; } 100% { left: 125%; opacity: 0; } } /* ===================================================== TABLET ===================================================== */ @media (max-width: 1024px) { .elementor-13 .elementor-element.elementor-element-3c4bd21 { animation: aa-hero-open 1.4s cubic-bezier(.22,.61,.36,1) both, aa-hero-breathe-tablet 16s ease-in-out 1.4s infinite alternate; } .elementor-13 .elementor-element.elementor-element-3c4bd21::after { width: 30%; } } @keyframes aa-hero-breathe-tablet { 0% { transform: scale(1); } 100% { transform: scale(1.020); } } /* ===================================================== MOBILE Più delicato ===================================================== */ @media (max-width: 767px) { .elementor-13 .elementor-element.elementor-element-3c4bd21 { animation: aa-hero-open-mobile 1.2s cubic-bezier(.22,.61,.36,1) both, aa-hero-breathe-mobile 18s ease-in-out 1.2s infinite alternate; } .elementor-13 .elementor-element.elementor-element-3c4bd21::after { width: 36%; animation: aa-light-first-mobile 1.1s .20s cubic-bezier(.22,.61,.36,1) forwards, aa-light-loop-mobile 11s 3s ease-in-out infinite; } } @keyframes aa-hero-open-mobile { 0% { transform: scale(1.035); filter: brightness(.82) saturate(.92); } 100% { transform: scale(1); filter: brightness(1) saturate(1); } } @keyframes aa-hero-breathe-mobile { 0% { transform: scale(1); } 100% { transform: scale(1.015); } } @keyframes aa-light-first-mobile { 0% { left: -55%; opacity: 0; } 18% { opacity: .55; } 75% { opacity: .45; } 100% { left: 125%; opacity: 0; } } @keyframes aa-light-loop-mobile { 0%, 76% { left: -55%; opacity: 0; } 82% { opacity: .12; } 91% { opacity: .20; } 100% { left: 125%; opacity: 0; } } /* ===================================================== ACCESSIBILITÀ ===================================================== */ @media (prefers-reduced-motion: reduce) { .elementor-13 .elementor-element.elementor-element-3c4bd21, .elementor-13 .elementor-element.elementor-element-3c4bd21::before, .elementor-13 .elementor-element.elementor-element-3c4bd21::after { animation: none !important; } } /* HERO — SFONDO FISSO, SENZA ZOOM DEL CONTENITORE */ .elementor-13 .elementor-element.elementor-element-3c4bd21 { animation: none !important; transform: none !important; filter: none !important; background-attachment: fixed !important; background-position: center center; background-size: cover; background-repeat: no-repeat; } /* VELO — ANTRACITE A SINISTRA, FOTO NATURALE A DESTRA */ .elementor-13 .elementor-element.elementor-element-3c4bd21::before { background: linear-gradient( to right, rgba(12, 13, 15, .88) 0%, rgba(18, 19, 21, .72) 22%, rgba(20, 21, 23, .42) 43%, rgba(20, 21, 23, .14) 62%, rgba(20, 21, 23, 0) 80%, rgba(20, 21, 23, 0) 100% ) !important; opacity: 1 !important; animation: none !important; }/* End custom CSS */ /* Start custom CSS for icon-box, class: .elementor-element-02a1434 *//* ========================================== RIQUADRO ICONA – ABOUT US Non modifica il font ========================================== */ .elementor-13 .elementor-element.elementor-element-02a1434 .elementor-icon-box-wrapper { position: relative; display: inline-flex; align-items: center; width: auto; padding: 10px 17px; border: 1px solid rgba(255, 53, 88, 0.42); border-radius: 999px; background: linear-gradient( 115deg, rgba(200, 16, 46, 0.18), rgba(255, 255, 255, 0.045), rgba(115, 0, 24, 0.15) ); box-shadow: 0 10px 30px rgba(0, 0, 0, 0.30), inset 0 1px 0 rgba(255, 255, 255, 0.12), 0 0 18px rgba(200, 16, 46, 0.10); overflow: hidden; transition: border-color 0.5s ease, background 0.5s ease, box-shadow 0.5s ease; } /* Riflesso luminoso */ .elementor-13 .elementor-element.elementor-element-02a1434 .elementor-icon-box-wrapper::before { content: ""; position: absolute; top: 0; left: -75%; width: 45%; height: 100%; background: linear-gradient( 90deg, transparent, rgba(255, 255, 255, 0.20), rgba(255, 53, 88, 0.14), transparent ); transform: skewX(-18deg); animation: agnelli-about-light 6s ease-in-out infinite; pointer-events: none; } /* Icona */ .elementor-13 .elementor-element.elementor-element-02a1434 .elementor-icon-box-icon { position: relative; z-index: 2; margin-bottom: 0 !important; } .elementor-13 .elementor-element.elementor-element-02a1434 .elementor-icon { color: #FF3558 !important; filter: drop-shadow(0 0 5px rgba(255, 53, 88, 0.50)); } /* Testo */ .elementor-13 .elementor-element.elementor-element-02a1434 .elementor-icon-box-content { position: relative; z-index: 2; } .elementor-13 .elementor-element.elementor-element-02a1434 .elementor-icon-box-title, .elementor-13 .elementor-element.elementor-element-02a1434 .elementor-icon-box-title a { color: #FFFFFF !important; margin: 0 !important; } /* Hover */ .elementor-13 .elementor-element.elementor-element-02a1434 .elementor-icon-box-wrapper:hover { border-color: #FF3558; background: linear-gradient( 115deg, rgba(200, 16, 46, 0.30), rgba(255, 255, 255, 0.06), rgba(115, 0, 24, 0.22) ); box-shadow: 0 14px 35px rgba(0, 0, 0, 0.38), inset 0 1px 0 rgba(255, 255, 255, 0.16), 0 0 25px rgba(200, 16, 46, 0.22); } @keyframes agnelli-about-light { 0%, 25% { left: -75%; opacity: 0; } 35% { opacity: 1; } 65% { left: 135%; opacity: 1; } 75%, 100% { left: 135%; opacity: 0; } } @media (prefers-reduced-motion: reduce) { .elementor-13 .elementor-element.elementor-element-02a1434 .elementor-icon-box-wrapper::before { animation: none; } }/* End custom CSS */ /* Start custom CSS for heading, class: .elementor-element-ad0840b *//* ========================================== TITOLI H2 SU SFONDO NERO Riflesso rosso lento e satinato Non modifica font, peso o dimensioni ========================================== */ .elementor-13 .elementor-element.elementor-element-ad0840b .elementor-heading-title { display: inline-block; color: #FFFFFF; background-image: linear-gradient( 105deg, #FFFFFF 0%, #FFFFFF 22%, #E8E8E8 34%, #FF3558 44%, #C8102E 52%, #FF3558 60%, #E8E8E8 70%, #FFFFFF 82%, #FFFFFF 100% ); background-size: 280% 100%; background-position: 0% 50%; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; animation: agnelli-h2-dark 11s ease-in-out infinite alternate; will-change: background-position; } .elementor-13 .elementor-element.elementor-element-ad0840b .elementor-heading-title a { color: inherit; -webkit-text-fill-color: inherit; } @keyframes agnelli-h2-dark { 0% { background-position: 0% 50%; } 20% { background-position: 0% 50%; } 80% { background-position: 100% 50%; } 100% { background-position: 100% 50%; } } @media (prefers-reduced-motion: reduce) { .elementor-13 .elementor-element.elementor-element-ad0840b .elementor-heading-title { animation: none; background-position: 50% 50%; } }/* End custom CSS */ /* Start custom CSS for icon-list, class: .elementor-element-489bfc9 *//* ========================================== LISTA ICONE PREMIUM Non modifica il font ========================================== */ .elementor-13 .elementor-element.elementor-element-489bfc9 .elementor-icon-list-items { display: flex; flex-direction: column; gap: 10px; } /* Singolo elemento */ .elementor-13 .elementor-element.elementor-element-489bfc9 .elementor-icon-list-item { position: relative; overflow: hidden; margin: 0 !important; padding: 12px 15px !important; border: 1px solid rgba(255, 255, 255, 0.09); border-radius: 13px; background: linear-gradient( 105deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.018) ); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.045), 0 8px 22px rgba(0, 0, 0, 0.16); transition: border-color 0.5s ease, background 0.5s ease, box-shadow 0.5s ease; } /* Luce rossa laterale */ .elementor-13 .elementor-element.elementor-element-489bfc9 .elementor-icon-list-item::before { content: ""; position: absolute; top: 18%; left: 0; width: 2px; height: 64%; border-radius: 5px; background: linear-gradient( 180deg, transparent, #FF3558, #730018, transparent ); opacity: 0.45; transition: opacity 0.5s ease, height 0.5s ease; } /* Cerchio rosso dell’icona */ .elementor-13 .elementor-element.elementor-element-489bfc9 .elementor-icon-list-icon { position: relative; z-index: 2; display: inline-flex !important; align-items: center; justify-content: center; flex: 0 0 26px; width: 26px; height: 26px; border-radius: 50%; background: linear-gradient( 145deg, #FF3558, #8E001F ); box-shadow: 0 0 0 3px rgba(200, 16, 46, 0.11), 0 6px 14px rgba(0, 0, 0, 0.30); } /* Icona interna bianca */ .elementor-13 .elementor-element.elementor-element-489bfc9 .elementor-icon-list-icon i, .elementor-13 .elementor-element.elementor-element-489bfc9 .elementor-icon-list-icon svg { color: #FFFFFF !important; fill: #FFFFFF !important; } /* Testo */ .elementor-13 .elementor-element.elementor-element-489bfc9 .elementor-icon-list-text { position: relative; z-index: 2; color: rgba(255, 255, 255, 0.92) !important; } /* Hover elemento */ .elementor-13 .elementor-element.elementor-element-489bfc9 .elementor-icon-list-item:hover { border-color: rgba(255, 53, 88, 0.42); background: linear-gradient( 105deg, rgba(200, 16, 46, 0.20), rgba(255, 255, 255, 0.025) ); box-shadow: inset 3px 0 0 rgba(255, 53, 88, 0.85), 0 12px 28px rgba(0, 0, 0, 0.24), 0 0 20px rgba(200, 16, 46, 0.08); } .elementor-13 .elementor-element.elementor-element-489bfc9 .elementor-icon-list-item:hover::before { height: 82%; opacity: 1; } /* Smartphone */ @media (max-width: 767px) { .elementor-13 .elementor-element.elementor-element-489bfc9 .elementor-icon-list-items { gap: 8px; } .elementor-13 .elementor-element.elementor-element-489bfc9 .elementor-icon-list-item { padding: 11px 12px !important; border-radius: 11px; } .elementor-13 .elementor-element.elementor-element-489bfc9 .elementor-icon-list-icon { flex-basis: 24px; width: 24px; height: 24px; } }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-d08195b *//* ================================================== PULSANTE PRINCIPALE ANDREA AGNELLI EFFETTO ORIGINALE + COLORI BLOCCATI ================================================== */ .elementor-13 .elementor-element.elementor-element-d08195b .elementor-button { position: relative; isolation: isolate; overflow: hidden; /* COLORI BLOCCATI - STATO INIZIALE */ color: #ffffff !important; background-color: #B11226 !important; border-color: #B11226 !important; box-shadow: 0 10px 25px rgba(177, 18, 38, 0.22), inset 0 0 0 1px rgba(255, 255, 255, 0.10); transition: color 1.1s ease, transform 0.65s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.65s ease, border-color 0.8s ease; } /* ================================================== TESTO SEMPRE SOPRA ALL’ANIMAZIONE ================================================== */ .elementor-13 .elementor-element.elementor-element-d08195b .elementor-button-content-wrapper { position: relative; z-index: 5; } /* COLORE TESTO BLOCCATO */ .elementor-13 .elementor-element.elementor-element-d08195b .elementor-button-text { color: #ffffff !important; transition: color 1.1s ease; } /* ================================================== PASSAGGIO DAL ROSSO AL BIANCO IDENTICO ALL'ORIGINALE ================================================== */ .elementor-13 .elementor-element.elementor-element-d08195b .elementor-button::before { content: ""; position: absolute; inset: 0; z-index: 2; border-radius: inherit; background: linear-gradient( to bottom, #ffffff 0%, #ffffff calc(100% - 7px), rgba(177, 18, 38, 0.15) calc(100% - 7px), rgba(177, 18, 38, 0.15) calc(100% - 5px), #ffffff calc(100% - 5px) ); transform: scaleX(0); transform-origin: left center; transition: transform 0.7s ease; } /* ================================================== FORBICI COMPLETE IN UN UNICO SVG ================================================== */ .elementor-13 .elementor-element.elementor-element-d08195b .elementor-button::after { content: ""; position: absolute; z-index: 7; width: 31px; height: 31px; left: 8px; bottom: -1px; /* BIANCHE SUL ROSSO */ background-color: #ffffff; -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 3.5c-.614-.884-.074-1.962.858-2.5L8 7.226 11.642 1c.932.538 1.472 1.616.858 2.5L8.81 8.61l1.556 2.661a2.5 2.5 0 1 1-.794.637L8 9.73l-1.572 2.177a2.5 2.5 0 1 1-.794-.637L7.19 8.61zm2.5 10a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0m7 0a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0'/%3E%3C/svg%3E"); -webkit-mask-repeat: no-repeat; -webkit-mask-position: center; -webkit-mask-size: contain; mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 3.5c-.614-.884-.074-1.962.858-2.5L8 7.226 11.642 1c.932.538 1.472 1.616.858 2.5L8.81 8.61l1.556 2.661a2.5 2.5 0 1 1-.794.637L8 9.73l-1.572 2.177a2.5 2.5 0 1 1-.794-.637L7.19 8.61zm2.5 10a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0m7 0a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0'/%3E%3C/svg%3E"); mask-repeat: no-repeat; mask-position: center; mask-size: contain; opacity: 0; pointer-events: none; filter: drop-shadow(0 2px 2px rgba(0, 0, 0, 0.14)); transition: opacity 0.35s ease, filter 0.35s ease; } /* ================================================== HOVER ================================================== */ .elementor-13 .elementor-element.elementor-element-d08195b .elementor-button:hover { /* NON CAMBIAMO LO SFONDO QUI: IL BIANCO DEVE ENTRARE CON L'ANIMAZIONE */ color: #111111 !important; border-color: #ffffff !important; transform: translateY(-2px); box-shadow: 0 16px 34px rgba(0, 0, 0, 0.18), 0 0 0 1px rgba(177, 18, 38, 0.10); } /* TESTO DA BIANCO A NERO IN MODO FLUIDO */ .elementor-13 .elementor-element.elementor-element-d08195b .elementor-button:hover .elementor-button-text { color: #111111 !important; } /* ================================================== PASSAGGIO BIANCO FLUIDO ================================================== */ .elementor-13 .elementor-element.elementor-element-d08195b .elementor-button:hover::before { animation: aa-passaggio-bianco 1.6s cubic-bezier(0.45, 0, 0.15, 1) forwards; } /* ================================================== SCORRIMENTO DELLE FORBICI ================================================== */ .elementor-13 .elementor-element.elementor-element-d08195b .elementor-button:hover::after { animation: aa-forbici-bicolore 1.6s cubic-bezier(0.45, 0, 0.15, 1) forwards; } /* ================================================== ANIMAZIONE DELLO SFONDO ================================================== */ @keyframes aa-passaggio-bianco { 0% { transform: scaleX(0); } 100% { transform: scaleX(1); } } /* ================================================== ANIMAZIONE FLUIDA DELLE FORBICI ================================================== */ @keyframes aa-forbici-bicolore { 0% { left: 8px; opacity: 0; background-color: #ffffff; transform: rotate(90deg) scale(0.92); filter: blur(0.8px) drop-shadow(0 2px 2px rgba(0, 0, 0, 0.12)); } /* COMPARSA MORBIDA SUL ROSSO */ 10% { opacity: 1; background-color: #ffffff; transform: rotate(90deg) scale(1); filter: blur(0) drop-shadow(0 2px 2px rgba(0, 0, 0, 0.14)); } /* ANCORA BIANCHE */ 22% { opacity: 1; background-color: #ffffff; } /* PASSAGGIO GRADUALE AL ROSSO */ 42% { opacity: 1; background-color: #B11226; } /* MOVIMENTO CENTRALE */ 78% { opacity: 1; background-color: #B11226; transform: rotate(90deg) scale(1); filter: blur(0) drop-shadow(0 2px 2px rgba(0, 0, 0, 0.14)); } /* INIZIO DISSOLVENZA */ 90% { left: calc(100% - 48px); opacity: 0.55; background-color: #B11226; transform: rotate(90deg) scale(0.97); filter: blur(0.3px) drop-shadow(0 2px 2px rgba(0, 0, 0, 0.10)); } /* SCOMPARSA PRIMA DEL BORDO */ 100% { left: calc(100% - 37px); opacity: 0; background-color: #B11226; transform: rotate(90deg) scale(0.90); filter: blur(1.4px); } } /* ================================================== TELEFONO ================================================== */ @media (max-width: 767px) { .elementor-13 .elementor-element.elementor-element-d08195b .elementor-button::after { width: 27px; height: 27px; bottom: 0; } } /* ================================================== RIDUZIONE MOVIMENTO SE RICHIESTA ================================================== */ @media (prefers-reduced-motion: reduce) { .elementor-13 .elementor-element.elementor-element-d08195b .elementor-button, .elementor-13 .elementor-element.elementor-element-d08195b .elementor-button::before, .elementor-13 .elementor-element.elementor-element-d08195b .elementor-button::after, .elementor-13 .elementor-element.elementor-element-d08195b .elementor-button-text { animation: none !important; transition-duration: 0.2s; } }/* End custom CSS */ /* Start custom CSS for icon-box, class: .elementor-element-80ca850 *//* ========================================== RIQUADRO ICONA SU SFONDO BIANCO Non modifica il font ========================================== */ .elementor-13 .elementor-element.elementor-element-80ca850 .elementor-icon-box-wrapper { position: relative; display: inline-flex; align-items: center; width: auto; padding: 10px 17px; border: 1px solid rgba(200, 16, 46, 0.35); border-radius: 999px; background: linear-gradient( 115deg, rgba(200, 16, 46, 0.09), rgba(255, 255, 255, 0.98), rgba(115, 0, 24, 0.07) ); box-shadow: 0 10px 28px rgba(20, 20, 20, 0.10), inset 0 1px 0 rgba(255, 255, 255, 0.95), 0 0 20px rgba(200, 16, 46, 0.07); overflow: hidden; transition: border-color 0.5s ease, background 0.5s ease, box-shadow 0.5s ease; } /* Riflesso satinato */ .elementor-13 .elementor-element.elementor-element-80ca850 .elementor-icon-box-wrapper::before { content: ""; position: absolute; top: 0; left: -75%; width: 45%; height: 100%; background: linear-gradient( 90deg, transparent, rgba(255, 255, 255, 0.90), rgba(255, 53, 88, 0.18), transparent ); transform: skewX(-18deg); animation: agnelli-icon-light-section 6s ease-in-out infinite; pointer-events: none; } /* Icona */ .elementor-13 .elementor-element.elementor-element-80ca850 .elementor-icon-box-icon { position: relative; z-index: 2; margin-bottom: 0 !important; } .elementor-13 .elementor-element.elementor-element-80ca850 .elementor-icon { color: #C8102E !important; filter: drop-shadow(0 0 4px rgba(200, 16, 46, 0.25)); } /* Contenuto */ .elementor-13 .elementor-element.elementor-element-80ca850 .elementor-icon-box-content { position: relative; z-index: 2; } /* Testo nero */ .elementor-13 .elementor-element.elementor-element-80ca850 .elementor-icon-box-title, .elementor-13 .elementor-element.elementor-element-80ca850 .elementor-icon-box-title a { color: #111111 !important; margin: 0 !important; } /* Hover */ .elementor-13 .elementor-element.elementor-element-80ca850 .elementor-icon-box-wrapper:hover { border-color: #C8102E; background: linear-gradient( 115deg, rgba(200, 16, 46, 0.16), #FFFFFF, rgba(255, 53, 88, 0.11) ); box-shadow: 0 14px 34px rgba(20, 20, 20, 0.14), inset 0 1px 0 rgba(255, 255, 255, 1), 0 0 24px rgba(200, 16, 46, 0.15); } /* Durante il passaggio il testo diventa bordeaux */ .elementor-13 .elementor-element.elementor-element-80ca850 .elementor-icon-box-wrapper:hover .elementor-icon-box-title, .elementor-13 .elementor-element.elementor-element-80ca850 .elementor-icon-box-wrapper:hover .elementor-icon-box-title a { color: #730018 !important; } /* Animazione del riflesso */ @keyframes agnelli-icon-light-section { 0%, 25% { left: -75%; opacity: 0; } 35% { opacity: 1; } 65% { left: 135%; opacity: 1; } 75%, 100% { left: 135%; opacity: 0; } } /* Smartphone */ @media (max-width: 767px) { .elementor-13 .elementor-element.elementor-element-80ca850 .elementor-icon-box-wrapper { padding: 9px 14px; } } /* Riduzione animazioni */ @media (prefers-reduced-motion: reduce) { .elementor-13 .elementor-element.elementor-element-80ca850 .elementor-icon-box-wrapper::before { animation: none; } }/* End custom CSS */ /* Start custom CSS for heading, class: .elementor-element-a8bf121 *//* ========================================== TITOLI H2 SU SFONDO BIANCO Riflesso rosso e bordeaux satinato Non modifica font, peso o dimensioni ========================================== */ .elementor-13 .elementor-element.elementor-element-a8bf121 .elementor-heading-title { display: inline-block; color: #111111; background-image: linear-gradient( 105deg, #111111 0%, #111111 22%, #2B2B2B 34%, #C8102E 44%, #730018 52%, #E32646 60%, #2B2B2B 70%, #111111 82%, #111111 100% ); background-size: 280% 100%; background-position: 0% 50%; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; animation: agnelli-h2-light 11s ease-in-out infinite alternate; will-change: background-position; } .elementor-13 .elementor-element.elementor-element-a8bf121 .elementor-heading-title a { color: inherit; -webkit-text-fill-color: inherit; } @keyframes agnelli-h2-light { 0% { background-position: 0% 50%; } 20% { background-position: 0% 50%; } 80% { background-position: 100% 50%; } 100% { background-position: 100% 50%; } } @media (prefers-reduced-motion: reduce) { .elementor-13 .elementor-element.elementor-element-a8bf121 .elementor-heading-title { animation: none; background-position: 50% 50%; } }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-06de91d *//* ===================================================== GRID SERVIZI – CARD PREMIUM ANDREA AGNELLI Applicare soltanto al contenitore Grid Non modifica i font ===================================================== */ .elementor-13 .elementor-element.elementor-element-06de91d { position: relative; isolation: isolate; counter-reset: servizio; gap: 18px !important; } /* Gap se il Grid utilizza un contenitore interno */ .elementor-13 .elementor-element.elementor-element-06de91d > .e-con-inner { gap: 18px !important; } /* ===================================================== SINGOLE CARD ===================================================== */ .elementor-13 .elementor-element.elementor-element-06de91d > .e-con, .elementor-13 .elementor-element.elementor-element-06de91d > .e-con-inner > .e-con { position: relative; isolation: isolate; overflow: hidden; height: 100%; padding: 25px 22px 20px !important; border: 1px solid rgba(255, 255, 255, 0.10); border-radius: 22px; background: radial-gradient( circle at 100% 0%, rgba(200, 16, 46, 0.18), transparent 38% ), linear-gradient( 145deg, #18181C 0%, #0B0B0E 62%, #070709 100% ) !important; box-shadow: 0 18px 42px rgba(15, 15, 18, 0.20), inset 0 1px 0 rgba(255, 255, 255, 0.08), inset 0 -25px 50px rgba(0, 0, 0, 0.16); transition: border-color 0.55s ease, box-shadow 0.55s ease, background 0.55s ease; } /* Mantiene i contenuti sopra gli effetti */ .elementor-13 .elementor-element.elementor-element-06de91d > .e-con > *, .elementor-13 .elementor-element.elementor-element-06de91d > .e-con-inner > .e-con > * { position: relative; z-index: 2; } /* Linea luminosa nella parte superiore */ .elementor-13 .elementor-element.elementor-element-06de91d > .e-con::before, .elementor-13 .elementor-element.elementor-element-06de91d > .e-con-inner > .e-con::before { content: ""; position: absolute; z-index: 1; top: 0; left: 12%; width: 76%; height: 2px; background: linear-gradient( 90deg, transparent, #730018, #FF3558, transparent ); opacity: 0.58; box-shadow: 0 0 13px rgba(255, 53, 88, 0.38); transition: width 0.55s ease, left 0.55s ease, opacity 0.55s ease; } /* ===================================================== NUMERO DECORATIVO 01, 02, 03, 04 ORA BIANCO ===================================================== */ .elementor-13 .elementor-element.elementor-element-06de91d > .e-con, .elementor-13 .elementor-element.elementor-element-06de91d > .e-con-inner > .e-con { counter-increment: servizio; } .elementor-13 .elementor-element.elementor-element-06de91d > .e-con::after, .elementor-13 .elementor-element.elementor-element-06de91d > .e-con-inner > .e-con::after { content: "0" counter(servizio); position: absolute; z-index: 1; top: 17px; right: 18px; color: rgba(255, 255, 255, 0.88); font-size: 34px; font-weight: 700; line-height: 1; transition: color 0.5s ease, opacity 0.5s ease; } /* ===================================================== ICONE ===================================================== */ .elementor-13 .elementor-element.elementor-element-06de91d .elementor-widget-icon .elementor-icon { display: inline-flex; align-items: center; justify-content: center; padding: 9px; border: 1px solid rgba(255, 53, 88, 0.32); border-radius: 12px; color: #FF3558 !important; background: linear-gradient( 145deg, rgba(200, 16, 46, 0.19), rgba(255, 255, 255, 0.035) ); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 8px 20px rgba(0, 0, 0, 0.24), 0 0 15px rgba(200, 16, 46, 0.10); transition: color 0.5s ease, border-color 0.5s ease, background 0.5s ease, box-shadow 0.5s ease; } .elementor-13 .elementor-element.elementor-element-06de91d .elementor-widget-icon svg { fill: currentColor !important; } /* ===================================================== TITOLI E TESTI ===================================================== */ .elementor-13 .elementor-element.elementor-element-06de91d .elementor-heading-title { color: #FFFFFF !important; } .elementor-13 .elementor-element.elementor-element-06de91d .elementor-widget-text-editor, .elementor-13 .elementor-element.elementor-element-06de91d .elementor-widget-text-editor p { color: rgba(255, 255, 255, 0.70) !important; line-height: 1.60; } /* ===================================================== IMMAGINI DELLE CARD ===================================================== */ .elementor-13 .elementor-element.elementor-element-06de91d .elementor-widget-image .elementor-widget-container { position: relative; overflow: hidden; border: 1px solid rgba(255, 255, 255, 0.10); border-radius: 15px; box-shadow: 0 13px 28px rgba(0, 0, 0, 0.32), inset 0 1px 0 rgba(255, 255, 255, 0.08); transition: border-color 0.55s ease, box-shadow 0.55s ease; } /* Leggera sfumatura sopra la fotografia */ .elementor-13 .elementor-element.elementor-element-06de91d .elementor-widget-image .elementor-widget-container::after { content: ""; position: absolute; inset: 0; background: linear-gradient( 180deg, transparent 52%, rgba(0, 0, 0, 0.30) 100% ), linear-gradient( 120deg, rgba(200, 16, 46, 0.08), transparent 45% ); pointer-events: none; } /* Immagini uniformi e nitide */ .elementor-13 .elementor-element.elementor-element-06de91d .elementor-widget-image img { display: block; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; border-radius: 14px; opacity: 1 !important; image-rendering: auto; image-rendering: -webkit-optimize-contrast; filter: brightness(1.02) contrast(1.08) saturate(1.04); transition: transform 0.9s cubic-bezier(0.22, 1, 0.36, 1), filter 0.7s ease; } /* ===================================================== HOVER DELLA CARD ===================================================== */ .elementor-13 .elementor-element.elementor-element-06de91d > .e-con:hover, .elementor-13 .elementor-element.elementor-element-06de91d > .e-con-inner > .e-con:hover { border-color: rgba(255, 53, 88, 0.52); background: radial-gradient( circle at 100% 0%, rgba(255, 53, 88, 0.25), transparent 43% ), linear-gradient( 145deg, #211317 0%, #0D0B0E 58%, #070709 100% ) !important; box-shadow: 0 24px 54px rgba(15, 15, 18, 0.30), 0 0 28px rgba(200, 16, 46, 0.15), inset 0 1px 0 rgba(255, 255, 255, 0.12); } /* Linea rossa completa in hover */ .elementor-13 .elementor-element.elementor-element-06de91d > .e-con:hover::before, .elementor-13 .elementor-element.elementor-element-06de91d > .e-con-inner > .e-con:hover::before { left: 0; width: 100%; opacity: 1; } /* Numero resta bianco anche in hover */ .elementor-13 .elementor-element.elementor-element-06de91d > .e-con:hover::after, .elementor-13 .elementor-element.elementor-element-06de91d > .e-con-inner > .e-con:hover::after { color: rgba(255, 255, 255, 1); } /* Icona più luminosa */ .elementor-13 .elementor-element.elementor-element-06de91d > .e-con:hover .elementor-widget-icon .elementor-icon, .elementor-13 .elementor-element.elementor-element-06de91d > .e-con-inner > .e-con:hover .elementor-widget-icon .elementor-icon { color: #FFFFFF !important; border-color: #FF3558; background: linear-gradient( 145deg, #E12647, #730018 ); box-shadow: 0 10px 24px rgba(0, 0, 0, 0.32), 0 0 22px rgba(200, 16, 46, 0.32); } /* Fotografia */ .elementor-13 .elementor-element.elementor-element-06de91d > .e-con:hover .elementor-widget-image .elementor-widget-container, .elementor-13 .elementor-element.elementor-element-06de91d > .e-con-inner > .e-con:hover .elementor-widget-image .elementor-widget-container { border-color: rgba(255, 53, 88, 0.48); box-shadow: 0 16px 35px rgba(0, 0, 0, 0.42), 0 0 20px rgba(200, 16, 46, 0.13); } .elementor-13 .elementor-element.elementor-element-06de91d > .e-con:hover .elementor-widget-image img, .elementor-13 .elementor-element.elementor-element-06de91d > .e-con-inner > .e-con:hover .elementor-widget-image img { transform: scale(1.035); filter: brightness(1.045) contrast(1.10) saturate(1.08); } /* ===================================================== TABLET E SMARTPHONE ===================================================== */ @media (max-width: 1024px) { .elementor-13 .elementor-element.elementor-element-06de91d { gap: 15px !important; } .elementor-13 .elementor-element.elementor-element-06de91d > .e-con-inner { gap: 15px !important; } .elementor-13 .elementor-element.elementor-element-06de91d > .e-con, .elementor-13 .elementor-element.elementor-element-06de91d > .e-con-inner > .e-con { padding: 22px 19px 18px !important; border-radius: 19px; } } @media (max-width: 767px) { .elementor-13 .elementor-element.elementor-element-06de91d { gap: 13px !important; } .elementor-13 .elementor-element.elementor-element-06de91d > .e-con-inner { gap: 13px !important; } .elementor-13 .elementor-element.elementor-element-06de91d > .e-con, .elementor-13 .elementor-element.elementor-element-06de91d > .e-con-inner > .e-con { padding: 21px 18px 17px !important; border-radius: 17px; } .elementor-13 .elementor-element.elementor-element-06de91d > .e-con::after, .elementor-13 .elementor-element.elementor-element-06de91d > .e-con-inner > .e-con::after { font-size: 28px; top: 15px; right: 15px; } .elementor-13 .elementor-element.elementor-element-06de91d .elementor-widget-image .elementor-widget-container { border-radius: 13px; } .elementor-13 .elementor-element.elementor-element-06de91d .elementor-widget-image img { border-radius: 12px; } /* Nessuno zoom su smartphone */ .elementor-13 .elementor-element.elementor-element-06de91d > .e-con:hover .elementor-widget-image img, .elementor-13 .elementor-element.elementor-element-06de91d > .e-con-inner > .e-con:hover .elementor-widget-image img { transform: none; } } @media (prefers-reduced-motion: reduce) { .elementor-13 .elementor-element.elementor-element-06de91d *, .elementor-13 .elementor-element.elementor-element-06de91d *::before, .elementor-13 .elementor-element.elementor-element-06de91d *::after { transition: none !important; transform: none !important; } }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-38f0272 *//* ================================================== PULSANTE ANDREA AGNELLI SFONDO BIANCO - ROSSO SEMPRE VISIBILE IN PARTENZA ================================================== */ .elementor-13 .elementor-element.elementor-element-38f0272 a.elementor-button, .elementor-13 .elementor-element.elementor-element-38f0272 .elementor-button { position: relative; isolation: isolate; overflow: hidden; /* FORZA COMPLETAMENTE LO STATO INIZIALE */ background: #B11226 !important; background-color: #B11226 !important; background-image: none !important; color: #ffffff !important; border: 1px solid #B11226 !important; border-color: #B11226 !important; box-shadow: 0 10px 25px rgba(177, 18, 38, 0.22), inset 0 0 0 1px rgba(255, 255, 255, 0.10); transition: color 1.1s ease, transform 0.65s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.65s ease, border-color 0.8s ease; } /* ================================================== TESTO ================================================== */ .elementor-13 .elementor-element.elementor-element-38f0272 .elementor-button-content-wrapper { position: relative; z-index: 5; } .elementor-13 .elementor-element.elementor-element-38f0272 .elementor-button-text { position: relative; z-index: 5; color: #ffffff !important; -webkit-text-fill-color: #ffffff !important; transition: color 1.1s ease, -webkit-text-fill-color 1.1s ease; } /* ================================================== STRATO CHIARO CHE ENTRA DA SINISTRA ================================================== */ .elementor-13 .elementor-element.elementor-element-38f0272 .elementor-button::before { content: ""; position: absolute; inset: 0; z-index: 2; border-radius: inherit; background: linear-gradient( to bottom, #F7F7F7 0%, #F7F7F7 calc(100% - 7px), rgba(177, 18, 38, 0.18) calc(100% - 7px), rgba(177, 18, 38, 0.18) calc(100% - 5px), #F7F7F7 calc(100% - 5px) ); transform: scaleX(0); transform-origin: left center; transition: transform 0.7s ease; } /* ================================================== FORBICI ================================================== */ .elementor-13 .elementor-element.elementor-element-38f0272 .elementor-button::after { content: ""; position: absolute; z-index: 7; width: 31px; height: 31px; left: 8px; bottom: -1px; background-color: #ffffff; -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 3.5c-.614-.884-.074-1.962.858-2.5L8 7.226 11.642 1c.932.538 1.472 1.616.858 2.5L8.81 8.61l1.556 2.661a2.5 2.5 0 1 1-.794.637L8 9.73l-1.572 2.177a2.5 2.5 0 1 1-.794-.637L7.19 8.61zm2.5 10a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0m7 0a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0'/%3E%3C/svg%3E"); -webkit-mask-repeat: no-repeat; -webkit-mask-position: center; -webkit-mask-size: contain; mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 3.5c-.614-.884-.074-1.962.858-2.5L8 7.226 11.642 1c.932.538 1.472 1.616.858 2.5L8.81 8.61l1.556 2.661a2.5 2.5 0 1 1-.794.637L8 9.73l-1.572 2.177a2.5 2.5 0 1 1-.794-.637L7.19 8.61zm2.5 10a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0m7 0a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0'/%3E%3C/svg%3E"); mask-repeat: no-repeat; mask-position: center; mask-size: contain; opacity: 0; pointer-events: none; filter: drop-shadow(0 2px 2px rgba(0, 0, 0, 0.14)); transition: opacity 0.35s ease, filter 0.35s ease; } /* ================================================== HOVER ================================================== */ .elementor-13 .elementor-element.elementor-element-38f0272 a.elementor-button:hover, .elementor-13 .elementor-element.elementor-element-38f0272 .elementor-button:hover { /* NON METTIAMO background bianco QUI. Deve essere lo ::before ad avanzare gradualmente. */ color: #111111 !important; border-color: #B11226 !important; transform: translateY(-2px); box-shadow: 0 16px 34px rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(177, 18, 38, 0.14); } /* TESTO NERO IN HOVER */ .elementor-13 .elementor-element.elementor-element-38f0272 .elementor-button:hover .elementor-button-text { color: #111111 !important; -webkit-text-fill-color: #111111 !important; } /* ================================================== PASSAGGIO CHIARO FLUIDO ================================================== */ .elementor-13 .elementor-element.elementor-element-38f0272 .elementor-button:hover::before { animation: aa-passaggio-chiaro 1.6s cubic-bezier(0.45, 0, 0.15, 1) forwards; } /* ================================================== FORBICI ================================================== */ .elementor-13 .elementor-element.elementor-element-38f0272 .elementor-button:hover::after { animation: aa-forbici-chiaro 1.6s cubic-bezier(0.45, 0, 0.15, 1) forwards; } /* ================================================== ANIMAZIONE SFONDO ================================================== */ @keyframes aa-passaggio-chiaro { 0% { transform: scaleX(0); } 100% { transform: scaleX(1); } } /* ================================================== ANIMAZIONE FORBICI ================================================== */ @keyframes aa-forbici-chiaro { 0% { left: 8px; opacity: 0; background-color: #ffffff; transform: rotate(90deg) scale(0.92); filter: blur(0.8px) drop-shadow(0 2px 2px rgba(0, 0, 0, 0.12)); } 10% { opacity: 1; background-color: #ffffff; transform: rotate(90deg) scale(1); filter: blur(0) drop-shadow(0 2px 2px rgba(0, 0, 0, 0.14)); } 22% { opacity: 1; background-color: #ffffff; } /* DIVENTANO ROSSE SULLA PARTE CHIARA */ 42% { opacity: 1; background-color: #B11226; } 78% { opacity: 1; background-color: #B11226; transform: rotate(90deg) scale(1); filter: blur(0) drop-shadow(0 2px 2px rgba(0, 0, 0, 0.14)); } 90% { left: calc(100% - 48px); opacity: 0.55; background-color: #B11226; transform: rotate(90deg) scale(0.97); filter: blur(0.3px) drop-shadow(0 2px 2px rgba(0, 0, 0, 0.10)); } 100% { left: calc(100% - 37px); opacity: 0; background-color: #B11226; transform: rotate(90deg) scale(0.90); filter: blur(1.4px); } } /* ================================================== MOBILE ================================================== */ @media (max-width: 767px) { .elementor-13 .elementor-element.elementor-element-38f0272 .elementor-button::after { width: 27px; height: 27px; bottom: 0; } } /* ================================================== RIDUZIONE MOVIMENTO ================================================== */ @media (prefers-reduced-motion: reduce) { .elementor-13 .elementor-element.elementor-element-38f0272 .elementor-button, .elementor-13 .elementor-element.elementor-element-38f0272 .elementor-button::before, .elementor-13 .elementor-element.elementor-element-38f0272 .elementor-button::after, .elementor-13 .elementor-element.elementor-element-38f0272 .elementor-button-text { animation: none !important; transition-duration: 0.2s; } }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-94f67b1 *//* ================================================== PULSANTE ANDREA AGNELLI SFONDO BIANCO - ROSSO SEMPRE VISIBILE IN PARTENZA ================================================== */ .elementor-13 .elementor-element.elementor-element-94f67b1 a.elementor-button, .elementor-13 .elementor-element.elementor-element-94f67b1 .elementor-button { position: relative; isolation: isolate; overflow: hidden; /* FORZA COMPLETAMENTE LO STATO INIZIALE */ background: #B11226 !important; background-color: #B11226 !important; background-image: none !important; color: #ffffff !important; border: 1px solid #B11226 !important; border-color: #B11226 !important; box-shadow: 0 10px 25px rgba(177, 18, 38, 0.22), inset 0 0 0 1px rgba(255, 255, 255, 0.10); transition: color 1.1s ease, transform 0.65s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.65s ease, border-color 0.8s ease; } /* ================================================== TESTO ================================================== */ .elementor-13 .elementor-element.elementor-element-94f67b1 .elementor-button-content-wrapper { position: relative; z-index: 5; } .elementor-13 .elementor-element.elementor-element-94f67b1 .elementor-button-text { position: relative; z-index: 5; color: #ffffff !important; -webkit-text-fill-color: #ffffff !important; transition: color 1.1s ease, -webkit-text-fill-color 1.1s ease; } /* ================================================== STRATO CHIARO CHE ENTRA DA SINISTRA ================================================== */ .elementor-13 .elementor-element.elementor-element-94f67b1 .elementor-button::before { content: ""; position: absolute; inset: 0; z-index: 2; border-radius: inherit; background: linear-gradient( to bottom, #F7F7F7 0%, #F7F7F7 calc(100% - 7px), rgba(177, 18, 38, 0.18) calc(100% - 7px), rgba(177, 18, 38, 0.18) calc(100% - 5px), #F7F7F7 calc(100% - 5px) ); transform: scaleX(0); transform-origin: left center; transition: transform 0.7s ease; } /* ================================================== FORBICI ================================================== */ .elementor-13 .elementor-element.elementor-element-94f67b1 .elementor-button::after { content: ""; position: absolute; z-index: 7; width: 31px; height: 31px; left: 8px; bottom: -1px; background-color: #ffffff; -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 3.5c-.614-.884-.074-1.962.858-2.5L8 7.226 11.642 1c.932.538 1.472 1.616.858 2.5L8.81 8.61l1.556 2.661a2.5 2.5 0 1 1-.794.637L8 9.73l-1.572 2.177a2.5 2.5 0 1 1-.794-.637L7.19 8.61zm2.5 10a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0m7 0a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0'/%3E%3C/svg%3E"); -webkit-mask-repeat: no-repeat; -webkit-mask-position: center; -webkit-mask-size: contain; mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 3.5c-.614-.884-.074-1.962.858-2.5L8 7.226 11.642 1c.932.538 1.472 1.616.858 2.5L8.81 8.61l1.556 2.661a2.5 2.5 0 1 1-.794.637L8 9.73l-1.572 2.177a2.5 2.5 0 1 1-.794-.637L7.19 8.61zm2.5 10a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0m7 0a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0'/%3E%3C/svg%3E"); mask-repeat: no-repeat; mask-position: center; mask-size: contain; opacity: 0; pointer-events: none; filter: drop-shadow(0 2px 2px rgba(0, 0, 0, 0.14)); transition: opacity 0.35s ease, filter 0.35s ease; } /* ================================================== HOVER ================================================== */ .elementor-13 .elementor-element.elementor-element-94f67b1 a.elementor-button:hover, .elementor-13 .elementor-element.elementor-element-94f67b1 .elementor-button:hover { /* NON METTIAMO background bianco QUI. Deve essere lo ::before ad avanzare gradualmente. */ color: #111111 !important; border-color: #B11226 !important; transform: translateY(-2px); box-shadow: 0 16px 34px rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(177, 18, 38, 0.14); } /* TESTO NERO IN HOVER */ .elementor-13 .elementor-element.elementor-element-94f67b1 .elementor-button:hover .elementor-button-text { color: #111111 !important; -webkit-text-fill-color: #111111 !important; } /* ================================================== PASSAGGIO CHIARO FLUIDO ================================================== */ .elementor-13 .elementor-element.elementor-element-94f67b1 .elementor-button:hover::before { animation: aa-passaggio-chiaro 1.6s cubic-bezier(0.45, 0, 0.15, 1) forwards; } /* ================================================== FORBICI ================================================== */ .elementor-13 .elementor-element.elementor-element-94f67b1 .elementor-button:hover::after { animation: aa-forbici-chiaro 1.6s cubic-bezier(0.45, 0, 0.15, 1) forwards; } /* ================================================== ANIMAZIONE SFONDO ================================================== */ @keyframes aa-passaggio-chiaro { 0% { transform: scaleX(0); } 100% { transform: scaleX(1); } } /* ================================================== ANIMAZIONE FORBICI ================================================== */ @keyframes aa-forbici-chiaro { 0% { left: 8px; opacity: 0; background-color: #ffffff; transform: rotate(90deg) scale(0.92); filter: blur(0.8px) drop-shadow(0 2px 2px rgba(0, 0, 0, 0.12)); } 10% { opacity: 1; background-color: #ffffff; transform: rotate(90deg) scale(1); filter: blur(0) drop-shadow(0 2px 2px rgba(0, 0, 0, 0.14)); } 22% { opacity: 1; background-color: #ffffff; } /* DIVENTANO ROSSE SULLA PARTE CHIARA */ 42% { opacity: 1; background-color: #B11226; } 78% { opacity: 1; background-color: #B11226; transform: rotate(90deg) scale(1); filter: blur(0) drop-shadow(0 2px 2px rgba(0, 0, 0, 0.14)); } 90% { left: calc(100% - 48px); opacity: 0.55; background-color: #B11226; transform: rotate(90deg) scale(0.97); filter: blur(0.3px) drop-shadow(0 2px 2px rgba(0, 0, 0, 0.10)); } 100% { left: calc(100% - 37px); opacity: 0; background-color: #B11226; transform: rotate(90deg) scale(0.90); filter: blur(1.4px); } } /* ================================================== MOBILE ================================================== */ @media (max-width: 767px) { .elementor-13 .elementor-element.elementor-element-94f67b1 .elementor-button::after { width: 27px; height: 27px; bottom: 0; } } /* ================================================== RIDUZIONE MOVIMENTO ================================================== */ @media (prefers-reduced-motion: reduce) { .elementor-13 .elementor-element.elementor-element-94f67b1 .elementor-button, .elementor-13 .elementor-element.elementor-element-94f67b1 .elementor-button::before, .elementor-13 .elementor-element.elementor-element-94f67b1 .elementor-button::after, .elementor-13 .elementor-element.elementor-element-94f67b1 .elementor-button-text { animation: none !important; transition-duration: 0.2s; } }/* End custom CSS */ /* Start custom CSS for icon-box, class: .elementor-element-8f2abce *//* ========================================== RIQUADRO ICONA – ABOUT US Non modifica il font ========================================== */ .elementor-13 .elementor-element.elementor-element-8f2abce .elementor-icon-box-wrapper { position: relative; display: inline-flex; align-items: center; width: auto; padding: 10px 17px; border: 1px solid rgba(255, 53, 88, 0.42); border-radius: 999px; background: linear-gradient( 115deg, rgba(200, 16, 46, 0.18), rgba(255, 255, 255, 0.045), rgba(115, 0, 24, 0.15) ); box-shadow: 0 10px 30px rgba(0, 0, 0, 0.30), inset 0 1px 0 rgba(255, 255, 255, 0.12), 0 0 18px rgba(200, 16, 46, 0.10); overflow: hidden; transition: border-color 0.5s ease, background 0.5s ease, box-shadow 0.5s ease; } /* Riflesso luminoso */ .elementor-13 .elementor-element.elementor-element-8f2abce .elementor-icon-box-wrapper::before { content: ""; position: absolute; top: 0; left: -75%; width: 45%; height: 100%; background: linear-gradient( 90deg, transparent, rgba(255, 255, 255, 0.20), rgba(255, 53, 88, 0.14), transparent ); transform: skewX(-18deg); animation: agnelli-about-light 6s ease-in-out infinite; pointer-events: none; } /* Icona */ .elementor-13 .elementor-element.elementor-element-8f2abce .elementor-icon-box-icon { position: relative; z-index: 2; margin-bottom: 0 !important; } .elementor-13 .elementor-element.elementor-element-8f2abce .elementor-icon { color: #FF3558 !important; filter: drop-shadow(0 0 5px rgba(255, 53, 88, 0.50)); } /* Testo */ .elementor-13 .elementor-element.elementor-element-8f2abce .elementor-icon-box-content { position: relative; z-index: 2; } .elementor-13 .elementor-element.elementor-element-8f2abce .elementor-icon-box-title, .elementor-13 .elementor-element.elementor-element-8f2abce .elementor-icon-box-title a { color: #FFFFFF !important; margin: 0 !important; } /* Hover */ .elementor-13 .elementor-element.elementor-element-8f2abce .elementor-icon-box-wrapper:hover { border-color: #FF3558; background: linear-gradient( 115deg, rgba(200, 16, 46, 0.30), rgba(255, 255, 255, 0.06), rgba(115, 0, 24, 0.22) ); box-shadow: 0 14px 35px rgba(0, 0, 0, 0.38), inset 0 1px 0 rgba(255, 255, 255, 0.16), 0 0 25px rgba(200, 16, 46, 0.22); } @keyframes agnelli-about-light { 0%, 25% { left: -75%; opacity: 0; } 35% { opacity: 1; } 65% { left: 135%; opacity: 1; } 75%, 100% { left: 135%; opacity: 0; } } @media (prefers-reduced-motion: reduce) { .elementor-13 .elementor-element.elementor-element-8f2abce .elementor-icon-box-wrapper::before { animation: none; } }/* End custom CSS */ /* Start custom CSS for heading, class: .elementor-element-346d282 *//* ========================================== TITOLI H2 SU SFONDO NERO Riflesso rosso lento e satinato Non modifica font, peso o dimensioni ========================================== */ .elementor-13 .elementor-element.elementor-element-346d282 .elementor-heading-title { display: inline-block; color: #FFFFFF; background-image: linear-gradient( 105deg, #FFFFFF 0%, #FFFFFF 22%, #E8E8E8 34%, #FF3558 44%, #C8102E 52%, #FF3558 60%, #E8E8E8 70%, #FFFFFF 82%, #FFFFFF 100% ); background-size: 280% 100%; background-position: 0% 50%; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; animation: agnelli-h2-dark 11s ease-in-out infinite alternate; will-change: background-position; } .elementor-13 .elementor-element.elementor-element-346d282 .elementor-heading-title a { color: inherit; -webkit-text-fill-color: inherit; } @keyframes agnelli-h2-dark { 0% { background-position: 0% 50%; } 20% { background-position: 0% 50%; } 80% { background-position: 100% 50%; } 100% { background-position: 100% 50%; } } @media (prefers-reduced-motion: reduce) { .elementor-13 .elementor-element.elementor-element-346d282 .elementor-heading-title { animation: none; background-position: 50% 50%; } }/* End custom CSS */ /* Start custom CSS for icon-box, class: .elementor-element-624cef0 *//* ========================================== RIQUADRO ICONA PREMIUM SU SFONDO NERO Non modifica il font ========================================== */ .elementor-13 .elementor-element.elementor-element-624cef0 .elementor-icon-box-wrapper { position: relative; overflow: hidden; padding: 19px 21px; border: 1px solid rgba(255, 255, 255, 0.07); border-left: 2px solid rgba(200, 16, 46, 0.75); border-radius: 14px; background: radial-gradient( circle at 0% 0%, rgba(200, 16, 46, 0.13), transparent 42% ), linear-gradient( 110deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.012) ); box-shadow: 0 12px 30px rgba(0, 0, 0, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.045); transition: border-color 0.5s ease, background 0.5s ease, box-shadow 0.5s ease; } /* Bagliore interno */ .elementor-13 .elementor-element.elementor-element-624cef0 .elementor-icon-box-wrapper::before { content: ""; position: absolute; right: -80px; bottom: -100px; width: 190px; height: 190px; border-radius: 50%; background: radial-gradient( circle, rgba(200, 16, 46, 0.18), rgba(200, 16, 46, 0.04) 45%, transparent 72% ); opacity: 0.45; transition: opacity 0.5s ease; pointer-events: none; } /* Icona */ .elementor-13 .elementor-element.elementor-element-624cef0 .elementor-icon-box-icon { position: relative; z-index: 2; margin-bottom: 10px !important; } .elementor-13 .elementor-element.elementor-element-624cef0 .elementor-icon { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border: 1px solid rgba(255, 53, 88, 0.40); border-radius: 50%; color: #FFFFFF !important; background: linear-gradient( 145deg, #E32646, #730018 ); box-shadow: 0 7px 18px rgba(0, 0, 0, 0.28), 0 0 17px rgba(200, 16, 46, 0.20); transition: background 0.5s ease, box-shadow 0.5s ease; } .elementor-13 .elementor-element.elementor-element-624cef0 .elementor-icon svg { fill: currentColor !important; } /* Contenuto */ .elementor-13 .elementor-element.elementor-element-624cef0 .elementor-icon-box-content { position: relative; z-index: 2; } /* Titolo */ .elementor-13 .elementor-element.elementor-element-624cef0 .elementor-icon-box-title, .elementor-13 .elementor-element.elementor-element-624cef0 .elementor-icon-box-title a { color: #FFFFFF !important; } /* Descrizione */ .elementor-13 .elementor-element.elementor-element-624cef0 .elementor-icon-box-description { color: rgba(255, 255, 255, 0.68) !important; line-height: 1.65; } /* Hover */ .elementor-13 .elementor-element.elementor-element-624cef0 .elementor-icon-box-wrapper:hover { border-color: rgba(255, 53, 88, 0.38); border-left-color: #FF3558; background: radial-gradient( circle at 0% 0%, rgba(200, 16, 46, 0.22), transparent 48% ), linear-gradient( 110deg, rgba(255, 255, 255, 0.065), rgba(255, 255, 255, 0.018) ); box-shadow: 0 16px 36px rgba(0, 0, 0, 0.26), 0 0 22px rgba(200, 16, 46, 0.09), inset 0 1px 0 rgba(255, 255, 255, 0.075); } .elementor-13 .elementor-element.elementor-element-624cef0 .elementor-icon-box-wrapper:hover::before { opacity: 1; } .elementor-13 .elementor-element.elementor-element-624cef0 .elementor-icon-box-wrapper:hover .elementor-icon { background: linear-gradient( 145deg, #FF4964, #9E0024 ); box-shadow: 0 8px 20px rgba(0, 0, 0, 0.32), 0 0 23px rgba(200, 16, 46, 0.36); } /* Smartphone */ @media (max-width: 767px) { .elementor-13 .elementor-element.elementor-element-624cef0 .elementor-icon-box-wrapper { padding: 17px 16px; border-radius: 12px; } .elementor-13 .elementor-element.elementor-element-624cef0 .elementor-icon { width: 35px; height: 35px; } }/* End custom CSS */ /* Start custom CSS for divider, class: .elementor-element-245b142 *//* ===================================================== DIVISORE PARRUCCHIERE CON FORBICI Applicare direttamente al widget Divisore ===================================================== */ .elementor-13 .elementor-element.elementor-element-245b142 { position: relative; } .elementor-13 .elementor-element.elementor-element-245b142 .elementor-divider { padding: 23px 0 !important; } /* Linea che ricorda una ciocca di capelli */ .elementor-13 .elementor-element.elementor-element-245b142 .elementor-divider-separator { position: relative; display: block; width: 100% !important; height: 2px !important; border: 0 !important; overflow: visible; background: linear-gradient( 90deg, transparent 0%, rgba(255, 255, 255, 0.08) 8%, #730018 30%, #FF3558 48%, #FF3558 52%, #730018 70%, rgba(255, 255, 255, 0.08) 92%, transparent 100% ); background-size: 180% 100%; box-shadow: 0 0 8px rgba(200, 16, 46, 0.20); animation: agnelli-hair-line 7s ease-in-out infinite alternate; } /* Forbici complete al centro */ .elementor-13 .elementor-element.elementor-element-245b142 .elementor-divider-separator::after { content: "✂︎"; position: absolute; z-index: 3; top: 50%; left: 50%; display: flex; align-items: center; justify-content: center; width: 43px; height: 43px; border: 1px solid rgba(255, 53, 88, 0.65); border-radius: 50%; color: #FFFFFF; background: radial-gradient( circle at 35% 30%, rgba(255, 53, 88, 0.30), transparent 46% ), linear-gradient( 145deg, #17171A, #08080A ); box-shadow: 0 8px 20px rgba(0, 0, 0, 0.42), inset 0 1px 0 rgba(255, 255, 255, 0.13), 0 0 18px rgba(200, 16, 46, 0.28); font-family: Arial, sans-serif; font-size: 22px; line-height: 1; transform: translate(-50%, -50%) rotate(-8deg); animation: agnelli-scissors-breathe 4s ease-in-out infinite; transition: color 0.45s ease, border-color 0.45s ease, background 0.45s ease, box-shadow 0.45s ease, transform 0.45s ease; } /* Hover */ .elementor-13 .elementor-element.elementor-element-245b142:hover .elementor-divider-separator { box-shadow: 0 0 14px rgba(200, 16, 46, 0.38); } .elementor-13 .elementor-element.elementor-element-245b142:hover .elementor-divider-separator::after { color: #FF3558; border-color: #FF3558; background: radial-gradient( circle at 35% 30%, rgba(255, 255, 255, 0.13), transparent 46% ), linear-gradient( 145deg, #211216, #09090B ); box-shadow: 0 10px 24px rgba(0, 0, 0, 0.48), inset 0 1px 0 rgba(255, 255, 255, 0.16), 0 0 25px rgba(200, 16, 46, 0.42); transform: translate(-50%, -50%) rotate(8deg); } /* Movimento leggero della linea */ @keyframes agnelli-hair-line { 0% { background-position: 0% 50%; } 100% { background-position: 100% 50%; } } /* Respiro luminoso delle forbici */ @keyframes agnelli-scissors-breathe { 0%, 100% { box-shadow: 0 8px 20px rgba(0, 0, 0, 0.42), inset 0 1px 0 rgba(255, 255, 255, 0.13), 0 0 12px rgba(200, 16, 46, 0.18); } 50% { box-shadow: 0 8px 20px rgba(0, 0, 0, 0.42), inset 0 1px 0 rgba(255, 255, 255, 0.13), 0 0 23px rgba(200, 16, 46, 0.38); } } /* Smartphone */ @media (max-width: 767px) { .elementor-13 .elementor-element.elementor-element-245b142 .elementor-divider { padding: 19px 0 !important; } .elementor-13 .elementor-element.elementor-element-245b142 .elementor-divider-separator::after { width: 37px; height: 37px; font-size: 19px; } } @media (prefers-reduced-motion: reduce) { .elementor-13 .elementor-element.elementor-element-245b142 .elementor-divider-separator, .elementor-13 .elementor-element.elementor-element-245b142 .elementor-divider-separator::after { animation: none !important; } }/* End custom CSS */ /* Start custom CSS for icon-box, class: .elementor-element-09fdde9 *//* ========================================== RIQUADRO ICONA PREMIUM SU SFONDO NERO Non modifica il font ========================================== */ .elementor-13 .elementor-element.elementor-element-09fdde9 .elementor-icon-box-wrapper { position: relative; overflow: hidden; padding: 19px 21px; border: 1px solid rgba(255, 255, 255, 0.07); border-left: 2px solid rgba(200, 16, 46, 0.75); border-radius: 14px; background: radial-gradient( circle at 0% 0%, rgba(200, 16, 46, 0.13), transparent 42% ), linear-gradient( 110deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.012) ); box-shadow: 0 12px 30px rgba(0, 0, 0, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.045); transition: border-color 0.5s ease, background 0.5s ease, box-shadow 0.5s ease; } /* Bagliore interno */ .elementor-13 .elementor-element.elementor-element-09fdde9 .elementor-icon-box-wrapper::before { content: ""; position: absolute; right: -80px; bottom: -100px; width: 190px; height: 190px; border-radius: 50%; background: radial-gradient( circle, rgba(200, 16, 46, 0.18), rgba(200, 16, 46, 0.04) 45%, transparent 72% ); opacity: 0.45; transition: opacity 0.5s ease; pointer-events: none; } /* Icona */ .elementor-13 .elementor-element.elementor-element-09fdde9 .elementor-icon-box-icon { position: relative; z-index: 2; margin-bottom: 10px !important; } .elementor-13 .elementor-element.elementor-element-09fdde9 .elementor-icon { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border: 1px solid rgba(255, 53, 88, 0.40); border-radius: 50%; color: #FFFFFF !important; background: linear-gradient( 145deg, #E32646, #730018 ); box-shadow: 0 7px 18px rgba(0, 0, 0, 0.28), 0 0 17px rgba(200, 16, 46, 0.20); transition: background 0.5s ease, box-shadow 0.5s ease; } .elementor-13 .elementor-element.elementor-element-09fdde9 .elementor-icon svg { fill: currentColor !important; } /* Contenuto */ .elementor-13 .elementor-element.elementor-element-09fdde9 .elementor-icon-box-content { position: relative; z-index: 2; } /* Titolo */ .elementor-13 .elementor-element.elementor-element-09fdde9 .elementor-icon-box-title, .elementor-13 .elementor-element.elementor-element-09fdde9 .elementor-icon-box-title a { color: #FFFFFF !important; } /* Descrizione */ .elementor-13 .elementor-element.elementor-element-09fdde9 .elementor-icon-box-description { color: rgba(255, 255, 255, 0.68) !important; line-height: 1.65; } /* Hover */ .elementor-13 .elementor-element.elementor-element-09fdde9 .elementor-icon-box-wrapper:hover { border-color: rgba(255, 53, 88, 0.38); border-left-color: #FF3558; background: radial-gradient( circle at 0% 0%, rgba(200, 16, 46, 0.22), transparent 48% ), linear-gradient( 110deg, rgba(255, 255, 255, 0.065), rgba(255, 255, 255, 0.018) ); box-shadow: 0 16px 36px rgba(0, 0, 0, 0.26), 0 0 22px rgba(200, 16, 46, 0.09), inset 0 1px 0 rgba(255, 255, 255, 0.075); } .elementor-13 .elementor-element.elementor-element-09fdde9 .elementor-icon-box-wrapper:hover::before { opacity: 1; } .elementor-13 .elementor-element.elementor-element-09fdde9 .elementor-icon-box-wrapper:hover .elementor-icon { background: linear-gradient( 145deg, #FF4964, #9E0024 ); box-shadow: 0 8px 20px rgba(0, 0, 0, 0.32), 0 0 23px rgba(200, 16, 46, 0.36); } /* Smartphone */ @media (max-width: 767px) { .elementor-13 .elementor-element.elementor-element-09fdde9 .elementor-icon-box-wrapper { padding: 17px 16px; border-radius: 12px; } .elementor-13 .elementor-element.elementor-element-09fdde9 .elementor-icon { width: 35px; height: 35px; } }/* End custom CSS */ /* Start custom CSS for divider, class: .elementor-element-3a55c67 *//* ===================================================== DIVISORE PARRUCCHIERE CON FORBICI Applicare direttamente al widget Divisore ===================================================== */ .elementor-13 .elementor-element.elementor-element-3a55c67 { position: relative; } .elementor-13 .elementor-element.elementor-element-3a55c67 .elementor-divider { padding: 23px 0 !important; } /* Linea che ricorda una ciocca di capelli */ .elementor-13 .elementor-element.elementor-element-3a55c67 .elementor-divider-separator { position: relative; display: block; width: 100% !important; height: 2px !important; border: 0 !important; overflow: visible; background: linear-gradient( 90deg, transparent 0%, rgba(255, 255, 255, 0.08) 8%, #730018 30%, #FF3558 48%, #FF3558 52%, #730018 70%, rgba(255, 255, 255, 0.08) 92%, transparent 100% ); background-size: 180% 100%; box-shadow: 0 0 8px rgba(200, 16, 46, 0.20); animation: agnelli-hair-line 7s ease-in-out infinite alternate; } /* Forbici complete al centro */ .elementor-13 .elementor-element.elementor-element-3a55c67 .elementor-divider-separator::after { content: "✂︎"; position: absolute; z-index: 3; top: 50%; left: 50%; display: flex; align-items: center; justify-content: center; width: 43px; height: 43px; border: 1px solid rgba(255, 53, 88, 0.65); border-radius: 50%; color: #FFFFFF; background: radial-gradient( circle at 35% 30%, rgba(255, 53, 88, 0.30), transparent 46% ), linear-gradient( 145deg, #17171A, #08080A ); box-shadow: 0 8px 20px rgba(0, 0, 0, 0.42), inset 0 1px 0 rgba(255, 255, 255, 0.13), 0 0 18px rgba(200, 16, 46, 0.28); font-family: Arial, sans-serif; font-size: 22px; line-height: 1; transform: translate(-50%, -50%) rotate(-8deg); animation: agnelli-scissors-breathe 4s ease-in-out infinite; transition: color 0.45s ease, border-color 0.45s ease, background 0.45s ease, box-shadow 0.45s ease, transform 0.45s ease; } /* Hover */ .elementor-13 .elementor-element.elementor-element-3a55c67:hover .elementor-divider-separator { box-shadow: 0 0 14px rgba(200, 16, 46, 0.38); } .elementor-13 .elementor-element.elementor-element-3a55c67:hover .elementor-divider-separator::after { color: #FF3558; border-color: #FF3558; background: radial-gradient( circle at 35% 30%, rgba(255, 255, 255, 0.13), transparent 46% ), linear-gradient( 145deg, #211216, #09090B ); box-shadow: 0 10px 24px rgba(0, 0, 0, 0.48), inset 0 1px 0 rgba(255, 255, 255, 0.16), 0 0 25px rgba(200, 16, 46, 0.42); transform: translate(-50%, -50%) rotate(8deg); } /* Movimento leggero della linea */ @keyframes agnelli-hair-line { 0% { background-position: 0% 50%; } 100% { background-position: 100% 50%; } } /* Respiro luminoso delle forbici */ @keyframes agnelli-scissors-breathe { 0%, 100% { box-shadow: 0 8px 20px rgba(0, 0, 0, 0.42), inset 0 1px 0 rgba(255, 255, 255, 0.13), 0 0 12px rgba(200, 16, 46, 0.18); } 50% { box-shadow: 0 8px 20px rgba(0, 0, 0, 0.42), inset 0 1px 0 rgba(255, 255, 255, 0.13), 0 0 23px rgba(200, 16, 46, 0.38); } } /* Smartphone */ @media (max-width: 767px) { .elementor-13 .elementor-element.elementor-element-3a55c67 .elementor-divider { padding: 19px 0 !important; } .elementor-13 .elementor-element.elementor-element-3a55c67 .elementor-divider-separator::after { width: 37px; height: 37px; font-size: 19px; } } @media (prefers-reduced-motion: reduce) { .elementor-13 .elementor-element.elementor-element-3a55c67 .elementor-divider-separator, .elementor-13 .elementor-element.elementor-element-3a55c67 .elementor-divider-separator::after { animation: none !important; } }/* End custom CSS */ /* Start custom CSS for icon-box, class: .elementor-element-2c1d378 *//* ========================================== RIQUADRO ICONA PREMIUM SU SFONDO NERO Non modifica il font ========================================== */ .elementor-13 .elementor-element.elementor-element-2c1d378 .elementor-icon-box-wrapper { position: relative; overflow: hidden; padding: 19px 21px; border: 1px solid rgba(255, 255, 255, 0.07); border-left: 2px solid rgba(200, 16, 46, 0.75); border-radius: 14px; background: radial-gradient( circle at 0% 0%, rgba(200, 16, 46, 0.13), transparent 42% ), linear-gradient( 110deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.012) ); box-shadow: 0 12px 30px rgba(0, 0, 0, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.045); transition: border-color 0.5s ease, background 0.5s ease, box-shadow 0.5s ease; } /* Bagliore interno */ .elementor-13 .elementor-element.elementor-element-2c1d378 .elementor-icon-box-wrapper::before { content: ""; position: absolute; right: -80px; bottom: -100px; width: 190px; height: 190px; border-radius: 50%; background: radial-gradient( circle, rgba(200, 16, 46, 0.18), rgba(200, 16, 46, 0.04) 45%, transparent 72% ); opacity: 0.45; transition: opacity 0.5s ease; pointer-events: none; } /* Icona */ .elementor-13 .elementor-element.elementor-element-2c1d378 .elementor-icon-box-icon { position: relative; z-index: 2; margin-bottom: 10px !important; } .elementor-13 .elementor-element.elementor-element-2c1d378 .elementor-icon { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border: 1px solid rgba(255, 53, 88, 0.40); border-radius: 50%; color: #FFFFFF !important; background: linear-gradient( 145deg, #E32646, #730018 ); box-shadow: 0 7px 18px rgba(0, 0, 0, 0.28), 0 0 17px rgba(200, 16, 46, 0.20); transition: background 0.5s ease, box-shadow 0.5s ease; } .elementor-13 .elementor-element.elementor-element-2c1d378 .elementor-icon svg { fill: currentColor !important; } /* Contenuto */ .elementor-13 .elementor-element.elementor-element-2c1d378 .elementor-icon-box-content { position: relative; z-index: 2; } /* Titolo */ .elementor-13 .elementor-element.elementor-element-2c1d378 .elementor-icon-box-title, .elementor-13 .elementor-element.elementor-element-2c1d378 .elementor-icon-box-title a { color: #FFFFFF !important; } /* Descrizione */ .elementor-13 .elementor-element.elementor-element-2c1d378 .elementor-icon-box-description { color: rgba(255, 255, 255, 0.68) !important; line-height: 1.65; } /* Hover */ .elementor-13 .elementor-element.elementor-element-2c1d378 .elementor-icon-box-wrapper:hover { border-color: rgba(255, 53, 88, 0.38); border-left-color: #FF3558; background: radial-gradient( circle at 0% 0%, rgba(200, 16, 46, 0.22), transparent 48% ), linear-gradient( 110deg, rgba(255, 255, 255, 0.065), rgba(255, 255, 255, 0.018) ); box-shadow: 0 16px 36px rgba(0, 0, 0, 0.26), 0 0 22px rgba(200, 16, 46, 0.09), inset 0 1px 0 rgba(255, 255, 255, 0.075); } .elementor-13 .elementor-element.elementor-element-2c1d378 .elementor-icon-box-wrapper:hover::before { opacity: 1; } .elementor-13 .elementor-element.elementor-element-2c1d378 .elementor-icon-box-wrapper:hover .elementor-icon { background: linear-gradient( 145deg, #FF4964, #9E0024 ); box-shadow: 0 8px 20px rgba(0, 0, 0, 0.32), 0 0 23px rgba(200, 16, 46, 0.36); } /* Smartphone */ @media (max-width: 767px) { .elementor-13 .elementor-element.elementor-element-2c1d378 .elementor-icon-box-wrapper { padding: 17px 16px; border-radius: 12px; } .elementor-13 .elementor-element.elementor-element-2c1d378 .elementor-icon { width: 35px; height: 35px; } }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-f844a9b *//* ================================================== PULSANTE PRINCIPALE ANDREA AGNELLI EFFETTO ORIGINALE + COLORI BLOCCATI ================================================== */ .elementor-13 .elementor-element.elementor-element-f844a9b .elementor-button { position: relative; isolation: isolate; overflow: hidden; /* COLORI BLOCCATI - STATO INIZIALE */ color: #ffffff !important; background-color: #B11226 !important; border-color: #B11226 !important; box-shadow: 0 10px 25px rgba(177, 18, 38, 0.22), inset 0 0 0 1px rgba(255, 255, 255, 0.10); transition: color 1.1s ease, transform 0.65s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.65s ease, border-color 0.8s ease; } /* ================================================== TESTO SEMPRE SOPRA ALL’ANIMAZIONE ================================================== */ .elementor-13 .elementor-element.elementor-element-f844a9b .elementor-button-content-wrapper { position: relative; z-index: 5; } /* COLORE TESTO BLOCCATO */ .elementor-13 .elementor-element.elementor-element-f844a9b .elementor-button-text { color: #ffffff !important; transition: color 1.1s ease; } /* ================================================== PASSAGGIO DAL ROSSO AL BIANCO IDENTICO ALL'ORIGINALE ================================================== */ .elementor-13 .elementor-element.elementor-element-f844a9b .elementor-button::before { content: ""; position: absolute; inset: 0; z-index: 2; border-radius: inherit; background: linear-gradient( to bottom, #ffffff 0%, #ffffff calc(100% - 7px), rgba(177, 18, 38, 0.15) calc(100% - 7px), rgba(177, 18, 38, 0.15) calc(100% - 5px), #ffffff calc(100% - 5px) ); transform: scaleX(0); transform-origin: left center; transition: transform 0.7s ease; } /* ================================================== FORBICI COMPLETE IN UN UNICO SVG ================================================== */ .elementor-13 .elementor-element.elementor-element-f844a9b .elementor-button::after { content: ""; position: absolute; z-index: 7; width: 31px; height: 31px; left: 8px; bottom: -1px; /* BIANCHE SUL ROSSO */ background-color: #ffffff; -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 3.5c-.614-.884-.074-1.962.858-2.5L8 7.226 11.642 1c.932.538 1.472 1.616.858 2.5L8.81 8.61l1.556 2.661a2.5 2.5 0 1 1-.794.637L8 9.73l-1.572 2.177a2.5 2.5 0 1 1-.794-.637L7.19 8.61zm2.5 10a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0m7 0a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0'/%3E%3C/svg%3E"); -webkit-mask-repeat: no-repeat; -webkit-mask-position: center; -webkit-mask-size: contain; mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 3.5c-.614-.884-.074-1.962.858-2.5L8 7.226 11.642 1c.932.538 1.472 1.616.858 2.5L8.81 8.61l1.556 2.661a2.5 2.5 0 1 1-.794.637L8 9.73l-1.572 2.177a2.5 2.5 0 1 1-.794-.637L7.19 8.61zm2.5 10a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0m7 0a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0'/%3E%3C/svg%3E"); mask-repeat: no-repeat; mask-position: center; mask-size: contain; opacity: 0; pointer-events: none; filter: drop-shadow(0 2px 2px rgba(0, 0, 0, 0.14)); transition: opacity 0.35s ease, filter 0.35s ease; } /* ================================================== HOVER ================================================== */ .elementor-13 .elementor-element.elementor-element-f844a9b .elementor-button:hover { /* NON CAMBIAMO LO SFONDO QUI: IL BIANCO DEVE ENTRARE CON L'ANIMAZIONE */ color: #111111 !important; border-color: #ffffff !important; transform: translateY(-2px); box-shadow: 0 16px 34px rgba(0, 0, 0, 0.18), 0 0 0 1px rgba(177, 18, 38, 0.10); } /* TESTO DA BIANCO A NERO IN MODO FLUIDO */ .elementor-13 .elementor-element.elementor-element-f844a9b .elementor-button:hover .elementor-button-text { color: #111111 !important; } /* ================================================== PASSAGGIO BIANCO FLUIDO ================================================== */ .elementor-13 .elementor-element.elementor-element-f844a9b .elementor-button:hover::before { animation: aa-passaggio-bianco 1.6s cubic-bezier(0.45, 0, 0.15, 1) forwards; } /* ================================================== SCORRIMENTO DELLE FORBICI ================================================== */ .elementor-13 .elementor-element.elementor-element-f844a9b .elementor-button:hover::after { animation: aa-forbici-bicolore 1.6s cubic-bezier(0.45, 0, 0.15, 1) forwards; } /* ================================================== ANIMAZIONE DELLO SFONDO ================================================== */ @keyframes aa-passaggio-bianco { 0% { transform: scaleX(0); } 100% { transform: scaleX(1); } } /* ================================================== ANIMAZIONE FLUIDA DELLE FORBICI ================================================== */ @keyframes aa-forbici-bicolore { 0% { left: 8px; opacity: 0; background-color: #ffffff; transform: rotate(90deg) scale(0.92); filter: blur(0.8px) drop-shadow(0 2px 2px rgba(0, 0, 0, 0.12)); } /* COMPARSA MORBIDA SUL ROSSO */ 10% { opacity: 1; background-color: #ffffff; transform: rotate(90deg) scale(1); filter: blur(0) drop-shadow(0 2px 2px rgba(0, 0, 0, 0.14)); } /* ANCORA BIANCHE */ 22% { opacity: 1; background-color: #ffffff; } /* PASSAGGIO GRADUALE AL ROSSO */ 42% { opacity: 1; background-color: #B11226; } /* MOVIMENTO CENTRALE */ 78% { opacity: 1; background-color: #B11226; transform: rotate(90deg) scale(1); filter: blur(0) drop-shadow(0 2px 2px rgba(0, 0, 0, 0.14)); } /* INIZIO DISSOLVENZA */ 90% { left: calc(100% - 48px); opacity: 0.55; background-color: #B11226; transform: rotate(90deg) scale(0.97); filter: blur(0.3px) drop-shadow(0 2px 2px rgba(0, 0, 0, 0.10)); } /* SCOMPARSA PRIMA DEL BORDO */ 100% { left: calc(100% - 37px); opacity: 0; background-color: #B11226; transform: rotate(90deg) scale(0.90); filter: blur(1.4px); } } /* ================================================== TELEFONO ================================================== */ @media (max-width: 767px) { .elementor-13 .elementor-element.elementor-element-f844a9b .elementor-button::after { width: 27px; height: 27px; bottom: 0; } } /* ================================================== RIDUZIONE MOVIMENTO SE RICHIESTA ================================================== */ @media (prefers-reduced-motion: reduce) { .elementor-13 .elementor-element.elementor-element-f844a9b .elementor-button, .elementor-13 .elementor-element.elementor-element-f844a9b .elementor-button::before, .elementor-13 .elementor-element.elementor-element-f844a9b .elementor-button::after, .elementor-13 .elementor-element.elementor-element-f844a9b .elementor-button-text { animation: none !important; transition-duration: 0.2s; } }/* End custom CSS */ /* Start custom CSS for image, class: .elementor-element-27c1929 *//* ========================================================= ANDREA AGNELLI — IMMAGINE PREMIUM Glass sweep + leggero zoom Da inserire direttamente nel widget Immagine ========================================================= */ .elementor-13 .elementor-element.elementor-element-27c1929 { position: relative; overflow: hidden; border-radius: 18px; box-shadow: 0 12px 28px rgba(0,0,0,.10); transition: transform .42s cubic-bezier(.22,.61,.36,1), box-shadow .42s ease; } /* immagine */ .elementor-13 .elementor-element.elementor-element-27c1929 img { display: block; width: 100%; height: auto; border-radius: 18px; transition: transform .55s cubic-bezier(.22,.61,.36,1), filter .45s ease; } /* ========================================================= GLASS SWEEP ========================================================= */ .elementor-13 .elementor-element.elementor-element-27c1929::after { content: ""; position: absolute; top: -20%; left: -45%; width: 30%; height: 150%; background: linear-gradient( 90deg, transparent 0%, rgba(255,255,255,.08) 20%, rgba(255,255,255,.65) 50%, rgba(255,255,255,.12) 80%, transparent 100% ); transform: skewX(-18deg); opacity: 0; pointer-events: none; z-index: 5; } /* ========================================================= HOVER DESKTOP ========================================================= */ @media (hover:hover) { .elementor-13 .elementor-element.elementor-element-27c1929:hover { transform: translateY(-4px); box-shadow: 0 20px 38px rgba(0,0,0,.14); } .elementor-13 .elementor-element.elementor-element-27c1929:hover img { transform: scale(1.035); filter: saturate(1.04) contrast(1.015); } .elementor-13 .elementor-element.elementor-element-27c1929:hover::after { animation: aa-image-glass 1s cubic-bezier(.22,.61,.36,1) forwards; } } /* ========================================================= TOUCH ========================================================= */ @media (hover:none) { .elementor-13 .elementor-element.elementor-element-27c1929:active img, .elementor-13 .elementor-element.elementor-element-27c1929:focus-within img { transform: scale(1.025); } .elementor-13 .elementor-element.elementor-element-27c1929:active::after, .elementor-13 .elementor-element.elementor-element-27c1929:focus-within::after { animation: aa-image-glass .85s ease forwards; } } /* ========================================================= ANIMAZIONE GLASS ========================================================= */ @keyframes aa-image-glass { 0% { left: -45%; opacity: 0; } 15% { opacity: .9; } 80% { opacity: .9; } 100% { left: 115%; opacity: 0; } } /* ========================================================= MOBILE ========================================================= */ @media (max-width:767px) { .elementor-13 .elementor-element.elementor-element-27c1929, .elementor-13 .elementor-element.elementor-element-27c1929 img { border-radius: 14px; } } /* ========================================================= ACCESSIBILITÀ ========================================================= */ @media (prefers-reduced-motion:reduce) { .elementor-13 .elementor-element.elementor-element-27c1929, .elementor-13 .elementor-element.elementor-element-27c1929 img, .elementor-13 .elementor-element.elementor-element-27c1929::after { animation: none !important; transition: none !important; } }/* End custom CSS */ /* Start custom CSS for icon-box, class: .elementor-element-a4be1a6 *//* ========================================== RIQUADRO ICONA SU SFONDO BIANCO Non modifica il font ========================================== */ .elementor-13 .elementor-element.elementor-element-a4be1a6 .elementor-icon-box-wrapper { position: relative; display: inline-flex; align-items: center; width: auto; padding: 10px 17px; border: 1px solid rgba(200, 16, 46, 0.35); border-radius: 999px; background: linear-gradient( 115deg, rgba(200, 16, 46, 0.09), rgba(255, 255, 255, 0.98), rgba(115, 0, 24, 0.07) ); box-shadow: 0 10px 28px rgba(20, 20, 20, 0.10), inset 0 1px 0 rgba(255, 255, 255, 0.95), 0 0 20px rgba(200, 16, 46, 0.07); overflow: hidden; transition: border-color 0.5s ease, background 0.5s ease, box-shadow 0.5s ease; } /* Riflesso satinato */ .elementor-13 .elementor-element.elementor-element-a4be1a6 .elementor-icon-box-wrapper::before { content: ""; position: absolute; top: 0; left: -75%; width: 45%; height: 100%; background: linear-gradient( 90deg, transparent, rgba(255, 255, 255, 0.90), rgba(255, 53, 88, 0.18), transparent ); transform: skewX(-18deg); animation: agnelli-icon-light-section 6s ease-in-out infinite; pointer-events: none; } /* Icona */ .elementor-13 .elementor-element.elementor-element-a4be1a6 .elementor-icon-box-icon { position: relative; z-index: 2; margin-bottom: 0 !important; } .elementor-13 .elementor-element.elementor-element-a4be1a6 .elementor-icon { color: #C8102E !important; filter: drop-shadow(0 0 4px rgba(200, 16, 46, 0.25)); } /* Contenuto */ .elementor-13 .elementor-element.elementor-element-a4be1a6 .elementor-icon-box-content { position: relative; z-index: 2; } /* Testo nero */ .elementor-13 .elementor-element.elementor-element-a4be1a6 .elementor-icon-box-title, .elementor-13 .elementor-element.elementor-element-a4be1a6 .elementor-icon-box-title a { color: #111111 !important; margin: 0 !important; } /* Hover */ .elementor-13 .elementor-element.elementor-element-a4be1a6 .elementor-icon-box-wrapper:hover { border-color: #C8102E; background: linear-gradient( 115deg, rgba(200, 16, 46, 0.16), #FFFFFF, rgba(255, 53, 88, 0.11) ); box-shadow: 0 14px 34px rgba(20, 20, 20, 0.14), inset 0 1px 0 rgba(255, 255, 255, 1), 0 0 24px rgba(200, 16, 46, 0.15); } /* Durante il passaggio il testo diventa bordeaux */ .elementor-13 .elementor-element.elementor-element-a4be1a6 .elementor-icon-box-wrapper:hover .elementor-icon-box-title, .elementor-13 .elementor-element.elementor-element-a4be1a6 .elementor-icon-box-wrapper:hover .elementor-icon-box-title a { color: #730018 !important; } /* Animazione del riflesso */ @keyframes agnelli-icon-light-section { 0%, 25% { left: -75%; opacity: 0; } 35% { opacity: 1; } 65% { left: 135%; opacity: 1; } 75%, 100% { left: 135%; opacity: 0; } } /* Smartphone */ @media (max-width: 767px) { .elementor-13 .elementor-element.elementor-element-a4be1a6 .elementor-icon-box-wrapper { padding: 9px 14px; } } /* Riduzione animazioni */ @media (prefers-reduced-motion: reduce) { .elementor-13 .elementor-element.elementor-element-a4be1a6 .elementor-icon-box-wrapper::before { animation: none; } }/* End custom CSS */ /* Start custom CSS for heading, class: .elementor-element-101c00e *//* ========================================== TITOLI H2 SU SFONDO BIANCO Riflesso rosso e bordeaux satinato Non modifica font, peso o dimensioni ========================================== */ .elementor-13 .elementor-element.elementor-element-101c00e .elementor-heading-title { display: inline-block; color: #111111; background-image: linear-gradient( 105deg, #111111 0%, #111111 22%, #2B2B2B 34%, #C8102E 44%, #730018 52%, #E32646 60%, #2B2B2B 70%, #111111 82%, #111111 100% ); background-size: 280% 100%; background-position: 0% 50%; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; animation: agnelli-h2-light 11s ease-in-out infinite alternate; will-change: background-position; } .elementor-13 .elementor-element.elementor-element-101c00e .elementor-heading-title a { color: inherit; -webkit-text-fill-color: inherit; } @keyframes agnelli-h2-light { 0% { background-position: 0% 50%; } 20% { background-position: 0% 50%; } 80% { background-position: 100% 50%; } 100% { background-position: 100% 50%; } } @media (prefers-reduced-motion: reduce) { .elementor-13 .elementor-element.elementor-element-101c00e .elementor-heading-title { animation: none; background-position: 50% 50%; } }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-9774241 *//* ================================================== PULSANTE ANDREA AGNELLI SFONDO BIANCO - ROSSO SEMPRE VISIBILE IN PARTENZA ================================================== */ .elementor-13 .elementor-element.elementor-element-9774241 a.elementor-button, .elementor-13 .elementor-element.elementor-element-9774241 .elementor-button { position: relative; isolation: isolate; overflow: hidden; /* FORZA COMPLETAMENTE LO STATO INIZIALE */ background: #B11226 !important; background-color: #B11226 !important; background-image: none !important; color: #ffffff !important; border: 1px solid #B11226 !important; border-color: #B11226 !important; box-shadow: 0 10px 25px rgba(177, 18, 38, 0.22), inset 0 0 0 1px rgba(255, 255, 255, 0.10); transition: color 1.1s ease, transform 0.65s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.65s ease, border-color 0.8s ease; } /* ================================================== TESTO ================================================== */ .elementor-13 .elementor-element.elementor-element-9774241 .elementor-button-content-wrapper { position: relative; z-index: 5; } .elementor-13 .elementor-element.elementor-element-9774241 .elementor-button-text { position: relative; z-index: 5; color: #ffffff !important; -webkit-text-fill-color: #ffffff !important; transition: color 1.1s ease, -webkit-text-fill-color 1.1s ease; } /* ================================================== STRATO CHIARO CHE ENTRA DA SINISTRA ================================================== */ .elementor-13 .elementor-element.elementor-element-9774241 .elementor-button::before { content: ""; position: absolute; inset: 0; z-index: 2; border-radius: inherit; background: linear-gradient( to bottom, #F7F7F7 0%, #F7F7F7 calc(100% - 7px), rgba(177, 18, 38, 0.18) calc(100% - 7px), rgba(177, 18, 38, 0.18) calc(100% - 5px), #F7F7F7 calc(100% - 5px) ); transform: scaleX(0); transform-origin: left center; transition: transform 0.7s ease; } /* ================================================== FORBICI ================================================== */ .elementor-13 .elementor-element.elementor-element-9774241 .elementor-button::after { content: ""; position: absolute; z-index: 7; width: 31px; height: 31px; left: 8px; bottom: -1px; background-color: #ffffff; -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 3.5c-.614-.884-.074-1.962.858-2.5L8 7.226 11.642 1c.932.538 1.472 1.616.858 2.5L8.81 8.61l1.556 2.661a2.5 2.5 0 1 1-.794.637L8 9.73l-1.572 2.177a2.5 2.5 0 1 1-.794-.637L7.19 8.61zm2.5 10a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0m7 0a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0'/%3E%3C/svg%3E"); -webkit-mask-repeat: no-repeat; -webkit-mask-position: center; -webkit-mask-size: contain; mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 3.5c-.614-.884-.074-1.962.858-2.5L8 7.226 11.642 1c.932.538 1.472 1.616.858 2.5L8.81 8.61l1.556 2.661a2.5 2.5 0 1 1-.794.637L8 9.73l-1.572 2.177a2.5 2.5 0 1 1-.794-.637L7.19 8.61zm2.5 10a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0m7 0a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0'/%3E%3C/svg%3E"); mask-repeat: no-repeat; mask-position: center; mask-size: contain; opacity: 0; pointer-events: none; filter: drop-shadow(0 2px 2px rgba(0, 0, 0, 0.14)); transition: opacity 0.35s ease, filter 0.35s ease; } /* ================================================== HOVER ================================================== */ .elementor-13 .elementor-element.elementor-element-9774241 a.elementor-button:hover, .elementor-13 .elementor-element.elementor-element-9774241 .elementor-button:hover { /* NON METTIAMO background bianco QUI. Deve essere lo ::before ad avanzare gradualmente. */ color: #111111 !important; border-color: #B11226 !important; transform: translateY(-2px); box-shadow: 0 16px 34px rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(177, 18, 38, 0.14); } /* TESTO NERO IN HOVER */ .elementor-13 .elementor-element.elementor-element-9774241 .elementor-button:hover .elementor-button-text { color: #111111 !important; -webkit-text-fill-color: #111111 !important; } /* ================================================== PASSAGGIO CHIARO FLUIDO ================================================== */ .elementor-13 .elementor-element.elementor-element-9774241 .elementor-button:hover::before { animation: aa-passaggio-chiaro 1.6s cubic-bezier(0.45, 0, 0.15, 1) forwards; } /* ================================================== FORBICI ================================================== */ .elementor-13 .elementor-element.elementor-element-9774241 .elementor-button:hover::after { animation: aa-forbici-chiaro 1.6s cubic-bezier(0.45, 0, 0.15, 1) forwards; } /* ================================================== ANIMAZIONE SFONDO ================================================== */ @keyframes aa-passaggio-chiaro { 0% { transform: scaleX(0); } 100% { transform: scaleX(1); } } /* ================================================== ANIMAZIONE FORBICI ================================================== */ @keyframes aa-forbici-chiaro { 0% { left: 8px; opacity: 0; background-color: #ffffff; transform: rotate(90deg) scale(0.92); filter: blur(0.8px) drop-shadow(0 2px 2px rgba(0, 0, 0, 0.12)); } 10% { opacity: 1; background-color: #ffffff; transform: rotate(90deg) scale(1); filter: blur(0) drop-shadow(0 2px 2px rgba(0, 0, 0, 0.14)); } 22% { opacity: 1; background-color: #ffffff; } /* DIVENTANO ROSSE SULLA PARTE CHIARA */ 42% { opacity: 1; background-color: #B11226; } 78% { opacity: 1; background-color: #B11226; transform: rotate(90deg) scale(1); filter: blur(0) drop-shadow(0 2px 2px rgba(0, 0, 0, 0.14)); } 90% { left: calc(100% - 48px); opacity: 0.55; background-color: #B11226; transform: rotate(90deg) scale(0.97); filter: blur(0.3px) drop-shadow(0 2px 2px rgba(0, 0, 0, 0.10)); } 100% { left: calc(100% - 37px); opacity: 0; background-color: #B11226; transform: rotate(90deg) scale(0.90); filter: blur(1.4px); } } /* ================================================== MOBILE ================================================== */ @media (max-width: 767px) { .elementor-13 .elementor-element.elementor-element-9774241 .elementor-button::after { width: 27px; height: 27px; bottom: 0; } } /* ================================================== RIDUZIONE MOVIMENTO ================================================== */ @media (prefers-reduced-motion: reduce) { .elementor-13 .elementor-element.elementor-element-9774241 .elementor-button, .elementor-13 .elementor-element.elementor-element-9774241 .elementor-button::before, .elementor-13 .elementor-element.elementor-element-9774241 .elementor-button::after, .elementor-13 .elementor-element.elementor-element-9774241 .elementor-button-text { animation: none !important; transition-duration: 0.2s; } }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-4f8ccfa *//* ================================================== KEVIN MURPHY — PULSANTE PRINCIPALE STESSO EFFETTO ANDREA AGNELLI PALETTE MULTICOLOR KEVIN MURPHY ================================================== */ .elementor-13 .elementor-element.elementor-element-4f8ccfa .elementor-button { position: relative; isolation: isolate; overflow: hidden; color: #ffffff !important; background: linear-gradient( 100deg, #ff2f6d 0%, #ff62b7 20%, #b83cff 40%, #5d63ff 60%, #00b7c7 78%, #ff9f2f 100% ) !important; background-size: 220% 100% !important; border-color: rgba(255,255,255,.22) !important; box-shadow: 0 12px 28px rgba(123,72,255,.20), 0 0 22px rgba(255,47,109,.12), inset 0 1px 0 rgba(255,255,255,.22); animation: km-button-gradient 7s ease-in-out infinite; transition: color 1.1s ease, transform .65s cubic-bezier(.22,1,.36,1), box-shadow .65s ease, border-color .8s ease; } /* ================================================== TESTO SEMPRE SOPRA ================================================== */ .elementor-13 .elementor-element.elementor-element-4f8ccfa .elementor-button-content-wrapper { position: relative; z-index: 5; } .elementor-13 .elementor-element.elementor-element-4f8ccfa .elementor-button-text { color: #ffffff !important; transition: color 1.1s ease; } /* ================================================== BIANCO CHE ENTRA NEL PULSANTE ================================================== */ .elementor-13 .elementor-element.elementor-element-4f8ccfa .elementor-button::before { content: ""; position: absolute; inset: 0; z-index: 2; border-radius: inherit; background: linear-gradient( to bottom, #ffffff 0%, #ffffff calc(100% - 7px), rgba(255,47,109,.16) calc(100% - 7px), rgba(184,60,255,.15) calc(100% - 5px), #ffffff calc(100% - 5px) ); transform: scaleX(0); transform-origin: left center; transition: transform .7s ease; } /* ================================================== FORBICI ================================================== */ .elementor-13 .elementor-element.elementor-element-4f8ccfa .elementor-button::after { content: ""; position: absolute; z-index: 7; width: 31px; height: 31px; left: 8px; bottom: -1px; /* BIANCHE ALL'INIZIO */ background-color: #ffffff; -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 3.5c-.614-.884-.074-1.962.858-2.5L8 7.226 11.642 1c.932.538 1.472 1.616.858 2.5L8.81 8.61l1.556 2.661a2.5 2.5 0 1 1-.794.637L8 9.73l-1.572 2.177a2.5 2.5 0 1 1-.794-.637L7.19 8.61zm2.5 10a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0m7 0a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0'/%3E%3C/svg%3E"); -webkit-mask-repeat: no-repeat; -webkit-mask-position: center; -webkit-mask-size: contain; mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 3.5c-.614-.884-.074-1.962.858-2.5L8 7.226 11.642 1c.932.538 1.472 1.616.858 2.5L8.81 8.61l1.556 2.661a2.5 2.5 0 1 1-.794.637L8 9.73l-1.572 2.177a2.5 2.5 0 1 1-.794-.637L7.19 8.61zm2.5 10a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0m7 0a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0'/%3E%3C/svg%3E"); mask-repeat: no-repeat; mask-position: center; mask-size: contain; opacity: 0; pointer-events: none; filter: drop-shadow( 0 2px 3px rgba(0,0,0,.14) ); } /* ================================================== DESKTOP HOVER ================================================== */ @media (hover: hover) { .elementor-13 .elementor-element.elementor-element-4f8ccfa .elementor-button:hover { color: #111111 !important; border-color: rgba(255,255,255,.90) !important; transform: translateY(-2px); box-shadow: 0 17px 36px rgba(0,0,0,.16), 0 0 25px rgba(184,60,255,.12), 0 0 18px rgba(255,47,109,.08); } .elementor-13 .elementor-element.elementor-element-4f8ccfa .elementor-button:hover .elementor-button-text { color: #111111 !important; } .elementor-13 .elementor-element.elementor-element-4f8ccfa .elementor-button:hover::before { animation: km-passaggio-bianco 1.6s cubic-bezier(.45,0,.15,1) forwards; } .elementor-13 .elementor-element.elementor-element-4f8ccfa .elementor-button:hover::after { animation: km-forbici-color 1.6s cubic-bezier(.45,0,.15,1) forwards; } } /* ================================================== TOUCH — TABLET / MOBILE ================================================== */ @media (hover: none) { .elementor-13 .elementor-element.elementor-element-4f8ccfa .elementor-button:active, .elementor-13 .elementor-element.elementor-element-4f8ccfa .elementor-button:focus-visible { color: #111111 !important; transform: scale(.98); } .elementor-13 .elementor-element.elementor-element-4f8ccfa .elementor-button:active .elementor-button-text, .elementor-13 .elementor-element.elementor-element-4f8ccfa .elementor-button:focus-visible .elementor-button-text { color: #111111 !important; } .elementor-13 .elementor-element.elementor-element-4f8ccfa .elementor-button:active::before, .elementor-13 .elementor-element.elementor-element-4f8ccfa .elementor-button:focus-visible::before { animation: km-passaggio-bianco 1.45s cubic-bezier(.45,0,.15,1) forwards; } .elementor-13 .elementor-element.elementor-element-4f8ccfa .elementor-button:active::after, .elementor-13 .elementor-element.elementor-element-4f8ccfa .elementor-button:focus-visible::after { animation: km-forbici-color 1.45s cubic-bezier(.45,0,.15,1) forwards; } } /* ================================================== GRADIENTE DI BASE IN MOVIMENTO ================================================== */ @keyframes km-button-gradient { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } } /* ================================================== PASSAGGIO DEL BIANCO ================================================== */ @keyframes km-passaggio-bianco { 0% { transform: scaleX(0); } 100% { transform: scaleX(1); } } /* ================================================== FORBICI MULTICOLOR ================================================== */ @keyframes km-forbici-color { 0% { left: 8px; opacity: 0; background-color: #ffffff; transform: rotate(90deg) scale(.92); filter: blur(.8px) drop-shadow( 0 2px 2px rgba(0,0,0,.12) ); } /* entrano bianche */ 10% { opacity: 1; background-color: #ffffff; transform: rotate(90deg) scale(1); filter: blur(0) drop-shadow( 0 2px 2px rgba(0,0,0,.14) ); } /* rosa */ 28% { opacity: 1; background-color: #ff2f6d; } /* viola */ 48% { opacity: 1; background-color: #b83cff; } /* blu */ 65% { opacity: 1; background-color: #5d63ff; } /* turchese */ 78% { opacity: 1; background-color: #00b7c7; transform: rotate(90deg) scale(1); } /* verso il bordo */ 90% { left: calc(100% - 48px); opacity: .60; background-color: #ff9f2f; transform: rotate(90deg) scale(.97); filter: blur(.3px) drop-shadow( 0 2px 2px rgba(0,0,0,.10) ); } /* spariscono */ 100% { left: calc(100% - 37px); opacity: 0; background-color: #ff62b7; transform: rotate(90deg) scale(.90); filter: blur(1.4px); } } /* ================================================== MOBILE ================================================== */ @media (max-width: 767px) { .elementor-13 .elementor-element.elementor-element-4f8ccfa .elementor-button::after { width: 27px; height: 27px; bottom: 0; } } /* ================================================== RIDUZIONE MOVIMENTO ================================================== */ @media (prefers-reduced-motion: reduce) { .elementor-13 .elementor-element.elementor-element-4f8ccfa .elementor-button { animation: none !important; } .elementor-13 .elementor-element.elementor-element-4f8ccfa .elementor-button, .elementor-13 .elementor-element.elementor-element-4f8ccfa .elementor-button::before, .elementor-13 .elementor-element.elementor-element-4f8ccfa .elementor-button::after, .elementor-13 .elementor-element.elementor-element-4f8ccfa .elementor-button-text { animation: none !important; transition-duration: .2s; } }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-c499392 *//* ===================================================== CONTENITORE PRINCIPALE CON DUE IMMAGINI E DUE PULSANTI Pulsanti centrati sotto le rispettive immagini Non modifica lo stile interno dei pulsanti ===================================================== */ .elementor-13 .elementor-element.elementor-element-c499392 { position: relative; isolation: isolate; gap: 22px !important; } /* Gestisce anche il contenitore interno di Elementor */ .elementor-13 .elementor-element.elementor-element-c499392 > .e-con-inner { gap: 22px !important; align-items: stretch !important; } /* ===================================================== STILE COMUNE DEI DUE CONTENITORI ===================================================== */ .elementor-13 .elementor-element.elementor-element-c499392 > .e-con, .elementor-13 .elementor-element.elementor-element-c499392 > .e-con-inner > .e-con { position: relative; overflow: visible; height: 100%; padding: 17px 17px 20px !important; border: 1px solid rgba(200,16,46,.17); border-radius: 23px; background: radial-gradient( circle at 50% 0%, rgba(200,16,46,.075), transparent 42% ), linear-gradient( 145deg, #FFFFFF, #F7F7F8 ); box-shadow: 0 20px 48px rgba(15,15,18,.12), inset 0 1px 0 rgba(255,255,255,.95); transition: border-color .55s ease, box-shadow .55s ease, background .55s ease; } /* Mantiene i contenuti sopra gli effetti */ .elementor-13 .elementor-element.elementor-element-c499392 > .e-con > *, .elementor-13 .elementor-element.elementor-element-c499392 > .e-con-inner > .e-con > * { position: relative; z-index: 2; } /* ===================================================== LINEE SUPERIORI SPECULARI ===================================================== */ /* Contenitore sinistro */ .elementor-13 .elementor-element.elementor-element-c499392 > .e-con:nth-child(1)::before, .elementor-13 .elementor-element.elementor-element-c499392 > .e-con-inner > .e-con:nth-child(1)::before { content: ""; position: absolute; top: 0; left: 22px; width: 42%; height: 2px; border-radius: 10px; background: linear-gradient( 90deg, #730018, #FF3558, transparent ); box-shadow: 0 0 13px rgba(200,16,46,.30); } /* Contenitore destro */ .elementor-13 .elementor-element.elementor-element-c499392 > .e-con:nth-child(2)::before, .elementor-13 .elementor-element.elementor-element-c499392 > .e-con-inner > .e-con:nth-child(2)::before { content: ""; position: absolute; top: 0; right: 22px; width: 42%; height: 2px; border-radius: 10px; background: linear-gradient( 90deg, transparent, #FF3558, #730018 ); box-shadow: 0 0 13px rgba(200,16,46,.30); } /* ===================================================== IMMAGINI ===================================================== */ .elementor-13 .elementor-element.elementor-element-c499392 .elementor-widget-image { width: 100%; } .elementor-13 .elementor-element.elementor-element-c499392 .elementor-widget-image .elementor-widget-container { position: relative; overflow: hidden; width: 100%; border: 1px solid rgba(20,20,20,.09); border-radius: 17px; box-shadow: 0 14px 32px rgba(10,10,12,.14); transition: border-color .5s ease, box-shadow .5s ease; } .elementor-13 .elementor-element.elementor-element-c499392 .elementor-widget-image img { display: block; width: 100%; border-radius: 16px; opacity: 1 !important; image-rendering: auto; image-rendering: -webkit-optimize-contrast; filter: brightness(1.02) contrast(1.07) saturate(1.04); transition: filter .6s ease; } /* Leggera sfumatura cinematografica */ .elementor-13 .elementor-element.elementor-element-c499392 .elementor-widget-image .elementor-widget-container::after { content: ""; position: absolute; inset: 0; background: linear-gradient( 180deg, transparent 58%, rgba(0,0,0,.16) 100% ); pointer-events: none; } /* ===================================================== PULSANTI CENTRATI SOTTO LA RISPETTIVA IMMAGINE ===================================================== */ .elementor-13 .elementor-element.elementor-element-c499392 > .e-con:nth-child(1) .elementor-widget-button, .elementor-13 .elementor-element.elementor-element-c499392 > .e-con:nth-child(2) .elementor-widget-button, .elementor-13 .elementor-element.elementor-element-c499392 > .e-con-inner > .e-con:nth-child(1) .elementor-widget-button, .elementor-13 .elementor-element.elementor-element-c499392 > .e-con-inner > .e-con:nth-child(2) .elementor-widget-button { align-self: center !important; width: auto !important; margin: 19px auto 0 !important; } /* Wrapper del pulsante sempre centrato */ .elementor-13 .elementor-element.elementor-element-c499392 > .e-con:nth-child(1) .elementor-button-wrapper, .elementor-13 .elementor-element.elementor-element-c499392 > .e-con:nth-child(2) .elementor-button-wrapper, .elementor-13 .elementor-element.elementor-element-c499392 > .e-con-inner > .e-con:nth-child(1) .elementor-button-wrapper, .elementor-13 .elementor-element.elementor-element-c499392 > .e-con-inner > .e-con:nth-child(2) .elementor-button-wrapper { text-align: center !important; display: flex !important; justify-content: center !important; width: 100% !important; } /* Non modifica l'estetica del bottone */ .elementor-13 .elementor-element.elementor-element-c499392 .elementor-button { margin-left: auto !important; margin-right: auto !important; } /* ===================================================== HOVER ===================================================== */ .elementor-13 .elementor-element.elementor-element-c499392 > .e-con:hover, .elementor-13 .elementor-element.elementor-element-c499392 > .e-con-inner > .e-con:hover { border-color: rgba(200,16,46,.40); background: radial-gradient( circle at 50% 0%, rgba(200,16,46,.13), transparent 46% ), linear-gradient( 145deg, #FFFFFF, #F5F5F6 ); box-shadow: 0 25px 58px rgba(15,15,18,.16), 0 0 25px rgba(200,16,46,.08), inset 0 1px 0 #FFFFFF; } .elementor-13 .elementor-element.elementor-element-c499392 > .e-con:hover .elementor-widget-image .elementor-widget-container, .elementor-13 .elementor-element.elementor-element-c499392 > .e-con-inner > .e-con:hover .elementor-widget-image .elementor-widget-container { border-color: rgba(200,16,46,.30); box-shadow: 0 17px 38px rgba(10,10,12,.18), 0 0 18px rgba(200,16,46,.07); } .elementor-13 .elementor-element.elementor-element-c499392 > .e-con:hover .elementor-widget-image img, .elementor-13 .elementor-element.elementor-element-c499392 > .e-con-inner > .e-con:hover .elementor-widget-image img { filter: brightness(1.035) contrast(1.09) saturate(1.07); } /* ===================================================== TABLET ===================================================== */ @media (max-width:1024px) { .elementor-13 .elementor-element.elementor-element-c499392, .elementor-13 .elementor-element.elementor-element-c499392 > .e-con-inner { gap: 16px !important; } .elementor-13 .elementor-element.elementor-element-c499392 > .e-con:nth-child(1) .elementor-widget-button, .elementor-13 .elementor-element.elementor-element-c499392 > .e-con:nth-child(2) .elementor-widget-button, .elementor-13 .elementor-element.elementor-element-c499392 > .e-con-inner > .e-con:nth-child(1) .elementor-widget-button, .elementor-13 .elementor-element.elementor-element-c499392 > .e-con-inner > .e-con:nth-child(2) .elementor-widget-button { align-self: center !important; margin: 17px auto 0 !important; } } /* ===================================================== MOBILE ===================================================== */ @media (max-width:767px) { .elementor-13 .elementor-element.elementor-element-c499392, .elementor-13 .elementor-element.elementor-element-c499392 > .e-con-inner { display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: flex-start !important; gap: 18px !important; } /* Singole card */ .elementor-13 .elementor-element.elementor-element-c499392 > .e-con, .elementor-13 .elementor-element.elementor-element-c499392 > .e-con-inner > .e-con { display: flex !important; flex-direction: column !important; justify-content: flex-start !important; align-items: stretch !important; gap: 0 !important; width: 100% !important; max-width: 430px !important; height: auto !important; min-height: 0 !important; margin: 0 auto !important; padding: 10px 10px 19px !important; border-radius: 18px !important; box-shadow: 0 14px 34px rgba(15,15,18,.11), 0 0 18px rgba(200,16,46,.045), inset 0 1px 0 rgba(255,255,255,1); } /* Elimina spazi automatici */ .elementor-13 .elementor-element.elementor-element-c499392 > .e-con > .elementor-element, .elementor-13 .elementor-element.elementor-element-c499392 > .e-con-inner > .e-con > .elementor-element { margin-bottom: 0 !important; } /* Immagine */ .elementor-13 .elementor-element.elementor-element-c499392 .elementor-widget-image { width: 100% !important; margin: 0 !important; } .elementor-13 .elementor-element.elementor-element-c499392 .elementor-widget-image .elementor-widget-container { width: 100%; overflow: hidden; border-radius: 14px !important; box-shadow: 0 11px 25px rgba(10,10,12,.13); } .elementor-13 .elementor-element.elementor-element-c499392 .elementor-widget-image img { display: block; width: 100% !important; height: auto !important; aspect-ratio: 16 / 10; object-fit: cover; border-radius: 13px !important; transform: none !important; } /* Pulsanti centrati */ .elementor-13 .elementor-element.elementor-element-c499392 > .e-con:nth-child(1) .elementor-widget-button, .elementor-13 .elementor-element.elementor-element-c499392 > .e-con:nth-child(2) .elementor-widget-button, .elementor-13 .elementor-element.elementor-element-c499392 > .e-con-inner > .e-con:nth-child(1) .elementor-widget-button, .elementor-13 .elementor-element.elementor-element-c499392 > .e-con-inner > .e-con:nth-child(2) .elementor-widget-button { position: relative; z-index: 5; align-self: center !important; width: auto !important; max-width: calc(100% - 30px); margin: -23px auto 0 !important; } .elementor-13 .elementor-element.elementor-element-c499392 .elementor-button-wrapper { display: flex !important; justify-content: center !important; width: 100% !important; text-align: center !important; } /* Conserva una dimensione equilibrata */ .elementor-13 .elementor-element.elementor-element-c499392 .elementor-button { min-width: 185px; max-width: 100%; margin-left: auto !important; margin-right: auto !important; white-space: nowrap; } /* Linee rosse superiori più corte */ .elementor-13 .elementor-element.elementor-element-c499392 > .e-con:nth-child(1)::before, .elementor-13 .elementor-element.elementor-element-c499392 > .e-con:nth-child(2)::before, .elementor-13 .elementor-element.elementor-element-c499392 > .e-con-inner > .e-con:nth-child(1)::before, .elementor-13 .elementor-element.elementor-element-c499392 > .e-con-inner > .e-con:nth-child(2)::before { width: 38%; } }/* End custom CSS */ /* Start custom CSS for icon-box, class: .elementor-element-209e0e3 *//* ========================================== RIQUADRO ICONA – ABOUT US Non modifica il font ========================================== */ .elementor-13 .elementor-element.elementor-element-209e0e3 .elementor-icon-box-wrapper { position: relative; display: inline-flex; align-items: center; width: auto; padding: 10px 17px; border: 1px solid rgba(255, 53, 88, 0.42); border-radius: 999px; background: linear-gradient( 115deg, rgba(200, 16, 46, 0.18), rgba(255, 255, 255, 0.045), rgba(115, 0, 24, 0.15) ); box-shadow: 0 10px 30px rgba(0, 0, 0, 0.30), inset 0 1px 0 rgba(255, 255, 255, 0.12), 0 0 18px rgba(200, 16, 46, 0.10); overflow: hidden; transition: border-color 0.5s ease, background 0.5s ease, box-shadow 0.5s ease; } /* Riflesso luminoso */ .elementor-13 .elementor-element.elementor-element-209e0e3 .elementor-icon-box-wrapper::before { content: ""; position: absolute; top: 0; left: -75%; width: 45%; height: 100%; background: linear-gradient( 90deg, transparent, rgba(255, 255, 255, 0.20), rgba(255, 53, 88, 0.14), transparent ); transform: skewX(-18deg); animation: agnelli-about-light 6s ease-in-out infinite; pointer-events: none; } /* Icona */ .elementor-13 .elementor-element.elementor-element-209e0e3 .elementor-icon-box-icon { position: relative; z-index: 2; margin-bottom: 0 !important; } .elementor-13 .elementor-element.elementor-element-209e0e3 .elementor-icon { color: #FF3558 !important; filter: drop-shadow(0 0 5px rgba(255, 53, 88, 0.50)); } /* Testo */ .elementor-13 .elementor-element.elementor-element-209e0e3 .elementor-icon-box-content { position: relative; z-index: 2; } .elementor-13 .elementor-element.elementor-element-209e0e3 .elementor-icon-box-title, .elementor-13 .elementor-element.elementor-element-209e0e3 .elementor-icon-box-title a { color: #FFFFFF !important; margin: 0 !important; } /* Hover */ .elementor-13 .elementor-element.elementor-element-209e0e3 .elementor-icon-box-wrapper:hover { border-color: #FF3558; background: linear-gradient( 115deg, rgba(200, 16, 46, 0.30), rgba(255, 255, 255, 0.06), rgba(115, 0, 24, 0.22) ); box-shadow: 0 14px 35px rgba(0, 0, 0, 0.38), inset 0 1px 0 rgba(255, 255, 255, 0.16), 0 0 25px rgba(200, 16, 46, 0.22); } @keyframes agnelli-about-light { 0%, 25% { left: -75%; opacity: 0; } 35% { opacity: 1; } 65% { left: 135%; opacity: 1; } 75%, 100% { left: 135%; opacity: 0; } } @media (prefers-reduced-motion: reduce) { .elementor-13 .elementor-element.elementor-element-209e0e3 .elementor-icon-box-wrapper::before { animation: none; } }/* End custom CSS */ /* Start custom CSS for heading, class: .elementor-element-2070755 *//* ========================================== TITOLI H2 SU SFONDO NERO Riflesso rosso lento e satinato Non modifica font, peso o dimensioni ========================================== */ .elementor-13 .elementor-element.elementor-element-2070755 .elementor-heading-title { display: inline-block; color: #FFFFFF; background-image: linear-gradient( 105deg, #FFFFFF 0%, #FFFFFF 22%, #E8E8E8 34%, #FF3558 44%, #C8102E 52%, #FF3558 60%, #E8E8E8 70%, #FFFFFF 82%, #FFFFFF 100% ); background-size: 280% 100%; background-position: 0% 50%; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; animation: agnelli-h2-dark 11s ease-in-out infinite alternate; will-change: background-position; } .elementor-13 .elementor-element.elementor-element-2070755 .elementor-heading-title a { color: inherit; -webkit-text-fill-color: inherit; } @keyframes agnelli-h2-dark { 0% { background-position: 0% 50%; } 20% { background-position: 0% 50%; } 80% { background-position: 100% 50%; } 100% { background-position: 100% 50%; } } @media (prefers-reduced-motion: reduce) { .elementor-13 .elementor-element.elementor-element-2070755 .elementor-heading-title { animation: none; background-position: 50% 50%; } }/* End custom CSS */ /* Start custom CSS for shortcode, class: .elementor-element-b195bbe *//* ===================================================== ANDREA AGNELLI – GOOGLE REVIEWS PREMIUM Solo widget Trustindex, nessuna modifica ai font ===================================================== */ /* Area generale del widget */ .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget { position: relative; overflow: visible !important; } /* Blocco valutazione Google a sinistra */ .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-header { position: relative; padding: 24px 20px !important; border: 1px solid rgba(255, 40, 75, 0.32) !important; border-radius: 18px !important; background: radial-gradient( circle at 15% 10%, rgba(255, 35, 70, 0.18), transparent 48% ), linear-gradient( 145deg, rgba(28, 28, 31, 0.96), rgba(8, 8, 10, 0.98) ) !important; box-shadow: 0 18px 45px rgba(0, 0, 0, 0.38), inset 0 1px 0 rgba(255, 255, 255, 0.07), 0 0 24px rgba(200, 16, 46, 0.08) !important; overflow: hidden; } /* Linea rossa sul blocco valutazione */ .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-header::before { content: ""; position: absolute; top: 0; left: 15%; width: 70%; height: 2px; background: linear-gradient( 90deg, transparent, #C8102E, #FF4964, transparent ); box-shadow: 0 0 14px rgba(255, 35, 70, 0.65); } /* Testi blocco valutazione */ .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-header, .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-header strong, .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-rating-text, .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-rating-text strong { color: #FFFFFF !important; } /* Singole card */ .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-review-item { padding: 8px !important; perspective: 900px; } /* Interno card */ .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-review-item .ti-inner { position: relative; height: 100% !important; min-height: 215px; padding: 24px !important; border: 1px solid transparent !important; border-radius: 18px !important; background: linear-gradient( 145deg, rgba(27, 27, 31, 0.98), rgba(9, 9, 11, 0.99) ) padding-box, linear-gradient( 130deg, rgba(255, 255, 255, 0.16), rgba(200, 16, 46, 0.52), rgba(255, 255, 255, 0.05) ) border-box !important; box-shadow: 0 16px 38px rgba(0, 0, 0, 0.38), inset 0 1px 0 rgba(255, 255, 255, 0.07), 0 0 0 rgba(200, 16, 46, 0) !important; overflow: hidden !important; transform: translateY(0) scale(1); transition: transform 0.65s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.65s ease, border-color 0.65s ease, background 0.65s ease !important; } /* Luce rossa morbida dentro la card */ .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-review-item .ti-inner::after { content: ""; position: absolute; right: -80px; bottom: -100px; width: 200px; height: 200px; border-radius: 50%; background: radial-gradient( circle, rgba(200, 16, 46, 0.22) 0%, rgba(200, 16, 46, 0.07) 40%, transparent 72% ); opacity: 0.6; pointer-events: none; transition: opacity 0.65s ease, transform 0.65s ease; } /* Riflesso luminoso che attraversa il bordo superiore */ .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-review-item .ti-inner::before { content: ""; position: absolute; top: 0; left: -65%; width: 48%; height: 2px; background: linear-gradient( 90deg, transparent, #C8102E, #FFFFFF, #FF3558, transparent ); box-shadow: 0 0 8px rgba(255, 255, 255, 0.45), 0 0 16px rgba(255, 35, 70, 0.55); animation: agnelli-review-light 7s ease-in-out infinite; pointer-events: none; } /* Ritardo differente per rendere l'effetto naturale */ .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-review-item:nth-child(2) .ti-inner::before { animation-delay: 1.2s; } .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-review-item:nth-child(3) .ti-inner::before { animation-delay: 2.4s; } .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-review-item:nth-child(4) .ti-inner::before { animation-delay: 3.6s; } /* Effetto premium al passaggio */ .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-review-item .ti-inner:hover { transform: translateY(-9px) scale(1.015); box-shadow: 0 25px 55px rgba(0, 0, 0, 0.50), inset 0 1px 0 rgba(255, 255, 255, 0.12), 0 0 28px rgba(200, 16, 46, 0.24) !important; background: linear-gradient( 145deg, rgba(34, 20, 24, 0.99), rgba(10, 10, 12, 0.99) ) padding-box, linear-gradient( 130deg, #730018, #FF3558, #C8102E, rgba(255, 255, 255, 0.18) ) border-box !important; } .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-review-item .ti-inner:hover::after { opacity: 1; transform: scale(1.2); } /* Nome del cliente */ .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-name, .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-name a { color: #FFFFFF !important; transition: color 0.4s ease; } .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-review-item .ti-inner:hover .ti-name, .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-review-item .ti-inner:hover .ti-name a { color: #FF4964 !important; } /* Data e informazioni secondarie */ .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-date, .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-profile-details .ti-date { color: rgba(255, 255, 255, 0.58) !important; } /* Testo recensione */ .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-review-content, .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-review-text, .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-review-content p { color: rgba(255, 255, 255, 0.88) !important; line-height: 1.65 !important; } /* Link "Leggi di più" */ .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-read-more, .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-read-more-active { color: #FF4964 !important; transition: color 0.35s ease; } .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-read-more:hover, .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-read-more-active:hover { color: #FFFFFF !important; } /* Immagine profilo */ .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-profile-img img { border: 2px solid rgba(255, 255, 255, 0.75) !important; box-shadow: 0 0 0 3px rgba(200, 16, 46, 0.20), 0 6px 14px rgba(0, 0, 0, 0.35) !important; transition: border-color 0.45s ease, box-shadow 0.45s ease, transform 0.45s ease; } .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-review-item .ti-inner:hover .ti-profile-img img { border-color: #FF4964 !important; box-shadow: 0 0 0 4px rgba(200, 16, 46, 0.28), 0 8px 18px rgba(0, 0, 0, 0.42) !important; transform: scale(1.06); } /* Frecce dello slider */ .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-controls .ti-prev, .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-controls .ti-next { width: 38px !important; height: 38px !important; border: 1px solid rgba(255, 60, 90, 0.55) !important; border-radius: 50% !important; background: rgba(10, 10, 12, 0.88) !important; box-shadow: 0 7px 20px rgba(0, 0, 0, 0.35) !important; transition: background 0.4s ease, transform 0.4s ease, box-shadow 0.4s ease !important; } .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-controls .ti-prev:hover, .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-controls .ti-next:hover { background: #C8102E !important; transform: scale(1.10); box-shadow: 0 0 20px rgba(200, 16, 46, 0.50) !important; } /* Animazione riflesso */ @keyframes agnelli-review-light { 0%, 18% { left: -65%; opacity: 0; } 28% { opacity: 1; } 62% { left: 118%; opacity: 1; } 72%, 100% { left: 118%; opacity: 0; } } /* Tablet e smartphone */ @media (max-width: 767px) { .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-header { padding: 20px 18px !important; border-radius: 15px !important; } .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-review-item { padding: 6px !important; } .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-review-item .ti-inner { min-height: 200px; padding: 21px !important; border-radius: 15px !important; } .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-review-item .ti-inner:hover { transform: translateY(-4px) scale(1.005); } } /* Accessibilità */ @media (prefers-reduced-motion: reduce) { .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-review-item .ti-inner, .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-review-item .ti-inner::before, .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-profile-img img { animation: none !important; transition: none !important; transform: none !important; } } /* ===================================================== CORREZIONE NITIDEZZA E TAGLIO SUPERIORE Da aggiungere in fondo al CSS delle recensioni ===================================================== */ /* Crea spazio sopra le card senza allungare la sezione */ .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-reviews-container-wrapper { padding-top: 16px !important; margin-top: -16px !important; } /* Rimuove l'effetto prospettiva che può sfocare il testo */ .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-review-item { perspective: none !important; } /* Movimento verticale reale, senza zoom */ .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-review-item .ti-inner { position: relative; top: 0; transform: none !important; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; transition: top 0.55s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.55s ease, border-color 0.55s ease, background 0.55s ease !important; } /* La card sale ma non viene ingrandita */ .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-review-item .ti-inner:hover { top: -7px; transform: none !important; } /* Mantiene perfettamente nitidi tutti i testi */ .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-name, .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-date, .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-review-content, .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-review-text, .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-review-content p { transform: none !important; filter: none !important; -webkit-font-smoothing: antialiased; } /* Movimento ridotto su telefono */ @media (max-width: 767px) { .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-reviews-container-wrapper { padding-top: 10px !important; margin-top: -10px !important; } .elementor-13 .elementor-element.elementor-element-b195bbe .ti-widget .ti-review-item .ti-inner:hover { top: -3px; transform: none !important; } }/* End custom CSS */ /* Start custom CSS for image, class: .elementor-element-1cad15d1 *//* ========================================================= ANDREA AGNELLI — IMMAGINE PREMIUM Glass sweep + leggero zoom Da inserire direttamente nel widget Immagine ========================================================= */ .elementor-13 .elementor-element.elementor-element-1cad15d1 { position: relative; overflow: hidden; border-radius: 18px; box-shadow: 0 12px 28px rgba(0,0,0,.10); transition: transform .42s cubic-bezier(.22,.61,.36,1), box-shadow .42s ease; } /* immagine */ .elementor-13 .elementor-element.elementor-element-1cad15d1 img { display: block; width: 100%; height: auto; border-radius: 18px; transition: transform .55s cubic-bezier(.22,.61,.36,1), filter .45s ease; } /* ========================================================= GLASS SWEEP ========================================================= */ .elementor-13 .elementor-element.elementor-element-1cad15d1::after { content: ""; position: absolute; top: -20%; left: -45%; width: 30%; height: 150%; background: linear-gradient( 90deg, transparent 0%, rgba(255,255,255,.08) 20%, rgba(255,255,255,.65) 50%, rgba(255,255,255,.12) 80%, transparent 100% ); transform: skewX(-18deg); opacity: 0; pointer-events: none; z-index: 5; } /* ========================================================= HOVER DESKTOP ========================================================= */ @media (hover:hover) { .elementor-13 .elementor-element.elementor-element-1cad15d1:hover { transform: translateY(-4px); box-shadow: 0 20px 38px rgba(0,0,0,.14); } .elementor-13 .elementor-element.elementor-element-1cad15d1:hover img { transform: scale(1.035); filter: saturate(1.04) contrast(1.015); } .elementor-13 .elementor-element.elementor-element-1cad15d1:hover::after { animation: aa-image-glass 1s cubic-bezier(.22,.61,.36,1) forwards; } } /* ========================================================= TOUCH ========================================================= */ @media (hover:none) { .elementor-13 .elementor-element.elementor-element-1cad15d1:active img, .elementor-13 .elementor-element.elementor-element-1cad15d1:focus-within img { transform: scale(1.025); } .elementor-13 .elementor-element.elementor-element-1cad15d1:active::after, .elementor-13 .elementor-element.elementor-element-1cad15d1:focus-within::after { animation: aa-image-glass .85s ease forwards; } } /* ========================================================= ANIMAZIONE GLASS ========================================================= */ @keyframes aa-image-glass { 0% { left: -45%; opacity: 0; } 15% { opacity: .9; } 80% { opacity: .9; } 100% { left: 115%; opacity: 0; } } /* ========================================================= MOBILE ========================================================= */ @media (max-width:767px) { .elementor-13 .elementor-element.elementor-element-1cad15d1, .elementor-13 .elementor-element.elementor-element-1cad15d1 img { border-radius: 14px; } } /* ========================================================= ACCESSIBILITÀ ========================================================= */ @media (prefers-reduced-motion:reduce) { .elementor-13 .elementor-element.elementor-element-1cad15d1, .elementor-13 .elementor-element.elementor-element-1cad15d1 img, .elementor-13 .elementor-element.elementor-element-1cad15d1::after { animation: none !important; transition: none !important; } }/* End custom CSS */ /* Start custom CSS for icon-box, class: .elementor-element-d5763d6 *//* ========================================== RIQUADRO ICONA SU SFONDO BIANCO Non modifica il font ========================================== */ .elementor-13 .elementor-element.elementor-element-d5763d6 .elementor-icon-box-wrapper { position: relative; display: inline-flex; align-items: center; width: auto; padding: 10px 17px; border: 1px solid rgba(200, 16, 46, 0.35); border-radius: 999px; background: linear-gradient( 115deg, rgba(200, 16, 46, 0.09), rgba(255, 255, 255, 0.98), rgba(115, 0, 24, 0.07) ); box-shadow: 0 10px 28px rgba(20, 20, 20, 0.10), inset 0 1px 0 rgba(255, 255, 255, 0.95), 0 0 20px rgba(200, 16, 46, 0.07); overflow: hidden; transition: border-color 0.5s ease, background 0.5s ease, box-shadow 0.5s ease; } /* Riflesso satinato */ .elementor-13 .elementor-element.elementor-element-d5763d6 .elementor-icon-box-wrapper::before { content: ""; position: absolute; top: 0; left: -75%; width: 45%; height: 100%; background: linear-gradient( 90deg, transparent, rgba(255, 255, 255, 0.90), rgba(255, 53, 88, 0.18), transparent ); transform: skewX(-18deg); animation: agnelli-icon-light-section 6s ease-in-out infinite; pointer-events: none; } /* Icona */ .elementor-13 .elementor-element.elementor-element-d5763d6 .elementor-icon-box-icon { position: relative; z-index: 2; margin-bottom: 0 !important; } .elementor-13 .elementor-element.elementor-element-d5763d6 .elementor-icon { color: #C8102E !important; filter: drop-shadow(0 0 4px rgba(200, 16, 46, 0.25)); } /* Contenuto */ .elementor-13 .elementor-element.elementor-element-d5763d6 .elementor-icon-box-content { position: relative; z-index: 2; } /* Testo nero */ .elementor-13 .elementor-element.elementor-element-d5763d6 .elementor-icon-box-title, .elementor-13 .elementor-element.elementor-element-d5763d6 .elementor-icon-box-title a { color: #111111 !important; margin: 0 !important; } /* Hover */ .elementor-13 .elementor-element.elementor-element-d5763d6 .elementor-icon-box-wrapper:hover { border-color: #C8102E; background: linear-gradient( 115deg, rgba(200, 16, 46, 0.16), #FFFFFF, rgba(255, 53, 88, 0.11) ); box-shadow: 0 14px 34px rgba(20, 20, 20, 0.14), inset 0 1px 0 rgba(255, 255, 255, 1), 0 0 24px rgba(200, 16, 46, 0.15); } /* Durante il passaggio il testo diventa bordeaux */ .elementor-13 .elementor-element.elementor-element-d5763d6 .elementor-icon-box-wrapper:hover .elementor-icon-box-title, .elementor-13 .elementor-element.elementor-element-d5763d6 .elementor-icon-box-wrapper:hover .elementor-icon-box-title a { color: #730018 !important; } /* Animazione del riflesso */ @keyframes agnelli-icon-light-section { 0%, 25% { left: -75%; opacity: 0; } 35% { opacity: 1; } 65% { left: 135%; opacity: 1; } 75%, 100% { left: 135%; opacity: 0; } } /* Smartphone */ @media (max-width: 767px) { .elementor-13 .elementor-element.elementor-element-d5763d6 .elementor-icon-box-wrapper { padding: 9px 14px; } } /* Riduzione animazioni */ @media (prefers-reduced-motion: reduce) { .elementor-13 .elementor-element.elementor-element-d5763d6 .elementor-icon-box-wrapper::before { animation: none; } }/* End custom CSS */ /* Start custom CSS for heading, class: .elementor-element-163372f1 *//* ========================================== TITOLI H2 SU SFONDO BIANCO Riflesso rosso e bordeaux satinato Non modifica font, peso o dimensioni ========================================== */ .elementor-13 .elementor-element.elementor-element-163372f1 .elementor-heading-title { display: inline-block; color: #111111; background-image: linear-gradient( 105deg, #111111 0%, #111111 22%, #2B2B2B 34%, #C8102E 44%, #730018 52%, #E32646 60%, #2B2B2B 70%, #111111 82%, #111111 100% ); background-size: 280% 100%; background-position: 0% 50%; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; animation: agnelli-h2-light 11s ease-in-out infinite alternate; will-change: background-position; } .elementor-13 .elementor-element.elementor-element-163372f1 .elementor-heading-title a { color: inherit; -webkit-text-fill-color: inherit; } @keyframes agnelli-h2-light { 0% { background-position: 0% 50%; } 20% { background-position: 0% 50%; } 80% { background-position: 100% 50%; } 100% { background-position: 100% 50%; } } @media (prefers-reduced-motion: reduce) { .elementor-13 .elementor-element.elementor-element-163372f1 .elementor-heading-title { animation: none; background-position: 50% 50%; } }/* End custom CSS */ /* Start custom CSS for icon-list, class: .elementor-element-35bc481f *//* LISTA ICONE PREMIUM — SFONDO BIANCO */ .elementor-13 .elementor-element.elementor-element-35bc481f .elementor-icon-list-items { display: flex; flex-direction: column; gap: 10px; } .elementor-13 .elementor-element.elementor-element-35bc481f .elementor-icon-list-item { position: relative; overflow: hidden; margin: 0 !important; padding: 12px 15px !important; border: 1px solid #E8E5E6; border-radius: 13px; background: linear-gradient(105deg, #FFFFFF, #F8F7F7); box-shadow: inset 0 1px 0 #FFFFFF, 0 6px 20px rgba(35, 20, 25, 0.06); transition: border-color 0.35s ease, background 0.35s ease, box-shadow 0.35s ease; } /* Accento rosso laterale */ .elementor-13 .elementor-element.elementor-element-35bc481f .elementor-icon-list-item::before { content: ""; position: absolute; top: 18%; left: 0; width: 2px; height: 64%; border-radius: 5px; background: linear-gradient( 180deg, transparent, #C8102E, #730018, transparent ); opacity: 0.65; transition: opacity 0.35s ease, height 0.35s ease; } /* Cerchio dell’icona */ .elementor-13 .elementor-element.elementor-element-35bc481f .elementor-icon-list-icon { position: relative; z-index: 2; display: inline-flex !important; align-items: center; justify-content: center; flex: 0 0 26px; width: 26px; height: 26px; border-radius: 50%; background: linear-gradient(145deg, #D51B3C, #79001C); box-shadow: 0 0 0 3px rgba(200, 16, 46, 0.09), 0 4px 10px rgba(115, 0, 24, 0.18); } .elementor-13 .elementor-element.elementor-element-35bc481f .elementor-icon-list-icon i, .elementor-13 .elementor-element.elementor-element-35bc481f .elementor-icon-list-icon svg { color: #FFFFFF !important; fill: #FFFFFF !important; } /* Mantiene il font impostato in Elementor */ .elementor-13 .elementor-element.elementor-element-35bc481f .elementor-icon-list-text { position: relative; z-index: 2; color: #292326 !important; } .elementor-13 .elementor-element.elementor-element-35bc481f .elementor-icon-list-item:hover { border-color: rgba(200, 16, 46, 0.38); background: linear-gradient(105deg, #FFF4F6, #FFFFFF); box-shadow: inset 3px 0 0 #C8102E, 0 10px 24px rgba(80, 20, 35, 0.10); } .elementor-13 .elementor-element.elementor-element-35bc481f .elementor-icon-list-item:hover::before { height: 82%; opacity: 1; } @media (max-width: 767px) { .elementor-13 .elementor-element.elementor-element-35bc481f .elementor-icon-list-items { gap: 8px; } .elementor-13 .elementor-element.elementor-element-35bc481f .elementor-icon-list-item { padding: 11px 12px !important; border-radius: 11px; } .elementor-13 .elementor-element.elementor-element-35bc481f .elementor-icon-list-icon { flex-basis: 24px; width: 24px; height: 24px; } }/* End custom CSS */ /* Start custom CSS for image, class: .elementor-element-22a2eee *//* ========================================================= ANDREA AGNELLI — IMMAGINE PREMIUM Glass sweep + leggero zoom Da inserire direttamente nel widget Immagine ========================================================= */ .elementor-13 .elementor-element.elementor-element-22a2eee { position: relative; overflow: hidden; border-radius: 18px; box-shadow: 0 12px 28px rgba(0,0,0,.10); transition: transform .42s cubic-bezier(.22,.61,.36,1), box-shadow .42s ease; } /* immagine */ .elementor-13 .elementor-element.elementor-element-22a2eee img { display: block; width: 100%; height: auto; border-radius: 18px; transition: transform .55s cubic-bezier(.22,.61,.36,1), filter .45s ease; } /* ========================================================= GLASS SWEEP ========================================================= */ .elementor-13 .elementor-element.elementor-element-22a2eee::after { content: ""; position: absolute; top: -20%; left: -45%; width: 30%; height: 150%; background: linear-gradient( 90deg, transparent 0%, rgba(255,255,255,.08) 20%, rgba(255,255,255,.65) 50%, rgba(255,255,255,.12) 80%, transparent 100% ); transform: skewX(-18deg); opacity: 0; pointer-events: none; z-index: 5; } /* ========================================================= HOVER DESKTOP ========================================================= */ @media (hover:hover) { .elementor-13 .elementor-element.elementor-element-22a2eee:hover { transform: translateY(-4px); box-shadow: 0 20px 38px rgba(0,0,0,.14); } .elementor-13 .elementor-element.elementor-element-22a2eee:hover img { transform: scale(1.035); filter: saturate(1.04) contrast(1.015); } .elementor-13 .elementor-element.elementor-element-22a2eee:hover::after { animation: aa-image-glass 1s cubic-bezier(.22,.61,.36,1) forwards; } } /* ========================================================= TOUCH ========================================================= */ @media (hover:none) { .elementor-13 .elementor-element.elementor-element-22a2eee:active img, .elementor-13 .elementor-element.elementor-element-22a2eee:focus-within img { transform: scale(1.025); } .elementor-13 .elementor-element.elementor-element-22a2eee:active::after, .elementor-13 .elementor-element.elementor-element-22a2eee:focus-within::after { animation: aa-image-glass .85s ease forwards; } } /* ========================================================= ANIMAZIONE GLASS ========================================================= */ @keyframes aa-image-glass { 0% { left: -45%; opacity: 0; } 15% { opacity: .9; } 80% { opacity: .9; } 100% { left: 115%; opacity: 0; } } /* ========================================================= MOBILE ========================================================= */ @media (max-width:767px) { .elementor-13 .elementor-element.elementor-element-22a2eee, .elementor-13 .elementor-element.elementor-element-22a2eee img { border-radius: 14px; } } /* ========================================================= ACCESSIBILITÀ ========================================================= */ @media (prefers-reduced-motion:reduce) { .elementor-13 .elementor-element.elementor-element-22a2eee, .elementor-13 .elementor-element.elementor-element-22a2eee img, .elementor-13 .elementor-element.elementor-element-22a2eee::after { animation: none !important; transition: none !important; } }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-dde326f *//* ================================================== PULSANTE ANDREA AGNELLI SFONDO BIANCO - ROSSO SEMPRE VISIBILE IN PARTENZA ================================================== */ .elementor-13 .elementor-element.elementor-element-dde326f a.elementor-button, .elementor-13 .elementor-element.elementor-element-dde326f .elementor-button { position: relative; isolation: isolate; overflow: hidden; /* FORZA COMPLETAMENTE LO STATO INIZIALE */ background: #B11226 !important; background-color: #B11226 !important; background-image: none !important; color: #ffffff !important; border: 1px solid #B11226 !important; border-color: #B11226 !important; box-shadow: 0 10px 25px rgba(177, 18, 38, 0.22), inset 0 0 0 1px rgba(255, 255, 255, 0.10); transition: color 1.1s ease, transform 0.65s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.65s ease, border-color 0.8s ease; } /* ================================================== TESTO ================================================== */ .elementor-13 .elementor-element.elementor-element-dde326f .elementor-button-content-wrapper { position: relative; z-index: 5; } .elementor-13 .elementor-element.elementor-element-dde326f .elementor-button-text { position: relative; z-index: 5; color: #ffffff !important; -webkit-text-fill-color: #ffffff !important; transition: color 1.1s ease, -webkit-text-fill-color 1.1s ease; } /* ================================================== STRATO CHIARO CHE ENTRA DA SINISTRA ================================================== */ .elementor-13 .elementor-element.elementor-element-dde326f .elementor-button::before { content: ""; position: absolute; inset: 0; z-index: 2; border-radius: inherit; background: linear-gradient( to bottom, #F7F7F7 0%, #F7F7F7 calc(100% - 7px), rgba(177, 18, 38, 0.18) calc(100% - 7px), rgba(177, 18, 38, 0.18) calc(100% - 5px), #F7F7F7 calc(100% - 5px) ); transform: scaleX(0); transform-origin: left center; transition: transform 0.7s ease; } /* ================================================== FORBICI ================================================== */ .elementor-13 .elementor-element.elementor-element-dde326f .elementor-button::after { content: ""; position: absolute; z-index: 7; width: 31px; height: 31px; left: 8px; bottom: -1px; background-color: #ffffff; -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 3.5c-.614-.884-.074-1.962.858-2.5L8 7.226 11.642 1c.932.538 1.472 1.616.858 2.5L8.81 8.61l1.556 2.661a2.5 2.5 0 1 1-.794.637L8 9.73l-1.572 2.177a2.5 2.5 0 1 1-.794-.637L7.19 8.61zm2.5 10a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0m7 0a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0'/%3E%3C/svg%3E"); -webkit-mask-repeat: no-repeat; -webkit-mask-position: center; -webkit-mask-size: contain; mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 3.5c-.614-.884-.074-1.962.858-2.5L8 7.226 11.642 1c.932.538 1.472 1.616.858 2.5L8.81 8.61l1.556 2.661a2.5 2.5 0 1 1-.794.637L8 9.73l-1.572 2.177a2.5 2.5 0 1 1-.794-.637L7.19 8.61zm2.5 10a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0m7 0a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0'/%3E%3C/svg%3E"); mask-repeat: no-repeat; mask-position: center; mask-size: contain; opacity: 0; pointer-events: none; filter: drop-shadow(0 2px 2px rgba(0, 0, 0, 0.14)); transition: opacity 0.35s ease, filter 0.35s ease; } /* ================================================== HOVER ================================================== */ .elementor-13 .elementor-element.elementor-element-dde326f a.elementor-button:hover, .elementor-13 .elementor-element.elementor-element-dde326f .elementor-button:hover { /* NON METTIAMO background bianco QUI. Deve essere lo ::before ad avanzare gradualmente. */ color: #111111 !important; border-color: #B11226 !important; transform: translateY(-2px); box-shadow: 0 16px 34px rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(177, 18, 38, 0.14); } /* TESTO NERO IN HOVER */ .elementor-13 .elementor-element.elementor-element-dde326f .elementor-button:hover .elementor-button-text { color: #111111 !important; -webkit-text-fill-color: #111111 !important; } /* ================================================== PASSAGGIO CHIARO FLUIDO ================================================== */ .elementor-13 .elementor-element.elementor-element-dde326f .elementor-button:hover::before { animation: aa-passaggio-chiaro 1.6s cubic-bezier(0.45, 0, 0.15, 1) forwards; } /* ================================================== FORBICI ================================================== */ .elementor-13 .elementor-element.elementor-element-dde326f .elementor-button:hover::after { animation: aa-forbici-chiaro 1.6s cubic-bezier(0.45, 0, 0.15, 1) forwards; } /* ================================================== ANIMAZIONE SFONDO ================================================== */ @keyframes aa-passaggio-chiaro { 0% { transform: scaleX(0); } 100% { transform: scaleX(1); } } /* ================================================== ANIMAZIONE FORBICI ================================================== */ @keyframes aa-forbici-chiaro { 0% { left: 8px; opacity: 0; background-color: #ffffff; transform: rotate(90deg) scale(0.92); filter: blur(0.8px) drop-shadow(0 2px 2px rgba(0, 0, 0, 0.12)); } 10% { opacity: 1; background-color: #ffffff; transform: rotate(90deg) scale(1); filter: blur(0) drop-shadow(0 2px 2px rgba(0, 0, 0, 0.14)); } 22% { opacity: 1; background-color: #ffffff; } /* DIVENTANO ROSSE SULLA PARTE CHIARA */ 42% { opacity: 1; background-color: #B11226; } 78% { opacity: 1; background-color: #B11226; transform: rotate(90deg) scale(1); filter: blur(0) drop-shadow(0 2px 2px rgba(0, 0, 0, 0.14)); } 90% { left: calc(100% - 48px); opacity: 0.55; background-color: #B11226; transform: rotate(90deg) scale(0.97); filter: blur(0.3px) drop-shadow(0 2px 2px rgba(0, 0, 0, 0.10)); } 100% { left: calc(100% - 37px); opacity: 0; background-color: #B11226; transform: rotate(90deg) scale(0.90); filter: blur(1.4px); } } /* ================================================== MOBILE ================================================== */ @media (max-width: 767px) { .elementor-13 .elementor-element.elementor-element-dde326f .elementor-button::after { width: 27px; height: 27px; bottom: 0; } } /* ================================================== RIDUZIONE MOVIMENTO ================================================== */ @media (prefers-reduced-motion: reduce) { .elementor-13 .elementor-element.elementor-element-dde326f .elementor-button, .elementor-13 .elementor-element.elementor-element-dde326f .elementor-button::before, .elementor-13 .elementor-element.elementor-element-dde326f .elementor-button::after, .elementor-13 .elementor-element.elementor-element-dde326f .elementor-button-text { animation: none !important; transition-duration: 0.2s; } }/* End custom CSS */ /* Start custom CSS for heading, class: .elementor-element-47196a3 *//* ========================================== TITOLI H2 SU SFONDO NERO Riflesso rosso lento e satinato Non modifica font, peso o dimensioni ========================================== */ .elementor-13 .elementor-element.elementor-element-47196a3 .elementor-heading-title { display: inline-block; color: #FFFFFF; background-image: linear-gradient( 105deg, #FFFFFF 0%, #FFFFFF 22%, #E8E8E8 34%, #FF3558 44%, #C8102E 52%, #FF3558 60%, #E8E8E8 70%, #FFFFFF 82%, #FFFFFF 100% ); background-size: 280% 100%; background-position: 0% 50%; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; animation: agnelli-h2-dark 11s ease-in-out infinite alternate; will-change: background-position; } .elementor-13 .elementor-element.elementor-element-47196a3 .elementor-heading-title a { color: inherit; -webkit-text-fill-color: inherit; } @keyframes agnelli-h2-dark { 0% { background-position: 0% 50%; } 20% { background-position: 0% 50%; } 80% { background-position: 100% 50%; } 100% { background-position: 100% 50%; } } @media (prefers-reduced-motion: reduce) { .elementor-13 .elementor-element.elementor-element-47196a3 .elementor-heading-title { animation: none; background-position: 50% 50%; } }/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-c0c0ccf *//* ================================================== PULSANTE PRINCIPALE ANDREA AGNELLI EFFETTO ORIGINALE + COLORI BLOCCATI ================================================== */ .elementor-13 .elementor-element.elementor-element-c0c0ccf .elementor-button { position: relative; isolation: isolate; overflow: hidden; /* COLORI BLOCCATI - STATO INIZIALE */ color: #ffffff !important; background-color: #B11226 !important; border-color: #B11226 !important; box-shadow: 0 10px 25px rgba(177, 18, 38, 0.22), inset 0 0 0 1px rgba(255, 255, 255, 0.10); transition: color 1.1s ease, transform 0.65s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.65s ease, border-color 0.8s ease; } /* ================================================== TESTO SEMPRE SOPRA ALL’ANIMAZIONE ================================================== */ .elementor-13 .elementor-element.elementor-element-c0c0ccf .elementor-button-content-wrapper { position: relative; z-index: 5; } /* COLORE TESTO BLOCCATO */ .elementor-13 .elementor-element.elementor-element-c0c0ccf .elementor-button-text { color: #ffffff !important; transition: color 1.1s ease; } /* ================================================== PASSAGGIO DAL ROSSO AL BIANCO IDENTICO ALL'ORIGINALE ================================================== */ .elementor-13 .elementor-element.elementor-element-c0c0ccf .elementor-button::before { content: ""; position: absolute; inset: 0; z-index: 2; border-radius: inherit; background: linear-gradient( to bottom, #ffffff 0%, #ffffff calc(100% - 7px), rgba(177, 18, 38, 0.15) calc(100% - 7px), rgba(177, 18, 38, 0.15) calc(100% - 5px), #ffffff calc(100% - 5px) ); transform: scaleX(0); transform-origin: left center; transition: transform 0.7s ease; } /* ================================================== FORBICI COMPLETE IN UN UNICO SVG ================================================== */ .elementor-13 .elementor-element.elementor-element-c0c0ccf .elementor-button::after { content: ""; position: absolute; z-index: 7; width: 31px; height: 31px; left: 8px; bottom: -1px; /* BIANCHE SUL ROSSO */ background-color: #ffffff; -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 3.5c-.614-.884-.074-1.962.858-2.5L8 7.226 11.642 1c.932.538 1.472 1.616.858 2.5L8.81 8.61l1.556 2.661a2.5 2.5 0 1 1-.794.637L8 9.73l-1.572 2.177a2.5 2.5 0 1 1-.794-.637L7.19 8.61zm2.5 10a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0m7 0a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0'/%3E%3C/svg%3E"); -webkit-mask-repeat: no-repeat; -webkit-mask-position: center; -webkit-mask-size: contain; mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 3.5c-.614-.884-.074-1.962.858-2.5L8 7.226 11.642 1c.932.538 1.472 1.616.858 2.5L8.81 8.61l1.556 2.661a2.5 2.5 0 1 1-.794.637L8 9.73l-1.572 2.177a2.5 2.5 0 1 1-.794-.637L7.19 8.61zm2.5 10a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0m7 0a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0'/%3E%3C/svg%3E"); mask-repeat: no-repeat; mask-position: center; mask-size: contain; opacity: 0; pointer-events: none; filter: drop-shadow(0 2px 2px rgba(0, 0, 0, 0.14)); transition: opacity 0.35s ease, filter 0.35s ease; } /* ================================================== HOVER ================================================== */ .elementor-13 .elementor-element.elementor-element-c0c0ccf .elementor-button:hover { /* NON CAMBIAMO LO SFONDO QUI: IL BIANCO DEVE ENTRARE CON L'ANIMAZIONE */ color: #111111 !important; border-color: #ffffff !important; transform: translateY(-2px); box-shadow: 0 16px 34px rgba(0, 0, 0, 0.18), 0 0 0 1px rgba(177, 18, 38, 0.10); } /* TESTO DA BIANCO A NERO IN MODO FLUIDO */ .elementor-13 .elementor-element.elementor-element-c0c0ccf .elementor-button:hover .elementor-button-text { color: #111111 !important; } /* ================================================== PASSAGGIO BIANCO FLUIDO ================================================== */ .elementor-13 .elementor-element.elementor-element-c0c0ccf .elementor-button:hover::before { animation: aa-passaggio-bianco 1.6s cubic-bezier(0.45, 0, 0.15, 1) forwards; } /* ================================================== SCORRIMENTO DELLE FORBICI ================================================== */ .elementor-13 .elementor-element.elementor-element-c0c0ccf .elementor-button:hover::after { animation: aa-forbici-bicolore 1.6s cubic-bezier(0.45, 0, 0.15, 1) forwards; } /* ================================================== ANIMAZIONE DELLO SFONDO ================================================== */ @keyframes aa-passaggio-bianco { 0% { transform: scaleX(0); } 100% { transform: scaleX(1); } } /* ================================================== ANIMAZIONE FLUIDA DELLE FORBICI ================================================== */ @keyframes aa-forbici-bicolore { 0% { left: 8px; opacity: 0; background-color: #ffffff; transform: rotate(90deg) scale(0.92); filter: blur(0.8px) drop-shadow(0 2px 2px rgba(0, 0, 0, 0.12)); } /* COMPARSA MORBIDA SUL ROSSO */ 10% { opacity: 1; background-color: #ffffff; transform: rotate(90deg) scale(1); filter: blur(0) drop-shadow(0 2px 2px rgba(0, 0, 0, 0.14)); } /* ANCORA BIANCHE */ 22% { opacity: 1; background-color: #ffffff; } /* PASSAGGIO GRADUALE AL ROSSO */ 42% { opacity: 1; background-color: #B11226; } /* MOVIMENTO CENTRALE */ 78% { opacity: 1; background-color: #B11226; transform: rotate(90deg) scale(1); filter: blur(0) drop-shadow(0 2px 2px rgba(0, 0, 0, 0.14)); } /* INIZIO DISSOLVENZA */ 90% { left: calc(100% - 48px); opacity: 0.55; background-color: #B11226; transform: rotate(90deg) scale(0.97); filter: blur(0.3px) drop-shadow(0 2px 2px rgba(0, 0, 0, 0.10)); } /* SCOMPARSA PRIMA DEL BORDO */ 100% { left: calc(100% - 37px); opacity: 0; background-color: #B11226; transform: rotate(90deg) scale(0.90); filter: blur(1.4px); } } /* ================================================== TELEFONO ================================================== */ @media (max-width: 767px) { .elementor-13 .elementor-element.elementor-element-c0c0ccf .elementor-button::after { width: 27px; height: 27px; bottom: 0; } } /* ================================================== RIDUZIONE MOVIMENTO SE RICHIESTA ================================================== */ @media (prefers-reduced-motion: reduce) { .elementor-13 .elementor-element.elementor-element-c0c0ccf .elementor-button, .elementor-13 .elementor-element.elementor-element-c0c0ccf .elementor-button::before, .elementor-13 .elementor-element.elementor-element-c0c0ccf .elementor-button::after, .elementor-13 .elementor-element.elementor-element-c0c0ccf .elementor-button-text { animation: none !important; transition-duration: 0.2s; } }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-2ad92b8 *//* ========================================================= ANDREA AGNELLI — CTA PRE-FOOTER Sfondo fisso + overlay permanente + lama rossa in hover Non modifica testo, font o pulsanti ========================================================= */ .elementor-13 .elementor-element.elementor-element-2ad92b8 { position: relative; overflow: hidden; isolation: isolate; min-height: 520px; background-size: cover !important; background-position: center 42% !important; background-repeat: no-repeat !important; /* Effetto sfondo fisso durante lo scorrimento */ background-attachment: fixed !important; filter: saturate(1) contrast(1); transition: filter .45s ease, background-position .8s ease; } /* --------------------------------------------------------- OVERLAY FISSO NERO-BORDEAUX Sempre presente, anche senza hover --------------------------------------------------------- */ .elementor-13 .elementor-element.elementor-element-2ad92b8::after { content: ""; position: absolute; inset: 0; background: linear-gradient( 110deg, rgba(0, 0, 0, 0.30) 0%, rgba(25, 2, 9, 0.24) 55%, rgba(72, 3, 23, 0.18) 100% ); opacity: 1; pointer-events: none; z-index: 1; } /* --------------------------------------------------------- LAMA ROSSA SUPERIORE --------------------------------------------------------- */ .elementor-13 .elementor-element.elementor-element-2ad92b8::before { content: ""; position: absolute; top: 0; left: -35%; width: 30%; height: 3px; background: linear-gradient( 90deg, transparent 0%, rgba(177, 18, 38, 0.25) 20%, #B11226 50%, rgba(118, 0, 24, 0.75) 72%, transparent 100% ); box-shadow: 0 0 10px rgba(177, 18, 38, 0.28), 0 0 18px rgba(177, 18, 38, 0.12); opacity: 0; pointer-events: none; z-index: 3; } /* Contenuti sempre sopra l’overlay */ .elementor-13 .elementor-element.elementor-element-2ad92b8 > * { position: relative; z-index: 4; } /* ========================================================= HOVER DESKTOP — SOLO LAMA ROSSA ========================================================= */ @media (hover: hover) and (pointer: fine) { .elementor-13 .elementor-element.elementor-element-2ad92b8:hover::before { animation: aa-lama-rossa 1.15s cubic-bezier(.22, .61, .36, 1) forwards; } .elementor-13 .elementor-element.elementor-element-2ad92b8:hover { filter: saturate(1.04) contrast(1.01); } } /* Animazione lama da sinistra a destra */ @keyframes aa-lama-rossa { 0% { left: -35%; opacity: 0; } 12% { opacity: 1; } 80% { opacity: 1; } 100% { left: 105%; opacity: 0; } } /* ========================================================= TABLET ========================================================= */ @media (max-width: 1024px) { .elementor-13 .elementor-element.elementor-element-2ad92b8 { min-height: 470px; background-position: center center !important; /* Più stabile sui dispositivi touch */ background-attachment: scroll !important; } .elementor-13 .elementor-element.elementor-element-2ad92b8::before { width: 34%; } } /* ========================================================= MOBILE ========================================================= */ @media (max-width: 767px) { .elementor-13 .elementor-element.elementor-element-2ad92b8 { min-height: 430px; background-position: center center !important; background-attachment: scroll !important; } /* Nessuna animazione hover su telefono */ .elementor-13 .elementor-element.elementor-element-2ad92b8::before { display: none; } /* Overlay sempre presente */ .elementor-13 .elementor-element.elementor-element-2ad92b8::after { opacity: 1; } } /* ========================================================= ACCESSIBILITÀ ========================================================= */ @media (prefers-reduced-motion: reduce) { .elementor-13 .elementor-element.elementor-element-2ad92b8, .elementor-13 .elementor-element.elementor-element-2ad92b8::before, .elementor-13 .elementor-element.elementor-element-2ad92b8::after { transition: none !important; animation: none !important; } }/* End custom CSS */