.elementor-725 .elementor-element.elementor-element-d9998a6{--display:flex;--min-height:100vh;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;--overlay-opacity:0.8;--margin-top:-43px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-725 .elementor-element.elementor-element-d9998a6:not(.elementor-motion-effects-element-type-background), .elementor-725 .elementor-element.elementor-element-d9998a6 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://studiolembo.com/wp-content/uploads/2026/07/WhatsApp-Image-2026-07-24-at-12.20.30-PM.jpeg");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-725 .elementor-element.elementor-element-d9998a6::before, .elementor-725 .elementor-element.elementor-element-d9998a6 > .elementor-background-video-container::before, .elementor-725 .elementor-element.elementor-element-d9998a6 > .e-con-inner > .elementor-background-video-container::before, .elementor-725 .elementor-element.elementor-element-d9998a6 > .elementor-background-slideshow::before, .elementor-725 .elementor-element.elementor-element-d9998a6 > .e-con-inner > .elementor-background-slideshow::before, .elementor-725 .elementor-element.elementor-element-d9998a6 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:#06111B;--background-overlay:'';}.elementor-725 .elementor-element.elementor-element-c3737b1{--display:flex;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-725 .elementor-element.elementor-element-62ffa07 .elementor-heading-title{font-family:"Marcellus", Sans-serif;font-size:59px;font-weight:400;line-height:70px;color:#FFFFFF;}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-725 .elementor-element.elementor-element-d482e99{font-family:"Hanken Grotesk", Sans-serif;font-size:18px;font-weight:400;line-height:30px;color:#FFFFFF;}.elementor-725 .elementor-element.elementor-element-4ceeab5{font-family:"Hanken Grotesk", Sans-serif;font-size:18px;font-weight:400;line-height:30px;color:#FFFFFF;}.elementor-widget-button .elementor-button{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-725 .elementor-element.elementor-element-ce07ac7{--display:flex;}.elementor-725 .elementor-element.elementor-element-1eed52a{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--padding-top:80px;--padding-bottom:80px;--padding-left:0px;--padding-right:0px;}.elementor-725 .elementor-element.elementor-element-1eed52a:not(.elementor-motion-effects-element-type-background), .elementor-725 .elementor-element.elementor-element-1eed52a > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FBFAF7;}.elementor-725 .elementor-element.elementor-element-0c29168{--display:flex;}.elementor-725 .elementor-element.elementor-element-5ec9c45 .elementor-heading-title{font-family:"Marcellus", Sans-serif;font-size:50px;font-weight:400;line-height:67px;color:#031320;}.elementor-725 .elementor-element.elementor-element-408ca82{--display:flex;}.elementor-725 .elementor-element.elementor-element-ddf1919{font-family:"Hanken Grotesk", Sans-serif;font-size:18px;font-weight:400;line-height:30px;color:#6E7887;}.elementor-725 .elementor-element.elementor-element-c4e43c5{font-family:"Hanken Grotesk", Sans-serif;font-size:18px;font-weight:400;line-height:30px;color:#6E7887;}.elementor-725 .elementor-element.elementor-element-11ee74d{font-family:"Hanken Grotesk", Sans-serif;font-size:18px;font-weight:400;line-height:30px;color:#6E7887;}.elementor-725 .elementor-element.elementor-element-2964622{--display:flex;--overlay-opacity:0.84;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-725 .elementor-element.elementor-element-2964622::before, .elementor-725 .elementor-element.elementor-element-2964622 > .elementor-background-video-container::before, .elementor-725 .elementor-element.elementor-element-2964622 > .e-con-inner > .elementor-background-video-container::before, .elementor-725 .elementor-element.elementor-element-2964622 > .elementor-background-slideshow::before, .elementor-725 .elementor-element.elementor-element-2964622 > .e-con-inner > .elementor-background-slideshow::before, .elementor-725 .elementor-element.elementor-element-2964622 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:#0B1626;--background-overlay:'';}.elementor-725 .elementor-element.elementor-element-8d10fbf .elementor-heading-title{font-family:"Marcellus", Sans-serif;font-size:51px;font-weight:400;line-height:57px;color:#FFFFFF;}.elementor-725 .elementor-element.elementor-element-76a7ff7{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}.elementor-725 .elementor-element.elementor-element-563ecd7{--display:grid;--e-con-grid-template-columns:repeat(2, 1fr);--e-con-grid-template-rows:repeat(2, 1fr);--grid-auto-flow:row;}.elementor-widget-icon-box.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-primary );}.elementor-widget-icon-box.elementor-view-framed .elementor-icon, .elementor-widget-icon-box.elementor-view-default .elementor-icon{fill:var( --e-global-color-primary );color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-widget-icon-box .elementor-icon-box-title, .elementor-widget-icon-box .elementor-icon-box-title a{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-icon-box .elementor-icon-box-title{color:var( --e-global-color-primary );}.elementor-widget-icon-box:has(:hover) .elementor-icon-box-title, .elementor-widget-icon-box:has(:focus) .elementor-icon-box-title{color:var( --e-global-color-primary );}.elementor-widget-icon-box .elementor-icon-box-description{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-725 .elementor-element.elementor-element-3999e6a{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--padding-top:80px;--padding-bottom:80px;--padding-left:0px;--padding-right:0px;}.elementor-725 .elementor-element.elementor-element-3999e6a:not(.elementor-motion-effects-element-type-background), .elementor-725 .elementor-element.elementor-element-3999e6a > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FBFAF7;}.elementor-725 .elementor-element.elementor-element-b98d3a5{--display:flex;}.elementor-725 .elementor-element.elementor-element-859bc31 .elementor-heading-title{font-family:"Marcellus", Sans-serif;font-size:51px;font-weight:400;line-height:57px;color:#181818;}.elementor-725 .elementor-element.elementor-element-ac4cbe2{font-family:"Hanken Grotesk", Sans-serif;font-size:18px;font-weight:400;line-height:30px;color:#6E7887;}.elementor-725 .elementor-element.elementor-element-a0faf56{font-family:"Hanken Grotesk", Sans-serif;font-size:18px;font-weight:400;line-height:30px;color:#6E7887;}.elementor-725 .elementor-element.elementor-element-fc46d39{font-family:"Hanken Grotesk", Sans-serif;font-size:18px;font-weight:400;line-height:30px;color:#6E7887;}.elementor-725 .elementor-element.elementor-element-1f1fb45{--display:flex;}.elementor-725 .elementor-element.elementor-element-375a1ca{--display:flex;--min-height:100vh;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-725 .elementor-element.elementor-element-375a1ca:not(.elementor-motion-effects-element-type-background), .elementor-725 .elementor-element.elementor-element-375a1ca > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-725 .elementor-element.elementor-element-3196cca{--display:flex;--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-widget-image .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-725 .elementor-element.elementor-element-4bc71fc img{height:600px;object-fit:cover;object-position:top left;}.elementor-725 .elementor-element.elementor-element-cc2a76e{--display:flex;--justify-content:center;--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-725 .elementor-element.elementor-element-632766c .elementor-heading-title{font-family:"Marcellus", Sans-serif;font-size:51px;font-weight:400;line-height:57px;color:#FFFFFF;}.elementor-725 .elementor-element.elementor-element-a490ca1{font-family:"Hanken Grotesk", Sans-serif;font-size:18px;font-weight:400;line-height:30px;color:#B7BBC0;}.elementor-725 .elementor-element.elementor-element-10dc545{font-family:"Hanken Grotesk", Sans-serif;font-size:18px;font-weight:400;line-height:30px;color:#B7BBC0;}.elementor-725 .elementor-element.elementor-element-a5067ff{--display:flex;--padding-top:80px;--padding-bottom:80px;--padding-left:0px;--padding-right:0px;}.elementor-725 .elementor-element.elementor-element-a5067ff:not(.elementor-motion-effects-element-type-background), .elementor-725 .elementor-element.elementor-element-a5067ff > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#0B1626;}.elementor-725 .elementor-element.elementor-element-51260d1 .elementor-heading-title{font-family:"Marcellus", Sans-serif;font-size:51px;font-weight:400;line-height:57px;color:#FFFFFF;}.elementor-725 .elementor-element.elementor-element-5dcd331{width:var( --container-widget-width, 55% );max-width:55%;--container-widget-width:55%;--container-widget-flex-grow:0;font-family:"Hanken Grotesk", Sans-serif;font-size:18px;font-weight:400;line-height:30px;color:#B9B9B9;}.elementor-725 .elementor-element.elementor-element-7ac857d{width:var( --container-widget-width, 55% );max-width:55%;--container-widget-width:55%;--container-widget-flex-grow:0;font-family:"Hanken Grotesk", Sans-serif;font-size:18px;font-weight:400;line-height:30px;color:#B9B9B9;}.elementor-725 .elementor-element.elementor-element-96fca9d{--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;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:30px;--padding-bottom:30px;--padding-left:0px;--padding-right:0px;}.elementor-725 .elementor-element.elementor-element-96fca9d:not(.elementor-motion-effects-element-type-background), .elementor-725 .elementor-element.elementor-element-96fca9d > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#0B1626;}.elementor-725 .elementor-element.elementor-element-d3860b7{--display:flex;--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-725 .elementor-element.elementor-element-4a735f8{--display:grid;--e-con-grid-template-columns:repeat(7, 1fr);--e-con-grid-template-rows:repeat(2, 1fr);--grid-auto-flow:row;--justify-items:center;--align-items:center;}.elementor-725 .elementor-element.elementor-element-10d13d9{--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;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:30px;--padding-bottom:30px;--padding-left:0px;--padding-right:0px;}.elementor-725 .elementor-element.elementor-element-10d13d9:not(.elementor-motion-effects-element-type-background), .elementor-725 .elementor-element.elementor-element-10d13d9 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#0B1626;}.elementor-725 .elementor-element.elementor-element-6b70d42{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}.elementor-725 .elementor-element.elementor-element-20809d4{--display:grid;--e-con-grid-template-columns:repeat(3, 1fr);--e-con-grid-template-rows:repeat(2, 1fr);--grid-auto-flow:row;}.elementor-725 .elementor-element.elementor-element-1553ac1{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--padding-top:80px;--padding-bottom:80px;--padding-left:0px;--padding-right:0px;}.elementor-725 .elementor-element.elementor-element-1553ac1:not(.elementor-motion-effects-element-type-background), .elementor-725 .elementor-element.elementor-element-1553ac1 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FBFAF7;}.elementor-725 .elementor-element.elementor-element-4a295e3{--display:flex;}.elementor-725 .elementor-element.elementor-element-a4d898a .elementor-heading-title{font-family:"Marcellus", Sans-serif;font-size:51px;font-weight:400;line-height:57px;color:#181818;}.elementor-725 .elementor-element.elementor-element-667de6a{font-family:"Hanken Grotesk", Sans-serif;font-size:18px;font-weight:400;line-height:30px;color:#6E7887;}.elementor-725 .elementor-element.elementor-element-4a89438{font-family:"Hanken Grotesk", Sans-serif;font-size:18px;font-weight:400;line-height:30px;color:#6E7887;}.elementor-725 .elementor-element.elementor-element-b83d957{font-family:"Hanken Grotesk", Sans-serif;font-size:18px;font-weight:400;line-height:30px;color:#6E7887;}.elementor-725 .elementor-element.elementor-element-2b5097d{--display:flex;}.elementor-725 .elementor-element.elementor-element-3243b7d{--display:flex;--min-height:100vh;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-725 .elementor-element.elementor-element-3243b7d:not(.elementor-motion-effects-element-type-background), .elementor-725 .elementor-element.elementor-element-3243b7d > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-725 .elementor-element.elementor-element-8b42ed6{--display:flex;--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-725 .elementor-element.elementor-element-455143f img{height:500px;object-fit:cover;object-position:top left;}.elementor-725 .elementor-element.elementor-element-8a2fc0c{--display:flex;--justify-content:center;--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-725 .elementor-element.elementor-element-d46ad0b .elementor-heading-title{font-family:"Marcellus", Sans-serif;font-size:51px;font-weight:400;line-height:57px;color:#FFFFFF;}.elementor-725 .elementor-element.elementor-element-349165a{font-family:"Hanken Grotesk", Sans-serif;font-size:18px;font-weight:400;line-height:30px;color:#B7BBC0;}.elementor-725 .elementor-element.elementor-element-75b5d8b{font-family:"Hanken Grotesk", Sans-serif;font-size:18px;font-weight:400;line-height:30px;color:#B7BBC0;}.elementor-725 .elementor-element.elementor-element-1369b43{font-family:"Hanken Grotesk", Sans-serif;font-size:18px;font-weight:400;line-height:30px;color:#B7BBC0;}.elementor-725 .elementor-element.elementor-element-cfd7a1f{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--padding-top:80px;--padding-bottom:80px;--padding-left:0px;--padding-right:0px;}.elementor-725 .elementor-element.elementor-element-cfd7a1f:not(.elementor-motion-effects-element-type-background), .elementor-725 .elementor-element.elementor-element-cfd7a1f > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FBFAF7;}.elementor-725 .elementor-element.elementor-element-d15d7bd{--display:flex;}.elementor-725 .elementor-element.elementor-element-f0c53c2 .elementor-heading-title{font-family:"Marcellus", Sans-serif;font-size:51px;font-weight:400;line-height:57px;color:#181818;}.elementor-725 .elementor-element.elementor-element-d0dc9c1{font-family:"Hanken Grotesk", Sans-serif;font-size:18px;font-weight:400;line-height:30px;color:#6E7887;}.elementor-725 .elementor-element.elementor-element-f528e65{font-family:"Hanken Grotesk", Sans-serif;font-size:18px;font-weight:400;line-height:30px;color:#6E7887;}.elementor-725 .elementor-element.elementor-element-1391e8a{font-family:"Hanken Grotesk", Sans-serif;font-size:18px;font-weight:400;line-height:30px;color:#6E7887;}.elementor-725 .elementor-element.elementor-element-c7d45bb{--display:flex;}.elementor-725 .elementor-element.elementor-element-fc9046a{--display:flex;--padding-top:80px;--padding-bottom:80px;--padding-left:0px;--padding-right:0px;}.elementor-725 .elementor-element.elementor-element-fc9046a:not(.elementor-motion-effects-element-type-background), .elementor-725 .elementor-element.elementor-element-fc9046a > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#0B1626;}.elementor-725 .elementor-element.elementor-element-ad23887 .elementor-heading-title{font-family:"Marcellus", Sans-serif;font-size:51px;font-weight:400;line-height:57px;color:#FFFFFF;}.elementor-725 .elementor-element.elementor-element-b1d041c{width:var( --container-widget-width, 55% );max-width:55%;--container-widget-width:55%;--container-widget-flex-grow:0;font-family:"Hanken Grotesk", Sans-serif;font-size:18px;font-weight:400;line-height:30px;color:#B9B9B9;}.elementor-725 .elementor-element.elementor-element-6a404f6{--display:grid;--e-con-grid-template-columns:repeat(3, 1fr);--e-con-grid-template-rows:repeat(2, 1fr);--grid-auto-flow:row;}.elementor-725 .elementor-element.elementor-element-0b8b3fb{--display:flex;--min-height:100vh;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-725 .elementor-element.elementor-element-0b8b3fb:not(.elementor-motion-effects-element-type-background), .elementor-725 .elementor-element.elementor-element-0b8b3fb > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-725 .elementor-element.elementor-element-0379b5c{--display:flex;--justify-content:center;--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-725 .elementor-element.elementor-element-06b229d .elementor-heading-title{font-family:"Marcellus", Sans-serif;font-size:51px;font-weight:400;line-height:57px;color:#0A0A0A;}.elementor-725 .elementor-element.elementor-element-479b91a{font-family:"Hanken Grotesk", Sans-serif;font-size:18px;font-weight:400;line-height:30px;color:#B7BBC0;}.elementor-725 .elementor-element.elementor-element-27430fe{font-family:"Hanken Grotesk", Sans-serif;font-size:18px;font-weight:400;line-height:30px;color:#B7BBC0;}.elementor-725 .elementor-element.elementor-element-a21bd70{--display:flex;--min-height:100vh;--padding-top:80px;--padding-bottom:80px;--padding-left:0px;--padding-right:0px;}.elementor-725 .elementor-element.elementor-element-a21bd70:not(.elementor-motion-effects-element-type-background), .elementor-725 .elementor-element.elementor-element-a21bd70 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FBFAF7;}.elementor-725 .elementor-element.elementor-element-6a33185 .elementor-heading-title{font-family:"Marcellus", Sans-serif;font-size:51px;font-weight:400;line-height:57px;color:#0B1626;}.elementor-725 .elementor-element.elementor-element-cc665ec{--display:grid;--e-con-grid-template-columns:repeat(3, 1fr);--e-con-grid-template-rows:repeat(1, 1fr);--grid-auto-flow:row;}.elementor-725 .elementor-element.elementor-element-20c7887{--display:flex;--overlay-opacity:0.84;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-725 .elementor-element.elementor-element-20c7887::before, .elementor-725 .elementor-element.elementor-element-20c7887 > .elementor-background-video-container::before, .elementor-725 .elementor-element.elementor-element-20c7887 > .e-con-inner > .elementor-background-video-container::before, .elementor-725 .elementor-element.elementor-element-20c7887 > .elementor-background-slideshow::before, .elementor-725 .elementor-element.elementor-element-20c7887 > .e-con-inner > .elementor-background-slideshow::before, .elementor-725 .elementor-element.elementor-element-20c7887 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:#0B1626;--background-overlay:'';}.elementor-725 .elementor-element.elementor-element-c0b09e5 .elementor-heading-title{font-family:"Marcellus", Sans-serif;font-size:51px;font-weight:400;line-height:57px;color:#FFFFFF;}.elementor-725 .elementor-element.elementor-element-b3b26f6{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}.elementor-725 .elementor-element.elementor-element-a14c6e8{--display:grid;--e-con-grid-template-columns:repeat(3, 1fr);--e-con-grid-template-rows:repeat(2, 1fr);--grid-auto-flow:row;}.elementor-725 .elementor-element.elementor-element-cbf4f4a{--display:flex;--min-height:100vh;--padding-top:80px;--padding-bottom:80px;--padding-left:0px;--padding-right:0px;}.elementor-725 .elementor-element.elementor-element-cbf4f4a:not(.elementor-motion-effects-element-type-background), .elementor-725 .elementor-element.elementor-element-cbf4f4a > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FBFAF7;}.elementor-725 .elementor-element.elementor-element-a968071{padding:0px 0px 0px 0px;}.elementor-725 .elementor-element.elementor-element-a968071 .elementor-heading-title{font-family:"Marcellus", Sans-serif;font-size:51px;font-weight:400;line-height:57px;color:#0B1626;}.elementor-725 .elementor-element.elementor-element-6f2a58f .elementskit-accordion.accoedion-primary .elementskit-card .elementskit-card-header>.elementskit-btn-link[aria-expanded="true"], .elementor-725 .elementor-element.elementor-element-6f2a58f .elementskit-accordion .elementskit-card-header>.elementskit-btn-link[aria-expanded=true], .elementor-725 .elementor-element.elementor-element-6f2a58f .elementskit-accordion.floating-style .elementskit-card .elementskit-btn-link[aria-expanded="true"]{background-color:#0B174F;}.elementor-725 .elementor-element.elementor-element-6f2a58f .elementskit-accordion .elementskit-card-header>.elementskit-btn-link{background-color:#FDFDFD;font-family:"Marcellus", Sans-serif;font-size:18px;font-weight:400;line-height:25px;color:#000000;}.elementor-725 .elementor-element.elementor-element-6f2a58f .elementskit-accordion .elementskit-card .elementskit-card-header>.elementskit-btn-link[aria-expanded="true"]{color:#FFFFFF;}.elementor-725 .elementor-element.elementor-element-6f2a58f .elementskit-accordion.curve-shape .elementskit-card-header>.elementskit-btn-link[aria-expanded=true]{color:#FFFFFF;}.elementor-725 .elementor-element.elementor-element-6f2a58f .elementskit-accordion .elementskit-card-body p, .elementor-725 .elementor-element.elementor-element-6f2a58f .elementskit-accordion .elementskit-card-body{font-family:"Hanken Grotesk", Sans-serif;font-size:17px;}.elementor-725 .elementor-element.elementor-element-b988e42{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-725 .elementor-element.elementor-element-b988e42:not(.elementor-motion-effects-element-type-background), .elementor-725 .elementor-element.elementor-element-b988e42 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-725 .elementor-element.elementor-element-5ab11ff .slmb-card__media{aspect-ratio:1.35;}.elementor-725 .elementor-element.elementor-element-5ab11ff .slmb-foot{justify-content:center;}.elementor-725 .elementor-element.elementor-element-5ab11ff .slmb-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:34px;}.elementor-725 .elementor-element.elementor-element-5ab11ff .slmb-card__body{padding:28px;}.elementor-725 .elementor-element.elementor-element-5ab11ff .slmb-card{border-radius:0px;--lift:-6px;}.elementor-725 .elementor-element.elementor-element-5ab11ff .slmb{--stagger:0.09s;--slmd-pad:88px;--slmd-ink:#0A1220;--slmd-ink-2:#111C2E;--slmd-card:#0E1A2B;--slmd-card-2:#111F33;--slmd-ivory:#F6F4EE;--slmd-body:#B9C2CF;--slmd-muted:#8A94A3;--slmd-accent:#909CD5;--slmd-accent-lt:#C3D0DE;--slmd-fill:#0b174f;--slmd-on-accent:#F6F4EE;--slmd-line:rgba(246,244,238,0.10);}.elementor-725 .elementor-element.elementor-element-4362256{--display:flex;--min-height:600px;--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--overlay-opacity:0.64;--padding-top:80px;--padding-bottom:80px;--padding-left:0px;--padding-right:0px;}.elementor-725 .elementor-element.elementor-element-4362256:not(.elementor-motion-effects-element-type-background), .elementor-725 .elementor-element.elementor-element-4362256 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#F4F2EC;background-image:url("https://studiolembo.com/wp-content/uploads/2026/07/WhatsApp-Image-2026-07-24-at-12.11.46-PM.jpeg");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-725 .elementor-element.elementor-element-4362256::before, .elementor-725 .elementor-element.elementor-element-4362256 > .elementor-background-video-container::before, .elementor-725 .elementor-element.elementor-element-4362256 > .e-con-inner > .elementor-background-video-container::before, .elementor-725 .elementor-element.elementor-element-4362256 > .elementor-background-slideshow::before, .elementor-725 .elementor-element.elementor-element-4362256 > .e-con-inner > .elementor-background-slideshow::before, .elementor-725 .elementor-element.elementor-element-4362256 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:#07091A;--background-overlay:'';}.elementor-725 .elementor-element.elementor-element-d1560ee{width:var( --container-widget-width, 65% );max-width:65%;--container-widget-width:65%;--container-widget-flex-grow:0;text-align:center;}.elementor-725 .elementor-element.elementor-element-d1560ee .elementor-heading-title{font-family:"Marcellus", Sans-serif;font-size:51px;font-weight:400;line-height:57px;color:#FFFFFF;}.elementor-725 .elementor-element.elementor-element-c90a26a{width:var( --container-widget-width, 50% );max-width:50%;--container-widget-width:50%;--container-widget-flex-grow:0;text-align:center;font-family:"Hanken Grotesk", Sans-serif;font-size:18px;font-weight:400;line-height:30px;color:#FFFFFF;}@media(max-width:1024px){.elementor-725 .elementor-element.elementor-element-563ecd7{--grid-auto-flow:row;}.elementor-725 .elementor-element.elementor-element-4a735f8{--grid-auto-flow:row;}.elementor-725 .elementor-element.elementor-element-20809d4{--grid-auto-flow:row;}.elementor-725 .elementor-element.elementor-element-6a404f6{--grid-auto-flow:row;}.elementor-725 .elementor-element.elementor-element-cc665ec{--grid-auto-flow:row;}.elementor-725 .elementor-element.elementor-element-a14c6e8{--grid-auto-flow:row;}.elementor-725 .elementor-element.elementor-element-5ab11ff .slmb-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}@media(min-width:768px){.elementor-725 .elementor-element.elementor-element-d9998a6{--content-width:1200px;}.elementor-725 .elementor-element.elementor-element-1eed52a{--content-width:1200px;}.elementor-725 .elementor-element.elementor-element-2964622{--content-width:1200px;}.elementor-725 .elementor-element.elementor-element-3999e6a{--content-width:1200px;}.elementor-725 .elementor-element.elementor-element-375a1ca{--content-width:1200px;}.elementor-725 .elementor-element.elementor-element-a5067ff{--content-width:1200px;}.elementor-725 .elementor-element.elementor-element-10d13d9{--content-width:1200px;}.elementor-725 .elementor-element.elementor-element-1553ac1{--content-width:1200px;}.elementor-725 .elementor-element.elementor-element-3243b7d{--content-width:1200px;}.elementor-725 .elementor-element.elementor-element-cfd7a1f{--content-width:1200px;}.elementor-725 .elementor-element.elementor-element-fc9046a{--content-width:1200px;}.elementor-725 .elementor-element.elementor-element-6a404f6{--content-width:1200px;}.elementor-725 .elementor-element.elementor-element-0b8b3fb{--content-width:1200px;}.elementor-725 .elementor-element.elementor-element-0379b5c{--width:100%;}.elementor-725 .elementor-element.elementor-element-a21bd70{--content-width:1200px;}.elementor-725 .elementor-element.elementor-element-20c7887{--content-width:1200px;}.elementor-725 .elementor-element.elementor-element-cbf4f4a{--content-width:1200px;}.elementor-725 .elementor-element.elementor-element-b988e42{--content-width:1200px;}.elementor-725 .elementor-element.elementor-element-4362256{--content-width:1200px;}}@media(max-width:767px){.elementor-725 .elementor-element.elementor-element-d9998a6{--padding-top:100px;--padding-bottom:50px;--padding-left:0px;--padding-right:0px;}.elementor-725 .elementor-element.elementor-element-62ffa07 .elementor-heading-title{font-size:30px;line-height:40px;}.elementor-725 .elementor-element.elementor-element-5ec9c45 .elementor-heading-title{font-size:30px;line-height:40px;}.elementor-725 .elementor-element.elementor-element-ddf1919{width:100%;max-width:100%;padding:13px 13px 13px 13px;}.elementor-725 .elementor-element.elementor-element-c4e43c5{width:100%;max-width:100%;padding:13px 13px 13px 13px;}.elementor-725 .elementor-element.elementor-element-11ee74d{width:100%;max-width:100%;padding:13px 13px 13px 13px;}.elementor-725 .elementor-element.elementor-element-563ecd7{--e-con-grid-template-columns:repeat(1, 1fr);--grid-auto-flow:row;}.elementor-725 .elementor-element.elementor-element-ac4cbe2{width:100%;max-width:100%;padding:13px 13px 13px 13px;}.elementor-725 .elementor-element.elementor-element-a0faf56{width:100%;max-width:100%;padding:13px 13px 13px 13px;}.elementor-725 .elementor-element.elementor-element-fc46d39{width:100%;max-width:100%;padding:13px 13px 13px 13px;}.elementor-725 .elementor-element.elementor-element-4bc71fc img{height:300px;}.elementor-725 .elementor-element.elementor-element-5dcd331{width:100%;max-width:100%;padding:13px 13px 13px 13px;}.elementor-725 .elementor-element.elementor-element-7ac857d{width:100%;max-width:100%;padding:13px 13px 13px 13px;}.elementor-725 .elementor-element.elementor-element-4a735f8{--e-con-grid-template-columns:repeat(1, 1fr);--grid-auto-flow:row;}.elementor-725 .elementor-element.elementor-element-20809d4{--e-con-grid-template-columns:repeat(1, 1fr);--grid-auto-flow:row;}.elementor-725 .elementor-element.elementor-element-667de6a{width:100%;max-width:100%;padding:13px 13px 13px 13px;}.elementor-725 .elementor-element.elementor-element-4a89438{width:100%;max-width:100%;padding:13px 13px 13px 13px;}.elementor-725 .elementor-element.elementor-element-b83d957{width:100%;max-width:100%;padding:13px 13px 13px 13px;}.elementor-725 .elementor-element.elementor-element-455143f img{height:300px;}.elementor-725 .elementor-element.elementor-element-d0dc9c1{width:100%;max-width:100%;padding:13px 13px 13px 13px;}.elementor-725 .elementor-element.elementor-element-f528e65{width:100%;max-width:100%;padding:13px 13px 13px 13px;}.elementor-725 .elementor-element.elementor-element-1391e8a{width:100%;max-width:100%;padding:13px 13px 13px 13px;}.elementor-725 .elementor-element.elementor-element-b1d041c{width:100%;max-width:100%;padding:13px 13px 13px 13px;}.elementor-725 .elementor-element.elementor-element-6a404f6{--e-con-grid-template-columns:repeat(1, 1fr);--grid-auto-flow:row;}.elementor-725 .elementor-element.elementor-element-cc665ec{--e-con-grid-template-columns:repeat(1, 1fr);--grid-auto-flow:row;}.elementor-725 .elementor-element.elementor-element-a14c6e8{--e-con-grid-template-columns:repeat(1, 1fr);--grid-auto-flow:row;}.elementor-725 .elementor-element.elementor-element-5ab11ff .slmb-grid{grid-template-columns:repeat(1,minmax(0,1fr));}}/* Start custom CSS for container, class: .elementor-element-375a1ca *//* ============================================================ CONTABILITÀ — matched to the live markup Target: .contabilita (two .e-child columns) ├ .e-child #1 → .imageani (portrait image) └ .e-child #2 → eyebrow + headline + 2 text-editors (intro) + 5 × .elementor-widget-icon-box (services) Light "paper" ground + brand navy accent. The lettered a–e markers, the rail, connector nodes and hover are all CSS-generated on the icon-box widgets. Keyed off structural classes + :nth-child, no element IDs, so the section survives Elementor re-saving. NOTE ON COLOUR: light ground, so the brand navy #0b174f is used at full strength — no lightened tint is needed the way it is on the dark sections. ============================================================ */ .contabilita{ --navy:#0B1626; /* heading ink */ --accent:#2E4A6B; /* deep slate blue */ --accent-lt:#4A6E96; --brand:#0b174f; /* brand navy — rail, dots, markers */ --brand-lt:#1832aa; /* hover */ --brand-dk:#060d2d; --ivory:#F6F4EE; --paper:#F4F2EC; --ink:#1B2534; --muted:#6E7887; --line:rgba(11,22,38,.10); --img-h:600px; /* desktop image height */ --fd:'Marcellus',Georgia,'Times New Roman',serif; --fs:'Hanken Grotesk',-apple-system,'Segoe UI',Helvetica,Arial,sans-serif; --ease:cubic-bezier(.22,.8,.24,1); position:relative;isolation:isolate; padding:clamp(90px,11vw,170px) 0 !important; overflow:visible !important; /* keep sticky working */ overflow-x:clip !important; /* but clip horizontal bleed (watermark/frame) — doesn't break sticky */ background-color:var(--paper) !important; font-family:var(--fs);color:var(--muted); } /* oversized watermark word — kept inside the section bounds */ .contabilita::before{ content:"SSD"; position:absolute;right:2%;bottom:-3%;z-index:0; max-width:96%; font-family:var(--fd);font-size:clamp(6rem,15vw,13rem);line-height:.82; color:rgba(11,22,38,.035);white-space:nowrap;pointer-events:none;user-select:none; letter-spacing:-.02em;overflow:hidden; } /* two columns — IMAGE left, TEXT right */ .contabilita > .e-con-inner{ position:relative;z-index:1;overflow:visible !important; width:min(1200px,92vw) !important;margin-inline:auto !important; display:grid !important; grid-template-columns:.82fr 1.18fr !important; gap:clamp(48px,6vw,96px) !important; align-items:start !important; } /* grid items default to min-width:auto and refuse to shrink below the photo's intrinsic width — this is what caused the horizontal scroll */ .contabilita > .e-con-inner > .e-child{min-width:0 !important} /* hide HTML widget if it only carries style/script */ .contabilita .elementor-widget-html:has(style):not(:has(.eyebrow)), .contabilita .elementor-widget-html:has(script):not(:has(.eyebrow)){display:none !important} /* ============================================================ LEFT — IMAGE COLUMN ============================================================ */ .contabilita > .e-con-inner > .e-child:first-child{gap:0 !important} @media(min-width:1025px){ .contabilita > .e-con-inner > .e-child:first-child{ position:sticky;top:clamp(40px,8vw,110px); } } .contabilita .imageani{ --slm-edge:24px; position:relative;max-width:100% !important; margin:0 0 var(--slm-edge) var(--slm-edge) !important; } .contabilita .imageani, .contabilita .imageani img{ width:100% !important;max-width:100% !important; } .contabilita .imageani img{ display:block;border-radius:4px; height:var(--img-h) !important; /* fixed height */ object-fit:cover;object-position:center; /* crop, never distort */ box-shadow:0 30px 60px -30px rgba(11,22,38,.5); } /* navy frame offset behind the photo */ .contabilita .imageani::before{ content:"";position:absolute;z-index:-1; left:calc(-1 * var(--slm-edge));top:var(--slm-edge); width:100%;height:var(--img-h); border:1px solid var(--brand);border-radius:4px; opacity:0;transform:translate(10px,-10px); animation:cont-frame .9s var(--ease) .3s forwards; } @keyframes cont-frame{to{opacity:1;transform:none}} .contabilita.is-in .imageani::before{opacity:1;transform:none} /* ============================================================ RIGHT — TEXT + RAIL LIST COLUMN ============================================================ */ .contabilita > .e-con-inner > .e-child:last-child{gap:0 !important} .contabilita .eyebrow{ display:inline-flex;align-items:center;gap:14px; font-family:var(--fs); font-size:.7rem;font-weight:600;letter-spacing:.34em;text-transform:uppercase; color:var(--brand);margin-bottom:24px; } .contabilita .eyebrow::before{ content:"";width:44px;height:1px;background:var(--brand); transform-origin:left;transform:scaleX(0); animation:cont-eye 1s var(--ease) .25s forwards; } @keyframes cont-eye{to{transform:scaleX(1)}} .contabilita.is-in .eyebrow::before, .contabilita .eyebrow.is-in::before{transform:scaleX(1)} .contabilita .headlineanm .elementor-heading-title{ font-family:var(--fd) !important;font-weight:400 !important; font-size:clamp(2.1rem,4.2vw,3.3rem) !important;line-height:1.08 !important;letter-spacing:-.015em; color:var(--navy) !important;margin:0 0 28px !important; } /* intro paragraphs (the two text-editors before the icon-boxes) */ .contabilita > .e-con-inner > .e-child:last-child .elementor-widget-text-editor{ font-family:var(--fs); font-size:1.04rem !important;line-height:1.8 !important;color:var(--muted) !important; max-width:60ch;margin:0 0 20px !important; } .contabilita .elementor-widget-text-editor p{margin:0 !important} /* ---------- THE LETTERED RAIL LIST ---------- */ .contabilita > .e-con-inner > .e-child:last-child{ counter-reset:cont; } /* wrapper for the services so the rail can span exactly the list. We draw the rail on the LAST icon-box group via a tall pseudo anchored to the first item; simpler: rail lives on each item's left as a base line, and one animated navy line is drawn spanning the whole group. */ .contabilita .elementor-widget-icon-box{ counter-increment:cont; position:relative; padding:clamp(24px,2.6vw,34px) 0 clamp(24px,2.6vw,34px) clamp(52px,4.6vw,72px) !important; border-bottom:1px solid var(--line); background:transparent !important; /* CSS-only entrance → the rows are visible without JS, so they also render inside the Elementor editor, which never runs custom scripts */ animation:cont-in .7s var(--ease) var(--d,0s) both; transition:padding-left .4s var(--ease); } @keyframes cont-in{ from{opacity:0;transform:translateX(16px)} to{opacity:1;transform:none} } .contabilita.is-in .elementor-widget-icon-box{opacity:1} .contabilita .elementor-widget-icon-box:first-of-type{ margin-top:clamp(28px,3vw,40px) !important; border-top:1px solid var(--line); } .contabilita .e-child:last-child > .elementor-widget-icon-box:nth-of-type(1){--d:.15s} .contabilita .e-child:last-child > .elementor-widget-icon-box:nth-of-type(2){--d:.26s} .contabilita .e-child:last-child > .elementor-widget-icon-box:nth-of-type(3){--d:.37s} .contabilita .e-child:last-child > .elementor-widget-icon-box:nth-of-type(4){--d:.48s} .contabilita .e-child:last-child > .elementor-widget-icon-box:nth-of-type(5){--d:.59s} .contabilita .e-child:last-child > .elementor-widget-icon-box:nth-of-type(6){--d:.70s} /* base rail: a light line down the left of every item (continuous) */ .contabilita .elementor-widget-icon-box::before{ content:""; position:absolute;left:clamp(16px,1.6vw,24px);top:0;bottom:0;width:2px; background:var(--line); z-index:0; } /* the animated NAVY rail overlays the base line on each item and draws in as the section enters view (staggered per item = continuous draw effect) */ .contabilita .elementor-widget-icon-box{ --rail-h:0; } .contabilita .elementor-icon-box-wrapper::before{ content:""; position:absolute;left:clamp(16px,1.6vw,24px);top:0;bottom:0;width:2px; background:linear-gradient(var(--brand),var(--accent)); transform:scaleY(0);transform-origin:top; animation:cont-rail .7s var(--ease) var(--d,0s) forwards; z-index:1; } @keyframes cont-rail{to{transform:scaleY(1)}} /* wrapper needs to be positioned relative to the item, spanning full height */ .contabilita .elementor-icon-box-wrapper{position:static !important} .contabilita .elementor-widget-icon-box > .elementor-icon-box-wrapper::before{ /* pin to the icon-box, not the wrapper's content box */ top:0;height:100%; } /* NAVY connector dot on the rail, per item */ .contabilita .elementor-widget-icon-box::after{ content:""; position:absolute;left:calc(clamp(16px,1.6vw,24px) + 1px - 5px); top:clamp(30px,3vw,42px); width:10px;height:10px;border-radius:50%; background:var(--paper);border:2px solid var(--brand); transform:scale(.4);opacity:0; animation:cont-dot .5s var(--ease) var(--d,0s) forwards; transition:box-shadow .5s var(--ease),background .4s var(--ease); z-index:3; } @keyframes cont-dot{to{opacity:1;transform:scale(1)}} .contabilita .elementor-widget-icon-box:first-of-type::after{top:calc(clamp(28px,3vw,40px) + clamp(24px,2.6vw,34px))} /* the a. b. c. lettered marker (letters, not digits — Marcellus italic is safe here) */ .contabilita .elementor-icon-box-title::before{ content:counter(cont,lower-alpha) "."; position:absolute;left:clamp(52px,4.6vw,72px);margin-left:-2.4em; font-family:var(--fd);font-style:italic; font-size:1rem;line-height:inherit;color:var(--brand); transition:color .4s var(--ease); } /* box internals */ .contabilita .elementor-icon-box-wrapper{ display:block !important;text-align:left !important; } .contabilita .elementor-icon-box-icon{display:none !important} .contabilita .elementor-icon-box-title{ font-family:var(--fd) !important;font-weight:400 !important; font-size:clamp(1.2rem,1.7vw,1.42rem) !important;line-height:1.2 !important; color:var(--navy) !important;margin:0 0 10px !important; transition:color .4s var(--ease),transform .4s var(--ease); } .contabilita .elementor-icon-box-title span{color:inherit !important} .contabilita .elementor-icon-box-description{ font-family:var(--fs) !important; font-size:.98rem !important;line-height:1.68 !important;color:var(--muted) !important;margin:0 !important; transition:color .4s var(--ease); } /* hover */ .contabilita .elementor-widget-icon-box:hover{padding-left:clamp(52px,4.6vw,72px) !important} .contabilita .elementor-widget-icon-box:hover::after{background:var(--brand);box-shadow:0 0 0 4px rgba(11,23,79,.16)} .contabilita .elementor-widget-icon-box:hover .elementor-icon-box-title::before{color:var(--brand-lt)} .contabilita .elementor-widget-icon-box:hover .elementor-icon-box-title{color:var(--navy) !important} .contabilita .elementor-widget-icon-box:hover .elementor-icon-box-description{color:var(--ink) !important} /* ---------- RESPONSIVE ---------- */ @media(max-width:1024px){ .contabilita > .e-con-inner{grid-template-columns:1fr !important;gap:clamp(40px,6vw,56px) !important} .contabilita > .e-con-inner > .e-child:first-child{max-width:460px} .contabilita{--img-h:420px} } @media(max-width:767px){ .contabilita{padding:70px 0 !important;--img-h:250px} /* mobile image height */ .contabilita > .e-con-inner > .e-child:first-child{max-width:100%;overflow:hidden} .contabilita .imageani{--slm-edge:0px;margin:0 !important} .contabilita .imageani::before{display:none} } /* ---------- REDUCED MOTION ---------- */ @media(prefers-reduced-motion:reduce){ .contabilita .elementor-widget-icon-box, .contabilita .elementor-widget-icon-box::after, .contabilita .elementor-icon-box-wrapper::before, .contabilita .imageani::before, .contabilita .eyebrow::before{ animation:none !important;opacity:1 !important;transform:none !important; } .contabilita .elementor-icon-box-wrapper::before{transform:scaleY(1) !important} .contabilita .elementor-widget-icon-box::after{transform:scale(1) !important} .contabilita .eyebrow::before{transform:scaleX(1) !important} }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-3243b7d *//* ============================================================ ORGANI DIRETTIVI — .direttivi · WHITE background Matched to the live markup (two .e-child columns): .e-child #1 → .imageani (single image widget) .e-child #2 → eyebrow + headline + 3 text-editors + 5 × .elementor-widget-icon-box Same design language as .slmfisc4: lettered a–e rail list with navy connector nodes on a light ground. Image is locked to 600px tall on desktop and 250px on mobile, cropped with object-fit so it never distorts. Colour note: the brand navy #0b174f hits 16.8:1 on white, so the SAME value serves for text and decoration — no separate "text" variant is needed the way it was for the bright green. ============================================================ */ .direttivi{ --paper:#FFFFFF; --navy:#0B1626; /* headings — 18.1:1 on white */ --ink:#1B2534; /* body — 15.4:1 */ --muted:#5A6675; /* secondary— 5.85:1 */ --brand:#0b174f; /* brand navy — 16.8:1 on white */ --brand-lt:#1832aa; /* hover / mid stop — 8.9:1 */ --brand-dk:#060d2d; --line:rgba(11,22,38,.12); --line-2:rgba(11,22,38,.07); --img-h:600px; /* desktop image height */ --rail-x:22px; /* rail centre line */ --node-d:12px; /* connector dot diameter */ --node-y:clamp(28px,3vw,40px); /* shared vertical anchor: dot AND letter */ --fd:'Marcellus',Georgia,'Times New Roman',serif; --fs:'Hanken Grotesk',-apple-system,'Segoe UI',Helvetica,Arial,sans-serif; --ease:cubic-bezier(.19,1,.22,1); position:relative;isolation:isolate; overflow:visible !important; /* keep sticky working */ overflow-x:clip !important; /* but contain sideways bleed */ padding:clamp(80px,10vw,150px) 0 !important; font-family:var(--fs);color:var(--ink); background-color:var(--paper) !important; background-image: radial-gradient(100% 70% at 96% -6%,rgba(11,23,79,.07),transparent 55%), radial-gradient(80% 70% at -6% 104%,rgba(46,74,107,.06),transparent 60%) !important; } /* top hairline */ .direttivi::before{ content:"";position:absolute;top:0;left:0;right:0;height:1px;z-index:3;pointer-events:none; background:linear-gradient(90deg,transparent,var(--brand-lt) 20%,var(--brand) 50%,var(--brand-lt) 80%,transparent); opacity:.55; } /* two columns — IMAGE left, TEXT right */ .direttivi > .e-con-inner{ position:relative;z-index:1;overflow:visible !important; width:min(1200px,92vw) !important;margin-inline:auto !important; display:grid !important; grid-template-columns:.86fr 1.14fr !important; gap:clamp(44px,5vw,84px) !important; align-items:start !important; } /* grid items default to min-width:auto, which refuses to shrink below the image's intrinsic 1024px — min-width:0 lets both columns size correctly */ .direttivi > .e-con-inner > .e-child{min-width:0 !important;max-width:100% !important} /* hide an HTML widget that only carries style/script */ .direttivi .elementor-widget-html:has(style):not(:has(.eyebrow)), .direttivi .elementor-widget-html:has(script):not(:has(.eyebrow)){display:none !important} /* ============================================================ LEFT — IMAGE (600px tall, sticky on desktop) ============================================================ */ .direttivi > .e-con-inner > .e-child:first-child{gap:0 !important} @media(min-width:1025px){ .direttivi > .e-con-inner > .e-child:first-child{ position:sticky;top:clamp(40px,8vw,110px); } } .direttivi .imageani{ position:relative; width:100% !important;max-width:100% !important; margin:0 !important; } /* the image itself — fixed height, cropped, never overflowing */ .direttivi .imageani img{ display:block; width:100% !important;max-width:100% !important; height:var(--img-h) !important; object-fit:cover;object-position:center; border-radius:14px; box-shadow:0 30px 60px -34px rgba(11,22,38,.45); } /* navy frame offset behind the photo */ .direttivi .imageani::before{ content:"";position:absolute;z-index:-1; left:-18px;top:18px;width:100%;height:100%; border:1px solid var(--brand);border-radius:14px; opacity:0;transform:translate(10px,-10px); animation:dir-frame .9s var(--ease) .3s forwards; } @keyframes dir-frame{to{opacity:.55;transform:none}} /* ============================================================ RIGHT — intro + lettered rail list ============================================================ */ .direttivi > .e-con-inner > .e-child:last-child{gap:0 !important} .direttivi .eyebrow{ display:inline-flex;align-items:center;gap:14px; font-family:var(--fs); font-size:.72rem;font-weight:700;letter-spacing:.34em;text-transform:uppercase; color:var(--brand);margin-bottom:22px; } .direttivi .eyebrow::before{ content:"";width:44px;height:2px;border-radius:2px; background:linear-gradient(90deg,var(--brand),var(--brand-lt)); transform-origin:left;transform:scaleX(0); animation:dir-eye 1s var(--ease) .25s forwards; } @keyframes dir-eye{to{transform:scaleX(1)}} .direttivi .headlineanm .elementor-heading-title{ font-family:var(--fd) !important;font-weight:400 !important; font-size:clamp(2.1rem,4.2vw,3.3rem) !important;line-height:1.07 !important;letter-spacing:-.015em; color:var(--navy) !important;margin:0 0 26px !important; } /* the 3 intro paragraphs */ .direttivi > .e-con-inner > .e-child:last-child .elementor-widget-text-editor{ font-family:var(--fs); font-size:1.03rem !important;line-height:1.8 !important;color:var(--ink) !important; max-width:58ch;margin:0 0 16px !important; } .direttivi .elementor-widget-text-editor p{margin:0 !important} /* ---------- THE LETTERED RAIL LIST ---------- */ .direttivi > .e-con-inner > .e-child:last-child{counter-reset:dir} .direttivi .elementor-widget-icon-box{ counter-increment:dir; position:relative; padding:clamp(22px,2.4vw,32px) 0 clamp(22px,2.4vw,32px) calc(var(--rail-x) + 58px) !important; margin:0 !important; border-bottom:1px solid var(--line-2); background:transparent !important; /* CSS-only entrance → visible without JS (works in the editor) */ animation:dir-in .7s var(--ease) var(--d,0s) both; transition:padding-left .4s var(--ease); } @keyframes dir-in{ from{opacity:0;transform:translateX(16px)} to{opacity:1;transform:none} } .direttivi .elementor-widget-icon-box:first-of-type{ margin-top:clamp(26px,3vw,38px) !important; border-top:1px solid var(--line-2); } .direttivi .elementor-widget-icon-box:last-of-type{border-bottom:0 !important} .direttivi .elementor-widget-icon-box:nth-of-type(1){--d:.14s} .direttivi .elementor-widget-icon-box:nth-of-type(2){--d:.24s} .direttivi .elementor-widget-icon-box:nth-of-type(3){--d:.34s} .direttivi .elementor-widget-icon-box:nth-of-type(4){--d:.44s} .direttivi .elementor-widget-icon-box:nth-of-type(5){--d:.54s} /* the rail — a continuous line down the left of the list */ .direttivi .elementor-widget-icon-box::before{ content:""; position:absolute;left:var(--rail-x);top:0;bottom:0;width:2px; background:var(--line-2);border-radius:2px; } /* navy rail overlay, drawing itself in per item */ .direttivi .elementor-icon-box-wrapper::before{ content:""; position:absolute;left:var(--rail-x);top:0;height:100%;width:2px;border-radius:2px; background:linear-gradient(var(--brand-lt),var(--brand)); transform:scaleY(0);transform-origin:top; animation:dir-rail .7s var(--ease) var(--d,0s) forwards; } @keyframes dir-rail{to{transform:scaleY(1)}} .direttivi .elementor-icon-box-wrapper{position:static !important} /* navy connector node */ .direttivi .elementor-widget-icon-box::after{ content:""; position:absolute;left:calc(var(--rail-x) + 1px - (var(--node-d) / 2)); top:var(--node-y); width:var(--node-d);height:var(--node-d);border-radius:50%; background:var(--paper);border:2px solid var(--brand); box-shadow:0 0 0 3px var(--paper); transform:scale(.4);opacity:0; animation:dir-node .5s var(--ease) var(--d,0s) forwards; transition:background .4s var(--ease),box-shadow .4s var(--ease); z-index:3; } @keyframes dir-node{to{opacity:1;transform:scale(1)}} /* the a. b. c. lettered marker — placed in the clear gap between the connector dot and the title text. Its left edge starts well past the dot's right edge (rail-x + node-d/2), so the two can never collide. Letters, not digits — Marcellus italic is safe here. */ .direttivi .elementor-icon-box-title::before{ content:counter(dir,lower-alpha) "."; position:absolute; left:calc(var(--rail-x) + 22px); top:var(--node-y); /* same anchor as the connector dot */ width:24px; height:var(--node-d); /* same height as the dot ... */ line-height:var(--node-d); /* ... so both centres line up */ font-family:var(--fd);font-style:italic; font-size:1.02rem;color:var(--brand); transition:color .4s var(--ease); } /* box internals */ .direttivi .elementor-icon-box-wrapper{display:block !important;text-align:left !important} .direttivi .elementor-icon-box-icon{display:none !important} .direttivi .elementor-icon-box-title{ font-family:var(--fd) !important;font-weight:400 !important; font-size:clamp(1.18rem,1.7vw,1.42rem) !important;line-height:1.2 !important; color:var(--navy) !important;margin:0 0 9px !important; transition:color .4s var(--ease); } .direttivi .elementor-icon-box-title span{color:inherit !important} .direttivi .elementor-icon-box-description{ font-family:var(--fs) !important; font-size:.97rem !important;line-height:1.7 !important; color:var(--muted) !important;margin:0 !important; transition:color .4s var(--ease); } /* hover — the title shifts to the brighter blue, not the brand navy: #0b174f against the #0B1626 heading ink is nearly the same value, so the hover would read as no change at all */ .direttivi .elementor-widget-icon-box:hover{padding-left:calc(var(--rail-x) + 68px) !important} .direttivi .elementor-widget-icon-box:hover .elementor-icon-box-title{color:var(--brand-lt) !important} .direttivi .elementor-widget-icon-box:hover .elementor-icon-box-title::before{color:var(--brand-lt)} .direttivi .elementor-widget-icon-box:hover .elementor-icon-box-description{color:var(--ink) !important} .direttivi .elementor-widget-icon-box:hover::after{ background:var(--brand); box-shadow:0 0 0 3px var(--paper),0 0 0 7px rgba(11,23,79,.20); } /* ============================================================ RESPONSIVE ============================================================ */ @media(max-width:1024px){ .direttivi > .e-con-inner{ grid-template-columns:1fr !important;gap:clamp(36px,5vw,52px) !important; } .direttivi{--img-h:420px} } @media(max-width:767px){ .direttivi{--img-h:250px;--rail-x:16px} /* mobile image height + tighter rail */ .direttivi{padding:70px 0 !important} .direttivi .imageani::before{display:none} } /* ============================================================ REDUCED MOTION ============================================================ */ @media(prefers-reduced-motion:reduce){ .direttivi .elementor-widget-icon-box, .direttivi .elementor-widget-icon-box::after, .direttivi .elementor-icon-box-wrapper::before, .direttivi .imageani::before, .direttivi .eyebrow::before{ animation:none !important;opacity:1 !important;transform:none !important; } .direttivi .elementor-icon-box-wrapper::before{transform:scaleY(1) !important} .direttivi .elementor-widget-icon-box::after{transform:scale(1) !important} .direttivi .eyebrow::before{transform:scaleX(1) !important} }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-6a404f6 *//* ============================================================ SLMLAV1 — 6 cards · per-card gradients · white border with an animated 1px WhatsApp-green line travelling around it. Matched to the live markup, which is an e-con-BOXED grid, so the cards sit inside a .e-con-inner wrapper:
6 x .elementor-widget-icon-box
Keyed off structural classes + :nth-of-type — no element IDs. ============================================================ */ /* the travelling angle for the border light. @property lets the angle animate; without it the border simply renders static (white with a green arc), so nothing breaks. */ @property --lav1-ang{ syntax:''; initial-value:0deg; inherits:false; } .slmlav1{ --ink:#0A1220; --wa:#25D366; /* WhatsApp brand green */ --wa-lt:#5CE68C; --edge:rgba(255,255,255,.82); /* the white border */ --fd:'Marcellus',Georgia,'Times New Roman',serif; --fs:'Hanken Grotesk',-apple-system,'Segoe UI',Helvetica,Arial,sans-serif; --ease:cubic-bezier(.19,1,.22,1); font-family:var(--fs); /* the container must stay transparent, or an Elementor background here shows through as one big block behind the cards */ background:none !important;background-color:transparent !important; background-image:none !important; border:0 !important; padding:0 !important; } /* the grid lives on the inner wrapper in this (boxed) structure */ .slmlav1 > .e-con-inner{ display:grid !important; grid-template-columns:repeat(3,1fr) !important; gap:clamp(16px,1.7vw,24px) !important; width:100% !important;max-width:none !important; align-items:stretch !important; counter-reset:lav1; background:none !important;background-color:transparent !important; padding:0 !important; } /* grid items must be allowed to shrink */ .slmlav1 > .e-con-inner > *{min-width:0 !important} /* ============================================================ EACH CARD ============================================================ */ .slmlav1 .elementor-widget-icon-box{ position:relative;isolation:isolate; counter-increment:lav1; min-height:clamp(200px,18vw,240px); padding:clamp(26px,2.5vw,38px) !important; margin:0 !important; border-radius:18px; /* WHITE BORDER + the travelling green light. Layer 1 (padding-box) = the card's own colour gradient. Layer 2 (border-box) = white ring with a green arc that rotates, so a 1px green line runs around the card. */ border:1px solid transparent !important; background-origin:border-box !important; background-clip:padding-box,border-box !important; animation:lav1-spin 5s linear infinite, lav1-in .8s var(--ease) var(--d,0s) both; transition:box-shadow .5s var(--ease),transform .5s var(--ease); } /* the light travelling around the border */ @keyframes lav1-spin{ to{--lav1-ang:360deg} } /* CSS-only entrance → cards show without JS, so they also appear inside the Elementor editor, which does not run custom scripts */ @keyframes lav1-in{ from{opacity:0;transform:translateY(24px)} to{opacity:1;transform:none} } .slmlav1 .elementor-widget-icon-box:nth-of-type(1){--d:.06s} .slmlav1 .elementor-widget-icon-box:nth-of-type(2){--d:.14s} .slmlav1 .elementor-widget-icon-box:nth-of-type(3){--d:.22s} .slmlav1 .elementor-widget-icon-box:nth-of-type(4){--d:.30s} .slmlav1 .elementor-widget-icon-box:nth-of-type(5){--d:.38s} .slmlav1 .elementor-widget-icon-box:nth-of-type(6){--d:.46s} /* ---- the 6 card gradients (layer 1) + shared border light (layer 2) ---- */ .slmlav1 .elementor-widget-icon-box:nth-of-type(1){ background-image: linear-gradient(135deg,#08352A 0%,#0A5040 24%,#0C6455 48%,#0A5560 74%,#08333F 100%), conic-gradient(from var(--lav1-ang),var(--edge) 0 72%,var(--wa) 84%,var(--wa-lt) 88%,var(--edge) 100%) !important; animation-delay:0s,.06s; } .slmlav1 .elementor-widget-icon-box:nth-of-type(2){ background-image: linear-gradient(135deg,#08284C 0%,#0F3A70 24%,#154C8C 48%,#2A3F8E 74%,#141F52 100%), conic-gradient(from var(--lav1-ang),var(--edge) 0 72%,var(--wa) 84%,var(--wa-lt) 88%,var(--edge) 100%) !important; animation-delay:-.8s,.14s; } .slmlav1 .elementor-widget-icon-box:nth-of-type(3){ background-image: linear-gradient(135deg,#251445 0%,#3B2070 24%,#522A88 48%,#6B2A78 74%,#2A1440 100%), conic-gradient(from var(--lav1-ang),var(--edge) 0 72%,var(--wa) 84%,var(--wa-lt) 88%,var(--edge) 100%) !important; animation-delay:-1.6s,.22s; } .slmlav1 .elementor-widget-icon-box:nth-of-type(4){ background-image: linear-gradient(135deg,#3E1F10 0%,#5E3218 24%,#75421E 48%,#742E38 74%,#3A1A2C 100%), conic-gradient(from var(--lav1-ang),var(--edge) 0 72%,var(--wa) 84%,var(--wa-lt) 88%,var(--edge) 100%) !important; animation-delay:-2.4s,.30s; } .slmlav1 .elementor-widget-icon-box:nth-of-type(5){ background-image: linear-gradient(135deg,#08302E 0%,#0A4A4A 24%,#0D5F62 48%,#1C5070 74%,#122C48 100%), conic-gradient(from var(--lav1-ang),var(--edge) 0 72%,var(--wa) 84%,var(--wa-lt) 88%,var(--edge) 100%) !important; animation-delay:-3.2s,.38s; } .slmlav1 .elementor-widget-icon-box:nth-of-type(6){ background-image: linear-gradient(135deg,#3A1630 0%,#54234E 24%,#472878 48%,#2B2A74 74%,#151A44 100%), conic-gradient(from var(--lav1-ang),var(--edge) 0 72%,var(--wa) 84%,var(--wa-lt) 88%,var(--edge) 100%) !important; animation-delay:-4s,.46s; } /* soft sheen for depth */ .slmlav1 .elementor-widget-icon-box::before{ content:"";position:absolute;inset:0;z-index:0;pointer-events:none; border-radius:inherit; background:radial-gradient(closest-side,rgba(255,255,255,.12),transparent 70%); background-repeat:no-repeat;background-size:60% 55%; animation:lav1-sheen 12s ease-in-out infinite alternate; transition:background-size .5s var(--ease); } @keyframes lav1-sheen{ 0%{background-position:8% 6%} 50%{background-position:92% 34%} 100%{background-position:26% 12%} } /* ghost index numeral */ .slmlav1 .elementor-widget-icon-box::after{ content:counter(lav1,decimal-leading-zero); position:absolute;top:-.08em;right:.06em;z-index:0; font-family:var(--fd);font-size:clamp(4.2rem,6.6vw,6rem);line-height:1; color:rgba(255,255,255,.10); transition:color .5s var(--ease),transform .5s var(--ease); pointer-events:none; } /* hover — the green light speeds up, card lifts */ .slmlav1 .elementor-widget-icon-box:hover{ transform:translateY(-8px) !important; box-shadow:0 34px 62px -30px rgba(0,0,0,.8),0 0 0 1px rgba(37,211,102,.25); animation-duration:1.8s,.8s; } .slmlav1 .elementor-widget-icon-box:hover::before{background-size:76% 70%} .slmlav1 .elementor-widget-icon-box:hover::after{color:rgba(255,255,255,.22);transform:translateY(-4px)} /* ============================================================ CARD CONTENT ============================================================ */ .slmlav1 .elementor-icon-box-wrapper{ position:relative;z-index:2; display:flex !important;flex-direction:column;align-items:flex-start !important; text-align:left !important; } .slmlav1 .elementor-icon-box-icon{display:none !important} /* small white dash above each title */ .slmlav1 .elementor-icon-box-content{position:relative} .slmlav1 .elementor-icon-box-content::before{ content:"";display:block; width:28px;height:2px;margin:0 0 16px;border-radius:2px; background:linear-gradient(90deg,#fff,rgba(255,255,255,.3)); transition:width .5s var(--ease); } .slmlav1 .elementor-widget-icon-box:hover .elementor-icon-box-content::before{ width:50px;background:linear-gradient(90deg,var(--wa-lt),rgba(255,255,255,.3)); } .slmlav1 .elementor-icon-box-title{ font-family:var(--fd) !important;font-weight:400 !important; font-size:clamp(1.2rem,1.65vw,1.45rem) !important;line-height:1.18 !important; color:#fff !important;margin:0 0 11px !important; text-shadow:0 1px 3px rgba(0,0,0,.45),0 2px 14px rgba(0,0,0,.3); } .slmlav1 .elementor-icon-box-title span{color:inherit !important} .slmlav1 .elementor-icon-box-description{ font-family:var(--fs) !important; font-size:.95rem !important;line-height:1.7 !important; color:rgba(255,255,255,.94) !important;margin:0 !important; text-shadow:0 1px 3px rgba(0,0,0,.48),0 2px 12px rgba(0,0,0,.32); } /* ============================================================ RESPONSIVE ============================================================ */ @media(max-width:900px){ .slmlav1 > .e-con-inner{grid-template-columns:repeat(2,1fr) !important} } @media(max-width:560px){ .slmlav1 > .e-con-inner{grid-template-columns:1fr !important} } /* ============================================================ REDUCED MOTION ============================================================ */ @media(prefers-reduced-motion:reduce){ .slmlav1 .elementor-widget-icon-box{ animation:none !important;opacity:1 !important;transform:none !important; } .slmlav1 .elementor-widget-icon-box::before{animation:none !important} .slmlav1 .elementor-widget-icon-box:hover{transform:none !important} }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-0b8b3fb *//* ============================================================ L'AUTOREVOLEZZA — .direttivi1 · WHITE background · FULL WIDTH Matched to the live markup — the image column has been removed, so the section is now a SINGLE full-width column: .direttivi1 > .e-con-inner └ .e-child → eyebrow + headline + 2 text-editors + 7 × .elementor-widget-icon-box (CREDENTIALS) + 1 × .elementor-widget-button NOTE: these icon-boxes carry NO

title — only a description paragraph — so the credentials are styled as a checked list: a navy check marker on a rail, with the description as the statement itself. The column is now full width. All the widgets are siblings in a single flex column, so the credential rows stay one-per-line; line length is capped instead so the text stays readable. Colour note: the brand navy #0b174f hits 16.8:1 on white, so the SAME value serves for text, markers and decoration — no separate "text" variant is needed the way it was for the bright green. ============================================================ */ /* width:100% + padding overflows unless everything is border-box. Elementor/themes usually set this but not reliably, so it is declared rather than assumed. */ .direttivi1, .direttivi1 *, .direttivi1 *::before, .direttivi1 *::after{box-sizing:border-box} .direttivi1{ --paper:#FFFFFF; --navy:#0B1626; --ink:#1B2534; /* credential text — 15.4:1 on white */ --muted:#5A6675; /* intro copy — 5.85:1 */ --brand:#0b174f; /* brand navy — 16.8:1 on white */ --brand-lt:#1832aa; /* hover / mid stop — 8.9:1 */ --brand-dk:#060d2d; --line-2:rgba(11,22,38,.07); --rail-x:11px; /* rail centre line */ --mark-d:22px; /* check marker diameter */ --fd:'Marcellus',Georgia,'Times New Roman',serif; --fs:'Hanken Grotesk',-apple-system,'Segoe UI',Helvetica,Arial,sans-serif; --ease:cubic-bezier(.19,1,.22,1); position:relative;isolation:isolate; overflow:visible !important; overflow-x:clip !important; padding:clamp(80px,10vw,140px) 0 !important; font-family:var(--fs);color:var(--ink); background-color:var(--paper) !important; background-image: radial-gradient(100% 70% at 96% -6%,rgba(11,23,79,.07),transparent 55%), radial-gradient(80% 70% at -6% 104%,rgba(46,74,107,.06),transparent 60%) !important; } /* top hairline */ .direttivi1::before{ content:"";position:absolute;top:0;left:0;right:0;height:1px;z-index:3;pointer-events:none; background:linear-gradient(90deg,transparent,var(--brand-lt) 20%,var(--brand) 50%,var(--brand-lt) 80%,transparent); opacity:.55; } /* ---- SINGLE FULL-WIDTH COLUMN ---- */ .direttivi1 > .e-con-inner{ position:relative;z-index:1;overflow:visible !important; width:min(1200px,92vw) !important;margin-inline:auto !important; display:block !important; /* no grid — one column */ } .direttivi1 > .e-con-inner > .e-child{ width:100% !important;max-width:none !important;min-width:0 !important; gap:0 !important; /* the image column used to be :first-child and carried a sticky rule + a 460px cap. With one child left, those would now clamp and stick the CONTENT — so they are deliberately not here. */ position:static !important; } /* hide an HTML widget that only carries style/script */ .direttivi1 .elementor-widget-html:has(style):not(:has(.eyebrow)), .direttivi1 .elementor-widget-html:has(script):not(:has(.eyebrow)){display:none !important} /* ============================================================ HEADER ============================================================ */ .direttivi1 .eyebrow{ display:inline-flex;align-items:center;gap:14px; font-family:var(--fs); font-size:.72rem;font-weight:700;letter-spacing:.34em;text-transform:uppercase; color:var(--brand);margin-bottom:22px; } .direttivi1 .eyebrow::before{ content:"";width:44px;height:2px;border-radius:2px; background:linear-gradient(90deg,var(--brand),var(--brand-lt)); transform-origin:left;transform:scaleX(0); animation:d1-eye 1s var(--ease) .25s forwards; } @keyframes d1-eye{to{transform:scaleX(1)}} .direttivi1 .headlineanm .elementor-heading-title, .direttivi1 .elementor-widget-heading .elementor-heading-title{ font-family:var(--fd) !important;font-weight:400 !important; font-size:clamp(2.1rem,4.4vw,3.4rem) !important;line-height:1.07 !important;letter-spacing:-.015em; color:var(--navy) !important;margin:0 0 24px !important; max-width:22ch; /* keeps the headline from over-running */ } /* the 2 intro paragraphs — capped so lines stay readable at full width */ .direttivi1 .elementor-widget-text-editor{ font-family:var(--fs); font-size:1.04rem !important;line-height:1.8 !important;color:var(--muted) !important; max-width:72ch;margin:0 0 16px !important; } .direttivi1 .elementor-widget-text-editor p{margin:0 !important} /* ============================================================ THE CREDENTIAL LIST (icon-boxes with NO title) ============================================================ */ .direttivi1 > .e-con-inner > .e-child{counter-reset:d1} .direttivi1 .elementor-widget-icon-box{ counter-increment:d1; position:relative; padding:clamp(13px,1.4vw,17px) 0 clamp(13px,1.4vw,17px) calc(var(--rail-x) + 44px) !important; margin:0 !important; background:transparent !important; width:100% !important; break-inside:avoid;-webkit-column-break-inside:avoid; animation:d1-in .65s var(--ease) var(--d,0s) both; transition:padding-left .35s var(--ease); } @keyframes d1-in{ from{opacity:0;transform:translateX(14px)} to{opacity:1;transform:none} } .direttivi1 .elementor-widget-icon-box:first-of-type{margin-top:clamp(20px,2.4vw,30px) !important} .direttivi1 .elementor-widget-icon-box:nth-of-type(1){--d:.10s} .direttivi1 .elementor-widget-icon-box:nth-of-type(2){--d:.18s} .direttivi1 .elementor-widget-icon-box:nth-of-type(3){--d:.26s} .direttivi1 .elementor-widget-icon-box:nth-of-type(4){--d:.34s} .direttivi1 .elementor-widget-icon-box:nth-of-type(5){--d:.42s} .direttivi1 .elementor-widget-icon-box:nth-of-type(6){--d:.50s} .direttivi1 .elementor-widget-icon-box:nth-of-type(7){--d:.58s} .direttivi1 .elementor-widget-icon-box:nth-of-type(8){--d:.66s} /* base rail down the left of each row */ .direttivi1 .elementor-widget-icon-box::before{ content:""; position:absolute;left:var(--rail-x);top:0;bottom:0;width:2px; background:var(--line-2);border-radius:2px; } /* navy rail overlay, drawing itself in per row */ .direttivi1 .elementor-icon-box-wrapper::before{ content:""; position:absolute;left:var(--rail-x);top:0;height:100%;width:2px;border-radius:2px; background:linear-gradient(var(--brand-lt),var(--brand)); transform:scaleY(0);transform-origin:top; animation:d1-rail .65s var(--ease) var(--d,0s) forwards; } @keyframes d1-rail{to{transform:scaleY(1)}} .direttivi1 .elementor-icon-box-wrapper{position:static !important} /* the navy CHECK marker, centred on the rail */ .direttivi1 .elementor-widget-icon-box::after{ content:"✓"; position:absolute; left:calc(var(--rail-x) + 1px - (var(--mark-d) / 2)); top:50%;transform:translateY(-50%) scale(.5); width:var(--mark-d);height:var(--mark-d);border-radius:50%; display:flex;align-items:center;justify-content:center; font-family:var(--fs);font-size:.72rem;font-weight:700;line-height:1; color:#fff;background:var(--brand); box-shadow:0 0 0 3px var(--paper); opacity:0; animation:d1-mark .45s var(--ease) var(--d,0s) forwards; transition:background .35s var(--ease),box-shadow .35s var(--ease); z-index:3; } @keyframes d1-mark{to{opacity:1;transform:translateY(-50%) scale(1)}} /* box internals */ .direttivi1 .elementor-icon-box-wrapper{display:block !important;text-align:left !important} .direttivi1 .elementor-icon-box-icon{display:none !important} /* the description IS the credential statement here */ .direttivi1 .elementor-icon-box-description{ font-family:var(--fs) !important; font-size:1.01rem !important;line-height:1.62 !important; color:var(--ink) !important;margin:0 !important; max-width:78ch; /* keeps lines readable at full width */ transition:color .35s var(--ease); } /* hover */ .direttivi1 .elementor-widget-icon-box:hover{padding-left:calc(var(--rail-x) + 52px) !important} .direttivi1 .elementor-widget-icon-box:hover::after{ background:var(--brand-lt); box-shadow:0 0 0 3px var(--paper),0 0 0 7px rgba(11,23,79,.20); } .direttivi1 .elementor-widget-icon-box:hover .elementor-icon-box-description{color:var(--navy) !important} /* ============================================================ BUTTON ============================================================ */ .direttivi1 .elementor-widget-button{ margin-top:clamp(26px,3vw,38px) !important; width:100% !important; } .direttivi1 .elementor-button{ display:inline-flex !important;align-items:center;gap:12px; font-family:var(--fs) !important; font-size:.82rem !important;font-weight:700 !important; letter-spacing:.09em !important;text-transform:uppercase !important; color:#fff !important; background:var(--brand) !important; border:0 !important;border-radius:100px !important; padding:15px 28px !important; box-shadow:0 14px 30px -14px rgba(11,23,79,.6); transition:background .35s var(--ease),transform .35s var(--ease),box-shadow .35s var(--ease); } .direttivi1 .elementor-button::after{ content:"";width:16px;height:1px;background:currentColor;position:relative; transition:width .35s var(--ease); } .direttivi1 .elementor-button:hover{ background:var(--brand-lt) !important; transform:translateY(-2px); box-shadow:0 20px 36px -16px rgba(11,23,79,.7); } .direttivi1 .elementor-button:hover::after{width:26px} /* ============================================================ RESPONSIVE ============================================================ */ @media(max-width:767px){ .direttivi1{padding:70px 0 !important} .direttivi1 .elementor-widget-text-editor{max-width:none} } /* ============================================================ REDUCED MOTION ============================================================ */ @media(prefers-reduced-motion:reduce){ .direttivi1 .elementor-widget-icon-box, .direttivi1 .elementor-widget-icon-box::after, .direttivi1 .elementor-icon-box-wrapper::before, .direttivi1 .eyebrow::before{ animation:none !important;opacity:1 !important; } .direttivi1 .elementor-widget-icon-box::after{transform:translateY(-50%) scale(1) !important} .direttivi1 .elementor-icon-box-wrapper::before{transform:scaleY(1) !important} .direttivi1 .eyebrow::before{transform:scaleX(1) !important} .direttivi1 .elementor-button:hover{transform:none} }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-a21bd70 *//* ============================================================ IL METODO — matched to the live Elementor markup Replicates the premium timeline design on .sectionmetodo. STRUCTURE THIS TARGETS .sectionmetodo > .e-con-inner ├ HTML widget → span.eyebrow ├ .headlineanm → h2.elementor-heading-title ├ HTML widget →