#imPage { display: grid; grid-template-columns: minmax(0, 1fr) 1200px minmax(0, 1fr); grid-template-rows: 187px auto; } #imHeader { display: block; grid-column: 1 / 4; grid-row: 1 / 2; } #imFooter { display: none; } #imSideBar { display: none; } #imContent { display: block; grid-column: 1 / 4; grid-row: 2 / 3; } #imContentGraphics { display: block; grid-column: 2 / 3; grid-row: 2 / 3; } @media (max-width: 1199.9px) and (min-width: 720.0px) { #imPage { display: grid; grid-template-columns: minmax(0, 1fr) 720px minmax(0, 1fr); grid-template-rows: 80px auto; } #imHeader { display: block; grid-column: 1 / 4; grid-row: 1 / 2; } #imFooter { display: none; } #imSideBar { display: none; } #imContent { display: block; grid-column: 1 / 4; grid-row: 2 / 3; } #imContentGraphics { display: block; grid-column: 2 / 3; grid-row: 2 / 3; } } @media (max-width: 719.9px) and (min-width: 480.0px) { #imPage { display: grid; grid-template-columns: minmax(0, 1fr) 480px minmax(0, 1fr); grid-template-rows: 114px auto; } #imHeader { display: block; grid-column: 1 / 4; grid-row: 1 / 2; } #imFooter { display: none; } #imSideBar { display: none; } #imContent { display: block; grid-column: 1 / 4; grid-row: 2 / 3; } #imContentGraphics { display: block; grid-column: 2 / 3; grid-row: 2 / 3; } } @media (max-width: 479.9px) { #imPage { display: grid; grid-template-columns: 0 minmax(0, 1fr) 0; grid-template-rows: 118px auto; } #imHeader { display: block; grid-column: 1 / 4; grid-row: 1 / 2; } #imFooter { display: none; } #imSideBar { display: none; } #imContent { display: block; grid-column: 1 / 4; grid-row: 2 / 3; } #imContentGraphics { display: block; grid-column: 2 / 3; grid-row: 2 / 3; } } #imContent { display: grid; grid-template-columns: minmax(0, 1fr) 91.667px 91.667px 91.667px 91.667px 91.667px 91.667px 91.667px 91.667px 91.667px 91.667px 91.667px 91.667px minmax(0, 1fr); grid-template-rows: auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto; } #imContent > header { display: block; grid-column: 2 / 14; grid-row: 1 / 2; } #imGoToCont { display: block; grid-column: 2 / 3; grid-row: 1 / 2; } #imCell_1 { display: grid; grid-column: 1 / 15; grid-row: 2 / 3; } #imCell_2 { display: grid; grid-column: 1 / 15; grid-row: 3 / 4; } #imCell_3 { display: grid; grid-column: 1 / 15; grid-row: 4 / 5; } #imCell_4 { display: grid; grid-column: 1 / 15; grid-row: 5 / 6; } #imCell_5 { display: grid; grid-column: 1 / 15; grid-row: 6 / 7; } #imCell_6 { display: grid; grid-column: 1 / 15; grid-row: 7 / 8; } #imCell_7 { display: grid; grid-column: 1 / 15; grid-row: 8 / 9; } #imCell_8 { display: grid; grid-column: 1 / 15; grid-row: 9 / 10; } #imCell_9 { display: grid; grid-column: 1 / 15; grid-row: 10 / 11; } #imCell_10 { display: grid; grid-column: 1 / 15; grid-row: 11 / 12; } #imCell_11 { display: grid; grid-column: 1 / 15; grid-row: 12 / 13; } #imCell_12 { display: grid; grid-column: 1 / 15; grid-row: 13 / 14; } #imCell_13 { display: grid; grid-column: 1 / 15; grid-row: 14 / 15; } #imCell_14 { display: grid; grid-column: 1 / 15; grid-row: 15 / 16; } #imCell_15 { display: grid; grid-column: 1 / 15; grid-row: 16 / 17; } #imCell_16 { display: grid; grid-column: 1 / 15; grid-row: 17 / 18; } #imCell_17 { display: grid; grid-column: 1 / 15; grid-row: 18 / 19; } #imCell_18 { display: grid; grid-column: 1 / 15; grid-row: 19 / 20; } #imCell_19 { display: grid; grid-column: 1 / 15; grid-row: 20 / 21; } #imCell_20 { display: grid; grid-column: 1 / 15; grid-row: 21 / 22; } #imCell_21 { display: grid; grid-column: 1 / 15; grid-row: 22 / 23; } #imCell_22 { display: grid; grid-column: 1 / 15; grid-row: 23 / 24; } #imCell_23 { display: grid; grid-column: 1 / 15; grid-row: 24 / 25; } #imCell_24 { display: grid; grid-column: 1 / 15; grid-row: 25 / 26; } #imCell_25 { display: grid; grid-column: 1 / 15; grid-row: 26 / 27; } #imCell_26 { display: grid; grid-column: 1 / 15; grid-row: 27 / 28; } #imCell_27 { display: grid; grid-column: 1 / 15; grid-row: 28 / 29; } #imCell_28 { display: grid; grid-column: 1 / 15; grid-row: 29 / 30; } #imCell_29 { display: grid; grid-column: 1 / 15; grid-row: 30 / 31; } #imCell_30 { display: grid; grid-column: 1 / 15; grid-row: 31 / 32; } #imCell_31 { display: grid; grid-column: 1 / 15; grid-row: 32 / 33; } #imCell_32 { display: grid; grid-column: 1 / 15; grid-row: 33 / 34; } #imCell_33 { display: grid; grid-column: 1 / 15; grid-row: 34 / 35; } #imCell_34 { display: grid; grid-column: 1 / 15; grid-row: 35 / 36; } #imCell_35 { display: grid; grid-column: 1 / 15; grid-row: 36 / 37; } #imCell_36 { display: grid; grid-column: 1 / 15; grid-row: 37 / 38; } #imPageRow_1 { display: block; grid-column: 2 / 14; grid-row: 2 / 3; } #imPageRow_2 { display: block; grid-column: 2 / 14; grid-row: 3 / 4; } #imPageRow_3 { display: block; grid-column: 2 / 14; grid-row: 4 / 5; } #imPageRow_4 { display: block; grid-column: 2 / 14; grid-row: 5 / 6; } #imPageRow_5 { display: block; grid-column: 2 / 14; grid-row: 6 / 7; } #imPageRow_6 { display: block; grid-column: 2 / 14; grid-row: 7 / 8; } #imPageRow_7 { display: block; grid-column: 2 / 14; grid-row: 8 / 9; } #imPageRow_8 { display: block; grid-column: 2 / 14; grid-row: 9 / 10; } #imPageRow_9 { display: block; grid-column: 2 / 14; grid-row: 10 / 11; } #imPageRow_10 { display: block; grid-column: 2 / 14; grid-row: 11 / 12; } #imPageRow_11 { display: block; grid-column: 2 / 14; grid-row: 12 / 13; } #imPageRow_12 { display: block; grid-column: 2 / 14; grid-row: 13 / 14; } #imPageRow_13 { display: block; grid-column: 2 / 14; grid-row: 14 / 15; } #imPageRow_14 { display: block; grid-column: 2 / 14; grid-row: 15 / 16; } #imPageRow_15 { display: block; grid-column: 2 / 14; grid-row: 16 / 17; } #imPageRow_16 { display: block; grid-column: 2 / 14; grid-row: 17 / 18; } #imPageRow_17 { display: block; grid-column: 2 / 14; grid-row: 18 / 19; } #imPageRow_18 { display: block; grid-column: 2 / 14; grid-row: 19 / 20; } #imPageRow_19 { display: block; grid-column: 2 / 14; grid-row: 20 / 21; } #imPageRow_20 { display: block; grid-column: 2 / 14; grid-row: 21 / 22; } #imPageRow_21 { display: block; grid-column: 2 / 14; grid-row: 22 / 23; } #imPageRow_22 { display: block; grid-column: 2 / 14; grid-row: 23 / 24; } #imPageRow_23 { display: block; grid-column: 2 / 14; grid-row: 24 / 25; } #imPageRow_24 { display: block; grid-column: 2 / 14; grid-row: 25 / 26; } #imPageRow_25 { display: block; grid-column: 2 / 14; grid-row: 26 / 27; } #imPageRow_26 { display: block; grid-column: 2 / 14; grid-row: 27 / 28; } #imPageRow_27 { display: block; grid-column: 2 / 14; grid-row: 28 / 29; } #imPageRow_28 { display: block; grid-column: 2 / 14; grid-row: 29 / 30; } #imPageRow_29 { display: block; grid-column: 2 / 14; grid-row: 30 / 31; } #imPageRow_30 { display: block; grid-column: 2 / 14; grid-row: 31 / 32; } #imPageRow_31 { display: block; grid-column: 2 / 14; grid-row: 32 / 33; } #imPageRow_32 { display: block; grid-column: 2 / 14; grid-row: 33 / 34; } #imPageRow_33 { display: block; grid-column: 2 / 14; grid-row: 34 / 35; } #imPageRow_34 { display: block; grid-column: 2 / 14; grid-row: 35 / 36; } #imPageRow_35 { display: block; grid-column: 2 / 14; grid-row: 36 / 37; } #imPageRow_36 { display: block; grid-column: 2 / 14; grid-row: 37 / 38; } @media (max-width: 1199.9px) and (min-width: 720.0px) { #imContent { display: grid; grid-template-columns: minmax(0, 1fr) 58.333px 58.333px 58.333px 58.333px 58.333px 58.333px 58.333px 58.333px 58.333px 58.333px 58.333px 58.333px minmax(0, 1fr); grid-template-rows: auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto; } #imContent > header { display: block; grid-column: 2 / 14; grid-row: 1 / 2; } #imGoToCont { display: block; grid-column: 2 / 3; grid-row: 1 / 2; } #imCell_1 { display: grid; grid-column: 1 / 15; grid-row: 2 / 3; } #imCell_2 { display: grid; grid-column: 1 / 15; grid-row: 3 / 4; } #imCell_3 { display: grid; grid-column: 1 / 15; grid-row: 4 / 5; } #imCell_4 { display: grid; grid-column: 1 / 15; grid-row: 5 / 6; } #imCell_5 { display: grid; grid-column: 1 / 15; grid-row: 6 / 7; } #imCell_6 { display: grid; grid-column: 1 / 15; grid-row: 7 / 8; } #imCell_7 { display: grid; grid-column: 1 / 15; grid-row: 8 / 9; } #imCell_8 { display: grid; grid-column: 1 / 15; grid-row: 9 / 10; } #imCell_9 { display: grid; grid-column: 1 / 15; grid-row: 10 / 11; } #imCell_10 { display: grid; grid-column: 1 / 15; grid-row: 11 / 12; } #imCell_11 { display: grid; grid-column: 1 / 15; grid-row: 12 / 13; } #imCell_12 { display: grid; grid-column: 1 / 15; grid-row: 13 / 14; } #imCell_13 { display: grid; grid-column: 1 / 15; grid-row: 14 / 15; } #imCell_14 { display: grid; grid-column: 1 / 15; grid-row: 15 / 16; } #imCell_15 { display: grid; grid-column: 1 / 15; grid-row: 16 / 17; } #imCell_16 { display: grid; grid-column: 1 / 15; grid-row: 17 / 18; } #imCell_17 { display: grid; grid-column: 1 / 15; grid-row: 18 / 19; } #imCell_18 { display: grid; grid-column: 1 / 15; grid-row: 19 / 20; } #imCell_19 { display: grid; grid-column: 1 / 15; grid-row: 20 / 21; } #imCell_20 { display: grid; grid-column: 1 / 15; grid-row: 21 / 22; } #imCell_21 { display: grid; grid-column: 1 / 15; grid-row: 22 / 23; } #imCell_22 { display: grid; grid-column: 1 / 15; grid-row: 23 / 24; } #imCell_23 { display: grid; grid-column: 1 / 15; grid-row: 24 / 25; } #imCell_24 { display: grid; grid-column: 1 / 15; grid-row: 25 / 26; } #imCell_25 { display: grid; grid-column: 1 / 15; grid-row: 26 / 27; } #imCell_26 { display: grid; grid-column: 1 / 15; grid-row: 27 / 28; } #imCell_27 { display: grid; grid-column: 1 / 15; grid-row: 28 / 29; } #imCell_28 { display: grid; grid-column: 1 / 15; grid-row: 29 / 30; } #imCell_29 { display: grid; grid-column: 1 / 15; grid-row: 30 / 31; } #imCell_30 { display: grid; grid-column: 1 / 15; grid-row: 31 / 32; } #imCell_31 { display: grid; grid-column: 1 / 15; grid-row: 32 / 33; } #imCell_32 { display: grid; grid-column: 1 / 15; grid-row: 33 / 34; } #imCell_33 { display: grid; grid-column: 1 / 15; grid-row: 34 / 35; } #imCell_34 { display: grid; grid-column: 1 / 15; grid-row: 35 / 36; } #imCell_35 { display: grid; grid-column: 1 / 15; grid-row: 36 / 37; } #imCell_36 { display: grid; grid-column: 1 / 15; grid-row: 37 / 38; } #imPageRow_1 { display: block; grid-column: 2 / 14; grid-row: 2 / 3; } #imPageRow_2 { display: block; grid-column: 2 / 14; grid-row: 3 / 4; } #imPageRow_3 { display: block; grid-column: 2 / 14; grid-row: 4 / 5; } #imPageRow_4 { display: block; grid-column: 2 / 14; grid-row: 5 / 6; } #imPageRow_5 { display: block; grid-column: 2 / 14; grid-row: 6 / 7; } #imPageRow_6 { display: block; grid-column: 2 / 14; grid-row: 7 / 8; } #imPageRow_7 { display: block; grid-column: 2 / 14; grid-row: 8 / 9; } #imPageRow_8 { display: block; grid-column: 2 / 14; grid-row: 9 / 10; } #imPageRow_9 { display: block; grid-column: 2 / 14; grid-row: 10 / 11; } #imPageRow_10 { display: block; grid-column: 2 / 14; grid-row: 11 / 12; } #imPageRow_11 { display: block; grid-column: 2 / 14; grid-row: 12 / 13; } #imPageRow_12 { display: block; grid-column: 2 / 14; grid-row: 13 / 14; } #imPageRow_13 { display: block; grid-column: 2 / 14; grid-row: 14 / 15; } #imPageRow_14 { display: block; grid-column: 2 / 14; grid-row: 15 / 16; } #imPageRow_15 { display: block; grid-column: 2 / 14; grid-row: 16 / 17; } #imPageRow_16 { display: block; grid-column: 2 / 14; grid-row: 17 / 18; } #imPageRow_17 { display: block; grid-column: 2 / 14; grid-row: 18 / 19; } #imPageRow_18 { display: block; grid-column: 2 / 14; grid-row: 19 / 20; } #imPageRow_19 { display: block; grid-column: 2 / 14; grid-row: 20 / 21; } #imPageRow_20 { display: block; grid-column: 2 / 14; grid-row: 21 / 22; } #imPageRow_21 { display: block; grid-column: 2 / 14; grid-row: 22 / 23; } #imPageRow_22 { display: block; grid-column: 2 / 14; grid-row: 23 / 24; } #imPageRow_23 { display: block; grid-column: 2 / 14; grid-row: 24 / 25; } #imPageRow_24 { display: block; grid-column: 2 / 14; grid-row: 25 / 26; } #imPageRow_25 { display: block; grid-column: 2 / 14; grid-row: 26 / 27; } #imPageRow_26 { display: block; grid-column: 2 / 14; grid-row: 27 / 28; } #imPageRow_27 { display: block; grid-column: 2 / 14; grid-row: 28 / 29; } #imPageRow_28 { display: block; grid-column: 2 / 14; grid-row: 29 / 30; } #imPageRow_29 { display: block; grid-column: 2 / 14; grid-row: 30 / 31; } #imPageRow_30 { display: block; grid-column: 2 / 14; grid-row: 31 / 32; } #imPageRow_31 { display: block; grid-column: 2 / 14; grid-row: 32 / 33; } #imPageRow_32 { display: block; grid-column: 2 / 14; grid-row: 33 / 34; } #imPageRow_33 { display: block; grid-column: 2 / 14; grid-row: 34 / 35; } #imPageRow_34 { display: block; grid-column: 2 / 14; grid-row: 35 / 36; } #imPageRow_35 { display: block; grid-column: 2 / 14; grid-row: 36 / 37; } #imPageRow_36 { display: block; grid-column: 2 / 14; grid-row: 37 / 38; } } @media (max-width: 719.9px) and (min-width: 480.0px) { #imContent { display: grid; grid-template-columns: minmax(0, 1fr) 38.333px 38.333px 38.333px 38.333px 38.333px 38.333px 38.333px 38.333px 38.333px 38.333px 38.333px 38.333px minmax(0, 1fr); grid-template-rows: auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto; } #imContent > header { display: block; grid-column: 2 / 14; grid-row: 1 / 2; } #imGoToCont { display: block; grid-column: 2 / 3; grid-row: 1 / 2; } #imCell_1 { display: grid; grid-column: 1 / 15; grid-row: 2 / 3; } #imCell_2 { display: grid; grid-column: 1 / 15; grid-row: 3 / 4; } #imCell_3 { display: grid; grid-column: 1 / 15; grid-row: 4 / 5; } #imCell_4 { display: grid; grid-column: 1 / 15; grid-row: 5 / 6; } #imCell_5 { display: grid; grid-column: 1 / 15; grid-row: 6 / 7; } #imCell_6 { display: grid; grid-column: 1 / 15; grid-row: 7 / 8; } #imCell_7 { display: grid; grid-column: 1 / 15; grid-row: 8 / 9; } #imCell_8 { display: grid; grid-column: 1 / 15; grid-row: 9 / 10; } #imCell_9 { display: grid; grid-column: 1 / 15; grid-row: 10 / 11; } #imCell_10 { display: grid; grid-column: 1 / 15; grid-row: 11 / 12; } #imCell_11 { display: grid; grid-column: 1 / 15; grid-row: 12 / 13; } #imCell_12 { display: grid; grid-column: 1 / 15; grid-row: 13 / 14; } #imCell_13 { display: grid; grid-column: 1 / 15; grid-row: 14 / 15; } #imCell_14 { display: grid; grid-column: 1 / 15; grid-row: 15 / 16; } #imCell_15 { display: grid; grid-column: 1 / 15; grid-row: 16 / 17; } #imCell_16 { display: grid; grid-column: 1 / 15; grid-row: 17 / 18; } #imCell_17 { display: grid; grid-column: 1 / 15; grid-row: 18 / 19; } #imCell_18 { display: grid; grid-column: 1 / 15; grid-row: 19 / 20; } #imCell_19 { display: grid; grid-column: 1 / 15; grid-row: 20 / 21; } #imCell_20 { display: grid; grid-column: 1 / 15; grid-row: 21 / 22; } #imCell_21 { display: grid; grid-column: 1 / 15; grid-row: 22 / 23; } #imCell_22 { display: grid; grid-column: 1 / 15; grid-row: 23 / 24; } #imCell_23 { display: grid; grid-column: 1 / 15; grid-row: 24 / 25; } #imCell_24 { display: grid; grid-column: 1 / 15; grid-row: 25 / 26; } #imCell_25 { display: grid; grid-column: 1 / 15; grid-row: 26 / 27; } #imCell_26 { display: grid; grid-column: 1 / 15; grid-row: 27 / 28; } #imCell_27 { display: grid; grid-column: 1 / 15; grid-row: 28 / 29; } #imCell_28 { display: grid; grid-column: 1 / 15; grid-row: 29 / 30; } #imCell_29 { display: grid; grid-column: 1 / 15; grid-row: 30 / 31; } #imCell_30 { display: grid; grid-column: 1 / 15; grid-row: 31 / 32; } #imCell_31 { display: grid; grid-column: 1 / 15; grid-row: 32 / 33; } #imCell_32 { display: grid; grid-column: 1 / 15; grid-row: 33 / 34; } #imCell_33 { display: grid; grid-column: 1 / 15; grid-row: 34 / 35; } #imCell_34 { display: grid; grid-column: 1 / 15; grid-row: 35 / 36; } #imCell_35 { display: grid; grid-column: 1 / 15; grid-row: 36 / 37; } #imCell_36 { display: grid; grid-column: 1 / 15; grid-row: 37 / 38; } #imPageRow_1 { display: block; grid-column: 2 / 14; grid-row: 2 / 3; } #imPageRow_2 { display: block; grid-column: 2 / 14; grid-row: 3 / 4; } #imPageRow_3 { display: block; grid-column: 2 / 14; grid-row: 4 / 5; } #imPageRow_4 { display: block; grid-column: 2 / 14; grid-row: 5 / 6; } #imPageRow_5 { display: block; grid-column: 2 / 14; grid-row: 6 / 7; } #imPageRow_6 { display: block; grid-column: 2 / 14; grid-row: 7 / 8; } #imPageRow_7 { display: block; grid-column: 2 / 14; grid-row: 8 / 9; } #imPageRow_8 { display: block; grid-column: 2 / 14; grid-row: 9 / 10; } #imPageRow_9 { display: block; grid-column: 2 / 14; grid-row: 10 / 11; } #imPageRow_10 { display: block; grid-column: 2 / 14; grid-row: 11 / 12; } #imPageRow_11 { display: block; grid-column: 2 / 14; grid-row: 12 / 13; } #imPageRow_12 { display: block; grid-column: 2 / 14; grid-row: 13 / 14; } #imPageRow_13 { display: block; grid-column: 2 / 14; grid-row: 14 / 15; } #imPageRow_14 { display: block; grid-column: 2 / 14; grid-row: 15 / 16; } #imPageRow_15 { display: block; grid-column: 2 / 14; grid-row: 16 / 17; } #imPageRow_16 { display: block; grid-column: 2 / 14; grid-row: 17 / 18; } #imPageRow_17 { display: block; grid-column: 2 / 14; grid-row: 18 / 19; } #imPageRow_18 { display: block; grid-column: 2 / 14; grid-row: 19 / 20; } #imPageRow_19 { display: block; grid-column: 2 / 14; grid-row: 20 / 21; } #imPageRow_20 { display: block; grid-column: 2 / 14; grid-row: 21 / 22; } #imPageRow_21 { display: block; grid-column: 2 / 14; grid-row: 22 / 23; } #imPageRow_22 { display: block; grid-column: 2 / 14; grid-row: 23 / 24; } #imPageRow_23 { display: block; grid-column: 2 / 14; grid-row: 24 / 25; } #imPageRow_24 { display: block; grid-column: 2 / 14; grid-row: 25 / 26; } #imPageRow_25 { display: block; grid-column: 2 / 14; grid-row: 26 / 27; } #imPageRow_26 { display: block; grid-column: 2 / 14; grid-row: 27 / 28; } #imPageRow_27 { display: block; grid-column: 2 / 14; grid-row: 28 / 29; } #imPageRow_28 { display: block; grid-column: 2 / 14; grid-row: 29 / 30; } #imPageRow_29 { display: block; grid-column: 2 / 14; grid-row: 30 / 31; } #imPageRow_30 { display: block; grid-column: 2 / 14; grid-row: 31 / 32; } #imPageRow_31 { display: block; grid-column: 2 / 14; grid-row: 32 / 33; } #imPageRow_32 { display: block; grid-column: 2 / 14; grid-row: 33 / 34; } #imPageRow_33 { display: block; grid-column: 2 / 14; grid-row: 34 / 35; } #imPageRow_34 { display: block; grid-column: 2 / 14; grid-row: 35 / 36; } #imPageRow_35 { display: block; grid-column: 2 / 14; grid-row: 36 / 37; } #imPageRow_36 { display: block; grid-column: 2 / 14; grid-row: 37 / 38; } } @media (max-width: 479.9px) { #imContent { display: grid; grid-template-columns: 0 minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) 0; grid-template-rows: auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto; } #imContent > header { display: block; grid-column: 2 / 14; grid-row: 1 / 2; } #imGoToCont { display: block; grid-column: 2 / 3; grid-row: 1 / 2; } #imCell_1 { display: grid; grid-column: 1 / 15; grid-row: 2 / 3; } #imCell_2 { display: grid; grid-column: 1 / 15; grid-row: 3 / 4; } #imCell_3 { display: grid; grid-column: 1 / 15; grid-row: 4 / 5; } #imCell_4 { display: grid; grid-column: 1 / 15; grid-row: 5 / 6; } #imCell_5 { display: grid; grid-column: 1 / 15; grid-row: 6 / 7; } #imCell_6 { display: grid; grid-column: 1 / 15; grid-row: 7 / 8; } #imCell_7 { display: grid; grid-column: 1 / 15; grid-row: 8 / 9; } #imCell_8 { display: grid; grid-column: 1 / 15; grid-row: 9 / 10; } #imCell_9 { display: grid; grid-column: 1 / 15; grid-row: 10 / 11; } #imCell_10 { display: grid; grid-column: 1 / 15; grid-row: 11 / 12; } #imCell_11 { display: grid; grid-column: 1 / 15; grid-row: 12 / 13; } #imCell_12 { display: grid; grid-column: 1 / 15; grid-row: 13 / 14; } #imCell_13 { display: grid; grid-column: 1 / 15; grid-row: 14 / 15; } #imCell_14 { display: grid; grid-column: 1 / 15; grid-row: 15 / 16; } #imCell_15 { display: grid; grid-column: 1 / 15; grid-row: 16 / 17; } #imCell_16 { display: grid; grid-column: 1 / 15; grid-row: 17 / 18; } #imCell_17 { display: grid; grid-column: 1 / 15; grid-row: 18 / 19; } #imCell_18 { display: grid; grid-column: 1 / 15; grid-row: 19 / 20; } #imCell_19 { display: grid; grid-column: 1 / 15; grid-row: 20 / 21; } #imCell_20 { display: grid; grid-column: 1 / 15; grid-row: 21 / 22; } #imCell_21 { display: grid; grid-column: 1 / 15; grid-row: 22 / 23; } #imCell_22 { display: grid; grid-column: 1 / 15; grid-row: 23 / 24; } #imCell_23 { display: grid; grid-column: 1 / 15; grid-row: 24 / 25; } #imCell_24 { display: grid; grid-column: 1 / 15; grid-row: 25 / 26; } #imCell_25 { display: grid; grid-column: 1 / 15; grid-row: 26 / 27; } #imCell_26 { display: grid; grid-column: 1 / 15; grid-row: 27 / 28; } #imCell_27 { display: grid; grid-column: 1 / 15; grid-row: 28 / 29; } #imCell_28 { display: grid; grid-column: 1 / 15; grid-row: 29 / 30; } #imCell_29 { display: grid; grid-column: 1 / 15; grid-row: 30 / 31; } #imCell_30 { display: grid; grid-column: 1 / 15; grid-row: 31 / 32; } #imCell_31 { display: grid; grid-column: 1 / 15; grid-row: 32 / 33; } #imCell_32 { display: grid; grid-column: 1 / 15; grid-row: 33 / 34; } #imCell_33 { display: grid; grid-column: 1 / 15; grid-row: 34 / 35; } #imCell_34 { display: grid; grid-column: 1 / 15; grid-row: 35 / 36; } #imCell_35 { display: grid; grid-column: 1 / 15; grid-row: 36 / 37; } #imCell_36 { display: grid; grid-column: 1 / 15; grid-row: 37 / 38; } #imPageRow_1 { display: block; grid-column: 2 / 14; grid-row: 2 / 3; } #imPageRow_2 { display: block; grid-column: 2 / 14; grid-row: 3 / 4; } #imPageRow_3 { display: block; grid-column: 2 / 14; grid-row: 4 / 5; } #imPageRow_4 { display: block; grid-column: 2 / 14; grid-row: 5 / 6; } #imPageRow_5 { display: block; grid-column: 2 / 14; grid-row: 6 / 7; } #imPageRow_6 { display: block; grid-column: 2 / 14; grid-row: 7 / 8; } #imPageRow_7 { display: block; grid-column: 2 / 14; grid-row: 8 / 9; } #imPageRow_8 { display: block; grid-column: 2 / 14; grid-row: 9 / 10; } #imPageRow_9 { display: block; grid-column: 2 / 14; grid-row: 10 / 11; } #imPageRow_10 { display: block; grid-column: 2 / 14; grid-row: 11 / 12; } #imPageRow_11 { display: block; grid-column: 2 / 14; grid-row: 12 / 13; } #imPageRow_12 { display: block; grid-column: 2 / 14; grid-row: 13 / 14; } #imPageRow_13 { display: block; grid-column: 2 / 14; grid-row: 14 / 15; } #imPageRow_14 { display: block; grid-column: 2 / 14; grid-row: 15 / 16; } #imPageRow_15 { display: block; grid-column: 2 / 14; grid-row: 16 / 17; } #imPageRow_16 { display: block; grid-column: 2 / 14; grid-row: 17 / 18; } #imPageRow_17 { display: block; grid-column: 2 / 14; grid-row: 18 / 19; } #imPageRow_18 { display: block; grid-column: 2 / 14; grid-row: 19 / 20; } #imPageRow_19 { display: block; grid-column: 2 / 14; grid-row: 20 / 21; } #imPageRow_20 { display: block; grid-column: 2 / 14; grid-row: 21 / 22; } #imPageRow_21 { display: block; grid-column: 2 / 14; grid-row: 22 / 23; } #imPageRow_22 { display: block; grid-column: 2 / 14; grid-row: 23 / 24; } #imPageRow_23 { display: block; grid-column: 2 / 14; grid-row: 24 / 25; } #imPageRow_24 { display: block; grid-column: 2 / 14; grid-row: 25 / 26; } #imPageRow_25 { display: block; grid-column: 2 / 14; grid-row: 26 / 27; } #imPageRow_26 { display: block; grid-column: 2 / 14; grid-row: 27 / 28; } #imPageRow_27 { display: block; grid-column: 2 / 14; grid-row: 28 / 29; } #imPageRow_28 { display: block; grid-column: 2 / 14; grid-row: 29 / 30; } #imPageRow_29 { display: block; grid-column: 2 / 14; grid-row: 30 / 31; } #imPageRow_30 { display: block; grid-column: 2 / 14; grid-row: 31 / 32; } #imPageRow_31 { display: block; grid-column: 2 / 14; grid-row: 32 / 33; } #imPageRow_32 { display: block; grid-column: 2 / 14; grid-row: 33 / 34; } #imPageRow_33 { display: block; grid-column: 2 / 14; grid-row: 34 / 35; } #imPageRow_34 { display: block; grid-column: 2 / 14; grid-row: 35 / 36; } #imPageRow_35 { display: block; grid-column: 2 / 14; grid-row: 36 / 37; } #imPageRow_36 { display: block; grid-column: 2 / 14; grid-row: 37 / 38; } } #imHeader_imCell_63 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHeader_imObjectImage_63 { position: relative; max-width: 100%; box-sizing: border-box; z-index: 3; } #imHeader_imCellStyleGraphics_63 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imHeader_imCellStyleBorders_63 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } #imHeader_imObjectImage_63 { vertical-align: top; margin-top: 0px; margin-bottom: 0px; margin-inline-start: auto; margin-inline-end: auto; } #imHeader_imObjectImage_63 #imHeader_imObjectImage_63_container img { width: 100%; height: auto; vertical-align: top; }#imHeader_imCell_7 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHeader_imObjectImage_07 { position: relative; max-width: 100%; box-sizing: border-box; z-index: 3; } #imHeader_imCellStyleGraphics_7 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imHeader_imCellStyleBorders_7 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } #imHeader_imObjectImage_07 { vertical-align: top; margin-top: 0px; margin-bottom: 0px; margin-inline-start: auto; margin-inline-end: auto; } #imHeader_imObjectImage_07 #imHeader_imObjectImage_07_container img { width: 100%; height: auto; vertical-align: top; }#imHeader_imCell_45 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHeader_imObjectButton_45 { position: relative; max-width: 100%; box-sizing: border-box; z-index: 3; } #imHeader_imCellStyleGraphics_45 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imHeader_imCellStyleBorders_45 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } #imHeader_imObjectButton_45 {margin: 0px; } #imHeader_imObjectButton_45_button {font: normal normal bold 18pt 'Arial'; background-color: transparent; transition: background-color 0.2s linear; position: relative; display: inline-block; word-wrap: break-word; max-width: 100%;border: solid; border-block-color: rgba(255, 255, 255, 1) rgba(255, 255, 255, 1); border-inline-color: rgba(255, 255, 255, 1) rgba(255, 255, 255, 1); border-width: 0px; border-radius: 25px; padding-block: 4px; padding-inline: 8px; color: rgba(8, 156, 68, 1); } #imHeader_imObjectButton_45_button:hover {background-color: transparent; cursor: pointer; } #imHeader_imCell_51 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHeader_imObjectButton_51 { position: relative; max-width: 100%; box-sizing: border-box; z-index: 3; } #imHeader_imCellStyleGraphics_51 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imHeader_imCellStyleBorders_51 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } #imHeader_imObjectButton_51 {margin: 0px; } #imHeader_imObjectButton_51_button {font: normal normal bold 18pt 'Arial'; background-color: transparent; transition: background-color 0.2s linear; position: relative; display: inline-block; word-wrap: break-word; max-width: 100%;border: solid; border-block-color: rgba(255, 255, 255, 1) rgba(255, 255, 255, 1); border-inline-color: rgba(255, 255, 255, 1) rgba(255, 255, 255, 1); border-width: 0px; border-radius: 25px; padding-block: 4px; padding-inline: 8px; color: rgba(8, 156, 68, 1); } #imHeader_imObjectButton_51_button:hover {background-color: transparent; cursor: pointer; } #imHeader_imCell_52 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHeader_imObjectButton_52 { position: relative; max-width: 100%; box-sizing: border-box; z-index: 3; } #imHeader_imCellStyleGraphics_52 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imHeader_imCellStyleBorders_52 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } #imHeader_imObjectButton_52 {margin: 0px; } #imHeader_imObjectButton_52_button {font: normal normal bold 11pt 'Arial'; background-color: rgba(0, 152, 70, 1); transition: background-color 0.2s linear; position: relative; display: inline-block; word-wrap: break-word; max-width: 100%;border: solid; border-block-color: rgba(255, 255, 255, 1) rgba(255, 255, 255, 1); border-inline-color: rgba(255, 255, 255, 1) rgba(255, 255, 255, 1); border-width: 1px; border-radius: 25px; padding: 10px; color: rgba(255, 255, 255, 1); } #imHeader_imObjectButton_52_button:hover {background-color: rgba(31, 112, 174, 1); cursor: pointer; } #imHeader_imCell_58 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHeader_imObjectImage_58 { position: relative; max-width: 100%; box-sizing: border-box; z-index: 3; } #imHeader_imCellStyleGraphics_58 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imHeader_imCellStyleBorders_58 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } #imHeader_imObjectImage_58 { vertical-align: top; margin-top: 0px; margin-bottom: 0px; margin-inline-start: auto; margin-inline-end: auto; } #imHeader_imObjectImage_58 #imHeader_imObjectImage_58_container img { width: 100%; height: auto; vertical-align: top; }#imHeader_imCell_61 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHeader_imObjectImage_61 { position: relative; max-width: 100%; box-sizing: border-box; z-index: 3; } #imHeader_imCellStyleGraphics_61 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imHeader_imCellStyleBorders_61 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } #imHeader_imObjectImage_61 { vertical-align: top; margin-top: 0px; margin-bottom: 0px; margin-inline-start: auto; margin-inline-end: auto; } #imHeader_imObjectImage_61 #imHeader_imObjectImage_61_container img { width: 100%; height: auto; vertical-align: top; }#imHeader_imCell_62 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHeader_imObjectImage_62 { position: relative; max-width: 100%; box-sizing: border-box; z-index: 3; } #imHeader_imCellStyleGraphics_62 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imHeader_imCellStyleBorders_62 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } #imHeader_imObjectImage_62 { vertical-align: top; margin-top: 0px; margin-bottom: 0px; margin-inline-start: auto; margin-inline-end: auto; } #imHeader_imObjectImage_62 #imHeader_imObjectImage_62_container img { width: 100%; height: auto; vertical-align: top; }#imHeader_imCell_84 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHeader_imMenuObject_84 { position: relative; max-width: 100%; box-sizing: border-box; z-index: 103; } #imHeader_imCellStyleGraphics_84 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imHeader_imCellStyleBorders_84 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 102; } .label-wrapper .menu-item-icon { max-height: 100%; position: absolute; top: 0; bottom: 0; inset-inline-start: 3px; margin: auto; z-index: 0; } .im-menu-opened #imStickyBarContainer, .im-menu-opened #imPageToTop { visibility: hidden !important; } #imHeader_imCell_85 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHeader_pluginAppObj_85 { position: relative; max-width: 100%; box-sizing: border-box; z-index: 3; } #imHeader_imCellStyleGraphics_85 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imHeader_imCellStyleBorders_85 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } #imHeader_imCell_86 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHeader_imObjectImage_86 { position: relative; max-width: 100%; box-sizing: border-box; z-index: 3; } #imHeader_imCellStyleGraphics_86 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imHeader_imCellStyleBorders_86 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } #imHeader_imObjectImage_86 { vertical-align: top; margin-top: 0px; margin-bottom: 0px; margin-inline-start: auto; margin-inline-end: auto; } #imHeader_imObjectImage_86 #imHeader_imObjectImage_86_container img { width: 100%; height: auto; vertical-align: top; }#imHeader_imCell_87 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHeader_pluginAppObj_87 { position: relative; max-width: 100%; box-sizing: border-box; z-index: 3; } #imHeader_imCellStyleGraphics_87 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imHeader_imCellStyleBorders_87 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } #imHeader_imCell_88 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHeader_pluginAppObj_88 { position: relative; max-width: 100%; box-sizing: border-box; z-index: 3; } #imHeader_imCellStyleGraphics_88 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imHeader_imCellStyleBorders_88 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } #imHeader_imCell_89 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHeader_pluginAppObj_89 { position: relative; max-width: 100%; box-sizing: border-box; z-index: 3; } #imHeader_imCellStyleGraphics_89 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imHeader_imCellStyleBorders_89 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } #imHeader_imCell_90 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHeader_pluginAppObj_90 { position: relative; max-width: 100%; box-sizing: border-box; z-index: 3; } #imHeader_imCellStyleGraphics_90 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imHeader_imCellStyleBorders_90 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } #imHeader_imCell_91 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHeader_pluginAppObj_91 { position: relative; max-width: 100%; box-sizing: border-box; z-index: 3; } #imHeader_imCellStyleGraphics_91 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imHeader_imCellStyleBorders_91 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } #imHeader_imCell_92 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHeader_pluginAppObj_92 { position: relative; max-width: 100%; box-sizing: border-box; z-index: 3; } #imHeader_imCellStyleGraphics_92 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imHeader_imCellStyleBorders_92 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } #imHeader_imCell_93 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHeader_imObjectImage_93 { position: relative; max-width: 100%; box-sizing: border-box; z-index: 3; } #imHeader_imCellStyleGraphics_93 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imHeader_imCellStyleBorders_93 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } #imHeader_imObjectImage_93 { vertical-align: top; margin-top: 0px; margin-bottom: 0px; margin-inline-start: auto; margin-inline-end: auto; } #imHeader_imObjectImage_93 #imHeader_imObjectImage_93_container img { width: 100%; height: auto; vertical-align: top; }#imHeader_imCell_94 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHeader_imObjectButton_94 { position: relative; max-width: 100%; box-sizing: border-box; z-index: 3; } #imHeader_imCellStyleGraphics_94 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imHeader_imCellStyleBorders_94 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } #imHeader_imObjectButton_94 {margin: 0px; } #imHeader_imObjectButton_94_button {font: normal normal bold 12pt 'Arial'; background-color: rgba(8, 156, 68, 1); transition: background-color 0.2s linear; position: relative; display: inline-block; word-wrap: break-word; max-width: 100%;border: solid; border-block-color: transparent transparent; border-inline-color: transparent transparent; border-width: 1px; border-radius: 5px; padding: 8px; color: rgba(255, 255, 255, 1); } #imHeader_imObjectButton_94_button:hover {background-color: rgba(38, 126, 98, 1); cursor: pointer; } #imHeader_imCell_95 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHeader_imObjectButton_95 { position: relative; max-width: 100%; box-sizing: border-box; z-index: 3; } #imHeader_imCellStyleGraphics_95 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imHeader_imCellStyleBorders_95 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } #imHeader_imObjectButton_95 {margin: 0px; } #imHeader_imObjectButton_95_button {font: normal normal bold 12pt 'Arial'; background-color: rgba(8, 156, 68, 1); transition: background-color 0.2s linear; position: relative; display: inline-block; word-wrap: break-word; max-width: 100%;border: solid; border-block-color: transparent transparent; border-inline-color: transparent transparent; border-width: 1px; border-radius: 5px; padding: 8px; color: rgba(255, 255, 255, 1); } #imHeader_imObjectButton_95_button:hover {background-color: rgba(38, 126, 98, 1); cursor: pointer; } #imFooter_imCell_24 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imFooter_imHTMLObject_24 { position: relative; max-width: 100%; box-sizing: border-box; z-index: 3; } #imFooter_imCellStyleGraphics_24 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imFooter_imCellStyleBorders_24 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } #imFooter_imCell_25 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imFooter_imHTMLObject_25 { position: relative; max-width: 100%; box-sizing: border-box; z-index: 3; } #imFooter_imCellStyleGraphics_25 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imFooter_imCellStyleBorders_25 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } #imFooter_imCell_26 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imFooter_imHTMLObject_26 { position: relative; max-width: 100%; box-sizing: border-box; z-index: 3; } #imFooter_imCellStyleGraphics_26 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imFooter_imCellStyleBorders_26 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } #imFooter_imCell_27 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imFooter_imHTMLObject_27 { position: relative; max-width: 100%; box-sizing: border-box; z-index: 3; } #imFooter_imCellStyleGraphics_27 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imFooter_imCellStyleBorders_27 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } #imFooter_imCell_28 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imFooter_imHTMLObject_28 { position: relative; max-width: 100%; box-sizing: border-box; z-index: 3; } #imFooter_imCellStyleGraphics_28 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imFooter_imCellStyleBorders_28 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } #imSideBar_imCell_19 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imSideBar_imObjectTitle_19 { position: relative; max-width: 100%; box-sizing: border-box; z-index: 3; } #imSideBar_imCellStyleGraphics_19 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imSideBar_imCellStyleBorders_19 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } #imSideBar_imObjectTitle_19 {margin: 0px; text-align: center;} #imSideBar_imObjectTitle_19_text {font: normal normal bold 16pt 'Arial'; padding: 0px; background-color: transparent; position: relative; display: inline-block; } #imSideBar_imObjectTitle_19_text, #imSideBar_imObjectTitle_19_text a { color: rgba(0, 152, 70, 1); overflow-wrap: break-word; max-width: 100%;white-space: pre-wrap; } #imSideBar_imObjectTitle_19_text a{ text-decoration: none; } #imSideBar_imCell_21 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imSideBar_imObjectForm_21 { position: relative; max-width: 100%; box-sizing: border-box; z-index: 3; } #imSideBar_imCellStyleGraphics_21 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imSideBar_imCellStyleBorders_21 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } #imSideBar_imObjectForm_21 { width: 100%; } .imObjectForm_21_tip { position: absolute; inset-inline-end: 0px; width: 20px; } #imObjectForm_21_form { position: relative; width: 100%; margin: 0px; padding: 0px; text-align: start; font-family: Arial, sans serif; font-size: 11pt; font-weight: normal; font-style: normal; } #imObjectForm_21_form label, #imObjectForm_21_form .checkbox, #imObjectForm_21_form .radiobutton, #imObjectForm_21_form option.label_option { opacity: 1; color: rgba(31, 112, 174, 1); font-family: Arial, sans serif; font-size: 11pt; font-weight: normal; font-style: normal; -webkit-text-size-adjust: 100%; } #imObjectForm_21_form ::placeholder { opacity: 1; color: rgba(31, 112, 174, 1); font-family: Arial, sans serif; font-size: 11pt; font-weight: normal; font-style: normal; -webkit-text-size-adjust: 100%; } #imObjectForm_21_form label { text-align: start; padding-block: 1px; padding-inline: 0px; } #imObjectForm_21_form label span { display: inline-block; padding-top: 5px; padding-bottom: 5px; } #imObjectForm_21_form fieldset { margin: 0px; padding-block: 8px 0px; padding-inline: 0px; } #imObjectForm_21_form fieldset.first { margin: 0px; padding: 0px; } #imObjectForm_21_form div.legend { margin-bottom: 8px; font-family: Arial, sans serif; font-size: 11pt;} #imObjectForm_21_form input[type=text], #imObjectForm_21_form input[type=password], #imObjectForm_21_form input[type=file], #imObjectForm_21_form input[type=tel], #imObjectForm_21_form input[type=date], #imObjectForm_21_form input[type=number], #imObjectForm_21_form input[type=email], #imObjectForm_21_form input[type=url], #imObjectForm_21_form select, #imObjectForm_21_form textarea, #imObjectForm_21_form span.textarea { resize: none; margin-block: 2px; margin-inline: 0px; color: rgba(0, 0, 0, 1); border-style: solid; border-width: 1px; border-color: transparent; background-color: rgba(255, 255, 255, 1); font-family: Arial, sans serif; font-size: 11pt; font-weight: normal; font-style: normal; padding-block: 5px; padding-inline: 11px; border-radius: 5px; box-shadow: none; transition: all 200ms ease; } #imObjectForm_21_form select { padding-block: 4px; padding-inline: 11px; } #imObjectForm_21_form input[type="checkbox"], #imObjectForm_21_form input[type="radio"] { border: 0; background-color: transparent; } #imObjectForm_21_form input.imFormFocus, #imObjectForm_21_form select.imFormFocus, #imObjectForm_21_form textarea.imFormFocus, #imObjectForm_21_form span.textarea.imFormFocus { color: rgba(255, 255, 255, 1); background-color: rgba(31, 112, 174, 1); border-color: rgba(169, 169, 169, 1);} #imObjectForm_21_form input[type="checkbox"].imFormFocus, #imObjectForm_21_form input[type="radio"].imFormFocus { border: 0; background-color: transparent; } #imObjectForm_21_form input.imFormMark, #imObjectForm_21_form textarea.imFormMark, #imObjectForm_21_form span.textarea.imFormMark, #imObjectForm_21_form select.imFormMark { color: rgba(255, 255, 255, 1); background-color: rgba(255, 0, 0, 1); border-color: rgba(255, 0, 0, 1); } #imObjectForm_21_form input[type="submit"], #imObjectForm_21_form input[type="button"], #imObjectForm_21_next, #imObjectForm_21_prev, #imObjectForm_21_submit {-webkit-appearance: none;cursor: pointer;color: rgba(255, 255, 255, 1); border: solid; border-block-color: transparent transparent; border-inline-color: transparent transparent; border-width: 0px; background-color: rgba(0, 152, 70, 1);font-family: Arial, sans serif;font-size: 12pt; font-weight: normal; font-style: normal;border-radius: 15px; padding-block: 8px; padding-inline: 4px; margin-inline-start: 0px; } #imObjectForm_21_form input[type="submit"]:disabled, #imObjectForm_21_form input[type="button"]:disabled, #imObjectForm_21_next:disabled, #imObjectForm_21_prev:disabled, #imObjectForm_21_submit:disabled { opacity: .5; cursor: default; }#imObjectForm_21_prot { display: none; } #imObjectForm_21_buttonswrap { text-align: center; box-sizing: border-box; width: 100%; } .imObjectFormFieldContainer { float: left; float: inline-start; box-sizing: border-box; padding-inline-start: 0px; margin: 0px; padding-top: 0px; padding-bottom: 2px; } .imObjectFormFieldContainer.centered { display: flex; align-items: center; } .imObjectFormAgreementCheckboxWrapper { display: block; } .imObjectFormAgreementCheckbox { margin-inline-end: 5px; vertical-align: middle; } .checkbox-input, .checkbox-label, .radio-input, .radio-label { vertical-align: middle; } .radio-input { margin-top: 0px; } #imObjectForm_21_1_container { position: relative; width: 100%; padding-inline-end: 10px; clear: left; clear: inline-start; } #imObjectForm_21_1_field { position: relative; float: left; float: inline-start; display: flex; box-sizing: border-box; width: 100%; padding-top: 2px; padding-bottom: 2px; } #imObjectForm_21_1 { box-sizing: border-box; width: 100%; } #imObjectForm_21_2_container { position: relative; width: 100%; padding-inline-end: 10px; clear: left; clear: inline-start; } #imObjectForm_21_2_field { position: relative; float: left; float: inline-start; display: flex; box-sizing: border-box; width: 100%; padding-top: 2px; padding-bottom: 2px; } #imObjectForm_21_2 { box-sizing: border-box; width: 100%; } #imObjectForm_21_3_container { position: relative; width: 100%; padding-inline-end: 10px; clear: left; clear: inline-start; } #imObjectForm_21_3_field { position: relative; float: left; float: inline-start; display: flex; box-sizing: border-box; width: 100%; padding-top: 2px; padding-bottom: 2px; } #imObjectForm_21_3 { box-sizing: border-box; width: 100%; } #imObjectForm_21_4_container { position: relative; width: 100%; padding-inline-end: 10px; clear: left; clear: inline-start; } #imObjectForm_21_4_field { position: relative; float: left; float: inline-start; display: flex; box-sizing: border-box; width: 100%; padding-top: 2px; padding-bottom: 2px; direction: ltr; } #imObjectForm_21_4 { box-sizing: border-box; width: 100%; } #imObjectForm_21_5_container { position: relative; width: 100%; padding-inline-end: 10px; clear: left; clear: inline-start; } #imObjectForm_21_5_field { position: relative; float: left; float: inline-start; display: flex; box-sizing: border-box; width: 100%; padding-top: 2px; padding-bottom: 2px; } #imObjectForm_21_5 { box-sizing: border-box; width: 100%; height: 70px; } #imObjectForm_21_6_container { position: relative; width: 100%; padding-inline-end: 10px; clear: left; clear: inline-start; } #imObjectForm_21_6_field { position: relative; float: left; float: inline-start; display: flex; box-sizing: border-box; width: 100%; padding-top: 2px; padding-bottom: 2px; padding-inline-end: 20px; } #imObjectForm_21_6_wrapper { display: inline-block; width: 100%; } .imObjectForm_21_6_radiobutton { display: block; float: left; float: inline-start; margin: 0; padding: 0; width: 100%; } .imObjectForm_21_6_radiobutton.firstrow { padding-top: 5px; } .imObjectForm_21_6_radiobutton.firstcolumn { clear: left; clear: inline-start; } #imObjectForm_21_7_container { position: relative; width: 100%; padding-inline-end: 10px; clear: left; clear: inline-start; } #imObjectForm_21_7_field { position: relative; float: left; float: inline-start; display: flex; box-sizing: border-box; width: 100%; padding-top: 2px; padding-bottom: 2px; } #imObjectForm_21_7 { box-sizing: border-box; width: 100%; font: normal normal normal 8pt 'Arial'; color: rgba(255, 255, 255, 1); text-decoration: none; text-align: start; padding: 0px; } #imSideBar_imObjectImage_22 { vertical-align: top; margin-top: 0px; margin-bottom: 0px; margin-inline-start: auto; margin-inline-end: auto; } #imSideBar_imObjectImage_22 #imSideBar_imObjectImage_22_container img { width: 100%; height: auto; vertical-align: top; }#imStickyBar_imCell_100 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imStickyBar_imObjectImage_100 { position: relative; max-width: 100%; box-sizing: border-box; z-index: 3; } #imStickyBar_imCellStyleGraphics_100 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imStickyBar_imCellStyleBorders_100 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } #imStickyBar_imObjectImage_100 { vertical-align: top; margin-top: 0px; margin-bottom: 0px; margin-inline-start: auto; margin-inline-end: auto; } #imStickyBar_imObjectImage_100 #imStickyBar_imObjectImage_100_container img { width: 100%; height: auto; vertical-align: top; }#imStickyBar_imCell_69 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imStickyBar_imObjectImage_69 { position: relative; max-width: 100%; box-sizing: border-box; z-index: 3; } #imStickyBar_imCellStyleGraphics_69 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imStickyBar_imCellStyleBorders_69 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } #imStickyBar_imObjectImage_69 { vertical-align: top; margin-top: 0px; margin-bottom: 0px; margin-inline-start: auto; margin-inline-end: auto; } #imStickyBar_imObjectImage_69 #imStickyBar_imObjectImage_69_container img { width: 100%; height: auto; vertical-align: top; }#imStickyBar_imCell_70 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imStickyBar_imObjectImage_70 { position: relative; max-width: 100%; box-sizing: border-box; z-index: 3; } #imStickyBar_imCellStyleGraphics_70 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imStickyBar_imCellStyleBorders_70 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } #imStickyBar_imObjectImage_70 { vertical-align: top; margin-top: 0px; margin-bottom: 0px; margin-inline-start: auto; margin-inline-end: auto; } #imStickyBar_imObjectImage_70 #imStickyBar_imObjectImage_70_container img { width: 100%; height: auto; vertical-align: top; }#imStickyBar_imCell_88 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imStickyBar_imObjectButton_88 { position: relative; max-width: 100%; box-sizing: border-box; z-index: 3; } #imStickyBar_imCellStyleGraphics_88 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imStickyBar_imCellStyleBorders_88 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } #imStickyBar_imObjectButton_88 {margin: 0px; } #imStickyBar_imObjectButton_88_button {font: normal normal bold 18pt 'Arial'; background-color: transparent; transition: background-color 0.2s linear; position: relative; display: inline-block; word-wrap: break-word; max-width: 100%;border: solid; border-block-color: rgba(255, 255, 255, 1) rgba(255, 255, 255, 1); border-inline-color: rgba(255, 255, 255, 1) rgba(255, 255, 255, 1); border-width: 0px; border-radius: 25px; padding-block: 4px; padding-inline: 8px; color: rgba(8, 156, 68, 1); } #imStickyBar_imObjectButton_88_button:hover {background-color: transparent; cursor: pointer; } #imStickyBar_imCell_95 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imStickyBar_imObjectButton_95 { position: relative; max-width: 100%; box-sizing: border-box; z-index: 3; } #imStickyBar_imCellStyleGraphics_95 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imStickyBar_imCellStyleBorders_95 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } #imStickyBar_imObjectButton_95 {margin: 0px; } #imStickyBar_imObjectButton_95_button {font: normal normal bold 11pt 'Arial'; background-color: rgba(0, 152, 70, 1); transition: background-color 0.2s linear; position: relative; display: inline-block; word-wrap: break-word; max-width: 100%;border: solid; border-block-color: rgba(255, 255, 255, 1) rgba(255, 255, 255, 1); border-inline-color: rgba(255, 255, 255, 1) rgba(255, 255, 255, 1); border-width: 1px; border-radius: 25px; padding: 10px; color: rgba(255, 255, 255, 1); } #imStickyBar_imObjectButton_95_button:hover {background-color: rgba(31, 112, 174, 1); cursor: pointer; } #imStickyBar_imCell_98 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imStickyBar_imObjectImage_98 { position: relative; max-width: 100%; box-sizing: border-box; z-index: 3; } #imStickyBar_imCellStyleGraphics_98 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imStickyBar_imCellStyleBorders_98 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } #imStickyBar_imObjectImage_98 { vertical-align: top; margin-top: 0px; margin-bottom: 0px; margin-inline-start: auto; margin-inline-end: auto; } #imStickyBar_imObjectImage_98 #imStickyBar_imObjectImage_98_container img { width: 100%; height: auto; vertical-align: top; }#imStickyBar_imCell_104 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imStickyBar_imObjectImage_104 { position: relative; max-width: 100%; box-sizing: border-box; z-index: 3; } #imStickyBar_imCellStyleGraphics_104 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imStickyBar_imCellStyleBorders_104 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } #imStickyBar_imObjectImage_104 { vertical-align: top; margin-top: 0px; margin-bottom: 0px; margin-inline-start: auto; margin-inline-end: auto; } #imStickyBar_imObjectImage_104 #imStickyBar_imObjectImage_104_container img { width: 100%; height: auto; vertical-align: top; }#imStickyBar_imCell_105 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imStickyBar_imObjectImage_105 { position: relative; max-width: 100%; box-sizing: border-box; z-index: 3; } #imStickyBar_imCellStyleGraphics_105 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imStickyBar_imCellStyleBorders_105 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } #imStickyBar_imObjectImage_105 { vertical-align: top; margin-top: 0px; margin-bottom: 0px; margin-inline-start: auto; margin-inline-end: auto; } #imStickyBar_imObjectImage_105 #imStickyBar_imObjectImage_105_container img { width: 100%; height: auto; vertical-align: top; }#imStickyBar_imCell_106 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imStickyBar_imObjectButton_106 { position: relative; max-width: 100%; box-sizing: border-box; z-index: 3; } #imStickyBar_imCellStyleGraphics_106 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imStickyBar_imCellStyleBorders_106 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } #imStickyBar_imObjectButton_106 {margin: 0px; } #imStickyBar_imObjectButton_106_button {font: normal normal bold 10pt 'Arial'; background-color: rgba(31, 112, 174, 1); transition: background-color 0.2s linear; position: relative; display: inline-block; word-wrap: break-word; max-width: 100%;border: solid; border-block-color: rgba(255, 255, 255, 1) rgba(255, 255, 255, 1); border-inline-color: rgba(255, 255, 255, 1) rgba(255, 255, 255, 1); border-width: 1px; border-radius: 25px; padding: 10px; color: rgba(255, 255, 255, 1); } #imStickyBar_imObjectButton_106_button:hover {background-color: rgba(0, 152, 70, 1); cursor: pointer; } #imStickyBar_imCell_107 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imStickyBar_imObjectButton_107 { position: relative; max-width: 100%; box-sizing: border-box; z-index: 3; } #imStickyBar_imCellStyleGraphics_107 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imStickyBar_imCellStyleBorders_107 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } #imStickyBar_imObjectButton_107 {margin: 0px; } #imStickyBar_imObjectButton_107_button {font: normal normal bold 10pt 'Arial'; background-color: rgba(0, 152, 70, 1); transition: background-color 0.2s linear; position: relative; display: inline-block; word-wrap: break-word; max-width: 100%;border: solid; border-block-color: rgba(255, 255, 255, 1) rgba(255, 255, 255, 1); border-inline-color: rgba(255, 255, 255, 1) rgba(255, 255, 255, 1); border-width: 1px; border-radius: 25px; padding: 10px; color: rgba(255, 255, 255, 1); } #imStickyBar_imObjectButton_107_button:hover {background-color: rgba(31, 112, 174, 1); cursor: pointer; } #imStickyBar_imCell_108 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imStickyBar_imObjectButton_108 { position: relative; max-width: 100%; box-sizing: border-box; z-index: 3; } #imStickyBar_imCellStyleGraphics_108 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imStickyBar_imCellStyleBorders_108 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } #imStickyBar_imObjectButton_108 {margin: 0px; } #imStickyBar_imObjectButton_108_button {font: normal normal bold 10pt 'Arial'; background-color: rgba(31, 112, 174, 1); transition: background-color 0.2s linear; position: relative; display: inline-block; word-wrap: break-word; max-width: 100%;border: solid; border-block-color: rgba(255, 255, 255, 1) rgba(255, 255, 255, 1); border-inline-color: rgba(255, 255, 255, 1) rgba(255, 255, 255, 1); border-width: 1px; border-radius: 25px; padding: 10px; color: rgba(255, 255, 255, 1); } #imStickyBar_imObjectButton_108_button:hover {background-color: rgba(0, 152, 70, 1); cursor: pointer; } #imStickyBar_imCell_112 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imStickyBar_imObjectButton_112 { position: relative; max-width: 100%; box-sizing: border-box; z-index: 3; } #imStickyBar_imCellStyleGraphics_112 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imStickyBar_imCellStyleBorders_112 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } #imStickyBar_imObjectButton_112 {margin: 0px; } #imStickyBar_imObjectButton_112_button {font: normal normal bold 18pt 'Arial'; background-color: transparent; transition: background-color 0.2s linear; position: relative; display: inline-block; word-wrap: break-word; max-width: 100%;border: solid; border-block-color: rgba(255, 255, 255, 1) rgba(255, 255, 255, 1); border-inline-color: rgba(255, 255, 255, 1) rgba(255, 255, 255, 1); border-width: 0px; border-radius: 25px; padding-block: 4px; padding-inline: 8px; color: rgba(8, 156, 68, 1); } #imStickyBar_imObjectButton_112_button:hover {background-color: transparent; cursor: pointer; } #imStickyBar_imCell_114 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imStickyBar_pluginAppObj_114 { position: relative; max-width: 100%; box-sizing: border-box; z-index: 3; } #imStickyBar_imCellStyleGraphics_114 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imStickyBar_imCellStyleBorders_114 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } #imStickyBar_imCell_115 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imStickyBar_imObjectImage_115 { position: relative; max-width: 100%; box-sizing: border-box; z-index: 3; } #imStickyBar_imCellStyleGraphics_115 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imStickyBar_imCellStyleBorders_115 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } #imStickyBar_imObjectImage_115 { vertical-align: top; margin-top: 0px; margin-bottom: 0px; margin-inline-start: auto; margin-inline-end: auto; } #imStickyBar_imObjectImage_115 #imStickyBar_imObjectImage_115_container img { width: 100%; height: auto; vertical-align: top; }#imStickyBar_imCell_117 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imStickyBar_imMenuObject_117 { position: relative; max-width: 100%; box-sizing: border-box; z-index: 103; } #imStickyBar_imCellStyleGraphics_117 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imStickyBar_imCellStyleBorders_117 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 102; } .label-wrapper .menu-item-icon { max-height: 100%; position: absolute; top: 0; bottom: 0; inset-inline-start: 3px; margin: auto; z-index: 0; } .im-menu-opened #imStickyBarContainer, .im-menu-opened #imPageToTop { visibility: hidden !important; } #imStickyBar_imCell_118 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imStickyBar_imObjectButton_118 { position: relative; max-width: 100%; box-sizing: border-box; z-index: 3; } #imStickyBar_imCellStyleGraphics_118 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imStickyBar_imCellStyleBorders_118 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } #imStickyBar_imObjectButton_118 {margin: 0px; } #imStickyBar_imObjectButton_118_button {font: normal normal bold 14pt 'Arial'; background-color: rgba(8, 156, 68, 1); transition: background-color 0.2s linear; position: relative; display: inline-block; word-wrap: break-word; max-width: 100%;border: solid; border-block-color: transparent transparent; border-inline-color: transparent transparent; border-width: 1px; border-radius: 5px; padding: 8px; color: rgba(255, 255, 255, 1); } #imStickyBar_imObjectButton_118_button:hover {background-color: rgba(38, 126, 98, 1); cursor: pointer; } #imStickyBar_imCell_119 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imStickyBar_imObjectButton_119 { position: relative; max-width: 100%; box-sizing: border-box; z-index: 3; } #imStickyBar_imCellStyleGraphics_119 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imStickyBar_imCellStyleBorders_119 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } #imStickyBar_imObjectButton_119 {margin: 0px; } #imStickyBar_imObjectButton_119_button {font: normal normal bold 12pt 'Arial'; background-color: rgba(8, 156, 68, 1); transition: background-color 0.2s linear; position: relative; display: inline-block; word-wrap: break-word; max-width: 100%;border: solid; border-block-color: transparent transparent; border-inline-color: transparent transparent; border-width: 1px; border-radius: 5px; padding: 8px; color: rgba(255, 255, 255, 1); } #imStickyBar_imObjectButton_119_button:hover {background-color: rgba(38, 126, 98, 1); cursor: pointer; } .imPageRow { position: relative; } #imCell_1 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHTMLObject_1726_01 { position: relative; align-self: start; justify-self: center; max-width: 100%; box-sizing: border-box; z-index: 3; } #imCellStyleGraphics_1 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imCellStyleBorders_1 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } /* ============================================================ MENU LOCALE — ISOLAMENTO ACUSTICO PARETI ROMA Pagina attiva: /isolamento-acustico-pareti-roma.html ============================================================ */ #menu-pagine-isolamento-roma { --spar-ln-dark: #073b46; --spar-ln-deep: #042d36; --spar-ln-blue: #087fa7; --spar-ln-teal: #08a9a8; --spar-ln-cyan: #16bfd0; --spar-ln-orange: #f58220; --spar-ln-orange-dark: #d96813; --spar-ln-green: #15ad56; --spar-ln-white: #ffffff; --spar-ln-light: #eef8fa; --spar-ln-soft: #f7fcfd; --spar-ln-text: #123f49; --spar-ln-muted: #5d757d; --spar-ln-line: rgba(7, 59, 70, 0.14); --spar-ln-shadow: 0 8px 22px rgba(4, 45, 54, 0.07); position: relative; z-index: 200; width: 100%; max-width: 100%; overflow: visible; border-bottom: 1px solid var(--spar-ln-line); background: var(--spar-ln-white); color: var(--spar-ln-text); box-shadow: var(--spar-ln-shadow); } #menu-pagine-isolamento-roma, #menu-pagine-isolamento-roma *, #menu-pagine-isolamento-roma *::before, #menu-pagine-isolamento-roma *::after { box-sizing: border-box; } #menu-pagine-isolamento-roma [hidden] { display: none !important; } #menu-pagine-isolamento-roma a, #menu-pagine-isolamento-roma button, #menu-pagine-isolamento-roma span, #menu-pagine-isolamento-roma strong, #menu-pagine-isolamento-roma small, #menu-pagine-isolamento-roma p { max-width: 100%; overflow-wrap: break-word; word-break: normal; } /* ============================================================ BARRA PRINCIPALE ============================================================ */ .spar-localnav__bar { position: relative; z-index: 3; width: 100%; background: linear-gradient( 90deg, #ffffff 0%, #f5fbfc 100% ); } .spar-localnav__bar-inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; width: min(calc(100% - 40px), 1220px); min-height: 68px; margin-inline: auto; } /* ============================================================ MARCHIO ============================================================ */ .spar-localnav__brand { display: inline-flex; flex: 0 0 auto; align-items: center; gap: 12px; min-width: 0; color: var(--spar-ln-text); text-decoration: none; } .spar-localnav__brand-logo-wrap { display: grid; flex: 0 0 auto; place-items: center; width: 58px; height: 48px; padding: 3px; } .spar-localnav__brand-logo { display: block; width: 54px; height: auto; object-fit: contain; } .spar-localnav__brand-copy { display: grid; min-width: 0; gap: 2px; } .spar-localnav__brand-copy small { color: var(--spar-ln-teal); font-size: 8px; font-weight: 900; line-height: 1.2; letter-spacing: 0.09em; text-transform: uppercase; } .spar-localnav__brand-copy strong { color: var(--spar-ln-dark); font-size: 14px; font-weight: 900; line-height: 1.3; } /* ============================================================ CONTROLLI DESKTOP ============================================================ */ .spar-localnav__desktop-controls { display: flex; align-items: center; justify-content: flex-end; gap: 7px; min-width: 0; } .spar-localnav__overview, .spar-localnav__current-link, .spar-localnav__toggle { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 42px; padding: 10px 14px; border: 1px solid transparent; border-radius: 10px; background: transparent; color: var(--spar-ln-dark); font: inherit; font-size: 12px; font-weight: 850; line-height: 1.3; text-align: center; text-decoration: none; cursor: pointer; transition: color 180ms ease, border-color 180ms ease, background-color 180ms ease, transform 180ms ease; } .spar-localnav__overview:hover, .spar-localnav__toggle:hover, .spar-localnav__toggle[aria-expanded="true"] { border-color: rgba(0, 143, 163, 0.2); background: var(--spar-ln-light); color: var(--spar-ln-teal); } .spar-localnav__current-link { border-color: rgba(245, 130, 32, 0.36); background: #fff2e7; color: #7c3508; } .spar-localnav__current-link:hover { border-color: var(--spar-ln-orange); background: #ffe9d8; color: #692b04; } .spar-localnav__current-dot { display: block; flex: 0 0 auto; width: 8px; height: 8px; border-radius: 50%; background: var(--spar-ln-orange); box-shadow: 0 0 0 4px rgba(245, 130, 32, 0.14); } .spar-localnav__arrow { width: 8px; height: 8px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: translateY(-2px) rotate(45deg); transition: transform 180ms ease; } .spar-localnav__toggle[aria-expanded="true"] .spar-localnav__arrow { transform: translateY(2px) rotate(225deg); } /* ============================================================ PANNELLI DESKTOP ============================================================ */ .spar-localnav__desktop-panel { position: relative; z-index: 2; width: 100%; overflow: visible; border-top: 1px solid var(--spar-ln-line); background: linear-gradient( 180deg, #ffffff 0%, #f4fbfc 100% ); box-shadow: inset 0 8px 18px rgba(4, 45, 54, 0.025); } .spar-localnav__panel-inner { width: min(calc(100% - 40px), 1220px); margin-inline: auto; padding: 17px 0 19px; } .spar-localnav__panel-heading { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; } .spar-localnav__panel-badge { display: grid; flex: 0 0 auto; place-items: center; width: 32px; height: 32px; border-radius: 9px; color: var(--spar-ln-white); font-size: 9px; font-weight: 900; line-height: 1; } .spar-localnav__panel-badge--orange { background: var(--spar-ln-orange); } .spar-localnav__panel-badge--teal { background: var(--spar-ln-teal); } .spar-localnav__panel-heading > div { display: grid; min-width: 0; gap: 2px; } .spar-localnav__panel-heading p { margin: 0; color: var(--spar-ln-teal); font-size: 8px; font-weight: 900; line-height: 1.2; letter-spacing: 0.08em; text-transform: uppercase; } .spar-localnav__panel-heading strong { color: var(--spar-ln-dark); font-size: 13px; font-weight: 900; line-height: 1.35; } /* ============================================================ GRIGLIE DEI COLLEGAMENTI ============================================================ */ .spar-localnav__grid { display: grid; gap: 9px; margin: 0; padding: 0; list-style: none; } .spar-localnav__grid--services { grid-template-columns: repeat(5, minmax(0, 1fr)); } .spar-localnav__grid--guides { grid-template-columns: repeat(4, minmax(0, 1fr)); } .spar-localnav__grid li { min-width: 0; } .spar-localnav__grid a { position: relative; display: grid; grid-template-columns: 38px minmax(0, 1fr); align-items: center; gap: 10px; width: 100%; min-width: 0; min-height: 76px; padding: 10px 11px; border: 1px solid var(--spar-ln-line); border-radius: 12px; background: var(--spar-ln-white); color: var(--spar-ln-text); text-decoration: none; box-shadow: 0 7px 18px rgba(4, 45, 54, 0.045); transition: border-color 180ms ease, background-color 180ms ease, box-shadow 180ms ease, transform 180ms ease; } .spar-localnav__grid a:hover { border-color: rgba(0, 143, 163, 0.38); background: var(--spar-ln-light); box-shadow: 0 10px 24px rgba(4, 45, 54, 0.08); transform: translateY(-2px); } /* ============================================================ ELEMENTO ATTIVO ============================================================ */ .spar-localnav__grid a.is-current { border-color: rgba(245, 130, 32, 0.62); background: linear-gradient( 135deg, #fff6ef, #fffaf6 ); box-shadow: 0 10px 26px rgba(245, 130, 32, 0.13); } .spar-localnav__grid a.is-current::after { position: absolute; top: -1px; right: 14px; width: 44px; height: 4px; border-radius: 0 0 5px 5px; background: var(--spar-ln-orange); content: ""; } .spar-localnav__grid a.is-current:hover { border-color: var(--spar-ln-orange); background: linear-gradient( 135deg, #fff0e3, #fff9f4 ); } /* ============================================================ CODICI E TESTI ============================================================ */ .spar-localnav__code { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 10px; color: var(--spar-ln-white); font-size: 9px; font-weight: 900; line-height: 1; } .spar-localnav__code--blue { background: var(--spar-ln-blue); } .spar-localnav__code--deep { background: var(--spar-ln-deep); } .spar-localnav__code--orange { background: var(--spar-ln-orange); } .spar-localnav__code--green { background: var(--spar-ln-green); } .spar-localnav__code--teal { background: var(--spar-ln-teal); } .spar-localnav__item-copy { display: grid; min-width: 0; gap: 3px; text-align: left; } .spar-localnav__item-status { color: var(--spar-ln-orange-dark); font-size: 7px; font-weight: 950; line-height: 1.2; letter-spacing: 0.07em; text-transform: uppercase; } .spar-localnav__item-copy strong { color: var(--spar-ln-dark); font-size: 11px; font-weight: 900; line-height: 1.34; overflow-wrap: anywhere; } .spar-localnav__item-copy small { color: var(--spar-ln-muted); font-size: 9px; font-weight: 650; line-height: 1.42; overflow-wrap: anywhere; } /* ============================================================ PULSANTE MOBILE ============================================================ */ .spar-localnav__mobile-toggle { display: none; align-items: center; gap: 10px; min-height: 42px; padding: 9px 12px; border: 1px solid var(--spar-ln-line); border-radius: 10px; background: var(--spar-ln-light); color: var(--spar-ln-dark); font: inherit; font-size: 11px; font-weight: 900; line-height: 1.3; cursor: pointer; } .spar-localnav__mobile-toggle:hover, .spar-localnav__mobile-toggle[aria-expanded="true"] { border-color: rgba(0, 143, 163, 0.32); background: #e2f4f6; } .spar-localnav__hamburger { display: grid; gap: 3px; width: 18px; } .spar-localnav__hamburger i { display: block; width: 18px; height: 2px; border-radius: 999px; background: currentColor; transition: opacity 180ms ease, transform 180ms ease; } .spar-localnav__mobile-toggle[aria-expanded="true"] .spar-localnav__hamburger i:first-child { transform: translateY(5px) rotate(45deg); } .spar-localnav__mobile-toggle[aria-expanded="true"] .spar-localnav__hamburger i:nth-child(2) { opacity: 0; } .spar-localnav__mobile-toggle[aria-expanded="true"] .spar-localnav__hamburger i:last-child { transform: translateY(-5px) rotate(-45deg); } /* ============================================================ PANNELLO MOBILE ============================================================ */ .spar-localnav__mobile-panel { position: relative; z-index: 2; width: 100%; border-top: 1px solid var(--spar-ln-line); background: linear-gradient( 180deg, #ffffff 0%, #f5fbfc 100% ); } .spar-localnav__mobile-inner { display: grid; gap: 10px; width: min(calc(100% - 32px), 920px); margin-inline: auto; padding: 14px 0 17px; } /* ============================================================ PAGINA PRINCIPALE MOBILE ============================================================ */ .spar-localnav__mobile-home { display: flex; align-items: center; gap: 12px; min-height: 60px; padding: 8px 12px; border: 1px solid var(--spar-ln-line); border-radius: 11px; background: var(--spar-ln-white); color: var(--spar-ln-dark); text-decoration: none; } .spar-localnav__mobile-home:hover { border-color: rgba(0, 143, 163, 0.34); background: var(--spar-ln-light); } .spar-localnav__mobile-logo-wrap { display: grid; flex: 0 0 auto; place-items: center; width: 58px; height: 44px; padding: 2px; border-radius: 8px; background: var(--spar-ln-white); } .spar-localnav__mobile-logo { display: block; width: 53px; height: auto; object-fit: contain; } .spar-localnav__mobile-home-copy { display: grid; min-width: 0; gap: 2px; } .spar-localnav__mobile-home-copy small { color: var(--spar-ln-teal); font-size: 8px; font-weight: 900; line-height: 1.2; letter-spacing: 0.07em; text-transform: uppercase; } .spar-localnav__mobile-home-copy strong { color: var(--spar-ln-dark); font-size: 12px; font-weight: 900; line-height: 1.35; } /* ============================================================ PAGINA ATTUALE MOBILE ============================================================ */ .spar-localnav__mobile-current { display: grid; grid-template-columns: 42px minmax(0, 1fr) 30px; align-items: center; gap: 11px; min-width: 0; min-height: 65px; padding: 10px 12px; border: 1px solid rgba(245, 130, 32, 0.48); border-radius: 11px; background: linear-gradient( 135deg, #fff1e5, #fffaf6 ); color: var(--spar-ln-dark); text-decoration: none; } .spar-localnav__mobile-current-code { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 11px; background: var(--spar-ln-blue); color: var(--spar-ln-white); font-size: 9px; font-weight: 950; line-height: 1; } .spar-localnav__mobile-current-copy { display: grid; min-width: 0; gap: 3px; } .spar-localnav__mobile-current-copy small { color: var(--spar-ln-orange-dark); font-size: 8px; font-weight: 950; line-height: 1.2; letter-spacing: 0.07em; text-transform: uppercase; } .spar-localnav__mobile-current-copy strong { color: var(--spar-ln-dark); font-size: 12px; font-weight: 900; line-height: 1.35; } .spar-localnav__mobile-current-check { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 9px; background: var(--spar-ln-orange); color: var(--spar-ln-white); font-size: 11px; font-weight: 950; line-height: 1; } /* ============================================================ GRUPPI MOBILE ============================================================ */ .spar-localnav__mobile-group { overflow: hidden; border: 1px solid var(--spar-ln-line); border-radius: 11px; background: var(--spar-ln-white); } .spar-localnav__mobile-group summary { display: flex; align-items: center; justify-content: space-between; gap: 14px; min-height: 50px; padding: 11px 13px; color: var(--spar-ln-dark); font-size: 12px; font-weight: 850; line-height: 1.35; cursor: pointer; list-style: none; } .spar-localnav__mobile-group summary::-webkit-details-marker { display: none; } .spar-localnav__mobile-group summary::marker { content: ""; } .spar-localnav__mobile-group summary:hover { background: var(--spar-ln-light); } .spar-localnav__plus { position: relative; display: block; flex: 0 0 auto; width: 27px; height: 27px; border-radius: 8px; background: var(--spar-ln-light); } .spar-localnav__plus::before, .spar-localnav__plus::after { position: absolute; top: 50%; left: 50%; width: 11px; height: 2px; border-radius: 999px; background: var(--spar-ln-teal); content: ""; transform: translate(-50%, -50%); } .spar-localnav__plus::after { transform: translate(-50%, -50%) rotate(90deg); } .spar-localnav__mobile-group[open] .spar-localnav__plus { background: var(--spar-ln-teal); } .spar-localnav__mobile-group[open] .spar-localnav__plus::before, .spar-localnav__mobile-group[open] .spar-localnav__plus::after { background: var(--spar-ln-white); } .spar-localnav__mobile-group[open] .spar-localnav__plus::after { transform: translate(-50%, -50%) rotate(0deg); } /* ============================================================ LINK MOBILE ============================================================ */ .spar-localnav__mobile-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; padding: 9px; border-top: 1px solid var(--spar-ln-line); background: var(--spar-ln-soft); } .spar-localnav__mobile-links a { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 3px; min-width: 0; min-height: 48px; padding: 9px 11px; border: 1px solid var(--spar-ln-line); border-radius: 9px; background: var(--spar-ln-white); color: var(--spar-ln-dark); font-size: 11px; font-weight: 800; line-height: 1.4; text-decoration: none; } .spar-localnav__mobile-links a:hover { border-color: rgba(0, 143, 163, 0.36); color: var(--spar-ln-teal); } .spar-localnav__mobile-links a.is-current { border-color: rgba(245, 130, 32, 0.52); background: #fff2e8; color: #713107; } .spar-localnav__mobile-links a.is-current small { color: var(--spar-ln-orange-dark); font-size: 8px; font-weight: 950; line-height: 1.2; letter-spacing: 0.06em; text-transform: uppercase; } /* ============================================================ FOCUS ACCESSIBILE ============================================================ */ .spar-localnav__brand:focus-visible, .spar-localnav__overview:focus-visible, .spar-localnav__current-link:focus-visible, .spar-localnav__toggle:focus-visible, .spar-localnav__grid a:focus-visible, .spar-localnav__mobile-toggle:focus-visible, .spar-localnav__mobile-home:focus-visible, .spar-localnav__mobile-current:focus-visible, .spar-localnav__mobile-group summary:focus-visible, .spar-localnav__mobile-links a:focus-visible { outline: 3px solid rgba(22, 191, 208, 0.54); outline-offset: 3px; } /* ============================================================ DESKTOP COMPATTI ============================================================ */ @media (min-width: 1021px) and (max-width: 1280px) { .spar-localnav__bar-inner, .spar-localnav__panel-inner { width: min(calc(100% - 32px), 1180px); } .spar-localnav__desktop-controls { gap: 5px; } .spar-localnav__overview, .spar-localnav__current-link, .spar-localnav__toggle { padding-inline: 11px; font-size: 11px; } .spar-localnav__grid--services { grid-template-columns: repeat(3, minmax(0, 1fr)); } .spar-localnav__grid--guides { grid-template-columns: repeat(2, minmax(0, 1fr)); } } /* ============================================================ TABLET E MOBILE ============================================================ */ @media (max-width: 1020px) { .spar-localnav__bar-inner { width: min(calc(100% - 32px), 920px); min-height: 64px; } .spar-localnav__desktop-controls, .spar-localnav__desktop-panel { display: none !important; } .spar-localnav__mobile-toggle { display: inline-flex; } .spar-localnav__brand-logo-wrap { width: 54px; height: 44px; } .spar-localnav__brand-logo { width: 50px; } .spar-localnav__brand-copy strong { font-size: 13px; } } /* ============================================================ SMARTPHONE ============================================================ */ @media (max-width: 640px) { .spar-localnav__bar-inner { width: min(calc(100% - 24px), 920px); min-height: 61px; gap: 12px; } .spar-localnav__brand { gap: 8px; } .spar-localnav__brand-logo-wrap { width: 48px; height: 40px; } .spar-localnav__brand-logo { width: 45px; } .spar-localnav__brand-copy small { display: none; } .spar-localnav__brand-copy strong { font-size: 11px; } .spar-localnav__mobile-toggle { min-height: 40px; padding: 8px 10px; font-size: 10px; } .spar-localnav__mobile-inner { width: min(calc(100% - 24px), 920px); padding-block: 12px 14px; } .spar-localnav__mobile-links { grid-template-columns: minmax(0, 1fr); } } /* ============================================================ SMARTPHONE STRETTI ============================================================ */ @media (max-width: 420px) { .spar-localnav__brand-logo-wrap { width: 45px; height: 38px; } .spar-localnav__brand-logo { width: 42px; } .spar-localnav__brand-copy strong { max-width: 145px; font-size: 10px; } .spar-localnav__mobile-home, .spar-localnav__mobile-current { padding-inline: 10px; } .spar-localnav__mobile-current { grid-template-columns: 38px minmax(0, 1fr) 27px; gap: 9px; } .spar-localnav__mobile-current-code { width: 37px; height: 37px; } .spar-localnav__mobile-current-check { width: 26px; height: 26px; } } /* ============================================================ SMARTPHONE MOLTO STRETTI ============================================================ */ @media (max-width: 360px) { .spar-localnav__mobile-toggle > span:first-child { display: none; } .spar-localnav__mobile-toggle { padding-inline: 10px; } .spar-localnav__brand-copy strong { max-width: 150px; } .spar-localnav__mobile-current-copy strong { font-size: 11px; } } /* ============================================================ ACCESSIBILITÀ ============================================================ */ @media (prefers-reduced-motion: reduce) { .spar-localnav__overview, .spar-localnav__current-link, .spar-localnav__toggle, .spar-localnav__arrow, .spar-localnav__grid a, .spar-localnav__hamburger i { transition: none; } .spar-localnav__grid a:hover { transform: none; } } /* ============================================================ STAMPA ============================================================ */ @media print { #menu-pagine-isolamento-roma { border-bottom: 1px solid #d6e3e5; box-shadow: none; } .spar-localnav__desktop-controls, .spar-localnav__desktop-panel, .spar-localnav__mobile-toggle, .spar-localnav__mobile-panel { display: none !important; } .spar-localnav__bar-inner { min-height: 54px; } }#imCell_2 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHTMLObject_1726_02 { position: relative; align-self: start; justify-self: center; max-width: 100%; box-sizing: border-box; z-index: 3; } #imCellStyleGraphics_2 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imCellStyleBorders_2 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } /* ============================================================ HERO — ISOLAMENTO ACUSTICO PARETI ROMA Pagina: /isolamento-acustico-pareti-roma.html ============================================================ */ .spar-hero, .spar-hero *, .spar-hero *::before, .spar-hero *::after { box-sizing: border-box; } .spar-hero { --spar-blue-dark: #07343b; --spar-blue-deep: #05282e; --spar-blue-medium: #0b4b53; --spar-turquoise: #27c4c5; --spar-turquoise-light: #81e1de; --spar-orange: #ff8a2a; --spar-orange-hover: #ff9b43; --spar-green: #27ad68; --spar-green-hover: #1d9257; --spar-white: #ffffff; --spar-cream: #fff8ec; --spar-light-blue: #e7f7f7; --spar-text-light: #d9edee; --spar-border: rgba(255, 255, 255, 0.16); --spar-shadow: 0 26px 70px rgba(0, 21, 25, 0.32); position: relative; isolation: isolate; width: 100%; max-width: 100%; overflow: hidden; background: linear-gradient( 125deg, var(--spar-blue-deep) 0%, var(--spar-blue-dark) 52%, #07535a 100% ); color: var(--spar-white); } /* Impedisce che stili esterni del sito forzino testi su una riga */ .spar-hero h1, .spar-hero h2, .spar-hero p, .spar-hero li, .spar-hero span, .spar-hero strong, .spar-hero small, .spar-hero a { max-width: 100%; white-space: normal; overflow-wrap: break-word; word-break: normal; } /* ============================================================ SFONDO DECORATIVO ============================================================ */ .spar-hero__background { position: absolute; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; } .spar-hero__background::before { content: ""; position: absolute; top: -190px; right: -130px; width: 620px; max-width: 70vw; aspect-ratio: 1; border-radius: 50%; background: radial-gradient( circle, rgba(39, 196, 197, 0.26) 0%, rgba(39, 196, 197, 0.08) 48%, transparent 72% ); } .spar-hero__background::after { content: ""; position: absolute; bottom: -230px; left: -160px; width: 590px; max-width: 70vw; aspect-ratio: 1; border-radius: 50%; background: radial-gradient( circle, rgba(255, 138, 42, 0.15) 0%, rgba(255, 138, 42, 0.04) 50%, transparent 73% ); } .spar-hero__shape { position: absolute; display: block; border: 1px solid rgba(255, 255, 255, 0.08); transform: rotate(18deg); } .spar-hero__shape--one { top: 10%; right: 4%; width: 270px; height: 430px; border-radius: 34px; background: linear-gradient( 150deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.01) ); } .spar-hero__shape--two { right: 19%; bottom: -280px; width: 290px; height: 540px; border-radius: 40px; background: linear-gradient( 150deg, rgba(39, 196, 197, 0.08), rgba(255, 255, 255, 0.01) ); } /* ============================================================ CONTENITORE PRINCIPALE ============================================================ */ .spar-hero__container { position: relative; display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(320px, 0.88fr); align-items: center; gap: clamp(38px, 5.5vw, 78px); width: min(calc(100% - 40px), 1220px); max-width: 1220px; margin-inline: auto; padding-block: clamp(68px, 8vw, 112px); } .spar-hero__content, .spar-hero__card { min-width: 0; width: 100%; } /* ============================================================ TESTI PRINCIPALI ============================================================ */ .spar-hero__eyebrow { display: inline-flex; align-items: center; gap: 10px; width: fit-content; margin: 0 0 20px; padding: 8px 14px; border: 1px solid rgba(129, 225, 222, 0.25); border-radius: 999px; background: rgba(255, 255, 255, 0.06); color: var(--spar-turquoise-light); font-size: 0.82rem; font-weight: 800; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-hero__eyebrow-dot { flex: 0 0 9px; width: 9px; height: 9px; border-radius: 50%; background: var(--spar-orange); box-shadow: 0 0 0 5px rgba(255, 138, 42, 0.14); } .spar-hero__title { width: 100%; margin: 0; color: var(--spar-white); font-family: inherit; font-size: clamp(2.35rem, 5vw, 4.55rem); font-weight: 900; line-height: 1; letter-spacing: -0.044em; text-wrap: balance; } .spar-hero__title-accent { display: block; margin-top: 12px; color: var(--spar-turquoise-light); font-size: 0.61em; line-height: 1.13; letter-spacing: -0.025em; } .spar-hero__answer { width: 100%; max-width: 760px; margin: 28px 0 0; color: var(--spar-white); font-size: clamp(1.06rem, 1.4vw, 1.25rem); font-weight: 500; line-height: 1.68; } .spar-hero__answer strong { color: var(--spar-turquoise-light); font-weight: 800; } .spar-hero__description { width: 100%; max-width: 760px; margin: 14px 0 0; color: var(--spar-text-light); font-size: clamp(0.98rem, 1.1vw, 1.07rem); line-height: 1.74; } /* ============================================================ BENEFICI ============================================================ */ .spar-hero__benefits { display: flex; flex-wrap: wrap; gap: 12px 20px; width: 100%; margin: 27px 0 0; padding: 0; list-style: none; } .spar-hero__benefit { display: inline-flex; min-width: 0; align-items: center; gap: 9px; color: var(--spar-white); font-size: 0.94rem; font-weight: 750; line-height: 1.4; } .spar-hero__benefit > span:last-child { min-width: 0; } .spar-hero__check { flex: 0 0 24px; display: inline-grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: rgba(39, 196, 197, 0.14); color: var(--spar-turquoise-light); } .spar-hero__check svg { display: block; width: 15px; height: 15px; } /* ============================================================ CTA ============================================================ */ .spar-hero__actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; width: 100%; margin-top: 31px; } .spar-hero__button { position: relative; display: flex; min-width: 0; min-height: 58px; align-items: center; justify-content: center; gap: 10px; padding: 13px 17px; border: 2px solid transparent; border-radius: 13px; font-family: inherit; font-size: 0.92rem; font-weight: 850; line-height: 1.28; text-align: center; text-decoration: none; cursor: pointer; transition: transform 180ms ease, box-shadow 180ms ease, background-color 180ms ease, border-color 180ms ease; } .spar-hero__button--phone { grid-column: 1 / -1; } .spar-hero__button:hover { transform: translateY(-2px); } .spar-hero__button:focus-visible { outline: 3px solid var(--spar-white); outline-offset: 4px; } .spar-hero__button-icon { flex: 0 0 23px; display: inline-grid; place-items: center; width: 23px; height: 23px; } .spar-hero__button-icon svg { display: block; width: 23px; height: 23px; } .spar-hero__button-text { min-width: 0; text-align: center; } .spar-hero__button--primary { background: var(--spar-orange); color: #281304; box-shadow: 0 13px 30px rgba(255, 138, 42, 0.24); } .spar-hero__button--primary:hover { background: var(--spar-orange-hover); box-shadow: 0 17px 34px rgba(255, 138, 42, 0.32); } .spar-hero__button--whatsapp { background: var(--spar-green); color: var(--spar-white); box-shadow: 0 13px 30px rgba(39, 173, 104, 0.22); } .spar-hero__button--whatsapp:hover { background: var(--spar-green-hover); box-shadow: 0 17px 34px rgba(39, 173, 104, 0.3); } .spar-hero__button--phone { border-color: rgba(255, 255, 255, 0.34); background: rgba(255, 255, 255, 0.08); color: var(--spar-white); } .spar-hero__button--phone:hover { border-color: rgba(129, 225, 222, 0.66); background: rgba(255, 255, 255, 0.14); } .spar-hero__phone-content { display: grid; min-width: 0; gap: 2px; text-align: left; } .spar-hero__phone-content small { font-size: 0.66rem; font-weight: 750; line-height: 1.1; letter-spacing: 0.055em; text-transform: uppercase; opacity: 0.82; } .spar-hero__phone-content strong { color: inherit; font-size: 1rem; font-weight: 900; line-height: 1.12; } .spar-hero__microcopy { width: 100%; max-width: 720px; margin: 17px 0 0; color: rgba(255, 255, 255, 0.75); font-size: 0.86rem; line-height: 1.58; } /* ============================================================ SCHEDA LATERALE ============================================================ */ .spar-hero__card { position: relative; max-width: 100%; overflow: hidden; padding: clamp(25px, 3vw, 36px); border: 1px solid var(--spar-border); border-radius: 25px; background: linear-gradient( 145deg, rgba(255, 255, 255, 0.13), rgba(255, 255, 255, 0.055) ); box-shadow: var(--spar-shadow); } .spar-hero__card::before { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; background: radial-gradient( circle at 90% 8%, rgba(39, 196, 197, 0.17), transparent 36% ); } .spar-hero__card-top { display: flex; min-width: 0; align-items: center; justify-content: space-between; gap: 14px; } .spar-hero__card-label { display: inline-flex; width: fit-content; min-width: 0; padding: 7px 11px; border-radius: 999px; background: var(--spar-orange); color: #2d1605; font-size: 0.7rem; font-weight: 900; line-height: 1.3; letter-spacing: 0.05em; text-transform: uppercase; } .spar-hero__sound-icon { flex: 0 0 54px; display: inline-grid; place-items: center; width: 54px; height: 54px; border: 1px solid rgba(129, 225, 222, 0.25); border-radius: 17px; background: rgba(39, 196, 197, 0.1); color: var(--spar-turquoise-light); } .spar-hero__sound-icon svg { display: block; width: 32px; height: 32px; } .spar-hero__card-question { display: block; width: 100%; margin: 24px 0 0; color: var(--spar-white); font-family: inherit; font-size: clamp(1.42rem, 2vw, 1.95rem); font-weight: 900; line-height: 1.2; letter-spacing: -0.025em; text-align: left; text-wrap: pretty; } .spar-hero__card-answer { width: 100%; margin: 15px 0 0; color: var(--spar-text-light); font-size: 0.98rem; line-height: 1.7; } .spar-hero__card-highlight { width: 100%; margin: 19px 0 0; padding: 15px 17px; border-left: 4px solid var(--spar-orange); border-radius: 0 12px 12px 0; background: rgba(255, 248, 236, 0.09); color: var(--spar-white); font-size: 0.92rem; font-weight: 750; line-height: 1.58; } /* ============================================================ PERCORSO ============================================================ */ .spar-hero__steps { display: grid; gap: 14px; width: 100%; margin: 25px 0 0; padding: 0; list-style: none; } .spar-hero__step { display: grid; grid-template-columns: 36px minmax(0, 1fr); align-items: center; gap: 13px; min-width: 0; } .spar-hero__step-number { display: inline-grid; place-items: center; width: 36px; height: 36px; border: 1px solid rgba(129, 225, 222, 0.28); border-radius: 50%; background: rgba(39, 196, 197, 0.1); color: var(--spar-turquoise-light); font-size: 0.82rem; font-weight: 900; } .spar-hero__step-text { display: grid; min-width: 0; gap: 3px; } .spar-hero__step-text strong { color: var(--spar-white); font-size: 0.91rem; line-height: 1.3; } .spar-hero__step-text small { color: rgba(217, 237, 238, 0.74); font-size: 0.79rem; line-height: 1.4; } /* ============================================================ NOTEBOOK E TABLET ORIZZONTALE ============================================================ */ @media (max-width: 1100px) { .spar-hero__container { grid-template-columns: minmax(0, 1fr); width: min(calc(100% - 40px), 900px); gap: 44px; } .spar-hero__content, .spar-hero__card { max-width: 820px; margin-inline: auto; } .spar-hero__title { font-size: clamp(2.6rem, 7vw, 4.4rem); } .spar-hero__card-question { font-size: clamp(1.55rem, 3.3vw, 2rem); } } /* ============================================================ TABLET ============================================================ */ @media (max-width: 768px) { .spar-hero__container { width: min(calc(100% - 32px), 720px); padding-block: 62px 68px; gap: 38px; } .spar-hero__title { font-size: clamp(2.35rem, 8.5vw, 3.8rem); } .spar-hero__actions { grid-template-columns: minmax(0, 1fr); } .spar-hero__button--phone { grid-column: auto; } .spar-hero__button { width: 100%; min-height: 60px; } .spar-hero__benefits { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; } .spar-hero__card { padding: 28px; } } /* ============================================================ MOBILE ============================================================ */ @media (max-width: 560px) { .spar-hero__container { width: calc(100% - 28px); padding-block: 50px 58px; gap: 34px; } .spar-hero__eyebrow { align-items: flex-start; margin-bottom: 17px; padding: 7px 11px; border-radius: 14px; font-size: 0.68rem; line-height: 1.4; letter-spacing: 0.055em; } .spar-hero__eyebrow-dot { margin-top: 2px; } .spar-hero__title { font-size: clamp(2rem, 11vw, 3rem); line-height: 1.03; letter-spacing: -0.035em; } .spar-hero__title-accent { margin-top: 10px; font-size: 0.6em; line-height: 1.17; } .spar-hero__answer { margin-top: 22px; font-size: 1.01rem; line-height: 1.62; } .spar-hero__description { font-size: 0.94rem; line-height: 1.67; } .spar-hero__benefits { margin-top: 23px; } .spar-hero__benefit { align-items: flex-start; font-size: 0.91rem; } .spar-hero__check { margin-top: 1px; } .spar-hero__actions { margin-top: 27px; } .spar-hero__button { min-height: 58px; padding: 13px 14px; border-radius: 12px; font-size: 0.91rem; } .spar-hero__microcopy { margin-top: 16px; font-size: 0.82rem; line-height: 1.58; } .spar-hero__card { width: 100%; padding: 22px 18px; border-radius: 20px; } .spar-hero__card-top { align-items: flex-start; gap: 10px; } .spar-hero__card-label { flex: 1 1 auto; padding: 7px 10px; border-radius: 11px; font-size: 0.64rem; line-height: 1.35; } .spar-hero__sound-icon { flex-basis: 46px; width: 46px; height: 46px; border-radius: 14px; } .spar-hero__sound-icon svg { width: 27px; height: 27px; } .spar-hero__card-question { margin-top: 21px; font-size: clamp(1.35rem, 7vw, 1.7rem); line-height: 1.22; letter-spacing: -0.02em; text-align: left; } .spar-hero__card-answer { font-size: 0.94rem; line-height: 1.68; } .spar-hero__card-highlight { padding: 14px 14px; font-size: 0.88rem; line-height: 1.56; } .spar-hero__step { grid-template-columns: 34px minmax(0, 1fr); gap: 11px; } .spar-hero__step-number { width: 34px; height: 34px; } .spar-hero__step-text strong { font-size: 0.89rem; } .spar-hero__step-text small { font-size: 0.77rem; } .spar-hero__shape--one { right: -210px; } .spar-hero__shape--two { display: none; } } /* ============================================================ SMARTPHONE MOLTO STRETTI ============================================================ */ @media (max-width: 380px) { .spar-hero__container { width: calc(100% - 22px); padding-block: 44px 52px; } .spar-hero__title { font-size: 1.92rem; } .spar-hero__title-accent { font-size: 0.61em; } .spar-hero__button { gap: 8px; padding-inline: 11px; font-size: 0.86rem; } .spar-hero__button-icon { flex-basis: 21px; width: 21px; height: 21px; } .spar-hero__button-icon svg { width: 21px; height: 21px; } .spar-hero__card { padding: 20px 15px; } .spar-hero__card-question { font-size: 1.28rem; } .spar-hero__card-answer { font-size: 0.9rem; } .spar-hero__card-highlight { padding-inline: 12px; font-size: 0.84rem; } } /* ============================================================ ACCESSIBILITÀ ============================================================ */ @media (prefers-reduced-motion: reduce) { .spar-hero__button { transition: none; } .spar-hero__button:hover { transform: none; } } /* ============================================================ STAMPA ============================================================ */ @media print { .spar-hero { background: #ffffff; color: #172d31; } .spar-hero__background, .spar-hero__actions { display: none; } .spar-hero__title, .spar-hero__answer, .spar-hero__card-question, .spar-hero__card-highlight, .spar-hero__step-text strong { color: #172d31; } .spar-hero__title-accent, .spar-hero__description, .spar-hero__card-answer, .spar-hero__step-text small { color: #35565b; } .spar-hero__card { border: 1px solid #ccd9db; background: #ffffff; box-shadow: none; } }#imCell_3 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHTMLObject_1726_03 { position: relative; align-self: start; justify-self: center; max-width: 100%; box-sizing: border-box; z-index: 3; } #imCellStyleGraphics_3 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imCellStyleBorders_3 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } /* ============================================================ INDICE DELLA PAGINA ISOLAMENTO ACUSTICO PARETI ROMA Pagina: /isolamento-acustico-pareti-roma.html ============================================================ */ .spar-index, .spar-index *, .spar-index *::before, .spar-index *::after { box-sizing: border-box; } .spar-index { --spar-index-dark: #073b46; --spar-index-deep: #042d36; --spar-index-medium: #0b5964; --spar-index-blue: #087fa7; --spar-index-teal: #08a9a8; --spar-index-cyan: #16bfd0; --spar-index-orange: #f58220; --spar-index-orange-dark: #c85a0b; --spar-index-green: #27a967; --spar-index-green-dark: #1b7f4c; --spar-index-white: #ffffff; --spar-index-cream: #fff8ed; --spar-index-light: #eef8fa; --spar-index-soft: #f7fcfd; --spar-index-text: #173f48; --spar-index-muted: #59757c; --spar-index-border: #d5e5e7; --spar-index-shadow: 0 20px 52px rgba(4, 45, 54, 0.1); width: 100%; max-width: 100%; overflow: hidden; padding-block: clamp(56px, 7vw, 90px); background: radial-gradient( circle at 5% 5%, rgba(22, 191, 208, 0.12), transparent 29% ), radial-gradient( circle at 95% 95%, rgba(245, 130, 32, 0.09), transparent 27% ), linear-gradient( 180deg, #ffffff, var(--spar-index-cream) ); color: var(--spar-index-text); } .spar-index h2, .spar-index h3, .spar-index p, .spar-index span, .spar-index strong, .spar-index small, .spar-index a, .spar-index summary { max-width: 100%; white-space: normal; overflow-wrap: break-word; word-break: normal; } .spar-index svg { display: block; max-width: 100%; } .spar-index__container { width: min(calc(100% - 40px), 1160px); margin-inline: auto; } /* ============================================================ INTESTAZIONE ============================================================ */ .spar-index__header { width: min(100%, 930px); margin-inline: auto; text-align: center; } .spar-index__eyebrow, .spar-index__help-label { margin: 0 0 12px; color: var(--spar-index-orange-dark); font-size: 0.72rem; font-weight: 900; line-height: 1.4; letter-spacing: 0.075em; text-transform: uppercase; } .spar-index__title { margin: 0; color: var(--spar-index-dark); font-size: clamp(1.9rem, 4vw, 3.35rem); font-weight: 900; line-height: 1.1; letter-spacing: -0.04em; text-wrap: balance; } .spar-index__direct-answer { margin: 23px auto 0; color: var(--spar-index-dark); font-size: clamp(1.02rem, 1.5vw, 1.18rem); font-weight: 650; line-height: 1.7; } .spar-index__direct-answer strong { color: inherit; font-weight: 900; } .spar-index__intro { margin: 14px auto 0; color: var(--spar-index-muted); font-size: 0.98rem; line-height: 1.7; } /* ============================================================ AZIONI RAPIDE ============================================================ */ .spar-index__quick-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; width: min(100%, 960px); margin: clamp(34px, 5vw, 53px) auto 0; } .spar-index__quick-link { display: grid; grid-template-columns: 52px minmax(0, 1fr); align-items: center; gap: 13px; min-width: 0; min-height: 78px; padding: 13px 16px; border: 1px solid transparent; border-radius: 16px; text-decoration: none; box-shadow: 0 13px 31px rgba(4, 45, 54, 0.09); transition: transform 180ms ease, box-shadow 180ms ease, background-color 180ms ease, border-color 180ms ease; } .spar-index__quick-link:hover { transform: translateY(-3px); box-shadow: 0 17px 38px rgba(4, 45, 54, 0.13); } .spar-index__quick-link:focus-visible { outline: 3px solid var(--spar-index-orange); outline-offset: 4px; } .spar-index__quick-link--start { border-color: rgba(8, 169, 168, 0.28); background: var(--spar-index-white); color: var(--spar-index-dark); } .spar-index__quick-link--start:hover { border-color: var(--spar-index-teal); background: var(--spar-index-light); } .spar-index__quick-link--contact { border-color: var(--spar-index-orange); background: var(--spar-index-orange); color: #321704; } .spar-index__quick-link--contact:hover { border-color: #ff9b43; background: #ff9b43; } .spar-index__quick-icon { display: grid; place-items: center; width: 50px; height: 50px; border-radius: 14px; background: var(--spar-index-dark); color: var(--spar-index-white); } .spar-index__quick-link--contact .spar-index__quick-icon { background: rgba(49, 23, 4, 0.14); color: #321704; } .spar-index__quick-icon svg { width: 25px; height: 25px; } .spar-index__quick-copy { display: grid; min-width: 0; gap: 3px; } .spar-index__quick-copy small { color: var(--spar-index-teal); font-size: 0.66rem; font-weight: 900; line-height: 1.25; letter-spacing: 0.055em; text-transform: uppercase; } .spar-index__quick-link--contact .spar-index__quick-copy small { color: rgba(49, 23, 4, 0.74); } .spar-index__quick-copy strong { color: inherit; font-size: 0.94rem; font-weight: 900; line-height: 1.4; } /* ============================================================ NAVIGAZIONE ============================================================ */ .spar-index__navigation { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 18px; margin-top: clamp(48px, 7vw, 76px); } /* ============================================================ GRUPPI ============================================================ */ .spar-index__group { min-width: 0; overflow: hidden; border: 1px solid var(--spar-index-border); border-top: 5px solid var(--spar-index-blue); border-radius: 20px; background: var(--spar-index-white); box-shadow: var(--spar-index-shadow); scroll-margin-top: 100px; } .spar-index__group--teal { border-top-color: var(--spar-index-teal); } .spar-index__group--orange { border-top-color: var(--spar-index-orange); } .spar-index__group--green { border-top-color: var(--spar-index-green); } .spar-index__group summary { display: grid; grid-template-columns: 54px minmax(0, 1fr) 38px; align-items: center; gap: 14px; min-width: 0; min-height: 91px; padding: 17px 18px; color: var(--spar-index-dark); cursor: pointer; list-style: none; transition: background-color 180ms ease; } .spar-index__group summary::-webkit-details-marker { display: none; } .spar-index__group summary::marker { content: ""; } .spar-index__group summary:hover { background: var(--spar-index-light); } .spar-index__group summary:focus-visible { outline: 3px solid var(--spar-index-orange); outline-offset: -4px; } .spar-index__group[open] summary { border-bottom: 1px solid var(--spar-index-border); background: var(--spar-index-soft); } .spar-index__group-number { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 15px; background: var(--spar-index-blue); color: var(--spar-index-white); font-size: 0.75rem; font-weight: 950; line-height: 1; } .spar-index__group--teal .spar-index__group-number { background: var(--spar-index-teal); } .spar-index__group--orange .spar-index__group-number { background: var(--spar-index-orange); color: #321704; } .spar-index__group--green .spar-index__group-number { background: var(--spar-index-green); } .spar-index__group-copy { display: grid; min-width: 0; gap: 4px; } .spar-index__group-copy small { color: var(--spar-index-orange-dark); font-size: 0.63rem; font-weight: 900; line-height: 1.3; letter-spacing: 0.055em; text-transform: uppercase; } .spar-index__group-copy strong { color: var(--spar-index-dark); font-size: clamp(1rem, 1.5vw, 1.18rem); font-weight: 900; line-height: 1.38; } .spar-index__group-toggle { position: relative; display: block; width: 36px; height: 36px; border-radius: 11px; background: var(--spar-index-light); color: var(--spar-index-teal); } .spar-index__group-toggle::before, .spar-index__group-toggle::after { position: absolute; top: 50%; left: 50%; width: 14px; height: 2px; border-radius: 999px; background: currentColor; content: ""; transform: translate(-50%, -50%); } .spar-index__group-toggle::after { transform: translate(-50%, -50%) rotate(90deg); } .spar-index__group[open] .spar-index__group-toggle { background: var(--spar-index-teal); color: var(--spar-index-white); } .spar-index__group[open] .spar-index__group-toggle::after { transform: translate(-50%, -50%) rotate(0deg); } /* ============================================================ ELENCO ARGOMENTI ============================================================ */ .spar-index__list { display: grid; gap: 9px; margin: 0; padding: 13px; list-style: none; background: var(--spar-index-soft); } .spar-index__list li { min-width: 0; } .spar-index__list a { display: grid; grid-template-columns: 40px minmax(0, 1fr) 26px; align-items: center; gap: 11px; min-width: 0; min-height: 74px; padding: 12px 13px; border: 1px solid var(--spar-index-border); border-radius: 13px; background: var(--spar-index-white); color: var(--spar-index-dark); text-decoration: none; box-shadow: 0 6px 18px rgba(4, 45, 54, 0.045); transition: transform 180ms ease, border-color 180ms ease, background-color 180ms ease, box-shadow 180ms ease; } .spar-index__list a:hover { transform: translateY(-2px); border-color: rgba(8, 169, 168, 0.46); background: var(--spar-index-light); box-shadow: 0 10px 25px rgba(4, 45, 54, 0.08); } .spar-index__list a:focus-visible { outline: 3px solid var(--spar-index-orange); outline-offset: 3px; } .spar-index__list a.spar-index__contact-item { border-color: rgba(245, 130, 32, 0.48); background: #fff3e8; } .spar-index__list a.spar-index__contact-item:hover { border-color: var(--spar-index-orange); background: #ffe9d8; } .spar-index__item-number { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 11px; background: var(--spar-index-dark); color: var(--spar-index-white); font-size: 0.67rem; font-weight: 950; line-height: 1; } .spar-index__group--teal .spar-index__item-number { background: var(--spar-index-teal); } .spar-index__group--orange .spar-index__item-number { background: var(--spar-index-orange); color: #321704; } .spar-index__group--green .spar-index__item-number { background: var(--spar-index-green); } .spar-index__item-copy { display: grid; min-width: 0; gap: 4px; } .spar-index__item-copy strong { color: var(--spar-index-dark); font-size: 0.87rem; font-weight: 900; line-height: 1.4; } .spar-index__item-copy small { color: var(--spar-index-muted); font-size: 0.74rem; font-weight: 650; line-height: 1.5; } .spar-index__item-arrow { color: var(--spar-index-orange-dark); font-size: 1.15rem; font-weight: 900; line-height: 1; text-align: right; } /* ============================================================ BLOCCO DI AIUTO ============================================================ */ .spar-index__help { display: grid; grid-template-columns: 70px minmax(0, 1fr) minmax(230px, auto); align-items: center; gap: 22px; margin-top: clamp(42px, 6vw, 66px); padding: clamp(23px, 3vw, 34px); border: 1px solid rgba(245, 130, 32, 0.3); border-radius: 21px; background: #fff2e5; box-shadow: 0 14px 35px rgba(4, 45, 54, 0.07); } .spar-index__help-icon { display: grid; place-items: center; width: 66px; height: 66px; border-radius: 18px; background: var(--spar-index-orange); color: #321704; } .spar-index__help-icon svg { width: 38px; height: 38px; } .spar-index__help-content { min-width: 0; } .spar-index__help-content h3 { margin: 0; color: var(--spar-index-dark); font-size: clamp(1.2rem, 2vw, 1.68rem); font-weight: 900; line-height: 1.3; letter-spacing: -0.025em; } .spar-index__help-content > p:last-child { margin: 9px 0 0; color: var(--spar-index-muted); font-size: 0.88rem; line-height: 1.65; } .spar-index__help-button { display: flex; align-items: center; justify-content: center; gap: 9px; min-width: 0; min-height: 55px; padding: 13px 17px; border: 2px solid var(--spar-index-dark); border-radius: 12px; background: var(--spar-index-dark); color: var(--spar-index-white); font-size: 0.82rem; font-weight: 900; line-height: 1.35; text-align: center; text-decoration: none; transition: transform 180ms ease, background-color 180ms ease, border-color 180ms ease; } .spar-index__help-button:hover { transform: translateY(-2px); border-color: var(--spar-index-medium); background: var(--spar-index-medium); } .spar-index__help-button:focus-visible { outline: 3px solid var(--spar-index-orange); outline-offset: 4px; } .spar-index__help-button svg { flex: 0 0 22px; width: 22px; height: 22px; } /* ============================================================ NOTEBOOK ============================================================ */ @media (max-width: 1050px) { .spar-index__navigation { grid-template-columns: minmax(0, 1fr); } .spar-index__group { width: min(100%, 900px); margin-inline: auto; } .spar-index__help { grid-template-columns: 66px minmax(0, 1fr); } .spar-index__help-button { grid-column: 1 / -1; justify-self: start; } } /* ============================================================ TABLET ============================================================ */ @media (max-width: 760px) { .spar-index__container { width: min(calc(100% - 32px), 720px); } .spar-index__quick-actions { grid-template-columns: minmax(0, 1fr); } .spar-index__group summary { grid-template-columns: 50px minmax(0, 1fr) 34px; } .spar-index__group-number { width: 48px; height: 48px; } } /* ============================================================ SMARTPHONE ============================================================ */ @media (max-width: 580px) { .spar-index { padding-block: 48px 60px; } .spar-index__container { width: calc(100% - 28px); } .spar-index__header { text-align: left; } .spar-index__eyebrow, .spar-index__help-label { font-size: 0.66rem; letter-spacing: 0.06em; } .spar-index__title { font-size: clamp(1.78rem, 9vw, 2.48rem); line-height: 1.1; } .spar-index__direct-answer { font-size: 0.96rem; line-height: 1.64; } .spar-index__intro { font-size: 0.89rem; line-height: 1.65; } .spar-index__quick-link { grid-template-columns: 47px minmax(0, 1fr); min-height: 72px; padding: 12px 13px; border-radius: 14px; } .spar-index__quick-icon { width: 45px; height: 45px; border-radius: 13px; } .spar-index__quick-icon svg { width: 22px; height: 22px; } .spar-index__navigation { gap: 14px; margin-top: 42px; } .spar-index__group { border-radius: 17px; } .spar-index__group summary { grid-template-columns: 45px minmax(0, 1fr) 31px; gap: 10px; min-height: 78px; padding: 14px 12px; } .spar-index__group-number { width: 43px; height: 43px; border-radius: 13px; } .spar-index__group-copy small { font-size: 0.57rem; } .spar-index__group-copy strong { font-size: 0.94rem; line-height: 1.36; } .spar-index__group-toggle { width: 30px; height: 30px; border-radius: 9px; } .spar-index__group-toggle::before, .spar-index__group-toggle::after { width: 12px; } .spar-index__list { gap: 8px; padding: 10px; } .spar-index__list a { grid-template-columns: 37px minmax(0, 1fr) 20px; gap: 9px; min-height: 69px; padding: 11px 10px; border-radius: 11px; } .spar-index__item-number { width: 35px; height: 35px; border-radius: 10px; font-size: 0.61rem; } .spar-index__item-copy strong { font-size: 0.82rem; } .spar-index__item-copy small { font-size: 0.69rem; line-height: 1.46; } .spar-index__item-arrow { font-size: 1rem; } .spar-index__help { grid-template-columns: minmax(0, 1fr); align-items: start; padding: 20px 16px; border-radius: 18px; } .spar-index__help-icon { width: 54px; height: 54px; border-radius: 15px; } .spar-index__help-icon svg { width: 31px; height: 31px; } .spar-index__help-button { grid-column: auto; width: 100%; min-height: 55px; } } /* ============================================================ SMARTPHONE STRETTI ============================================================ */ @media (max-width: 380px) { .spar-index__container { width: calc(100% - 22px); } .spar-index__title { font-size: 1.66rem; } .spar-index__quick-link, .spar-index__group summary, .spar-index__list, .spar-index__help { padding-inline: 11px; } .spar-index__group summary { grid-template-columns: 41px minmax(0, 1fr) 29px; gap: 8px; } .spar-index__group-number { width: 39px; height: 39px; } .spar-index__group-copy strong { font-size: 0.88rem; } .spar-index__list a { grid-template-columns: 34px minmax(0, 1fr) 18px; gap: 7px; padding-inline: 8px; } .spar-index__item-number { width: 33px; height: 33px; } } /* ============================================================ ACCESSIBILITÀ ============================================================ */ @media (prefers-reduced-motion: reduce) { .spar-index__quick-link, .spar-index__group summary, .spar-index__list a, .spar-index__help-button { transition: none; } .spar-index__quick-link:hover, .spar-index__list a:hover, .spar-index__help-button:hover { transform: none; } } /* ============================================================ STAMPA ============================================================ */ @media print { .spar-index { padding: 30px 0; background: #ffffff; } .spar-index__quick-actions, .spar-index__help { display: none; } .spar-index__navigation { grid-template-columns: minmax(0, 1fr); } .spar-index__group { break-inside: avoid; box-shadow: none; } .spar-index__group summary { border-bottom: 1px solid var(--spar-index-border); } .spar-index__list a { box-shadow: none; } }#imCell_4 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHTMLObject_1726_04 { position: relative; align-self: start; justify-self: center; max-width: 100%; box-sizing: border-box; z-index: 3; } #imCellStyleGraphics_4 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imCellStyleBorders_4 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } /* ============================================================ H2 — INSONORIZZARE UNA PARETE CONFINANTE A ROMA Pagina: /isolamento-acustico-pareti-roma.html ============================================================ */ .spar-conf, .spar-conf *, .spar-conf *::before, .spar-conf *::after { box-sizing: border-box; } .spar-conf { --spar-conf-blue-dark: #07343b; --spar-conf-blue-deep: #05282e; --spar-conf-blue-medium: #0c525a; --spar-conf-teal: #22bcbf; --spar-conf-teal-light: #b9eeee; --spar-conf-orange: #ff8a2a; --spar-conf-orange-dark: #dc6d14; --spar-conf-green: #27ad68; --spar-conf-green-dark: #18854e; --spar-conf-cream: #fff8ed; --spar-conf-light: #eef9f8; --spar-conf-white: #ffffff; --spar-conf-text: #173b40; --spar-conf-muted: #557176; --spar-conf-border: #d5e7e5; --spar-conf-shadow: 0 20px 55px rgba(6, 52, 59, 0.11); position: relative; width: 100%; max-width: 100%; overflow: hidden; padding-block: clamp(70px, 8vw, 112px); background: radial-gradient( circle at 4% 10%, rgba(34, 188, 191, 0.12), transparent 28% ), radial-gradient( circle at 96% 88%, rgba(255, 138, 42, 0.1), transparent 26% ), var(--spar-conf-cream); color: var(--spar-conf-text); } .spar-conf h2, .spar-conf h3, .spar-conf p, .spar-conf li, .spar-conf span, .spar-conf strong, .spar-conf small, .spar-conf a { max-width: 100%; overflow-wrap: break-word; word-break: normal; white-space: normal; } .spar-conf__container { width: min(calc(100% - 40px), 1220px); max-width: 1220px; margin-inline: auto; } /* ============================================================ HEADER ============================================================ */ .spar-conf__header { width: min(100%, 930px); margin-inline: auto; text-align: center; } .spar-conf__eyebrow, .spar-conf__section-label { margin: 0 0 14px; color: var(--spar-conf-orange-dark); font-size: 0.78rem; font-weight: 900; line-height: 1.4; letter-spacing: 0.085em; text-transform: uppercase; } .spar-conf__title { margin: 0; color: var(--spar-conf-blue-dark); font-family: inherit; font-size: clamp(2.1rem, 4.4vw, 3.75rem); font-weight: 900; line-height: 1.05; letter-spacing: -0.04em; text-wrap: balance; } .spar-conf__title span { display: block; margin-top: 7px; color: var(--spar-conf-teal); } .spar-conf__direct-answer { margin: 27px auto 0; color: var(--spar-conf-blue-dark); font-size: clamp(1.07rem, 1.5vw, 1.22rem); font-weight: 650; line-height: 1.72; } .spar-conf__direct-answer strong { color: var(--spar-conf-blue-dark); font-weight: 900; } .spar-conf__intro { margin: 16px auto 0; color: var(--spar-conf-muted); font-size: 1rem; line-height: 1.76; } /* ============================================================ RISPOSTA PRINCIPALE ============================================================ */ .spar-conf__answer-box { display: grid; grid-template-columns: 78px minmax(0, 1fr); align-items: center; gap: 24px; width: min(100%, 1000px); margin: clamp(38px, 5vw, 58px) auto 0; padding: clamp(23px, 3vw, 34px); border: 1px solid rgba(34, 188, 191, 0.24); border-radius: 22px; background: var(--spar-conf-white); box-shadow: var(--spar-conf-shadow); } .spar-conf__answer-icon { display: grid; place-items: center; width: 72px; height: 72px; border-radius: 20px; background: var(--spar-conf-blue-dark); color: var(--spar-conf-teal-light); } .spar-conf__answer-icon svg { display: block; width: 43px; height: 43px; } .spar-conf__answer-content { min-width: 0; } .spar-conf__answer-label { margin: 0 0 7px; color: var(--spar-conf-orange-dark); font-size: 0.74rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-conf__answer-question { margin: 0 0 9px; color: var(--spar-conf-blue-dark); font-size: clamp(1.25rem, 2vw, 1.65rem); font-weight: 900; line-height: 1.3; } .spar-conf__answer-content > p:last-child { margin: 0; color: var(--spar-conf-muted); font-size: 0.97rem; line-height: 1.68; } /* ============================================================ PROBLEMI ============================================================ */ .spar-conf__problems { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin-top: clamp(40px, 5vw, 62px); } .spar-conf__problem { position: relative; min-width: 0; padding: clamp(23px, 2.6vw, 32px); border: 1px solid var(--spar-conf-border); border-top: 5px solid var(--spar-conf-blue-dark); border-radius: 20px; background: var(--spar-conf-white); box-shadow: 0 14px 38px rgba(6, 52, 59, 0.08); } .spar-conf__problem--teal { border-top-color: var(--spar-conf-teal); } .spar-conf__problem--orange { border-top-color: var(--spar-conf-orange); } .spar-conf__problem-top { display: flex; align-items: center; justify-content: space-between; gap: 16px; } .spar-conf__problem-number { color: rgba(7, 52, 59, 0.25); font-size: 1.8rem; font-weight: 950; line-height: 1; } .spar-conf__problem-icon { display: grid; flex: 0 0 48px; place-items: center; width: 48px; height: 48px; border-radius: 15px; background: var(--spar-conf-light); color: var(--spar-conf-blue-dark); } .spar-conf__problem-icon svg { width: 27px; height: 27px; } .spar-conf__problem h3 { margin: 22px 0 13px; color: var(--spar-conf-blue-dark); font-size: clamp(1.25rem, 1.7vw, 1.48rem); font-weight: 900; line-height: 1.28; letter-spacing: -0.02em; } .spar-conf__problem p { margin: 0; color: var(--spar-conf-muted); font-size: 0.94rem; line-height: 1.7; } .spar-conf__problem p + p { margin-top: 12px; } .spar-conf__problem-result { padding-top: 14px; border-top: 1px solid var(--spar-conf-border); color: var(--spar-conf-blue-dark) !important; font-weight: 750; } /* ============================================================ PRINCIPIO TECNICO ============================================================ */ .spar-conf__principle { display: grid; grid-template-columns: minmax(0, 0.92fr) minmax(400px, 1.08fr); align-items: center; gap: clamp(36px, 5vw, 68px); margin-top: clamp(55px, 7vw, 86px); } .spar-conf__principle-content { min-width: 0; } .spar-conf__principle-content h3, .spar-conf__video-heading h3, .spar-conf__conversion h3 { margin: 0; color: var(--spar-conf-blue-dark); font-size: clamp(1.75rem, 3vw, 2.55rem); font-weight: 900; line-height: 1.14; letter-spacing: -0.035em; text-wrap: balance; } .spar-conf__principle-content p:not(.spar-conf__section-label) { margin: 19px 0 0; color: var(--spar-conf-muted); font-size: 1rem; line-height: 1.75; } .spar-conf__principle-content p + p { margin-top: 13px; } /* ============================================================ SCHEMA ============================================================ */ .spar-conf__diagram { display: grid; grid-template-columns: minmax(90px, 1fr) 36px minmax(42px, 0.35fr) minmax(38px, 0.3fr) minmax(150px, 1.35fr) minmax(90px, 1fr); align-items: stretch; gap: 9px; min-width: 0; padding: 22px; border: 1px solid rgba(34, 188, 191, 0.24); border-radius: 22px; background: var(--spar-conf-white); box-shadow: var(--spar-conf-shadow); } .spar-conf__diagram-source, .spar-conf__diagram-wall, .spar-conf__diagram-gap, .spar-conf__diagram-system, .spar-conf__diagram-room { display: flex; min-width: 0; min-height: 210px; align-items: center; justify-content: center; flex-direction: column; padding: 13px; border-radius: 14px; text-align: center; } .spar-conf__diagram-source { background: #ffefe0; color: #763508; } .spar-conf__diagram-source span, .spar-conf__diagram-room span { font-size: 0.73rem; font-weight: 850; line-height: 1.35; text-transform: uppercase; } .spar-conf__diagram-source strong { margin-top: 10px; color: inherit; font-size: 0.9rem; line-height: 1.4; } .spar-conf__diagram-wave { display: grid; place-items: center; min-width: 0; color: var(--spar-conf-orange); font-size: 1.1rem; font-weight: 900; } .spar-conf__diagram-wall { border: 2px solid #9eaaac; background: repeating-linear-gradient( 45deg, #e2e7e7, #e2e7e7 9px, #d4dcdc 9px, #d4dcdc 18px ); color: #40575b; } .spar-conf__diagram-wall span, .spar-conf__diagram-gap span { writing-mode: vertical-rl; transform: rotate(180deg); font-size: 0.69rem; font-weight: 900; line-height: 1.2; text-transform: uppercase; } .spar-conf__diagram-gap { border: 1px dashed var(--spar-conf-teal); background: var(--spar-conf-light); color: var(--spar-conf-blue-medium); } .spar-conf__diagram-system { gap: 8px; border: 2px solid var(--spar-conf-blue-dark); background: #e4f5f4; color: var(--spar-conf-blue-dark); } .spar-conf__diagram-system span:not(.spar-conf__diagram-title) { width: 100%; padding: 7px; border-radius: 8px; background: var(--spar-conf-white); font-size: 0.72rem; font-weight: 750; line-height: 1.3; } .spar-conf__diagram-title { margin-bottom: 3px; font-size: 0.75rem; font-weight: 900; line-height: 1.3; text-transform: uppercase; } .spar-conf__diagram-room { background: var(--spar-conf-blue-dark); color: var(--spar-conf-white); } .spar-conf__diagram-note { grid-column: 1 / -1; margin: 5px 0 0; color: var(--spar-conf-muted); font-size: 0.77rem; line-height: 1.5; text-align: center; } /* ============================================================ VIDEO ============================================================ */ .spar-conf__video { margin-top: clamp(60px, 8vw, 96px); padding: clamp(27px, 4vw, 48px); border-radius: 26px; background: radial-gradient( circle at 92% 8%, rgba(34, 188, 191, 0.2), transparent 30% ), linear-gradient( 135deg, var(--spar-conf-blue-deep), var(--spar-conf-blue-dark) ); color: var(--spar-conf-white); box-shadow: 0 25px 65px rgba(3, 35, 40, 0.22); } .spar-conf__video-heading { width: min(100%, 820px); } .spar-conf__video-heading .spar-conf__section-label { color: var(--spar-conf-orange); } .spar-conf__video-heading h3 { color: var(--spar-conf-white); } .spar-conf__video-heading > p:last-child { margin: 17px 0 0; color: rgba(255, 255, 255, 0.78); font-size: 1rem; line-height: 1.7; } .spar-conf__video-grid { display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(310px, 0.88fr); align-items: start; gap: clamp(27px, 4vw, 48px); margin-top: 34px; } .spar-conf__video-figure { min-width: 0; margin: 0; } .spar-conf__video-frame { position: relative; width: 100%; max-width: 100%; overflow: hidden; border: 1px solid rgba(255, 255, 255, 0.15); border-radius: 17px; background: #000000; box-shadow: 0 18px 42px rgba(0, 0, 0, 0.27); aspect-ratio: 16 / 9; } .spar-conf__video-frame iframe { position: absolute; inset: 0; display: block; width: 100%; height: 100%; border: 0; } .spar-conf__video-figure figcaption { margin-top: 12px; color: rgba(255, 255, 255, 0.68); font-size: 0.79rem; line-height: 1.5; } .spar-conf__video-external { display: inline-flex; align-items: center; gap: 8px; margin-top: 13px; color: var(--spar-conf-teal-light); font-size: 0.84rem; font-weight: 800; line-height: 1.4; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; } .spar-conf__video-external:hover { color: var(--spar-conf-white); } .spar-conf__video-external:focus-visible { outline: 3px solid var(--spar-conf-orange); outline-offset: 4px; border-radius: 4px; } .spar-conf__video-external svg { flex: 0 0 18px; width: 18px; height: 18px; } .spar-conf__video-points { min-width: 0; } .spar-conf__video-points-label { margin: 0 0 17px; color: var(--spar-conf-orange); font-size: 0.73rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-conf__video-points ul { display: grid; gap: 13px; margin: 0; padding: 0; list-style: none; } .spar-conf__video-points li { display: grid; grid-template-columns: 39px minmax(0, 1fr); align-items: start; gap: 12px; min-width: 0; padding: 14px; border: 1px solid rgba(255, 255, 255, 0.12); border-radius: 13px; background: rgba(255, 255, 255, 0.065); } .spar-conf__video-points li > span { display: grid; place-items: center; width: 39px; height: 39px; border-radius: 11px; background: rgba(34, 188, 191, 0.16); color: var(--spar-conf-teal-light); font-size: 0.69rem; font-weight: 900; } .spar-conf__video-points li div { min-width: 0; } .spar-conf__video-points strong { display: block; color: var(--spar-conf-white); font-size: 0.91rem; font-weight: 850; line-height: 1.38; } .spar-conf__video-points li p { margin: 5px 0 0; color: rgba(255, 255, 255, 0.69); font-size: 0.82rem; line-height: 1.55; } /* ============================================================ TRASCRIZIONE ============================================================ */ .spar-conf__transcript { margin-top: 31px; border: 1px solid rgba(255, 255, 255, 0.15); border-radius: 16px; background: rgba(255, 255, 255, 0.065); } .spar-conf__transcript > summary { display: grid; grid-template-columns: 40px minmax(0, 1fr) 24px; align-items: center; gap: 12px; min-width: 0; padding: 17px 19px; color: var(--spar-conf-white); font-size: 0.91rem; font-weight: 850; line-height: 1.4; list-style: none; cursor: pointer; } .spar-conf__transcript > summary::-webkit-details-marker { display: none; } .spar-conf__transcript > summary:focus-visible { outline: 3px solid var(--spar-conf-orange); outline-offset: 3px; border-radius: 14px; } .spar-conf__transcript-icon { display: grid; place-items: center; width: 40px; height: 34px; border-radius: 9px; background: var(--spar-conf-orange); color: #321705; font-size: 0.7rem; font-weight: 950; letter-spacing: 0.03em; } .spar-conf__transcript summary svg { width: 22px; height: 22px; transition: transform 180ms ease; } .spar-conf__transcript[open] summary svg { transform: rotate(180deg); } .spar-conf__transcript-content { padding: 0 19px 21px; } .spar-conf__transcript-intro { margin: 0 0 17px; padding-top: 17px; border-top: 1px solid rgba(255, 255, 255, 0.12); color: rgba(255, 255, 255, 0.7); font-size: 0.84rem; line-height: 1.55; } .spar-conf__transcript-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; } .spar-conf__transcript-grid article { display: grid; grid-template-columns: 31px minmax(0, 1fr); align-items: start; gap: 10px; min-width: 0; padding: 13px; border-radius: 11px; background: rgba(255, 255, 255, 0.06); } .spar-conf__transcript-grid article > span { display: grid; place-items: center; width: 31px; height: 31px; border-radius: 50%; background: rgba(34, 188, 191, 0.15); color: var(--spar-conf-teal-light); font-size: 0.62rem; font-weight: 900; } .spar-conf__transcript-grid article p { margin: 0; color: rgba(255, 255, 255, 0.75); font-size: 0.81rem; line-height: 1.55; } .spar-conf__transcript-conclusion { background: rgba(255, 138, 42, 0.11) !important; } /* ============================================================ CONVERSIONE ============================================================ */ .spar-conf__conversion { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(330px, 0.92fr); align-items: center; gap: clamp(30px, 5vw, 65px); margin-top: clamp(55px, 7vw, 85px); padding: clamp(27px, 4vw, 48px); border: 1px solid rgba(34, 188, 191, 0.24); border-radius: 25px; background: var(--spar-conf-white); box-shadow: var(--spar-conf-shadow); } .spar-conf__conversion-content { min-width: 0; } .spar-conf__conversion-label { margin: 0 0 13px; color: var(--spar-conf-orange-dark); font-size: 0.75rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-conf__conversion-content > p:not(.spar-conf__conversion-label) { margin: 17px 0 0; color: var(--spar-conf-muted); font-size: 0.97rem; line-height: 1.72; } .spar-conf__conversion-content > p + p { margin-top: 11px; } .spar-conf__actions { display: grid; gap: 11px; min-width: 0; } .spar-conf__button { display: flex; min-width: 0; min-height: 58px; align-items: center; justify-content: center; gap: 10px; padding: 13px 17px; border: 2px solid transparent; border-radius: 12px; font-family: inherit; font-size: 0.91rem; font-weight: 850; line-height: 1.3; text-align: center; text-decoration: none; transition: transform 180ms ease, box-shadow 180ms ease, background-color 180ms ease, border-color 180ms ease; } .spar-conf__button:hover { transform: translateY(-2px); } .spar-conf__button:focus-visible { outline: 3px solid var(--spar-conf-blue-dark); outline-offset: 4px; } .spar-conf__button svg { flex: 0 0 23px; width: 23px; height: 23px; } .spar-conf__button--primary { background: var(--spar-conf-orange); color: #2c1504; box-shadow: 0 12px 28px rgba(255, 138, 42, 0.23); } .spar-conf__button--primary:hover { background: #ff9b43; } .spar-conf__button--whatsapp { background: var(--spar-conf-green); color: var(--spar-conf-white); box-shadow: 0 12px 28px rgba(39, 173, 104, 0.2); } .spar-conf__button--whatsapp:hover { background: var(--spar-conf-green-dark); } .spar-conf__button--phone { border-color: rgba(7, 52, 59, 0.32); background: var(--spar-conf-white); color: var(--spar-conf-blue-dark); } .spar-conf__button--phone:hover { border-color: var(--spar-conf-teal); background: var(--spar-conf-light); } .spar-conf__phone-text { display: grid; min-width: 0; gap: 1px; text-align: left; } .spar-conf__phone-text small { font-size: 0.64rem; font-weight: 750; line-height: 1.1; letter-spacing: 0.055em; text-transform: uppercase; } .spar-conf__phone-text strong { color: inherit; font-size: 1rem; font-weight: 900; line-height: 1.15; } /* ============================================================ TABLET E NOTEBOOK ============================================================ */ @media (max-width: 1080px) { .spar-conf__problems { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-conf__problem:last-child { grid-column: 1 / -1; } .spar-conf__principle, .spar-conf__video-grid, .spar-conf__conversion { grid-template-columns: minmax(0, 1fr); } .spar-conf__principle-content, .spar-conf__video-heading, .spar-conf__conversion-content { max-width: 850px; } .spar-conf__diagram { max-width: 850px; } .spar-conf__actions { grid-template-columns: repeat(3, minmax(0, 1fr)); } } /* ============================================================ TABLET ============================================================ */ @media (max-width: 780px) { .spar-conf { padding-block: 62px 74px; } .spar-conf__container { width: min(calc(100% - 32px), 720px); } .spar-conf__answer-box { grid-template-columns: 62px minmax(0, 1fr); gap: 18px; } .spar-conf__answer-icon { width: 60px; height: 60px; border-radius: 17px; } .spar-conf__answer-icon svg { width: 36px; height: 36px; } .spar-conf__problems { grid-template-columns: minmax(0, 1fr); } .spar-conf__problem:last-child { grid-column: auto; } .spar-conf__diagram { grid-template-columns: minmax(85px, 1fr) 30px minmax(40px, 0.35fr) minmax(36px, 0.3fr) minmax(130px, 1.3fr) minmax(85px, 1fr); padding: 17px; gap: 7px; } .spar-conf__diagram-source, .spar-conf__diagram-wall, .spar-conf__diagram-gap, .spar-conf__diagram-system, .spar-conf__diagram-room { min-height: 190px; padding: 10px; } .spar-conf__transcript-grid { grid-template-columns: minmax(0, 1fr); } .spar-conf__actions { grid-template-columns: minmax(0, 1fr); } } /* ============================================================ MOBILE ============================================================ */ @media (max-width: 560px) { .spar-conf { padding-block: 52px 62px; } .spar-conf__container { width: calc(100% - 28px); } .spar-conf__header { text-align: left; } .spar-conf__eyebrow, .spar-conf__section-label { font-size: 0.69rem; letter-spacing: 0.065em; } .spar-conf__title { font-size: clamp(1.95rem, 10vw, 2.8rem); line-height: 1.08; } .spar-conf__title span { margin-top: 5px; } .spar-conf__direct-answer { margin-top: 21px; font-size: 1rem; line-height: 1.64; } .spar-conf__intro { font-size: 0.93rem; line-height: 1.68; } .spar-conf__answer-box { grid-template-columns: minmax(0, 1fr); align-items: start; gap: 16px; padding: 21px 18px; border-radius: 18px; } .spar-conf__answer-icon { width: 54px; height: 54px; border-radius: 15px; } .spar-conf__answer-question { font-size: 1.18rem; } .spar-conf__answer-content > p:last-child { font-size: 0.91rem; } .spar-conf__problem { padding: 22px 18px; border-radius: 17px; } .spar-conf__problem h3 { font-size: 1.22rem; } .spar-conf__problem p { font-size: 0.91rem; line-height: 1.66; } .spar-conf__principle-content h3, .spar-conf__video-heading h3, .spar-conf__conversion h3 { font-size: clamp(1.55rem, 7.5vw, 2rem); line-height: 1.18; } .spar-conf__principle-content p:not(.spar-conf__section-label), .spar-conf__video-heading > p:last-child, .spar-conf__conversion-content > p:not(.spar-conf__conversion-label) { font-size: 0.92rem; line-height: 1.67; } /* Lo schema diventa verticale sui telefoni */ .spar-conf__diagram { grid-template-columns: minmax(0, 1fr); padding: 17px; gap: 9px; } .spar-conf__diagram-source, .spar-conf__diagram-wall, .spar-conf__diagram-gap, .spar-conf__diagram-system, .spar-conf__diagram-room { min-height: auto; padding: 15px; } .spar-conf__diagram-wave { min-height: 28px; transform: rotate(90deg); } .spar-conf__diagram-wall span, .spar-conf__diagram-gap span { writing-mode: horizontal-tb; transform: none; } .spar-conf__diagram-system span:not(.spar-conf__diagram-title) { padding: 8px; } .spar-conf__diagram-note { grid-column: auto; } .spar-conf__video { padding: 23px 17px; border-radius: 20px; } .spar-conf__video-grid { margin-top: 26px; gap: 27px; } .spar-conf__video-frame { border-radius: 13px; } .spar-conf__video-points li { grid-template-columns: 35px minmax(0, 1fr); gap: 10px; padding: 12px; } .spar-conf__video-points li > span { width: 35px; height: 35px; } .spar-conf__video-points strong { font-size: 0.87rem; } .spar-conf__video-points li p { font-size: 0.79rem; } .spar-conf__transcript > summary { grid-template-columns: 36px minmax(0, 1fr) 21px; gap: 9px; padding: 15px 13px; font-size: 0.84rem; } .spar-conf__transcript-icon { width: 36px; height: 31px; } .spar-conf__transcript-content { padding-inline: 13px; } .spar-conf__transcript-grid article { grid-template-columns: 29px minmax(0, 1fr); padding: 11px; } .spar-conf__transcript-grid article > span { width: 29px; height: 29px; } .spar-conf__transcript-grid article p { font-size: 0.78rem; } .spar-conf__conversion { padding: 23px 18px; border-radius: 19px; } .spar-conf__button { width: 100%; min-height: 58px; padding-inline: 13px; font-size: 0.88rem; } } /* ============================================================ SCHERMI MOLTO STRETTI ============================================================ */ @media (max-width: 380px) { .spar-conf__container { width: calc(100% - 22px); } .spar-conf__title { font-size: 1.85rem; } .spar-conf__problem { padding-inline: 15px; } .spar-conf__video { padding-inline: 14px; } .spar-conf__conversion { padding-inline: 15px; } .spar-conf__button { gap: 8px; padding-inline: 10px; font-size: 0.84rem; } .spar-conf__button svg { flex-basis: 21px; width: 21px; height: 21px; } } /* ============================================================ ACCESSIBILITÀ ============================================================ */ @media (prefers-reduced-motion: reduce) { .spar-conf__button, .spar-conf__transcript summary svg { transition: none; } .spar-conf__button:hover { transform: none; } } /* ============================================================ STAMPA ============================================================ */ @media print { .spar-conf { padding: 30px 0; background: #ffffff; } .spar-conf__video-frame, .spar-conf__actions { display: none; } .spar-conf__video { background: #ffffff; color: #173b40; box-shadow: none; border: 1px solid #cfdede; } .spar-conf__video-heading h3, .spar-conf__video-points strong, .spar-conf__transcript > summary { color: #173b40; } .spar-conf__video-heading > p:last-child, .spar-conf__video-points li p, .spar-conf__transcript-grid article p { color: #557176; } }#imCell_5 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHTMLObject_1726_05 { position: relative; align-self: start; justify-self: center; max-width: 100%; box-sizing: border-box; z-index: 3; } #imCellStyleGraphics_5 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imCellStyleBorders_5 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } /* ============================================================ H3 — VOCI, TELEVISIONE E MUSICA DEI VICINI Pagina: /isolamento-acustico-pareti-roma.html ============================================================ */ .spar-vtm, .spar-vtm *, .spar-vtm *::before, .spar-vtm *::after { box-sizing: border-box; } .spar-vtm { --spar-vtm-blue-dark: #07343b; --spar-vtm-blue-deep: #05282e; --spar-vtm-blue-medium: #0b5159; --spar-vtm-turquoise: #24bfc1; --spar-vtm-turquoise-light: #c7f1ef; --spar-vtm-orange: #ff8a2a; --spar-vtm-orange-dark: #d86812; --spar-vtm-green: #27ad68; --spar-vtm-green-dark: #19864f; --spar-vtm-white: #ffffff; --spar-vtm-cream: #fff8ed; --spar-vtm-light: #edf8f7; --spar-vtm-text: #173c41; --spar-vtm-muted: #557277; --spar-vtm-border: #d4e6e4; --spar-vtm-shadow: 0 20px 52px rgba(6, 52, 59, 0.1); position: relative; width: 100%; max-width: 100%; overflow: hidden; padding-block: clamp(65px, 8vw, 105px); background: radial-gradient( circle at 96% 7%, rgba(36, 191, 193, 0.11), transparent 28% ), radial-gradient( circle at 3% 92%, rgba(255, 138, 42, 0.09), transparent 25% ), #ffffff; color: var(--spar-vtm-text); } .spar-vtm h3, .spar-vtm h4, .spar-vtm p, .spar-vtm li, .spar-vtm span, .spar-vtm strong, .spar-vtm small, .spar-vtm a { max-width: 100%; white-space: normal; overflow-wrap: break-word; word-break: normal; } .spar-vtm__container { width: min(calc(100% - 40px), 1220px); max-width: 1220px; margin-inline: auto; } /* ============================================================ INTRODUZIONE ============================================================ */ .spar-vtm__header { width: min(100%, 940px); margin-inline: auto; text-align: center; } .spar-vtm__eyebrow, .spar-vtm__section-label { margin: 0 0 13px; color: var(--spar-vtm-orange-dark); font-size: 0.76rem; font-weight: 900; line-height: 1.4; letter-spacing: 0.08em; text-transform: uppercase; } .spar-vtm__title { margin: 0; color: var(--spar-vtm-blue-dark); font-family: inherit; font-size: clamp(2rem, 4.1vw, 3.45rem); font-weight: 900; line-height: 1.08; letter-spacing: -0.04em; text-wrap: balance; } .spar-vtm__direct-answer { margin: 25px auto 0; color: var(--spar-vtm-blue-dark); font-size: clamp(1.05rem, 1.45vw, 1.2rem); font-weight: 650; line-height: 1.7; } .spar-vtm__direct-answer strong { color: var(--spar-vtm-blue-dark); font-weight: 900; } .spar-vtm__intro { margin: 15px auto 0; color: var(--spar-vtm-muted); font-size: 1rem; line-height: 1.74; } /* ============================================================ RISPOSTA DIRETTA ============================================================ */ .spar-vtm__answer-box { display: grid; grid-template-columns: 76px minmax(0, 1fr); align-items: center; gap: 23px; width: min(100%, 1000px); margin: clamp(36px, 5vw, 56px) auto 0; padding: clamp(22px, 3vw, 33px); border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 22px; background: var(--spar-vtm-cream); box-shadow: var(--spar-vtm-shadow); } .spar-vtm__answer-icon { display: grid; place-items: center; width: 70px; height: 70px; border-radius: 20px; background: var(--spar-vtm-blue-dark); color: var(--spar-vtm-turquoise-light); } .spar-vtm__answer-icon svg { display: block; width: 42px; height: 42px; } .spar-vtm__answer-content { min-width: 0; } .spar-vtm__answer-label { margin: 0 0 6px; color: var(--spar-vtm-orange-dark); font-size: 0.72rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-vtm__answer-question { margin: 0 0 9px; color: var(--spar-vtm-blue-dark); font-size: clamp(1.2rem, 2vw, 1.6rem); font-weight: 900; line-height: 1.3; } .spar-vtm__answer-content > p:last-child { margin: 0; color: var(--spar-vtm-muted); font-size: 0.96rem; line-height: 1.68; } /* ============================================================ CARTE RUMORI ============================================================ */ .spar-vtm__noise-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin-top: clamp(40px, 5vw, 62px); } .spar-vtm__noise-card { position: relative; display: flex; min-width: 0; flex-direction: column; padding: clamp(22px, 2.5vw, 31px); border: 1px solid var(--spar-vtm-border); border-top: 5px solid var(--spar-vtm-blue-dark); border-radius: 20px; background: var(--spar-vtm-white); box-shadow: 0 14px 36px rgba(6, 52, 59, 0.08); } .spar-vtm__noise-card--teal { border-top-color: var(--spar-vtm-turquoise); } .spar-vtm__noise-card--orange { border-top-color: var(--spar-vtm-orange); } .spar-vtm__noise-top { display: flex; align-items: center; justify-content: space-between; gap: 15px; } .spar-vtm__noise-number { color: rgba(7, 52, 59, 0.23); font-size: 1.75rem; font-weight: 950; line-height: 1; } .spar-vtm__noise-icon { display: grid; flex: 0 0 48px; place-items: center; width: 48px; height: 48px; border-radius: 15px; background: var(--spar-vtm-light); color: var(--spar-vtm-blue-dark); } .spar-vtm__noise-icon svg { display: block; width: 27px; height: 27px; } .spar-vtm__noise-card h4 { margin: 21px 0 13px; color: var(--spar-vtm-blue-dark); font-size: clamp(1.22rem, 1.65vw, 1.45rem); font-weight: 900; line-height: 1.28; letter-spacing: -0.02em; } .spar-vtm__noise-card > p { margin: 0; color: var(--spar-vtm-muted); font-size: 0.93rem; line-height: 1.68; } .spar-vtm__noise-card > p + p { margin-top: 12px; } .spar-vtm__signal { display: grid; gap: 6px; margin-top: auto; padding: 15px; border-radius: 13px; background: var(--spar-vtm-light); } .spar-vtm__noise-card > p + .spar-vtm__signal { margin-top: 20px; } .spar-vtm__signal strong { color: var(--spar-vtm-orange-dark); font-size: 0.72rem; font-weight: 900; line-height: 1.3; letter-spacing: 0.055em; text-transform: uppercase; } .spar-vtm__signal span { color: var(--spar-vtm-blue-dark); font-size: 0.85rem; font-weight: 700; line-height: 1.52; } /* ============================================================ DIAGNOSI ============================================================ */ .spar-vtm__diagnosis { display: grid; grid-template-columns: minmax(0, 1.03fr) minmax(370px, 0.97fr); align-items: center; gap: clamp(35px, 5vw, 68px); margin-top: clamp(58px, 7vw, 88px); padding: clamp(28px, 4vw, 48px); border-radius: 25px; background: radial-gradient( circle at 93% 8%, rgba(36, 191, 193, 0.2), transparent 31% ), linear-gradient( 135deg, var(--spar-vtm-blue-deep), var(--spar-vtm-blue-dark) ); color: var(--spar-vtm-white); box-shadow: 0 24px 62px rgba(3, 35, 40, 0.2); } .spar-vtm__diagnosis-content { min-width: 0; } .spar-vtm__diagnosis .spar-vtm__section-label { color: var(--spar-vtm-orange); } .spar-vtm__diagnosis-content h4, .spar-vtm__warning h4, .spar-vtm__conversion h4 { margin: 0; font-size: clamp(1.65rem, 2.8vw, 2.4rem); font-weight: 900; line-height: 1.16; letter-spacing: -0.032em; text-wrap: balance; } .spar-vtm__diagnosis-content h4 { color: var(--spar-vtm-white); } .spar-vtm__diagnosis-content > p:not(.spar-vtm__section-label) { margin: 18px 0 0; color: rgba(255, 255, 255, 0.77); font-size: 0.97rem; line-height: 1.72; } .spar-vtm__diagnosis-content > p + p { margin-top: 12px; } .spar-vtm__diagnosis-highlight { padding: 15px 17px; border-left: 4px solid var(--spar-vtm-orange); border-radius: 0 12px 12px 0; background: rgba(255, 255, 255, 0.08); color: var(--spar-vtm-white) !important; font-weight: 750; } .spar-vtm__symptoms { display: grid; gap: 12px; min-width: 0; } .spar-vtm__symptom { display: grid; grid-template-columns: 48px minmax(0, 1fr); align-items: start; gap: 13px; min-width: 0; padding: 14px; border: 1px solid rgba(255, 255, 255, 0.13); border-radius: 14px; background: rgba(255, 255, 255, 0.07); } .spar-vtm__symptom-icon { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 13px; background: rgba(36, 191, 193, 0.15); color: var(--spar-vtm-turquoise-light); } .spar-vtm__symptom-icon svg { width: 26px; height: 26px; } .spar-vtm__symptom > div { min-width: 0; } .spar-vtm__symptom strong { display: block; color: var(--spar-vtm-white); font-size: 0.9rem; font-weight: 850; line-height: 1.35; } .spar-vtm__symptom p { margin: 5px 0 0; color: rgba(255, 255, 255, 0.68); font-size: 0.81rem; line-height: 1.52; } /* ============================================================ AVVISO TRASMISSIONI LATERALI ============================================================ */ .spar-vtm__warning { display: grid; grid-template-columns: 70px minmax(0, 1fr); align-items: center; gap: 22px; margin-top: clamp(40px, 5vw, 60px); padding: clamp(23px, 3vw, 34px); border: 1px solid rgba(255, 138, 42, 0.31); border-radius: 21px; background: #fff3e7; } .spar-vtm__warning-icon { display: grid; place-items: center; width: 66px; height: 66px; border-radius: 19px; background: var(--spar-vtm-orange); color: #321705; } .spar-vtm__warning-icon svg { width: 36px; height: 36px; } .spar-vtm__warning-content { min-width: 0; } .spar-vtm__warning-label { margin: 0 0 6px; color: var(--spar-vtm-orange-dark); font-size: 0.71rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-vtm__warning h4 { color: var(--spar-vtm-blue-dark); font-size: clamp(1.35rem, 2.2vw, 1.85rem); } .spar-vtm__warning-content > p:last-child { margin: 11px 0 0; color: var(--spar-vtm-muted); font-size: 0.94rem; line-height: 1.68; } /* ============================================================ CONVERSIONE ============================================================ */ .spar-vtm__conversion { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(330px, 0.92fr); align-items: center; gap: clamp(31px, 5vw, 66px); margin-top: clamp(52px, 7vw, 82px); padding: clamp(27px, 4vw, 47px); border: 1px solid rgba(36, 191, 193, 0.24); border-radius: 24px; background: var(--spar-vtm-cream); box-shadow: var(--spar-vtm-shadow); } .spar-vtm__conversion-content { min-width: 0; } .spar-vtm__conversion-label { margin: 0 0 12px; color: var(--spar-vtm-orange-dark); font-size: 0.74rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-vtm__conversion h4 { color: var(--spar-vtm-blue-dark); } .spar-vtm__conversion-content > p:not(.spar-vtm__conversion-label) { margin: 16px 0 0; color: var(--spar-vtm-muted); font-size: 0.96rem; line-height: 1.71; } .spar-vtm__conversion-content > p + p { margin-top: 11px; } .spar-vtm__actions { display: grid; gap: 11px; min-width: 0; } .spar-vtm__button { display: flex; min-width: 0; min-height: 58px; align-items: center; justify-content: center; gap: 10px; padding: 13px 17px; border: 2px solid transparent; border-radius: 12px; font-family: inherit; font-size: 0.91rem; font-weight: 850; line-height: 1.3; text-align: center; text-decoration: none; transition: transform 180ms ease, box-shadow 180ms ease, background-color 180ms ease, border-color 180ms ease; } .spar-vtm__button:hover { transform: translateY(-2px); } .spar-vtm__button:focus-visible { outline: 3px solid var(--spar-vtm-blue-dark); outline-offset: 4px; } .spar-vtm__button svg { flex: 0 0 23px; width: 23px; height: 23px; } .spar-vtm__button--primary { background: var(--spar-vtm-orange); color: #2c1504; box-shadow: 0 12px 27px rgba(255, 138, 42, 0.22); } .spar-vtm__button--primary:hover { background: #ff9b43; } .spar-vtm__button--whatsapp { background: var(--spar-vtm-green); color: var(--spar-vtm-white); box-shadow: 0 12px 27px rgba(39, 173, 104, 0.2); } .spar-vtm__button--whatsapp:hover { background: var(--spar-vtm-green-dark); } .spar-vtm__button--phone { border-color: rgba(7, 52, 59, 0.32); background: var(--spar-vtm-white); color: var(--spar-vtm-blue-dark); } .spar-vtm__button--phone:hover { border-color: var(--spar-vtm-turquoise); background: var(--spar-vtm-light); } .spar-vtm__phone-text { display: grid; min-width: 0; gap: 1px; text-align: left; } .spar-vtm__phone-text small { font-size: 0.64rem; font-weight: 750; line-height: 1.1; letter-spacing: 0.055em; text-transform: uppercase; } .spar-vtm__phone-text strong { color: inherit; font-size: 1rem; font-weight: 900; line-height: 1.15; } /* ============================================================ NOTEBOOK E TABLET ORIZZONTALE ============================================================ */ @media (max-width: 1080px) { .spar-vtm__noise-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-vtm__noise-card:last-child { grid-column: 1 / -1; } .spar-vtm__diagnosis, .spar-vtm__conversion { grid-template-columns: minmax(0, 1fr); } .spar-vtm__diagnosis-content, .spar-vtm__conversion-content { max-width: 850px; } .spar-vtm__symptoms { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-vtm__actions { grid-template-columns: repeat(3, minmax(0, 1fr)); } } /* ============================================================ TABLET ============================================================ */ @media (max-width: 780px) { .spar-vtm { padding-block: 60px 74px; } .spar-vtm__container { width: min(calc(100% - 32px), 720px); } .spar-vtm__answer-box { grid-template-columns: 61px minmax(0, 1fr); gap: 18px; } .spar-vtm__answer-icon { width: 59px; height: 59px; border-radius: 17px; } .spar-vtm__answer-icon svg { width: 35px; height: 35px; } .spar-vtm__noise-grid { grid-template-columns: minmax(0, 1fr); } .spar-vtm__noise-card:last-child { grid-column: auto; } .spar-vtm__symptoms { grid-template-columns: minmax(0, 1fr); } .spar-vtm__actions { grid-template-columns: minmax(0, 1fr); } } /* ============================================================ MOBILE ============================================================ */ @media (max-width: 560px) { .spar-vtm { padding-block: 50px 61px; } .spar-vtm__container { width: calc(100% - 28px); } .spar-vtm__header { text-align: left; } .spar-vtm__eyebrow, .spar-vtm__section-label { font-size: 0.68rem; letter-spacing: 0.06em; } .spar-vtm__title { font-size: clamp(1.9rem, 9.8vw, 2.7rem); line-height: 1.1; } .spar-vtm__direct-answer { margin-top: 20px; font-size: 0.99rem; line-height: 1.63; } .spar-vtm__intro { font-size: 0.92rem; line-height: 1.67; } .spar-vtm__answer-box { grid-template-columns: minmax(0, 1fr); align-items: start; gap: 15px; padding: 20px 17px; border-radius: 18px; } .spar-vtm__answer-icon { width: 53px; height: 53px; border-radius: 15px; } .spar-vtm__answer-question { font-size: 1.16rem; } .spar-vtm__answer-content > p:last-child { font-size: 0.9rem; } .spar-vtm__noise-card { padding: 21px 17px; border-radius: 17px; } .spar-vtm__noise-card h4 { font-size: 1.2rem; } .spar-vtm__noise-card > p { font-size: 0.9rem; line-height: 1.65; } .spar-vtm__signal { padding: 13px; } .spar-vtm__diagnosis { padding: 23px 17px; border-radius: 20px; } .spar-vtm__diagnosis-content h4, .spar-vtm__conversion h4 { font-size: clamp(1.5rem, 7.5vw, 1.95rem); line-height: 1.19; } .spar-vtm__diagnosis-content > p:not(.spar-vtm__section-label), .spar-vtm__conversion-content > p:not(.spar-vtm__conversion-label) { font-size: 0.91rem; line-height: 1.66; } .spar-vtm__symptom { grid-template-columns: 43px minmax(0, 1fr); gap: 11px; padding: 12px; } .spar-vtm__symptom-icon { width: 43px; height: 43px; border-radius: 12px; } .spar-vtm__symptom-icon svg { width: 24px; height: 24px; } .spar-vtm__warning { grid-template-columns: minmax(0, 1fr); align-items: start; gap: 15px; padding: 21px 17px; border-radius: 18px; } .spar-vtm__warning-icon { width: 54px; height: 54px; border-radius: 15px; } .spar-vtm__warning-icon svg { width: 31px; height: 31px; } .spar-vtm__warning h4 { font-size: 1.28rem; } .spar-vtm__warning-content > p:last-child { font-size: 0.9rem; line-height: 1.65; } .spar-vtm__conversion { padding: 22px 17px; border-radius: 19px; } .spar-vtm__button { width: 100%; min-height: 58px; padding-inline: 13px; font-size: 0.87rem; } } /* ============================================================ SMARTPHONE MOLTO STRETTI ============================================================ */ @media (max-width: 380px) { .spar-vtm__container { width: calc(100% - 22px); } .spar-vtm__title { font-size: 1.82rem; } .spar-vtm__noise-card, .spar-vtm__diagnosis, .spar-vtm__warning, .spar-vtm__conversion { padding-inline: 14px; } .spar-vtm__button { gap: 8px; padding-inline: 10px; font-size: 0.83rem; } .spar-vtm__button svg { flex-basis: 21px; width: 21px; height: 21px; } } /* ============================================================ ACCESSIBILITÀ ============================================================ */ @media (prefers-reduced-motion: reduce) { .spar-vtm__button { transition: none; } .spar-vtm__button:hover { transform: none; } } /* ============================================================ STAMPA ============================================================ */ @media print { .spar-vtm { padding: 30px 0; background: #ffffff; } .spar-vtm__diagnosis { border: 1px solid #ccdede; background: #ffffff; color: var(--spar-vtm-text); box-shadow: none; } .spar-vtm__diagnosis-content h4, .spar-vtm__symptom strong { color: var(--spar-vtm-text); } .spar-vtm__diagnosis-content > p:not(.spar-vtm__section-label), .spar-vtm__symptom p { color: var(--spar-vtm-muted); } .spar-vtm__actions { display: none; } }#imCell_6 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHTMLObject_1726_06 { position: relative; align-self: start; justify-self: center; max-width: 100%; box-sizing: border-box; z-index: 3; } #imCellStyleGraphics_6 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imCellStyleBorders_6 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } /* ============================================================ H3 — RUMORI TRA APPARTAMENTI CONFINANTI Pagina: /isolamento-acustico-pareti-roma.html ============================================================ */ .spar-rac, .spar-rac *, .spar-rac *::before, .spar-rac *::after { box-sizing: border-box; } .spar-rac { --spar-rac-blue-dark: #07343b; --spar-rac-blue-deep: #05282e; --spar-rac-blue-medium: #0b5159; --spar-rac-teal: #24bfc1; --spar-rac-teal-light: #c7f1ef; --spar-rac-orange: #ff8a2a; --spar-rac-orange-dark: #d86812; --spar-rac-green: #27ad68; --spar-rac-green-dark: #19864f; --spar-rac-white: #ffffff; --spar-rac-cream: #fff8ed; --spar-rac-light: #edf8f7; --spar-rac-text: #173c41; --spar-rac-muted: #557277; --spar-rac-border: #d4e6e4; --spar-rac-shadow: 0 20px 52px rgba(6, 52, 59, 0.1); position: relative; width: 100%; max-width: 100%; overflow: hidden; padding-block: clamp(66px, 8vw, 108px); background: radial-gradient( circle at 4% 10%, rgba(36, 191, 193, 0.11), transparent 27% ), radial-gradient( circle at 96% 91%, rgba(255, 138, 42, 0.09), transparent 25% ), var(--spar-rac-cream); color: var(--spar-rac-text); } .spar-rac h3, .spar-rac h4, .spar-rac h5, .spar-rac p, .spar-rac li, .spar-rac span, .spar-rac strong, .spar-rac small, .spar-rac a { max-width: 100%; white-space: normal; overflow-wrap: break-word; word-break: normal; } .spar-rac__container { width: min(calc(100% - 40px), 1220px); max-width: 1220px; margin-inline: auto; } /* ============================================================ INTRODUZIONE ============================================================ */ .spar-rac__header { width: min(100%, 940px); margin-inline: auto; text-align: center; } .spar-rac__eyebrow, .spar-rac__section-label { margin: 0 0 13px; color: var(--spar-rac-orange-dark); font-size: 0.76rem; font-weight: 900; line-height: 1.4; letter-spacing: 0.08em; text-transform: uppercase; } .spar-rac__title { margin: 0; color: var(--spar-rac-blue-dark); font-family: inherit; font-size: clamp(2rem, 4.1vw, 3.45rem); font-weight: 900; line-height: 1.08; letter-spacing: -0.04em; text-wrap: balance; } .spar-rac__direct-answer { margin: 25px auto 0; color: var(--spar-rac-blue-dark); font-size: clamp(1.05rem, 1.45vw, 1.2rem); font-weight: 650; line-height: 1.7; } .spar-rac__direct-answer strong { color: inherit; font-weight: 900; } .spar-rac__intro { margin: 15px auto 0; color: var(--spar-rac-muted); font-size: 1rem; line-height: 1.74; } /* ============================================================ DOMANDA PRINCIPALE ============================================================ */ .spar-rac__question-box { display: grid; grid-template-columns: 78px minmax(0, 1fr); align-items: center; gap: 23px; width: min(100%, 1000px); margin: clamp(36px, 5vw, 57px) auto 0; padding: clamp(23px, 3vw, 34px); border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 22px; background: var(--spar-rac-white); box-shadow: var(--spar-rac-shadow); } .spar-rac__question-icon { display: grid; place-items: center; width: 72px; height: 72px; border-radius: 20px; background: var(--spar-rac-blue-dark); color: var(--spar-rac-teal-light); } .spar-rac__question-icon svg { display: block; width: 43px; height: 43px; } .spar-rac__question-content { min-width: 0; } .spar-rac__question-label { margin: 0 0 7px; color: var(--spar-rac-orange-dark); font-size: 0.72rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-rac__question-content h4 { margin: 0; color: var(--spar-rac-blue-dark); font-size: clamp(1.22rem, 2vw, 1.62rem); font-weight: 900; line-height: 1.3; } .spar-rac__question-content > p:last-child { margin: 10px 0 0; color: var(--spar-rac-muted); font-size: 0.96rem; line-height: 1.68; } /* ============================================================ PERCORSI DEL RUMORE ============================================================ */ .spar-rac__routes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin-top: clamp(40px, 5vw, 62px); } .spar-rac__route { position: relative; display: flex; min-width: 0; flex-direction: column; padding: clamp(22px, 2.5vw, 31px); border: 1px solid var(--spar-rac-border); border-top: 5px solid var(--spar-rac-blue-dark); border-radius: 20px; background: var(--spar-rac-white); box-shadow: 0 14px 36px rgba(6, 52, 59, 0.08); } .spar-rac__route--teal { border-top-color: var(--spar-rac-teal); } .spar-rac__route--orange { border-top-color: var(--spar-rac-orange); } .spar-rac__route-header { display: flex; align-items: center; justify-content: space-between; gap: 15px; } .spar-rac__route-number { color: rgba(7, 52, 59, 0.23); font-size: 1.75rem; font-weight: 950; line-height: 1; } .spar-rac__route-icon { display: grid; flex: 0 0 48px; place-items: center; width: 48px; height: 48px; border-radius: 15px; background: var(--spar-rac-light); color: var(--spar-rac-blue-dark); } .spar-rac__route-icon svg { display: block; width: 27px; height: 27px; } .spar-rac__route h4 { margin: 21px 0 13px; color: var(--spar-rac-blue-dark); font-size: clamp(1.22rem, 1.65vw, 1.45rem); font-weight: 900; line-height: 1.28; letter-spacing: -0.02em; } .spar-rac__route > p { margin: 0; color: var(--spar-rac-muted); font-size: 0.93rem; line-height: 1.68; } .spar-rac__route > p + p { margin-top: 12px; } .spar-rac__route-note { display: grid; gap: 6px; margin-top: auto; padding: 15px; border-radius: 13px; background: var(--spar-rac-light); } .spar-rac__route > p + .spar-rac__route-note { margin-top: 20px; } .spar-rac__route-note strong { color: var(--spar-rac-orange-dark); font-size: 0.72rem; font-weight: 900; line-height: 1.3; letter-spacing: 0.055em; text-transform: uppercase; } .spar-rac__route-note span { color: var(--spar-rac-blue-dark); font-size: 0.85rem; font-weight: 700; line-height: 1.52; } /* ============================================================ SCHEMA APPARTAMENTI ============================================================ */ .spar-rac__scheme { display: grid; grid-template-columns: minmax(0, 0.93fr) minmax(430px, 1.07fr); align-items: center; gap: clamp(36px, 5vw, 68px); margin-top: clamp(58px, 7vw, 88px); } .spar-rac__scheme-content { min-width: 0; } .spar-rac__scheme-content h4, .spar-rac__evaluation-header h4, .spar-rac__method-heading h4, .spar-rac__conversion h4 { margin: 0; color: var(--spar-rac-blue-dark); font-size: clamp(1.65rem, 2.9vw, 2.42rem); font-weight: 900; line-height: 1.16; letter-spacing: -0.032em; text-wrap: balance; } .spar-rac__scheme-content > p:not(.spar-rac__section-label) { margin: 18px 0 0; color: var(--spar-rac-muted); font-size: 0.97rem; line-height: 1.72; } .spar-rac__scheme-content > p + p { margin-top: 12px; } .spar-rac__scheme-highlight { padding: 15px 17px; border-left: 4px solid var(--spar-rac-orange); border-radius: 0 12px 12px 0; background: #fff0e2; color: var(--spar-rac-blue-dark) !important; font-weight: 750; } /* ============================================================ GRAFICA APPARTAMENTI ============================================================ */ .spar-rac__building { position: relative; min-width: 0; padding: 55px 20px 28px; border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 22px; background: var(--spar-rac-white); box-shadow: var(--spar-rac-shadow); } .spar-rac__building-floor { display: flex; min-height: 38px; align-items: center; justify-content: center; padding: 8px 12px; border-radius: 9px; background: repeating-linear-gradient( 45deg, #cfdada, #cfdada 9px, #e2e8e8 9px, #e2e8e8 18px ); color: #3d5559; font-size: 0.7rem; font-weight: 900; line-height: 1.3; text-align: center; text-transform: uppercase; } .spar-rac__building-apartments { display: grid; grid-template-columns: minmax(0, 1fr) 64px minmax(0, 1fr); min-width: 0; min-height: 230px; } .spar-rac__building-home { display: flex; min-width: 0; align-items: center; justify-content: center; flex-direction: column; padding: 20px 15px; text-align: center; } .spar-rac__building-home--source { background: #fff0e2; color: #703507; } .spar-rac__building-home--protected { background: var(--spar-rac-light); color: var(--spar-rac-blue-dark); } .spar-rac__building-label { font-size: 0.73rem; font-weight: 900; line-height: 1.4; text-transform: uppercase; } .spar-rac__building-noise, .spar-rac__building-room { margin-top: 10px; font-size: 0.83rem; font-weight: 750; line-height: 1.4; } .spar-rac__building-speaker { display: grid; place-items: center; width: 58px; height: 58px; margin-top: 20px; border-radius: 17px; background: var(--spar-rac-orange); color: #321705; } .spar-rac__building-speaker svg { width: 34px; height: 34px; } .spar-rac__building-wall { position: relative; display: flex; min-width: 0; align-items: center; justify-content: center; border-inline: 2px solid #909fa1; background: repeating-linear-gradient( 45deg, #d8dfdf, #d8dfdf 8px, #c9d2d2 8px, #c9d2d2 16px ); } .spar-rac__building-wall > span:first-child { writing-mode: vertical-rl; transform: rotate(180deg); color: #3c5357; font-size: 0.67rem; font-weight: 900; line-height: 1.2; text-transform: uppercase; } .spar-rac__building-arrow--direct { position: absolute; right: -24px; z-index: 2; display: grid; place-items: center; width: 47px; height: 36px; border-radius: 999px; background: var(--spar-rac-orange); color: #321705; font-size: 1.35rem; font-weight: 900; } .spar-rac__building-side-arrow { position: absolute; left: 12%; z-index: 3; color: var(--spar-rac-blue-medium); font-size: 0.68rem; font-weight: 900; line-height: 1.3; letter-spacing: 0.03em; text-transform: uppercase; } .spar-rac__building-side-arrow--top { top: 22px; } .spar-rac__building-side-arrow--bottom { bottom: 69px; } .spar-rac__building-note { margin: 15px 0 0; color: var(--spar-rac-muted); font-size: 0.75rem; line-height: 1.5; text-align: center; } /* ============================================================ VALUTAZIONE ============================================================ */ .spar-rac__evaluation { margin-top: clamp(60px, 8vw, 94px); } .spar-rac__evaluation-header { width: min(100%, 850px); margin-inline: auto; text-align: center; } .spar-rac__evaluation-header > p:last-child { margin: 17px auto 0; color: var(--spar-rac-muted); font-size: 0.97rem; line-height: 1.72; } .spar-rac__evaluation-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 21px; margin-top: 34px; } .spar-rac__evaluation-card { min-width: 0; padding: clamp(23px, 3vw, 34px); border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 21px; background: var(--spar-rac-white); box-shadow: 0 14px 36px rgba(6, 52, 59, 0.08); } .spar-rac__evaluation-card--complex { border-color: rgba(255, 138, 42, 0.33); background: #fffaf5; } .spar-rac__evaluation-badge { display: inline-flex; width: fit-content; padding: 7px 11px; border-radius: 999px; background: var(--spar-rac-blue-dark); color: var(--spar-rac-white); font-size: 0.68rem; font-weight: 900; line-height: 1.3; letter-spacing: 0.055em; text-transform: uppercase; } .spar-rac__evaluation-card--complex .spar-rac__evaluation-badge { background: var(--spar-rac-orange); color: #321705; } .spar-rac__evaluation-card h5 { margin: 19px 0 0; color: var(--spar-rac-blue-dark); font-size: clamp(1.25rem, 2vw, 1.6rem); font-weight: 900; line-height: 1.28; letter-spacing: -0.02em; } .spar-rac__evaluation-card ul { display: grid; gap: 11px; margin: 20px 0 0; padding: 0; list-style: none; } .spar-rac__evaluation-card li { position: relative; padding-left: 27px; color: var(--spar-rac-muted); font-size: 0.91rem; line-height: 1.6; } .spar-rac__evaluation-card li::before { content: "✓"; position: absolute; top: 0; left: 0; display: grid; place-items: center; width: 19px; height: 19px; border-radius: 50%; background: var(--spar-rac-light); color: var(--spar-rac-blue-medium); font-size: 0.7rem; font-weight: 900; } .spar-rac__evaluation-card--complex li::before { background: #fff0e2; color: var(--spar-rac-orange-dark); } .spar-rac__evaluation-card > p:last-child { margin: 20px 0 0; padding-top: 16px; border-top: 1px solid var(--spar-rac-border); color: var(--spar-rac-blue-dark); font-size: 0.91rem; font-weight: 750; line-height: 1.62; } /* ============================================================ METODO ============================================================ */ .spar-rac__method { display: grid; grid-template-columns: minmax(0, 0.87fr) minmax(430px, 1.13fr); align-items: center; gap: clamp(35px, 5vw, 68px); margin-top: clamp(58px, 7vw, 88px); padding: clamp(28px, 4vw, 48px); border-radius: 25px; background: radial-gradient( circle at 94% 8%, rgba(36, 191, 193, 0.2), transparent 30% ), linear-gradient( 135deg, var(--spar-rac-blue-deep), var(--spar-rac-blue-dark) ); box-shadow: 0 24px 62px rgba(3, 35, 40, 0.2); } .spar-rac__method-heading { min-width: 0; } .spar-rac__method .spar-rac__section-label { color: var(--spar-rac-orange); } .spar-rac__method-heading h4 { color: var(--spar-rac-white); } .spar-rac__method-heading > p:last-child { margin: 17px 0 0; color: rgba(255, 255, 255, 0.74); font-size: 0.96rem; line-height: 1.7; } .spar-rac__method-list { display: grid; gap: 12px; min-width: 0; margin: 0; padding: 0; list-style: none; } .spar-rac__method-list li { display: grid; grid-template-columns: 42px minmax(0, 1fr); align-items: start; gap: 13px; min-width: 0; padding: 14px; border: 1px solid rgba(255, 255, 255, 0.13); border-radius: 14px; background: rgba(255, 255, 255, 0.07); } .spar-rac__method-list li > span { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: rgba(36, 191, 193, 0.16); color: var(--spar-rac-teal-light); font-size: 0.76rem; font-weight: 900; } .spar-rac__method-list li > div { min-width: 0; } .spar-rac__method-list strong { display: block; color: var(--spar-rac-white); font-size: 0.91rem; font-weight: 850; line-height: 1.35; } .spar-rac__method-list p { margin: 5px 0 0; color: rgba(255, 255, 255, 0.67); font-size: 0.81rem; line-height: 1.53; } /* ============================================================ CTA ============================================================ */ .spar-rac__conversion { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(330px, 0.92fr); align-items: center; gap: clamp(31px, 5vw, 66px); margin-top: clamp(53px, 7vw, 84px); padding: clamp(27px, 4vw, 47px); border: 1px solid rgba(36, 191, 193, 0.24); border-radius: 24px; background: var(--spar-rac-white); box-shadow: var(--spar-rac-shadow); } .spar-rac__conversion-content { min-width: 0; } .spar-rac__conversion-label { margin: 0 0 12px; color: var(--spar-rac-orange-dark); font-size: 0.74rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-rac__conversion-content > p:not(.spar-rac__conversion-label) { margin: 16px 0 0; color: var(--spar-rac-muted); font-size: 0.96rem; line-height: 1.71; } .spar-rac__conversion-content > p + p { margin-top: 11px; } .spar-rac__actions { display: grid; gap: 11px; min-width: 0; } .spar-rac__button { display: flex; min-width: 0; min-height: 58px; align-items: center; justify-content: center; gap: 10px; padding: 13px 17px; border: 2px solid transparent; border-radius: 12px; font-family: inherit; font-size: 0.91rem; font-weight: 850; line-height: 1.3; text-align: center; text-decoration: none; transition: transform 180ms ease, box-shadow 180ms ease, background-color 180ms ease, border-color 180ms ease; } .spar-rac__button:hover { transform: translateY(-2px); } .spar-rac__button:focus-visible { outline: 3px solid var(--spar-rac-blue-dark); outline-offset: 4px; } .spar-rac__button svg { flex: 0 0 23px; width: 23px; height: 23px; } .spar-rac__button--primary { background: var(--spar-rac-orange); color: #2c1504; box-shadow: 0 12px 27px rgba(255, 138, 42, 0.22); } .spar-rac__button--primary:hover { background: #ff9b43; } .spar-rac__button--whatsapp { background: var(--spar-rac-green); color: var(--spar-rac-white); box-shadow: 0 12px 27px rgba(39, 173, 104, 0.2); } .spar-rac__button--whatsapp:hover { background: var(--spar-rac-green-dark); } .spar-rac__button--phone { border-color: rgba(7, 52, 59, 0.32); background: var(--spar-rac-white); color: var(--spar-rac-blue-dark); } .spar-rac__button--phone:hover { border-color: var(--spar-rac-teal); background: var(--spar-rac-light); } .spar-rac__phone-text { display: grid; min-width: 0; gap: 1px; text-align: left; } .spar-rac__phone-text small { font-size: 0.64rem; font-weight: 750; line-height: 1.1; letter-spacing: 0.055em; text-transform: uppercase; } .spar-rac__phone-text strong { color: inherit; font-size: 1rem; font-weight: 900; line-height: 1.15; } /* ============================================================ NOTEBOOK E TABLET ORIZZONTALE ============================================================ */ @media (max-width: 1080px) { .spar-rac__routes { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-rac__route:last-child { grid-column: 1 / -1; } .spar-rac__scheme, .spar-rac__method, .spar-rac__conversion { grid-template-columns: minmax(0, 1fr); } .spar-rac__scheme-content, .spar-rac__method-heading, .spar-rac__conversion-content { max-width: 850px; } .spar-rac__building { max-width: 850px; } .spar-rac__actions { grid-template-columns: repeat(3, minmax(0, 1fr)); } } /* ============================================================ TABLET ============================================================ */ @media (max-width: 780px) { .spar-rac { padding-block: 60px 74px; } .spar-rac__container { width: min(calc(100% - 32px), 720px); } .spar-rac__question-box { grid-template-columns: 62px minmax(0, 1fr); gap: 18px; } .spar-rac__question-icon { width: 60px; height: 60px; border-radius: 17px; } .spar-rac__question-icon svg { width: 36px; height: 36px; } .spar-rac__routes, .spar-rac__evaluation-grid { grid-template-columns: minmax(0, 1fr); } .spar-rac__route:last-child { grid-column: auto; } .spar-rac__actions { grid-template-columns: minmax(0, 1fr); } } /* ============================================================ MOBILE ============================================================ */ @media (max-width: 560px) { .spar-rac { padding-block: 50px 62px; } .spar-rac__container { width: calc(100% - 28px); } .spar-rac__header, .spar-rac__evaluation-header { text-align: left; } .spar-rac__eyebrow, .spar-rac__section-label { font-size: 0.68rem; letter-spacing: 0.06em; } .spar-rac__title { font-size: clamp(1.9rem, 9.8vw, 2.7rem); line-height: 1.1; } .spar-rac__direct-answer { margin-top: 20px; font-size: 0.99rem; line-height: 1.63; } .spar-rac__intro { font-size: 0.92rem; line-height: 1.67; } .spar-rac__question-box { grid-template-columns: minmax(0, 1fr); align-items: start; gap: 15px; padding: 20px 17px; border-radius: 18px; } .spar-rac__question-icon { width: 53px; height: 53px; border-radius: 15px; } .spar-rac__question-content h4 { font-size: 1.16rem; } .spar-rac__question-content > p:last-child { font-size: 0.9rem; } .spar-rac__route { padding: 21px 17px; border-radius: 17px; } .spar-rac__route h4 { font-size: 1.2rem; } .spar-rac__route > p { font-size: 0.9rem; line-height: 1.65; } .spar-rac__scheme-content h4, .spar-rac__evaluation-header h4, .spar-rac__method-heading h4, .spar-rac__conversion h4 { font-size: clamp(1.5rem, 7.5vw, 1.95rem); line-height: 1.19; } .spar-rac__scheme-content > p:not(.spar-rac__section-label), .spar-rac__evaluation-header > p:last-child, .spar-rac__method-heading > p:last-child, .spar-rac__conversion-content > p:not(.spar-rac__conversion-label) { font-size: 0.91rem; line-height: 1.66; } .spar-rac__building { padding: 48px 14px 22px; border-radius: 18px; } .spar-rac__building-apartments { grid-template-columns: minmax(0, 1fr); min-height: auto; } .spar-rac__building-home { min-height: 150px; padding: 18px 12px; } .spar-rac__building-wall { min-height: 60px; border: 2px solid #909fa1; } .spar-rac__building-wall > span:first-child { writing-mode: horizontal-tb; transform: none; } .spar-rac__building-arrow--direct { right: 50%; bottom: -18px; transform: translateX(50%) rotate(90deg); } .spar-rac__building-side-arrow { display: none; } .spar-rac__evaluation-card { padding: 21px 17px; border-radius: 18px; } .spar-rac__evaluation-card h5 { font-size: 1.2rem; } .spar-rac__evaluation-card li, .spar-rac__evaluation-card > p:last-child { font-size: 0.88rem; } .spar-rac__method { padding: 23px 17px; border-radius: 20px; } .spar-rac__method-list li { grid-template-columns: 38px minmax(0, 1fr); gap: 10px; padding: 12px; } .spar-rac__method-list li > span { width: 38px; height: 38px; } .spar-rac__conversion { padding: 22px 17px; border-radius: 19px; } .spar-rac__button { width: 100%; min-height: 58px; padding-inline: 13px; font-size: 0.87rem; } } /* ============================================================ SMARTPHONE MOLTO STRETTI ============================================================ */ @media (max-width: 380px) { .spar-rac__container { width: calc(100% - 22px); } .spar-rac__title { font-size: 1.82rem; } .spar-rac__route, .spar-rac__building, .spar-rac__evaluation-card, .spar-rac__method, .spar-rac__conversion { padding-inline: 14px; } .spar-rac__button { gap: 8px; padding-inline: 10px; font-size: 0.83rem; } .spar-rac__button svg { flex-basis: 21px; width: 21px; height: 21px; } } /* ============================================================ ACCESSIBILITÀ ============================================================ */ @media (prefers-reduced-motion: reduce) { .spar-rac__button { transition: none; } .spar-rac__button:hover { transform: none; } } /* ============================================================ STAMPA ============================================================ */ @media print { .spar-rac { padding: 30px 0; background: #ffffff; } .spar-rac__method { border: 1px solid #ccdede; background: #ffffff; box-shadow: none; } .spar-rac__method-heading h4, .spar-rac__method-list strong { color: var(--spar-rac-text); } .spar-rac__method-heading > p:last-child, .spar-rac__method-list p { color: var(--spar-rac-muted); } .spar-rac__actions { display: none; } }#imCell_7 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHTMLObject_1726_07 { position: relative; align-self: start; justify-self: center; max-width: 100%; box-sizing: border-box; z-index: 3; } #imCellStyleGraphics_7 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imCellStyleBorders_7 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } /* ============================================================ H3 — PARETI INTERNE GIÀ ESISTENTI Pagina: /isolamento-acustico-pareti-roma.html ============================================================ */ .spar-pie, .spar-pie *, .spar-pie *::before, .spar-pie *::after { box-sizing: border-box; } .spar-pie { --spar-pie-blue-dark: #07343b; --spar-pie-blue-deep: #05282e; --spar-pie-blue-medium: #0b5159; --spar-pie-teal: #24bfc1; --spar-pie-teal-light: #c7f1ef; --spar-pie-orange: #ff8a2a; --spar-pie-orange-dark: #d86812; --spar-pie-green: #27ad68; --spar-pie-green-dark: #19864f; --spar-pie-white: #ffffff; --spar-pie-cream: #fff8ed; --spar-pie-light: #edf8f7; --spar-pie-text: #173c41; --spar-pie-muted: #557277; --spar-pie-border: #d4e6e4; --spar-pie-shadow: 0 20px 52px rgba(6, 52, 59, 0.1); position: relative; width: 100%; max-width: 100%; overflow: hidden; padding-block: clamp(66px, 8vw, 108px); background: radial-gradient( circle at 96% 8%, rgba(36, 191, 193, 0.11), transparent 27% ), radial-gradient( circle at 3% 92%, rgba(255, 138, 42, 0.09), transparent 25% ), #ffffff; color: var(--spar-pie-text); } .spar-pie h3, .spar-pie h4, .spar-pie h5, .spar-pie p, .spar-pie li, .spar-pie span, .spar-pie strong, .spar-pie small, .spar-pie a { max-width: 100%; white-space: normal; overflow-wrap: break-word; word-break: normal; } .spar-pie__container { width: min(calc(100% - 40px), 1220px); max-width: 1220px; margin-inline: auto; } /* ============================================================ INTRODUZIONE ============================================================ */ .spar-pie__header { width: min(100%, 940px); margin-inline: auto; text-align: center; } .spar-pie__eyebrow, .spar-pie__section-label { margin: 0 0 13px; color: var(--spar-pie-orange-dark); font-size: 0.76rem; font-weight: 900; line-height: 1.4; letter-spacing: 0.08em; text-transform: uppercase; } .spar-pie__title { margin: 0; color: var(--spar-pie-blue-dark); font-family: inherit; font-size: clamp(2rem, 4.1vw, 3.45rem); font-weight: 900; line-height: 1.08; letter-spacing: -0.04em; text-wrap: balance; } .spar-pie__direct-answer { margin: 25px auto 0; color: var(--spar-pie-blue-dark); font-size: clamp(1.05rem, 1.45vw, 1.2rem); font-weight: 650; line-height: 1.7; } .spar-pie__direct-answer strong { color: inherit; font-weight: 900; } .spar-pie__intro { margin: 15px auto 0; color: var(--spar-pie-muted); font-size: 1rem; line-height: 1.74; } /* ============================================================ RISPOSTA IMMEDIATA ============================================================ */ .spar-pie__answer { display: grid; grid-template-columns: 78px minmax(0, 1fr); align-items: center; gap: 23px; width: min(100%, 1000px); margin: clamp(36px, 5vw, 57px) auto 0; padding: clamp(23px, 3vw, 34px); border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 22px; background: var(--spar-pie-cream); box-shadow: var(--spar-pie-shadow); } .spar-pie__answer-icon { display: grid; place-items: center; width: 72px; height: 72px; border-radius: 20px; background: var(--spar-pie-blue-dark); color: var(--spar-pie-teal-light); } .spar-pie__answer-icon svg { display: block; width: 43px; height: 43px; } .spar-pie__answer-content { min-width: 0; } .spar-pie__answer-label { margin: 0 0 7px; color: var(--spar-pie-orange-dark); font-size: 0.72rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-pie__answer-content h4 { margin: 0; color: var(--spar-pie-blue-dark); font-size: clamp(1.22rem, 2vw, 1.62rem); font-weight: 900; line-height: 1.3; } .spar-pie__answer-content > p:last-child { margin: 10px 0 0; color: var(--spar-pie-muted); font-size: 0.96rem; line-height: 1.68; } /* ============================================================ TIPOLOGIE DI PARETE ============================================================ */ .spar-pie__walls { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin-top: clamp(40px, 5vw, 62px); } .spar-pie__wall-card { position: relative; display: flex; min-width: 0; flex-direction: column; padding: clamp(22px, 2.5vw, 31px); border: 1px solid var(--spar-pie-border); border-top: 5px solid var(--spar-pie-blue-dark); border-radius: 20px; background: var(--spar-pie-white); box-shadow: 0 14px 36px rgba(6, 52, 59, 0.08); } .spar-pie__wall-card--teal { border-top-color: var(--spar-pie-teal); } .spar-pie__wall-card--orange { border-top-color: var(--spar-pie-orange); } .spar-pie__wall-top { display: flex; align-items: center; justify-content: space-between; gap: 15px; } .spar-pie__wall-number { color: rgba(7, 52, 59, 0.23); font-size: 1.75rem; font-weight: 950; line-height: 1; } .spar-pie__wall-icon { display: grid; flex: 0 0 48px; place-items: center; width: 48px; height: 48px; border-radius: 15px; background: var(--spar-pie-light); color: var(--spar-pie-blue-dark); } .spar-pie__wall-icon svg { display: block; width: 27px; height: 27px; } .spar-pie__wall-card h4 { margin: 21px 0 13px; color: var(--spar-pie-blue-dark); font-size: clamp(1.22rem, 1.65vw, 1.45rem); font-weight: 900; line-height: 1.28; letter-spacing: -0.02em; } .spar-pie__wall-card > p { margin: 0; color: var(--spar-pie-muted); font-size: 0.93rem; line-height: 1.68; } .spar-pie__wall-card > p + p { margin-top: 12px; } .spar-pie__wall-note { display: grid; gap: 6px; margin-top: auto; padding: 15px; border-radius: 13px; background: var(--spar-pie-light); } .spar-pie__wall-card > p + .spar-pie__wall-note { margin-top: 20px; } .spar-pie__wall-note strong { color: var(--spar-pie-orange-dark); font-size: 0.72rem; font-weight: 900; line-height: 1.3; letter-spacing: 0.055em; text-transform: uppercase; } .spar-pie__wall-note span { color: var(--spar-pie-blue-dark); font-size: 0.85rem; font-weight: 700; line-height: 1.52; } /* ============================================================ INTERVENTO E SCHEMA ============================================================ */ .spar-pie__intervention { display: grid; grid-template-columns: minmax(0, 0.93fr) minmax(430px, 1.07fr); align-items: center; gap: clamp(36px, 5vw, 68px); margin-top: clamp(58px, 7vw, 88px); } .spar-pie__intervention-content { min-width: 0; } .spar-pie__intervention-content h4, .spar-pie__elements-header h4, .spar-pie__space h4, .spar-pie__mistakes-content h4, .spar-pie__process-header h4, .spar-pie__conversion h4 { margin: 0; color: var(--spar-pie-blue-dark); font-size: clamp(1.65rem, 2.9vw, 2.42rem); font-weight: 900; line-height: 1.16; letter-spacing: -0.032em; text-wrap: balance; } .spar-pie__intervention-content > p:not(.spar-pie__section-label) { margin: 18px 0 0; color: var(--spar-pie-muted); font-size: 0.97rem; line-height: 1.72; } .spar-pie__intervention-content > p + p { margin-top: 12px; } .spar-pie__intervention-highlight { padding: 15px 17px; border-left: 4px solid var(--spar-pie-orange); border-radius: 0 12px 12px 0; background: #fff0e2; color: var(--spar-pie-blue-dark) !important; font-weight: 750; } .spar-pie__layers { display: grid; grid-template-columns: minmax(90px, 1fr) minmax(54px, 0.48fr) minmax(78px, 0.68fr) minmax(160px, 1.42fr) minmax(90px, 1fr); align-items: stretch; gap: 8px; min-width: 0; padding: 20px; border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 22px; background: var(--spar-pie-white); box-shadow: var(--spar-pie-shadow); } .spar-pie__layer { display: flex; min-width: 0; min-height: 230px; align-items: center; justify-content: center; flex-direction: column; padding: 13px; border-radius: 13px; text-align: center; } .spar-pie__layer--source { background: #fff0e2; color: #703507; } .spar-pie__layer--wall { border: 2px solid #9ca9ab; background: repeating-linear-gradient( 45deg, #e0e6e6, #e0e6e6 9px, #cfd8d8 9px, #cfd8d8 18px ); color: #40575b; } .spar-pie__layer--gap { border: 1px dashed var(--spar-pie-teal); background: var(--spar-pie-light); color: var(--spar-pie-blue-medium); } .spar-pie__layer--system { gap: 9px; border: 2px solid var(--spar-pie-blue-dark); background: #e2f5f4; color: var(--spar-pie-blue-dark); } .spar-pie__layer--room { background: var(--spar-pie-blue-dark); color: var(--spar-pie-white); } .spar-pie__layer > span { font-size: 0.7rem; font-weight: 900; line-height: 1.35; text-transform: uppercase; } .spar-pie__layer--source strong { margin-top: 10px; color: inherit; font-size: 0.87rem; line-height: 1.4; } .spar-pie__layer--wall span, .spar-pie__layer--gap span { writing-mode: vertical-rl; transform: rotate(180deg); } .spar-pie__layer--system ul { display: grid; gap: 7px; width: 100%; margin: 5px 0 0; padding: 0; list-style: none; } .spar-pie__layer--system li { padding: 7px; border-radius: 8px; background: var(--spar-pie-white); font-size: 0.7rem; font-weight: 750; line-height: 1.3; } .spar-pie__layers-note { grid-column: 1 / -1; margin: 6px 0 0; color: var(--spar-pie-muted); font-size: 0.76rem; line-height: 1.5; text-align: center; } /* ============================================================ ELEMENTI PRESENTI ============================================================ */ .spar-pie__elements { margin-top: clamp(60px, 8vw, 94px); } .spar-pie__elements-header { width: min(100%, 850px); margin-inline: auto; text-align: center; } .spar-pie__elements-header > p:last-child { margin: 17px auto 0; color: var(--spar-pie-muted); font-size: 0.97rem; line-height: 1.72; } .spar-pie__elements-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 17px; margin-top: 33px; } .spar-pie__element { min-width: 0; padding: 22px; border: 1px solid var(--spar-pie-border); border-radius: 18px; background: var(--spar-pie-white); box-shadow: 0 12px 30px rgba(6, 52, 59, 0.07); } .spar-pie__element-icon { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 14px; background: var(--spar-pie-light); color: var(--spar-pie-blue-dark); } .spar-pie__element-icon svg { width: 27px; height: 27px; } .spar-pie__element h5 { margin: 17px 0 0; color: var(--spar-pie-blue-dark); font-size: 1.05rem; font-weight: 900; line-height: 1.35; } .spar-pie__element p { margin: 10px 0 0; color: var(--spar-pie-muted); font-size: 0.87rem; line-height: 1.62; } /* ============================================================ SPAZIO ============================================================ */ .spar-pie__space { display: grid; grid-template-columns: 74px minmax(0, 1fr); align-items: center; gap: 23px; margin-top: clamp(44px, 6vw, 68px); padding: clamp(24px, 3vw, 35px); border: 1px solid rgba(255, 138, 42, 0.31); border-radius: 21px; background: #fff3e7; } .spar-pie__space-icon { display: grid; place-items: center; width: 70px; height: 70px; border-radius: 20px; background: var(--spar-pie-orange); color: #321705; } .spar-pie__space-icon svg { width: 41px; height: 41px; } .spar-pie__space-content { min-width: 0; } .spar-pie__space-label { margin: 0 0 7px; color: var(--spar-pie-orange-dark); font-size: 0.72rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-pie__space h4 { font-size: clamp(1.35rem, 2.2vw, 1.88rem); } .spar-pie__space-content > p:not(.spar-pie__space-label) { margin: 11px 0 0; color: var(--spar-pie-muted); font-size: 0.94rem; line-height: 1.68; } .spar-pie__space-content > p + p { margin-top: 10px; } /* ============================================================ ERRORI ============================================================ */ .spar-pie__mistakes { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(420px, 1.1fr); align-items: center; gap: clamp(35px, 5vw, 68px); margin-top: clamp(58px, 7vw, 88px); padding: clamp(28px, 4vw, 48px); border-radius: 25px; background: radial-gradient( circle at 94% 8%, rgba(36, 191, 193, 0.2), transparent 30% ), linear-gradient( 135deg, var(--spar-pie-blue-deep), var(--spar-pie-blue-dark) ); box-shadow: 0 24px 62px rgba(3, 35, 40, 0.2); } .spar-pie__mistakes-content { min-width: 0; } .spar-pie__mistakes .spar-pie__section-label { color: var(--spar-pie-orange); } .spar-pie__mistakes-content h4 { color: var(--spar-pie-white); } .spar-pie__mistakes-content > p:not(.spar-pie__section-label) { margin: 17px 0 0; color: rgba(255, 255, 255, 0.74); font-size: 0.96rem; line-height: 1.7; } .spar-pie__mistakes-content > p + p { margin-top: 11px; } .spar-pie__mistakes-list { display: grid; gap: 12px; min-width: 0; margin: 0; padding: 0; list-style: none; } .spar-pie__mistakes-list li { display: grid; grid-template-columns: 40px minmax(0, 1fr); align-items: start; gap: 12px; min-width: 0; padding: 14px; border: 1px solid rgba(255, 255, 255, 0.13); border-radius: 14px; background: rgba(255, 255, 255, 0.07); } .spar-pie__mistakes-list li > span { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: rgba(255, 138, 42, 0.16); color: var(--spar-pie-orange); font-size: 1.1rem; font-weight: 900; } .spar-pie__mistakes-list li > div { min-width: 0; } .spar-pie__mistakes-list strong { display: block; color: var(--spar-pie-white); font-size: 0.9rem; font-weight: 850; line-height: 1.35; } .spar-pie__mistakes-list p { margin: 5px 0 0; color: rgba(255, 255, 255, 0.67); font-size: 0.8rem; line-height: 1.53; } /* ============================================================ PROCESSO ============================================================ */ .spar-pie__process { margin-top: clamp(60px, 8vw, 94px); } .spar-pie__process-header { width: min(100%, 850px); margin-inline: auto; text-align: center; } .spar-pie__process-header > p:last-child { margin: 17px auto 0; color: var(--spar-pie-muted); font-size: 0.97rem; line-height: 1.72; } .spar-pie__process-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin: 33px 0 0; padding: 0; list-style: none; } .spar-pie__process-list li { min-width: 0; padding: 22px; border: 1px solid var(--spar-pie-border); border-radius: 18px; background: var(--spar-pie-white); box-shadow: 0 12px 30px rgba(6, 52, 59, 0.07); } .spar-pie__process-number { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; background: var(--spar-pie-blue-dark); color: var(--spar-pie-teal-light); font-size: 0.8rem; font-weight: 900; } .spar-pie__process-list strong { display: block; margin-top: 17px; color: var(--spar-pie-blue-dark); font-size: 0.95rem; font-weight: 900; line-height: 1.4; } .spar-pie__process-list p { margin: 8px 0 0; color: var(--spar-pie-muted); font-size: 0.84rem; line-height: 1.58; } /* ============================================================ CTA ============================================================ */ .spar-pie__conversion { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(330px, 0.92fr); align-items: center; gap: clamp(31px, 5vw, 66px); margin-top: clamp(53px, 7vw, 84px); padding: clamp(27px, 4vw, 47px); border: 1px solid rgba(36, 191, 193, 0.24); border-radius: 24px; background: var(--spar-pie-cream); box-shadow: var(--spar-pie-shadow); } .spar-pie__conversion-content { min-width: 0; } .spar-pie__conversion-label { margin: 0 0 12px; color: var(--spar-pie-orange-dark); font-size: 0.74rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-pie__conversion-content > p:not(.spar-pie__conversion-label) { margin: 16px 0 0; color: var(--spar-pie-muted); font-size: 0.96rem; line-height: 1.71; } .spar-pie__conversion-content > p + p { margin-top: 11px; } .spar-pie__actions { display: grid; gap: 11px; min-width: 0; } .spar-pie__button { display: flex; min-width: 0; min-height: 58px; align-items: center; justify-content: center; gap: 10px; padding: 13px 17px; border: 2px solid transparent; border-radius: 12px; font-family: inherit; font-size: 0.91rem; font-weight: 850; line-height: 1.3; text-align: center; text-decoration: none; transition: transform 180ms ease, box-shadow 180ms ease, background-color 180ms ease, border-color 180ms ease; } .spar-pie__button:hover { transform: translateY(-2px); } .spar-pie__button:focus-visible { outline: 3px solid var(--spar-pie-blue-dark); outline-offset: 4px; } .spar-pie__button svg { flex: 0 0 23px; width: 23px; height: 23px; } .spar-pie__button--primary { background: var(--spar-pie-orange); color: #2c1504; box-shadow: 0 12px 27px rgba(255, 138, 42, 0.22); } .spar-pie__button--primary:hover { background: #ff9b43; } .spar-pie__button--whatsapp { background: var(--spar-pie-green); color: var(--spar-pie-white); box-shadow: 0 12px 27px rgba(39, 173, 104, 0.2); } .spar-pie__button--whatsapp:hover { background: var(--spar-pie-green-dark); } .spar-pie__button--phone { border-color: rgba(7, 52, 59, 0.32); background: var(--spar-pie-white); color: var(--spar-pie-blue-dark); } .spar-pie__button--phone:hover { border-color: var(--spar-pie-teal); background: var(--spar-pie-light); } .spar-pie__phone-text { display: grid; min-width: 0; gap: 1px; text-align: left; } .spar-pie__phone-text small { font-size: 0.64rem; font-weight: 750; line-height: 1.1; letter-spacing: 0.055em; text-transform: uppercase; } .spar-pie__phone-text strong { color: inherit; font-size: 1rem; font-weight: 900; line-height: 1.15; } /* ============================================================ NOTEBOOK E TABLET ORIZZONTALE ============================================================ */ @media (max-width: 1080px) { .spar-pie__walls { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-pie__wall-card:last-child { grid-column: 1 / -1; } .spar-pie__intervention, .spar-pie__mistakes, .spar-pie__conversion { grid-template-columns: minmax(0, 1fr); } .spar-pie__elements-grid, .spar-pie__process-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-pie__intervention-content, .spar-pie__mistakes-content, .spar-pie__conversion-content { max-width: 850px; } .spar-pie__layers { max-width: 850px; } .spar-pie__actions { grid-template-columns: repeat(3, minmax(0, 1fr)); } } /* ============================================================ TABLET ============================================================ */ @media (max-width: 780px) { .spar-pie { padding-block: 60px 74px; } .spar-pie__container { width: min(calc(100% - 32px), 720px); } .spar-pie__answer { grid-template-columns: 62px minmax(0, 1fr); gap: 18px; } .spar-pie__answer-icon { width: 60px; height: 60px; border-radius: 17px; } .spar-pie__answer-icon svg { width: 36px; height: 36px; } .spar-pie__walls { grid-template-columns: minmax(0, 1fr); } .spar-pie__wall-card:last-child { grid-column: auto; } .spar-pie__elements-grid, .spar-pie__process-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-pie__actions { grid-template-columns: minmax(0, 1fr); } } /* ============================================================ MOBILE ============================================================ */ @media (max-width: 560px) { .spar-pie { padding-block: 50px 62px; } .spar-pie__container { width: calc(100% - 28px); } .spar-pie__header, .spar-pie__elements-header, .spar-pie__process-header { text-align: left; } .spar-pie__eyebrow, .spar-pie__section-label { font-size: 0.68rem; letter-spacing: 0.06em; } .spar-pie__title { font-size: clamp(1.9rem, 9.8vw, 2.7rem); line-height: 1.1; } .spar-pie__direct-answer { margin-top: 20px; font-size: 0.99rem; line-height: 1.63; } .spar-pie__intro { font-size: 0.92rem; line-height: 1.67; } .spar-pie__answer { grid-template-columns: minmax(0, 1fr); align-items: start; gap: 15px; padding: 20px 17px; border-radius: 18px; } .spar-pie__answer-icon { width: 53px; height: 53px; border-radius: 15px; } .spar-pie__answer-content h4 { font-size: 1.16rem; } .spar-pie__answer-content > p:last-child { font-size: 0.9rem; } .spar-pie__wall-card { padding: 21px 17px; border-radius: 17px; } .spar-pie__wall-card h4 { font-size: 1.2rem; } .spar-pie__wall-card > p { font-size: 0.9rem; line-height: 1.65; } .spar-pie__intervention-content h4, .spar-pie__elements-header h4, .spar-pie__mistakes-content h4, .spar-pie__process-header h4, .spar-pie__conversion h4 { font-size: clamp(1.5rem, 7.5vw, 1.95rem); line-height: 1.19; } .spar-pie__intervention-content > p:not(.spar-pie__section-label), .spar-pie__elements-header > p:last-child, .spar-pie__mistakes-content > p:not(.spar-pie__section-label), .spar-pie__process-header > p:last-child, .spar-pie__conversion-content > p:not(.spar-pie__conversion-label) { font-size: 0.91rem; line-height: 1.66; } .spar-pie__layers { grid-template-columns: minmax(0, 1fr); padding: 17px; gap: 9px; } .spar-pie__layer { min-height: auto; padding: 15px; } .spar-pie__layer--wall span, .spar-pie__layer--gap span { writing-mode: horizontal-tb; transform: none; } .spar-pie__layers-note { grid-column: auto; } .spar-pie__elements-grid, .spar-pie__process-list { grid-template-columns: minmax(0, 1fr); } .spar-pie__element, .spar-pie__process-list li { padding: 19px 17px; border-radius: 16px; } .spar-pie__space { grid-template-columns: minmax(0, 1fr); align-items: start; gap: 15px; padding: 21px 17px; border-radius: 18px; } .spar-pie__space-icon { width: 54px; height: 54px; border-radius: 15px; } .spar-pie__space-icon svg { width: 31px; height: 31px; } .spar-pie__space h4 { font-size: 1.28rem; } .spar-pie__space-content > p:not(.spar-pie__space-label) { font-size: 0.9rem; line-height: 1.65; } .spar-pie__mistakes { padding: 23px 17px; border-radius: 20px; } .spar-pie__mistakes-list li { grid-template-columns: 38px minmax(0, 1fr); gap: 10px; padding: 12px; } .spar-pie__mistakes-list li > span { width: 38px; height: 38px; } .spar-pie__conversion { padding: 22px 17px; border-radius: 19px; } .spar-pie__button { width: 100%; min-height: 58px; padding-inline: 13px; font-size: 0.87rem; } } /* ============================================================ SMARTPHONE MOLTO STRETTI ============================================================ */ @media (max-width: 380px) { .spar-pie__container { width: calc(100% - 22px); } .spar-pie__title { font-size: 1.82rem; } .spar-pie__wall-card, .spar-pie__layers, .spar-pie__element, .spar-pie__space, .spar-pie__mistakes, .spar-pie__process-list li, .spar-pie__conversion { padding-inline: 14px; } .spar-pie__button { gap: 8px; padding-inline: 10px; font-size: 0.83rem; } .spar-pie__button svg { flex-basis: 21px; width: 21px; height: 21px; } } /* ============================================================ ACCESSIBILITÀ ============================================================ */ @media (prefers-reduced-motion: reduce) { .spar-pie__button { transition: none; } .spar-pie__button:hover { transform: none; } } /* ============================================================ STAMPA ============================================================ */ @media print { .spar-pie { padding: 30px 0; background: #ffffff; } .spar-pie__mistakes { border: 1px solid #ccdede; background: #ffffff; box-shadow: none; } .spar-pie__mistakes-content h4, .spar-pie__mistakes-list strong { color: var(--spar-pie-text); } .spar-pie__mistakes-content > p:not(.spar-pie__section-label), .spar-pie__mistakes-list p { color: var(--spar-pie-muted); } .spar-pie__actions { display: none; } }#imCell_8 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHTMLObject_1726_08 { position: relative; align-self: start; justify-self: center; max-width: 100%; box-sizing: border-box; z-index: 3; } #imCellStyleGraphics_8 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imCellStyleBorders_8 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } /* ============================================================ H2 — DA DOVE PASSA IL RUMORE ATTRAVERSO UNA PARETE Pagina: /isolamento-acustico-pareti-roma.html ============================================================ */ .spar-pass, .spar-pass *, .spar-pass *::before, .spar-pass *::after { box-sizing: border-box; } .spar-pass { --spar-pass-blue-dark: #07343b; --spar-pass-blue-deep: #05282e; --spar-pass-blue-medium: #0b5159; --spar-pass-teal: #24bfc1; --spar-pass-teal-light: #c7f1ef; --spar-pass-orange: #ff8a2a; --spar-pass-orange-dark: #d86812; --spar-pass-green: #27ad68; --spar-pass-green-dark: #19864f; --spar-pass-white: #ffffff; --spar-pass-cream: #fff8ed; --spar-pass-light: #edf8f7; --spar-pass-text: #173c41; --spar-pass-muted: #557277; --spar-pass-border: #d4e6e4; --spar-pass-shadow: 0 20px 52px rgba(6, 52, 59, 0.1); position: relative; width: 100%; max-width: 100%; overflow: hidden; padding-block: clamp(66px, 8vw, 108px); background: radial-gradient( circle at 4% 9%, rgba(36, 191, 193, 0.11), transparent 27% ), radial-gradient( circle at 96% 92%, rgba(255, 138, 42, 0.09), transparent 25% ), var(--spar-pass-cream); color: var(--spar-pass-text); } .spar-pass h2, .spar-pass h3, .spar-pass h4, .spar-pass p, .spar-pass li, .spar-pass span, .spar-pass strong, .spar-pass small, .spar-pass a { max-width: 100%; white-space: normal; overflow-wrap: break-word; word-break: normal; } .spar-pass__container { width: min(calc(100% - 40px), 1220px); max-width: 1220px; margin-inline: auto; } /* ============================================================ HEADER ============================================================ */ .spar-pass__header { width: min(100%, 940px); margin-inline: auto; text-align: center; } .spar-pass__eyebrow, .spar-pass__section-label { margin: 0 0 13px; color: var(--spar-pass-orange-dark); font-size: 0.76rem; font-weight: 900; line-height: 1.4; letter-spacing: 0.08em; text-transform: uppercase; } .spar-pass__title { margin: 0; color: var(--spar-pass-blue-dark); font-family: inherit; font-size: clamp(2.05rem, 4.25vw, 3.6rem); font-weight: 900; line-height: 1.07; letter-spacing: -0.04em; text-wrap: balance; } .spar-pass__direct-answer { margin: 25px auto 0; color: var(--spar-pass-blue-dark); font-size: clamp(1.05rem, 1.45vw, 1.2rem); font-weight: 650; line-height: 1.7; } .spar-pass__direct-answer strong { color: inherit; font-weight: 900; } .spar-pass__intro { margin: 15px auto 0; color: var(--spar-pass-muted); font-size: 1rem; line-height: 1.74; } /* ============================================================ RISPOSTA DIRETTA ============================================================ */ .spar-pass__answer { display: grid; grid-template-columns: 78px minmax(0, 1fr); align-items: center; gap: 23px; width: min(100%, 1000px); margin: clamp(36px, 5vw, 57px) auto 0; padding: clamp(23px, 3vw, 34px); border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 22px; background: var(--spar-pass-white); box-shadow: var(--spar-pass-shadow); } .spar-pass__answer-icon { display: grid; place-items: center; width: 72px; height: 72px; border-radius: 20px; background: var(--spar-pass-blue-dark); color: var(--spar-pass-teal-light); } .spar-pass__answer-icon svg { display: block; width: 43px; height: 43px; } .spar-pass__answer-content { min-width: 0; } .spar-pass__answer-label { margin: 0 0 7px; color: var(--spar-pass-orange-dark); font-size: 0.72rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-pass__answer-content h3 { margin: 0; color: var(--spar-pass-blue-dark); font-size: clamp(1.22rem, 2vw, 1.62rem); font-weight: 900; line-height: 1.3; } .spar-pass__answer-content > p:last-child { margin: 10px 0 0; color: var(--spar-pass-muted); font-size: 0.96rem; line-height: 1.68; } /* ============================================================ PERCORSI PRINCIPALI ============================================================ */ .spar-pass__routes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin-top: clamp(40px, 5vw, 62px); } .spar-pass__route { position: relative; display: flex; min-width: 0; flex-direction: column; padding: clamp(22px, 2.5vw, 31px); border: 1px solid var(--spar-pass-border); border-top: 5px solid var(--spar-pass-blue-dark); border-radius: 20px; background: var(--spar-pass-white); box-shadow: 0 14px 36px rgba(6, 52, 59, 0.08); } .spar-pass__route--teal { border-top-color: var(--spar-pass-teal); } .spar-pass__route--orange { border-top-color: var(--spar-pass-orange); } .spar-pass__route-top { display: flex; align-items: center; justify-content: space-between; gap: 15px; } .spar-pass__route-number { color: rgba(7, 52, 59, 0.23); font-size: 1.75rem; font-weight: 950; line-height: 1; } .spar-pass__route-icon { display: grid; flex: 0 0 48px; place-items: center; width: 48px; height: 48px; border-radius: 15px; background: var(--spar-pass-light); color: var(--spar-pass-blue-dark); } .spar-pass__route-icon svg { display: block; width: 27px; height: 27px; } .spar-pass__route h3 { margin: 21px 0 13px; color: var(--spar-pass-blue-dark); font-size: clamp(1.2rem, 1.65vw, 1.43rem); font-weight: 900; line-height: 1.28; letter-spacing: -0.02em; } .spar-pass__route > p { margin: 0; color: var(--spar-pass-muted); font-size: 0.93rem; line-height: 1.68; } .spar-pass__route > p + p { margin-top: 12px; } .spar-pass__route-signal { display: grid; gap: 6px; margin-top: auto; padding: 15px; border-radius: 13px; background: var(--spar-pass-light); } .spar-pass__route > p + .spar-pass__route-signal { margin-top: 20px; } .spar-pass__route-signal strong { color: var(--spar-pass-orange-dark); font-size: 0.72rem; font-weight: 900; line-height: 1.3; letter-spacing: 0.055em; text-transform: uppercase; } .spar-pass__route-signal span { color: var(--spar-pass-blue-dark); font-size: 0.85rem; font-weight: 700; line-height: 1.52; } /* ============================================================ PERCORSO E DIAGRAMMA ============================================================ */ .spar-pass__path { display: grid; grid-template-columns: minmax(0, 0.93fr) minmax(430px, 1.07fr); align-items: center; gap: clamp(36px, 5vw, 68px); margin-top: clamp(58px, 7vw, 88px); } .spar-pass__path-content { min-width: 0; } .spar-pass__path-content h3, .spar-pass__clues-header h3, .spar-pass__system-content h3, .spar-pass__analysis-header h3, .spar-pass__conversion h3 { margin: 0; color: var(--spar-pass-blue-dark); font-size: clamp(1.65rem, 2.9vw, 2.42rem); font-weight: 900; line-height: 1.16; letter-spacing: -0.032em; text-wrap: balance; } .spar-pass__path-content > p:not(.spar-pass__section-label) { margin: 18px 0 0; color: var(--spar-pass-muted); font-size: 0.97rem; line-height: 1.72; } .spar-pass__path-content > p + p { margin-top: 12px; } .spar-pass__path-highlight { padding: 15px 17px; border-left: 4px solid var(--spar-pass-orange); border-radius: 0 12px 12px 0; background: #fff0e2; color: var(--spar-pass-blue-dark) !important; font-weight: 750; } /* ============================================================ DIAGRAMMA ============================================================ */ .spar-pass__diagram { position: relative; min-width: 0; padding: 20px; border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 22px; background: var(--spar-pass-white); box-shadow: var(--spar-pass-shadow); } .spar-pass__diagram-ceiling, .spar-pass__diagram-floor { position: relative; display: flex; min-height: 42px; align-items: center; justify-content: center; padding: 8px 12px; border-radius: 9px; background: repeating-linear-gradient( 45deg, #cfdada, #cfdada 9px, #e2e8e8 9px, #e2e8e8 18px ); color: #3d5559; font-size: 0.69rem; font-weight: 900; line-height: 1.3; text-align: center; text-transform: uppercase; } .spar-pass__diagram-center { display: grid; grid-template-columns: minmax(0, 1fr) 68px minmax(0, 1fr); min-width: 0; min-height: 235px; } .spar-pass__diagram-source, .spar-pass__diagram-room { display: flex; min-width: 0; align-items: center; justify-content: center; flex-direction: column; padding: 20px 15px; text-align: center; } .spar-pass__diagram-source { background: #fff0e2; color: #703507; } .spar-pass__diagram-room { background: var(--spar-pass-light); color: var(--spar-pass-blue-dark); } .spar-pass__diagram-label { font-size: 0.72rem; font-weight: 900; line-height: 1.4; text-transform: uppercase; } .spar-pass__diagram-source strong, .spar-pass__diagram-room strong { margin-top: 10px; color: inherit; font-size: 0.84rem; line-height: 1.4; } .spar-pass__diagram-speaker { display: grid; place-items: center; width: 58px; height: 58px; margin-top: 19px; border-radius: 17px; background: var(--spar-pass-orange); color: #321705; } .spar-pass__diagram-speaker svg { width: 34px; height: 34px; } .spar-pass__diagram-wall { position: relative; display: flex; min-width: 0; align-items: center; justify-content: center; border-inline: 2px solid #909fa1; background: repeating-linear-gradient( 45deg, #d8dfdf, #d8dfdf 8px, #c9d2d2 8px, #c9d2d2 16px ); } .spar-pass__diagram-wall > span:first-child { writing-mode: vertical-rl; transform: rotate(180deg); color: #3c5357; font-size: 0.67rem; font-weight: 900; line-height: 1.2; text-transform: uppercase; } .spar-pass__diagram-direct { position: absolute; right: -24px; z-index: 2; display: grid; place-items: center; width: 47px; height: 36px; border-radius: 999px; background: var(--spar-pass-orange); color: #321705; font-size: 1.35rem; font-weight: 900; } .spar-pass__diagram-arrow { position: absolute; left: 8%; color: var(--spar-pass-blue-medium); font-size: 0.65rem; font-weight: 900; line-height: 1.3; letter-spacing: 0.03em; text-transform: uppercase; } .spar-pass__diagram-arrow--top { top: -26px; } .spar-pass__diagram-arrow--bottom { bottom: -26px; } .spar-pass__diagram-note { margin: 33px 0 0; color: var(--spar-pass-muted); font-size: 0.75rem; line-height: 1.5; text-align: center; } /* ============================================================ INDIZI ============================================================ */ .spar-pass__clues { margin-top: clamp(60px, 8vw, 94px); } .spar-pass__clues-header, .spar-pass__analysis-header { width: min(100%, 850px); margin-inline: auto; text-align: center; } .spar-pass__clues-header > p:last-child, .spar-pass__analysis-header > p:last-child { margin: 17px auto 0; color: var(--spar-pass-muted); font-size: 0.97rem; line-height: 1.72; } .spar-pass__clues-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 17px; margin-top: 33px; } .spar-pass__clue { min-width: 0; padding: 22px; border: 1px solid var(--spar-pass-border); border-radius: 18px; background: var(--spar-pass-white); box-shadow: 0 12px 30px rgba(6, 52, 59, 0.07); } .spar-pass__clue-icon { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 14px; background: var(--spar-pass-light); color: var(--spar-pass-blue-dark); } .spar-pass__clue-icon svg { width: 27px; height: 27px; } .spar-pass__clue h4 { margin: 17px 0 0; color: var(--spar-pass-blue-dark); font-size: 1.03rem; font-weight: 900; line-height: 1.35; } .spar-pass__clue p { margin: 9px 0 0; color: var(--spar-pass-muted); font-size: 0.86rem; line-height: 1.62; } /* ============================================================ SISTEMA TECNICO ============================================================ */ .spar-pass__system { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(420px, 1.1fr); align-items: center; gap: clamp(35px, 5vw, 68px); margin-top: clamp(58px, 7vw, 88px); padding: clamp(28px, 4vw, 48px); border-radius: 25px; background: radial-gradient( circle at 94% 8%, rgba(36, 191, 193, 0.2), transparent 30% ), linear-gradient( 135deg, var(--spar-pass-blue-deep), var(--spar-pass-blue-dark) ); box-shadow: 0 24px 62px rgba(3, 35, 40, 0.2); } .spar-pass__system-content { min-width: 0; } .spar-pass__system .spar-pass__section-label { color: var(--spar-pass-orange); } .spar-pass__system-content h3 { color: var(--spar-pass-white); } .spar-pass__system-content > p:not(.spar-pass__section-label) { margin: 17px 0 0; color: rgba(255, 255, 255, 0.74); font-size: 0.96rem; line-height: 1.7; } .spar-pass__system-content > p + p { margin-top: 11px; } .spar-pass__system-highlight { padding: 14px 16px; border-left: 4px solid var(--spar-pass-orange); border-radius: 0 11px 11px 0; background: rgba(255, 255, 255, 0.08); color: var(--spar-pass-white) !important; font-weight: 750; } .spar-pass__system-list { display: grid; gap: 12px; min-width: 0; margin: 0; padding: 0; list-style: none; } .spar-pass__system-list li { display: grid; grid-template-columns: 40px minmax(0, 1fr); align-items: start; gap: 12px; min-width: 0; padding: 14px; border: 1px solid rgba(255, 255, 255, 0.13); border-radius: 14px; background: rgba(255, 255, 255, 0.07); } .spar-pass__system-list li > span { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: rgba(36, 191, 193, 0.16); color: var(--spar-pass-teal-light); font-size: 0.9rem; font-weight: 900; } .spar-pass__system-list li > div { min-width: 0; } .spar-pass__system-list strong { display: block; color: var(--spar-pass-white); font-size: 0.9rem; font-weight: 850; line-height: 1.35; } .spar-pass__system-list p { margin: 5px 0 0; color: rgba(255, 255, 255, 0.67); font-size: 0.8rem; line-height: 1.53; } /* ============================================================ SOPRALLUOGO ============================================================ */ .spar-pass__analysis { margin-top: clamp(60px, 8vw, 94px); } .spar-pass__analysis-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin: 33px 0 0; padding: 0; list-style: none; } .spar-pass__analysis-list li { min-width: 0; padding: 22px; border: 1px solid var(--spar-pass-border); border-radius: 18px; background: var(--spar-pass-white); box-shadow: 0 12px 30px rgba(6, 52, 59, 0.07); } .spar-pass__analysis-number { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; background: var(--spar-pass-blue-dark); color: var(--spar-pass-teal-light); font-size: 0.8rem; font-weight: 900; } .spar-pass__analysis-list strong { display: block; margin-top: 17px; color: var(--spar-pass-blue-dark); font-size: 0.94rem; font-weight: 900; line-height: 1.4; } .spar-pass__analysis-list p { margin: 8px 0 0; color: var(--spar-pass-muted); font-size: 0.84rem; line-height: 1.58; } /* ============================================================ CTA ============================================================ */ .spar-pass__conversion { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(330px, 0.92fr); align-items: center; gap: clamp(31px, 5vw, 66px); margin-top: clamp(53px, 7vw, 84px); padding: clamp(27px, 4vw, 47px); border: 1px solid rgba(36, 191, 193, 0.24); border-radius: 24px; background: var(--spar-pass-white); box-shadow: var(--spar-pass-shadow); } .spar-pass__conversion-content { min-width: 0; } .spar-pass__conversion-label { margin: 0 0 12px; color: var(--spar-pass-orange-dark); font-size: 0.74rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-pass__conversion-content > p:not(.spar-pass__conversion-label) { margin: 16px 0 0; color: var(--spar-pass-muted); font-size: 0.96rem; line-height: 1.71; } .spar-pass__conversion-content > p + p { margin-top: 11px; } .spar-pass__actions { display: grid; gap: 11px; min-width: 0; } .spar-pass__button { display: flex; min-width: 0; min-height: 58px; align-items: center; justify-content: center; gap: 10px; padding: 13px 17px; border: 2px solid transparent; border-radius: 12px; font-family: inherit; font-size: 0.91rem; font-weight: 850; line-height: 1.3; text-align: center; text-decoration: none; transition: transform 180ms ease, box-shadow 180ms ease, background-color 180ms ease, border-color 180ms ease; } .spar-pass__button:hover { transform: translateY(-2px); } .spar-pass__button:focus-visible { outline: 3px solid var(--spar-pass-blue-dark); outline-offset: 4px; } .spar-pass__button svg { flex: 0 0 23px; width: 23px; height: 23px; } .spar-pass__button--primary { background: var(--spar-pass-orange); color: #2c1504; box-shadow: 0 12px 27px rgba(255, 138, 42, 0.22); } .spar-pass__button--primary:hover { background: #ff9b43; } .spar-pass__button--whatsapp { background: var(--spar-pass-green); color: var(--spar-pass-white); box-shadow: 0 12px 27px rgba(39, 173, 104, 0.2); } .spar-pass__button--whatsapp:hover { background: var(--spar-pass-green-dark); } .spar-pass__button--phone { border-color: rgba(7, 52, 59, 0.32); background: var(--spar-pass-white); color: var(--spar-pass-blue-dark); } .spar-pass__button--phone:hover { border-color: var(--spar-pass-teal); background: var(--spar-pass-light); } .spar-pass__phone-text { display: grid; min-width: 0; gap: 1px; text-align: left; } .spar-pass__phone-text small { font-size: 0.64rem; font-weight: 750; line-height: 1.1; letter-spacing: 0.055em; text-transform: uppercase; } .spar-pass__phone-text strong { color: inherit; font-size: 1rem; font-weight: 900; line-height: 1.15; } /* ============================================================ NOTEBOOK E TABLET ORIZZONTALE ============================================================ */ @media (max-width: 1080px) { .spar-pass__routes { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-pass__route:last-child { grid-column: 1 / -1; } .spar-pass__path, .spar-pass__system, .spar-pass__conversion { grid-template-columns: minmax(0, 1fr); } .spar-pass__path-content, .spar-pass__system-content, .spar-pass__conversion-content { max-width: 850px; } .spar-pass__diagram { max-width: 850px; } .spar-pass__clues-grid, .spar-pass__analysis-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-pass__actions { grid-template-columns: repeat(3, minmax(0, 1fr)); } } /* ============================================================ TABLET ============================================================ */ @media (max-width: 780px) { .spar-pass { padding-block: 60px 74px; } .spar-pass__container { width: min(calc(100% - 32px), 720px); } .spar-pass__answer { grid-template-columns: 62px minmax(0, 1fr); gap: 18px; } .spar-pass__answer-icon { width: 60px; height: 60px; border-radius: 17px; } .spar-pass__answer-icon svg { width: 36px; height: 36px; } .spar-pass__routes { grid-template-columns: minmax(0, 1fr); } .spar-pass__route:last-child { grid-column: auto; } .spar-pass__actions { grid-template-columns: minmax(0, 1fr); } } /* ============================================================ MOBILE ============================================================ */ @media (max-width: 560px) { .spar-pass { padding-block: 50px 62px; } .spar-pass__container { width: calc(100% - 28px); } .spar-pass__header, .spar-pass__clues-header, .spar-pass__analysis-header { text-align: left; } .spar-pass__eyebrow, .spar-pass__section-label { font-size: 0.68rem; letter-spacing: 0.06em; } .spar-pass__title { font-size: clamp(1.9rem, 9.8vw, 2.75rem); line-height: 1.1; } .spar-pass__direct-answer { margin-top: 20px; font-size: 0.99rem; line-height: 1.63; } .spar-pass__intro { font-size: 0.92rem; line-height: 1.67; } .spar-pass__answer { grid-template-columns: minmax(0, 1fr); align-items: start; gap: 15px; padding: 20px 17px; border-radius: 18px; } .spar-pass__answer-icon { width: 53px; height: 53px; border-radius: 15px; } .spar-pass__answer-content h3 { font-size: 1.16rem; } .spar-pass__answer-content > p:last-child { font-size: 0.9rem; } .spar-pass__route { padding: 21px 17px; border-radius: 17px; } .spar-pass__route h3 { font-size: 1.19rem; } .spar-pass__route > p { font-size: 0.9rem; line-height: 1.65; } .spar-pass__path-content h3, .spar-pass__clues-header h3, .spar-pass__system-content h3, .spar-pass__analysis-header h3, .spar-pass__conversion h3 { font-size: clamp(1.5rem, 7.5vw, 1.95rem); line-height: 1.19; } .spar-pass__path-content > p:not(.spar-pass__section-label), .spar-pass__clues-header > p:last-child, .spar-pass__system-content > p:not(.spar-pass__section-label), .spar-pass__analysis-header > p:last-child, .spar-pass__conversion-content > p:not(.spar-pass__conversion-label) { font-size: 0.91rem; line-height: 1.66; } .spar-pass__diagram { padding: 16px 13px; border-radius: 18px; } .spar-pass__diagram-center { grid-template-columns: minmax(0, 1fr); min-height: auto; } .spar-pass__diagram-source, .spar-pass__diagram-room { min-height: 150px; padding: 18px 12px; } .spar-pass__diagram-wall { min-height: 60px; border: 2px solid #909fa1; } .spar-pass__diagram-wall > span:first-child { writing-mode: horizontal-tb; transform: none; } .spar-pass__diagram-direct { right: 50%; bottom: -18px; transform: translateX(50%) rotate(90deg); } .spar-pass__diagram-arrow { display: none; } .spar-pass__diagram-note { margin-top: 17px; } .spar-pass__clues-grid, .spar-pass__analysis-list { grid-template-columns: minmax(0, 1fr); } .spar-pass__clue, .spar-pass__analysis-list li { padding: 19px 17px; border-radius: 16px; } .spar-pass__system { padding: 23px 17px; border-radius: 20px; } .spar-pass__system-list li { grid-template-columns: 38px minmax(0, 1fr); gap: 10px; padding: 12px; } .spar-pass__system-list li > span { width: 38px; height: 38px; } .spar-pass__conversion { padding: 22px 17px; border-radius: 19px; } .spar-pass__button { width: 100%; min-height: 58px; padding-inline: 13px; font-size: 0.87rem; } } /* ============================================================ SMARTPHONE MOLTO STRETTI ============================================================ */ @media (max-width: 380px) { .spar-pass__container { width: calc(100% - 22px); } .spar-pass__title { font-size: 1.82rem; } .spar-pass__route, .spar-pass__diagram, .spar-pass__clue, .spar-pass__system, .spar-pass__analysis-list li, .spar-pass__conversion { padding-inline: 14px; } .spar-pass__button { gap: 8px; padding-inline: 10px; font-size: 0.83rem; } .spar-pass__button svg { flex-basis: 21px; width: 21px; height: 21px; } } /* ============================================================ ACCESSIBILITÀ ============================================================ */ @media (prefers-reduced-motion: reduce) { .spar-pass__button { transition: none; } .spar-pass__button:hover { transform: none; } } /* ============================================================ STAMPA ============================================================ */ @media print { .spar-pass { padding: 30px 0; background: #ffffff; } .spar-pass__system { border: 1px solid #ccdede; background: #ffffff; box-shadow: none; } .spar-pass__system-content h3, .spar-pass__system-list strong { color: var(--spar-pass-text); } .spar-pass__system-content > p:not(.spar-pass__section-label), .spar-pass__system-list p { color: var(--spar-pass-muted); } .spar-pass__actions { display: none; } }#imCell_9 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHTMLObject_1726_09 { position: relative; align-self: start; justify-self: center; max-width: 100%; box-sizing: border-box; z-index: 3; } #imCellStyleGraphics_9 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imCellStyleBorders_9 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } /* ============================================================ H3 — TRASMISSIONE DIRETTA ATTRAVERSO IL MURO Pagina: /isolamento-acustico-pareti-roma.html ============================================================ */ .spar-tdm, .spar-tdm *, .spar-tdm *::before, .spar-tdm *::after { box-sizing: border-box; } .spar-tdm { --spar-tdm-blue-dark: #07343b; --spar-tdm-blue-deep: #05282e; --spar-tdm-blue-medium: #0b5159; --spar-tdm-teal: #24bfc1; --spar-tdm-teal-light: #c7f1ef; --spar-tdm-orange: #ff8a2a; --spar-tdm-orange-dark: #d86812; --spar-tdm-green: #27ad68; --spar-tdm-green-dark: #19864f; --spar-tdm-white: #ffffff; --spar-tdm-cream: #fff8ed; --spar-tdm-light: #edf8f7; --spar-tdm-text: #173c41; --spar-tdm-muted: #557277; --spar-tdm-border: #d4e6e4; --spar-tdm-shadow: 0 20px 52px rgba(6, 52, 59, 0.1); position: relative; width: 100%; max-width: 100%; overflow: hidden; padding-block: clamp(66px, 8vw, 108px); background: radial-gradient( circle at 96% 8%, rgba(36, 191, 193, 0.11), transparent 27% ), radial-gradient( circle at 4% 92%, rgba(255, 138, 42, 0.09), transparent 25% ), #ffffff; color: var(--spar-tdm-text); } .spar-tdm h3, .spar-tdm h4, .spar-tdm h5, .spar-tdm p, .spar-tdm li, .spar-tdm span, .spar-tdm strong, .spar-tdm small, .spar-tdm a { max-width: 100%; white-space: normal; overflow-wrap: break-word; word-break: normal; } .spar-tdm__container { width: min(calc(100% - 40px), 1220px); max-width: 1220px; margin-inline: auto; } /* ============================================================ HEADER ============================================================ */ .spar-tdm__header { width: min(100%, 940px); margin-inline: auto; text-align: center; } .spar-tdm__eyebrow, .spar-tdm__section-label { margin: 0 0 13px; color: var(--spar-tdm-orange-dark); font-size: 0.76rem; font-weight: 900; line-height: 1.4; letter-spacing: 0.08em; text-transform: uppercase; } .spar-tdm__title { margin: 0; color: var(--spar-tdm-blue-dark); font-family: inherit; font-size: clamp(2rem, 4.1vw, 3.45rem); font-weight: 900; line-height: 1.08; letter-spacing: -0.04em; text-wrap: balance; } .spar-tdm__direct-answer { margin: 25px auto 0; color: var(--spar-tdm-blue-dark); font-size: clamp(1.05rem, 1.45vw, 1.2rem); font-weight: 650; line-height: 1.7; } .spar-tdm__direct-answer strong { color: inherit; font-weight: 900; } .spar-tdm__intro { margin: 15px auto 0; color: var(--spar-tdm-muted); font-size: 1rem; line-height: 1.74; } /* ============================================================ RISPOSTA IMMEDIATA ============================================================ */ .spar-tdm__answer { display: grid; grid-template-columns: 78px minmax(0, 1fr); align-items: center; gap: 23px; width: min(100%, 1000px); margin: clamp(36px, 5vw, 57px) auto 0; padding: clamp(23px, 3vw, 34px); border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 22px; background: var(--spar-tdm-cream); box-shadow: var(--spar-tdm-shadow); } .spar-tdm__answer-icon { display: grid; place-items: center; width: 72px; height: 72px; border-radius: 20px; background: var(--spar-tdm-blue-dark); color: var(--spar-tdm-teal-light); } .spar-tdm__answer-icon svg { display: block; width: 43px; height: 43px; } .spar-tdm__answer-content { min-width: 0; } .spar-tdm__answer-label { margin: 0 0 7px; color: var(--spar-tdm-orange-dark); font-size: 0.72rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-tdm__answer-content h4 { margin: 0; color: var(--spar-tdm-blue-dark); font-size: clamp(1.22rem, 2vw, 1.62rem); font-weight: 900; line-height: 1.3; } .spar-tdm__answer-content > p:last-child { margin: 10px 0 0; color: var(--spar-tdm-muted); font-size: 0.96rem; line-height: 1.68; } /* ============================================================ PROCESSO DI TRASMISSIONE ============================================================ */ .spar-tdm__process { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(420px, 1.1fr); align-items: center; gap: clamp(35px, 5vw, 68px); margin-top: clamp(55px, 7vw, 86px); } .spar-tdm__process-content { min-width: 0; } .spar-tdm__process-content h4, .spar-tdm__factors-header h4, .spar-tdm__signals-content h4, .spar-tdm__evaluation h4, .spar-tdm__solution-content h4, .spar-tdm__method-header h4, .spar-tdm__conversion h4 { margin: 0; color: var(--spar-tdm-blue-dark); font-size: clamp(1.65rem, 2.9vw, 2.42rem); font-weight: 900; line-height: 1.16; letter-spacing: -0.032em; text-wrap: balance; } .spar-tdm__process-content > p:not(.spar-tdm__section-label) { margin: 18px 0 0; color: var(--spar-tdm-muted); font-size: 0.97rem; line-height: 1.72; } .spar-tdm__process-content > p + p { margin-top: 12px; } .spar-tdm__process-highlight { padding: 15px 17px; border-left: 4px solid var(--spar-tdm-orange); border-radius: 0 12px 12px 0; background: #fff0e2; color: var(--spar-tdm-blue-dark) !important; font-weight: 750; } .spar-tdm__steps { display: grid; gap: 12px; min-width: 0; margin: 0; padding: 0; list-style: none; } .spar-tdm__steps li { display: grid; grid-template-columns: 44px minmax(0, 1fr); align-items: start; gap: 13px; min-width: 0; padding: 15px; border: 1px solid var(--spar-tdm-border); border-radius: 15px; background: var(--spar-tdm-white); box-shadow: 0 10px 27px rgba(6, 52, 59, 0.07); } .spar-tdm__step-number { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 13px; background: var(--spar-tdm-blue-dark); color: var(--spar-tdm-teal-light); font-size: 0.78rem; font-weight: 900; } .spar-tdm__steps li > div { min-width: 0; } .spar-tdm__steps strong { display: block; color: var(--spar-tdm-blue-dark); font-size: 0.92rem; font-weight: 900; line-height: 1.4; } .spar-tdm__steps p { margin: 5px 0 0; color: var(--spar-tdm-muted); font-size: 0.82rem; line-height: 1.55; } /* ============================================================ DIAGRAMMA ============================================================ */ .spar-tdm__diagram { display: grid; grid-template-columns: minmax(130px, 1fr) 52px minmax(74px, 0.5fr) 52px minmax(130px, 1fr); align-items: stretch; gap: 9px; min-width: 0; margin-top: clamp(45px, 6vw, 70px); padding: 22px; border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 22px; background: var(--spar-tdm-white); box-shadow: var(--spar-tdm-shadow); } .spar-tdm__diagram-room, .spar-tdm__diagram-wall { display: flex; min-width: 0; min-height: 230px; align-items: center; justify-content: center; flex-direction: column; padding: 16px; border-radius: 14px; text-align: center; } .spar-tdm__diagram-room--source { background: #fff0e2; color: #703507; } .spar-tdm__diagram-room--protected { background: var(--spar-tdm-light); color: var(--spar-tdm-blue-dark); } .spar-tdm__diagram-label { font-size: 0.72rem; font-weight: 900; line-height: 1.4; text-transform: uppercase; } .spar-tdm__diagram-room strong { margin-top: 10px; color: inherit; font-size: 0.86rem; line-height: 1.4; } .spar-tdm__diagram-speaker { display: grid; place-items: center; width: 58px; height: 58px; margin-top: 20px; border-radius: 17px; background: var(--spar-tdm-orange); color: #321705; } .spar-tdm__diagram-speaker svg { width: 34px; height: 34px; } .spar-tdm__diagram-wave { display: grid; place-items: center; color: var(--spar-tdm-orange); font-size: 1.25rem; font-weight: 900; } .spar-tdm__diagram-wall { border: 2px solid #909fa1; background: repeating-linear-gradient( 45deg, #d8dfdf, #d8dfdf 8px, #c9d2d2 8px, #c9d2d2 16px ); color: #3c5357; } .spar-tdm__diagram-wall > span:first-child { writing-mode: vertical-rl; transform: rotate(180deg); font-size: 0.68rem; font-weight: 900; line-height: 1.2; text-transform: uppercase; } .spar-tdm__diagram-vibration { margin-top: 17px; padding: 7px 9px; border-radius: 9px; background: var(--spar-tdm-orange); color: #321705; font-size: 0.65rem; font-weight: 900; line-height: 1.3; text-transform: uppercase; } .spar-tdm__diagram-note { grid-column: 1 / -1; margin: 7px 0 0; color: var(--spar-tdm-muted); font-size: 0.76rem; line-height: 1.5; text-align: center; } /* ============================================================ FATTORI ============================================================ */ .spar-tdm__factors { margin-top: clamp(60px, 8vw, 94px); } .spar-tdm__factors-header, .spar-tdm__method-header { width: min(100%, 850px); margin-inline: auto; text-align: center; } .spar-tdm__factors-header > p:last-child, .spar-tdm__method-header > p:last-child { margin: 17px auto 0; color: var(--spar-tdm-muted); font-size: 0.97rem; line-height: 1.72; } .spar-tdm__factors-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 17px; margin-top: 33px; } .spar-tdm__factor { min-width: 0; padding: 22px; border: 1px solid var(--spar-tdm-border); border-radius: 18px; background: var(--spar-tdm-white); box-shadow: 0 12px 30px rgba(6, 52, 59, 0.07); } .spar-tdm__factor-icon { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 14px; background: var(--spar-tdm-light); color: var(--spar-tdm-blue-dark); } .spar-tdm__factor-icon svg { width: 27px; height: 27px; } .spar-tdm__factor h5 { margin: 17px 0 0; color: var(--spar-tdm-blue-dark); font-size: 1.03rem; font-weight: 900; line-height: 1.35; } .spar-tdm__factor p { margin: 9px 0 0; color: var(--spar-tdm-muted); font-size: 0.86rem; line-height: 1.62; } /* ============================================================ SEGNALI ============================================================ */ .spar-tdm__signals { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(420px, 1.1fr); align-items: center; gap: clamp(35px, 5vw, 68px); margin-top: clamp(58px, 7vw, 88px); padding: clamp(28px, 4vw, 48px); border-radius: 25px; background: radial-gradient( circle at 94% 8%, rgba(36, 191, 193, 0.2), transparent 30% ), linear-gradient( 135deg, var(--spar-tdm-blue-deep), var(--spar-tdm-blue-dark) ); box-shadow: 0 24px 62px rgba(3, 35, 40, 0.2); } .spar-tdm__signals-content { min-width: 0; } .spar-tdm__signals .spar-tdm__section-label { color: var(--spar-tdm-orange); } .spar-tdm__signals-content h4 { color: var(--spar-tdm-white); } .spar-tdm__signals-content > p:not(.spar-tdm__section-label) { margin: 17px 0 0; color: rgba(255, 255, 255, 0.74); font-size: 0.96rem; line-height: 1.7; } .spar-tdm__signals-highlight { padding: 14px 16px; border-left: 4px solid var(--spar-tdm-orange); border-radius: 0 11px 11px 0; background: rgba(255, 255, 255, 0.08); color: var(--spar-tdm-white) !important; font-weight: 750; } .spar-tdm__signals-list { display: grid; gap: 12px; min-width: 0; margin: 0; padding: 0; list-style: none; } .spar-tdm__signals-list li { display: grid; grid-template-columns: 40px minmax(0, 1fr); align-items: start; gap: 12px; min-width: 0; padding: 14px; border: 1px solid rgba(255, 255, 255, 0.13); border-radius: 14px; background: rgba(255, 255, 255, 0.07); } .spar-tdm__signals-list li > span { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: rgba(36, 191, 193, 0.16); color: var(--spar-tdm-teal-light); font-size: 0.9rem; font-weight: 900; } .spar-tdm__signals-list li > div { min-width: 0; } .spar-tdm__signals-list strong { display: block; color: var(--spar-tdm-white); font-size: 0.9rem; font-weight: 850; line-height: 1.35; } .spar-tdm__signals-list p { margin: 5px 0 0; color: rgba(255, 255, 255, 0.67); font-size: 0.8rem; line-height: 1.53; } /* ============================================================ VALUTAZIONE ============================================================ */ .spar-tdm__evaluation { display: grid; grid-template-columns: 74px minmax(0, 1fr); align-items: center; gap: 23px; margin-top: clamp(44px, 6vw, 68px); padding: clamp(24px, 3vw, 35px); border: 1px solid rgba(255, 138, 42, 0.31); border-radius: 21px; background: #fff3e7; } .spar-tdm__evaluation-icon { display: grid; place-items: center; width: 70px; height: 70px; border-radius: 20px; background: var(--spar-tdm-orange); color: #321705; } .spar-tdm__evaluation-icon svg { width: 41px; height: 41px; } .spar-tdm__evaluation-content { min-width: 0; } .spar-tdm__evaluation-label { margin: 0 0 7px; color: var(--spar-tdm-orange-dark); font-size: 0.72rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-tdm__evaluation h4 { font-size: clamp(1.35rem, 2.2vw, 1.88rem); } .spar-tdm__evaluation-content > p:not(.spar-tdm__evaluation-label) { margin: 11px 0 0; color: var(--spar-tdm-muted); font-size: 0.94rem; line-height: 1.68; } /* ============================================================ SOLUZIONE E CONFRONTO ============================================================ */ .spar-tdm__solution { display: grid; grid-template-columns: minmax(0, 0.93fr) minmax(430px, 1.07fr); align-items: center; gap: clamp(36px, 5vw, 68px); margin-top: clamp(58px, 7vw, 88px); } .spar-tdm__solution-content { min-width: 0; } .spar-tdm__solution-content > p:not(.spar-tdm__section-label) { margin: 18px 0 0; color: var(--spar-tdm-muted); font-size: 0.97rem; line-height: 1.72; } .spar-tdm__solution-content > p + p { margin-top: 12px; } .spar-tdm__solution-highlight { padding: 15px 17px; border-left: 4px solid var(--spar-tdm-orange); border-radius: 0 12px 12px 0; background: #fff0e2; color: var(--spar-tdm-blue-dark) !important; font-weight: 750; } .spar-tdm__comparison { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; min-width: 0; } .spar-tdm__comparison-card { min-width: 0; padding: 23px; border: 1px solid var(--spar-tdm-border); border-radius: 19px; background: var(--spar-tdm-white); box-shadow: 0 13px 32px rgba(6, 52, 59, 0.08); } .spar-tdm__comparison-card--wrong { border-top: 5px solid #d3634f; } .spar-tdm__comparison-card--right { border-top: 5px solid var(--spar-tdm-teal); } .spar-tdm__comparison-symbol { display: grid; place-items: center; width: 45px; height: 45px; border-radius: 14px; font-size: 1.15rem; font-weight: 900; } .spar-tdm__comparison-card--wrong .spar-tdm__comparison-symbol { background: #fff0ed; color: #a23b2a; } .spar-tdm__comparison-card--right .spar-tdm__comparison-symbol { background: var(--spar-tdm-light); color: var(--spar-tdm-blue-medium); } .spar-tdm__comparison-card h5 { margin: 17px 0 0; color: var(--spar-tdm-blue-dark); font-size: 1.08rem; font-weight: 900; line-height: 1.35; } .spar-tdm__comparison-card ul { display: grid; gap: 9px; margin: 16px 0 0; padding: 0; list-style: none; } .spar-tdm__comparison-card li { position: relative; padding-left: 19px; color: var(--spar-tdm-muted); font-size: 0.83rem; line-height: 1.55; } .spar-tdm__comparison-card li::before { content: ""; position: absolute; top: 0.58em; left: 0; width: 7px; height: 7px; border-radius: 50%; background: var(--spar-tdm-orange); } .spar-tdm__comparison-card--right li::before { background: var(--spar-tdm-teal); } /* ============================================================ METODO ============================================================ */ .spar-tdm__method { margin-top: clamp(60px, 8vw, 94px); } .spar-tdm__method-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin: 33px 0 0; padding: 0; list-style: none; } .spar-tdm__method-list li { min-width: 0; padding: 22px; border: 1px solid var(--spar-tdm-border); border-radius: 18px; background: var(--spar-tdm-white); box-shadow: 0 12px 30px rgba(6, 52, 59, 0.07); } .spar-tdm__method-number { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; background: var(--spar-tdm-blue-dark); color: var(--spar-tdm-teal-light); font-size: 0.8rem; font-weight: 900; } .spar-tdm__method-list strong { display: block; margin-top: 17px; color: var(--spar-tdm-blue-dark); font-size: 0.94rem; font-weight: 900; line-height: 1.4; } .spar-tdm__method-list p { margin: 8px 0 0; color: var(--spar-tdm-muted); font-size: 0.84rem; line-height: 1.58; } /* ============================================================ CTA ============================================================ */ .spar-tdm__conversion { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(330px, 0.92fr); align-items: center; gap: clamp(31px, 5vw, 66px); margin-top: clamp(53px, 7vw, 84px); padding: clamp(27px, 4vw, 47px); border: 1px solid rgba(36, 191, 193, 0.24); border-radius: 24px; background: var(--spar-tdm-cream); box-shadow: var(--spar-tdm-shadow); } .spar-tdm__conversion-content { min-width: 0; } .spar-tdm__conversion-label { margin: 0 0 12px; color: var(--spar-tdm-orange-dark); font-size: 0.74rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-tdm__conversion-content > p:not(.spar-tdm__conversion-label) { margin: 16px 0 0; color: var(--spar-tdm-muted); font-size: 0.96rem; line-height: 1.71; } .spar-tdm__conversion-content > p + p { margin-top: 11px; } .spar-tdm__actions { display: grid; gap: 11px; min-width: 0; } .spar-tdm__button { display: flex; min-width: 0; min-height: 58px; align-items: center; justify-content: center; gap: 10px; padding: 13px 17px; border: 2px solid transparent; border-radius: 12px; font-family: inherit; font-size: 0.91rem; font-weight: 850; line-height: 1.3; text-align: center; text-decoration: none; transition: transform 180ms ease, box-shadow 180ms ease, background-color 180ms ease, border-color 180ms ease; } .spar-tdm__button:hover { transform: translateY(-2px); } .spar-tdm__button:focus-visible { outline: 3px solid var(--spar-tdm-blue-dark); outline-offset: 4px; } .spar-tdm__button svg { flex: 0 0 23px; width: 23px; height: 23px; } .spar-tdm__button--primary { background: var(--spar-tdm-orange); color: #2c1504; box-shadow: 0 12px 27px rgba(255, 138, 42, 0.22); } .spar-tdm__button--primary:hover { background: #ff9b43; } .spar-tdm__button--whatsapp { background: var(--spar-tdm-green); color: var(--spar-tdm-white); box-shadow: 0 12px 27px rgba(39, 173, 104, 0.2); } .spar-tdm__button--whatsapp:hover { background: var(--spar-tdm-green-dark); } .spar-tdm__button--phone { border-color: rgba(7, 52, 59, 0.32); background: var(--spar-tdm-white); color: var(--spar-tdm-blue-dark); } .spar-tdm__button--phone:hover { border-color: var(--spar-tdm-teal); background: var(--spar-tdm-light); } .spar-tdm__phone-text { display: grid; min-width: 0; gap: 1px; text-align: left; } .spar-tdm__phone-text small { font-size: 0.64rem; font-weight: 750; line-height: 1.1; letter-spacing: 0.055em; text-transform: uppercase; } .spar-tdm__phone-text strong { color: inherit; font-size: 1rem; font-weight: 900; line-height: 1.15; } /* ============================================================ NOTEBOOK E TABLET ORIZZONTALE ============================================================ */ @media (max-width: 1080px) { .spar-tdm__process, .spar-tdm__signals, .spar-tdm__solution, .spar-tdm__conversion { grid-template-columns: minmax(0, 1fr); } .spar-tdm__process-content, .spar-tdm__signals-content, .spar-tdm__solution-content, .spar-tdm__conversion-content { max-width: 850px; } .spar-tdm__factors-grid, .spar-tdm__method-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-tdm__actions { grid-template-columns: repeat(3, minmax(0, 1fr)); } } /* ============================================================ TABLET ============================================================ */ @media (max-width: 780px) { .spar-tdm { padding-block: 60px 74px; } .spar-tdm__container { width: min(calc(100% - 32px), 720px); } .spar-tdm__answer { grid-template-columns: 62px minmax(0, 1fr); gap: 18px; } .spar-tdm__answer-icon { width: 60px; height: 60px; border-radius: 17px; } .spar-tdm__answer-icon svg { width: 36px; height: 36px; } .spar-tdm__diagram { grid-template-columns: minmax(100px, 1fr) 42px minmax(65px, 0.5fr) 42px minmax(100px, 1fr); padding: 17px; gap: 7px; } .spar-tdm__comparison { grid-template-columns: minmax(0, 1fr); } .spar-tdm__actions { grid-template-columns: minmax(0, 1fr); } } /* ============================================================ MOBILE ============================================================ */ @media (max-width: 560px) { .spar-tdm { padding-block: 50px 62px; } .spar-tdm__container { width: calc(100% - 28px); } .spar-tdm__header, .spar-tdm__factors-header, .spar-tdm__method-header { text-align: left; } .spar-tdm__eyebrow, .spar-tdm__section-label { font-size: 0.68rem; letter-spacing: 0.06em; } .spar-tdm__title { font-size: clamp(1.9rem, 9.8vw, 2.7rem); line-height: 1.1; } .spar-tdm__direct-answer { margin-top: 20px; font-size: 0.99rem; line-height: 1.63; } .spar-tdm__intro { font-size: 0.92rem; line-height: 1.67; } .spar-tdm__answer { grid-template-columns: minmax(0, 1fr); align-items: start; gap: 15px; padding: 20px 17px; border-radius: 18px; } .spar-tdm__answer-icon { width: 53px; height: 53px; border-radius: 15px; } .spar-tdm__answer-content h4 { font-size: 1.16rem; } .spar-tdm__answer-content > p:last-child { font-size: 0.9rem; } .spar-tdm__process-content h4, .spar-tdm__factors-header h4, .spar-tdm__signals-content h4, .spar-tdm__solution-content h4, .spar-tdm__method-header h4, .spar-tdm__conversion h4 { font-size: clamp(1.5rem, 7.5vw, 1.95rem); line-height: 1.19; } .spar-tdm__process-content > p:not(.spar-tdm__section-label), .spar-tdm__factors-header > p:last-child, .spar-tdm__signals-content > p:not(.spar-tdm__section-label), .spar-tdm__solution-content > p:not(.spar-tdm__section-label), .spar-tdm__method-header > p:last-child, .spar-tdm__conversion-content > p:not(.spar-tdm__conversion-label) { font-size: 0.91rem; line-height: 1.66; } .spar-tdm__steps li { grid-template-columns: 38px minmax(0, 1fr); gap: 10px; padding: 12px; } .spar-tdm__step-number { width: 38px; height: 38px; } .spar-tdm__diagram { grid-template-columns: minmax(0, 1fr); padding: 17px; gap: 9px; } .spar-tdm__diagram-room, .spar-tdm__diagram-wall { min-height: auto; padding: 18px 14px; } .spar-tdm__diagram-wave { min-height: 30px; transform: rotate(90deg); } .spar-tdm__diagram-wall > span:first-child { writing-mode: horizontal-tb; transform: none; } .spar-tdm__diagram-note { grid-column: auto; } .spar-tdm__factors-grid, .spar-tdm__method-list { grid-template-columns: minmax(0, 1fr); } .spar-tdm__factor, .spar-tdm__method-list li { padding: 19px 17px; border-radius: 16px; } .spar-tdm__signals { padding: 23px 17px; border-radius: 20px; } .spar-tdm__signals-list li { grid-template-columns: 38px minmax(0, 1fr); gap: 10px; padding: 12px; } .spar-tdm__signals-list li > span { width: 38px; height: 38px; } .spar-tdm__evaluation { grid-template-columns: minmax(0, 1fr); align-items: start; gap: 15px; padding: 21px 17px; border-radius: 18px; } .spar-tdm__evaluation-icon { width: 54px; height: 54px; border-radius: 15px; } .spar-tdm__evaluation-icon svg { width: 31px; height: 31px; } .spar-tdm__evaluation h4 { font-size: 1.28rem; } .spar-tdm__evaluation-content > p:not(.spar-tdm__evaluation-label) { font-size: 0.9rem; line-height: 1.65; } .spar-tdm__comparison-card { padding: 20px 17px; border-radius: 17px; } .spar-tdm__conversion { padding: 22px 17px; border-radius: 19px; } .spar-tdm__button { width: 100%; min-height: 58px; padding-inline: 13px; font-size: 0.87rem; } } /* ============================================================ SMARTPHONE MOLTO STRETTI ============================================================ */ @media (max-width: 380px) { .spar-tdm__container { width: calc(100% - 22px); } .spar-tdm__title { font-size: 1.82rem; } .spar-tdm__diagram, .spar-tdm__factor, .spar-tdm__signals, .spar-tdm__evaluation, .spar-tdm__comparison-card, .spar-tdm__method-list li, .spar-tdm__conversion { padding-inline: 14px; } .spar-tdm__button { gap: 8px; padding-inline: 10px; font-size: 0.83rem; } .spar-tdm__button svg { flex-basis: 21px; width: 21px; height: 21px; } } /* ============================================================ ACCESSIBILITÀ ============================================================ */ @media (prefers-reduced-motion: reduce) { .spar-tdm__button { transition: none; } .spar-tdm__button:hover { transform: none; } } /* ============================================================ STAMPA ============================================================ */ @media print { .spar-tdm { padding: 30px 0; background: #ffffff; } .spar-tdm__signals { border: 1px solid #ccdede; background: #ffffff; box-shadow: none; } .spar-tdm__signals-content h4, .spar-tdm__signals-list strong { color: var(--spar-tdm-text); } .spar-tdm__signals-content > p:not(.spar-tdm__section-label), .spar-tdm__signals-list p { color: var(--spar-tdm-muted); } .spar-tdm__actions { display: none; } }#imCell_10 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHTMLObject_1726_10 { position: relative; align-self: start; justify-self: center; max-width: 100%; box-sizing: border-box; z-index: 3; } #imCellStyleGraphics_10 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imCellStyleBorders_10 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } /* ============================================================ H3 — PASSAGGI LATERALI DA SOFFITTO, PAVIMENTO E PARETI ADIACENTI Pagina: /isolamento-acustico-pareti-roma.html ============================================================ */ .spar-lat, .spar-lat *, .spar-lat *::before, .spar-lat *::after { box-sizing: border-box; } .spar-lat { --spar-lat-blue-dark: #07343b; --spar-lat-blue-deep: #05282e; --spar-lat-blue-medium: #0b5159; --spar-lat-teal: #24bfc1; --spar-lat-teal-light: #c7f1ef; --spar-lat-orange: #ff8a2a; --spar-lat-orange-dark: #d86812; --spar-lat-green: #27ad68; --spar-lat-green-dark: #19864f; --spar-lat-white: #ffffff; --spar-lat-cream: #fff8ed; --spar-lat-light: #edf8f7; --spar-lat-text: #173c41; --spar-lat-muted: #557277; --spar-lat-border: #d4e6e4; --spar-lat-shadow: 0 20px 52px rgba(6, 52, 59, 0.1); position: relative; width: 100%; max-width: 100%; overflow: hidden; padding-block: clamp(66px, 8vw, 108px); background: radial-gradient( circle at 4% 9%, rgba(36, 191, 193, 0.11), transparent 27% ), radial-gradient( circle at 96% 92%, rgba(255, 138, 42, 0.09), transparent 25% ), var(--spar-lat-cream); color: var(--spar-lat-text); } .spar-lat h3, .spar-lat h4, .spar-lat h5, .spar-lat p, .spar-lat li, .spar-lat span, .spar-lat strong, .spar-lat small, .spar-lat a { max-width: 100%; white-space: normal; overflow-wrap: break-word; word-break: normal; } .spar-lat__container { width: min(calc(100% - 40px), 1220px); max-width: 1220px; margin-inline: auto; } /* ============================================================ HEADER ============================================================ */ .spar-lat__header { width: min(100%, 950px); margin-inline: auto; text-align: center; } .spar-lat__eyebrow, .spar-lat__section-label { margin: 0 0 13px; color: var(--spar-lat-orange-dark); font-size: 0.76rem; font-weight: 900; line-height: 1.4; letter-spacing: 0.08em; text-transform: uppercase; } .spar-lat__title { margin: 0; color: var(--spar-lat-blue-dark); font-family: inherit; font-size: clamp(2rem, 4.1vw, 3.45rem); font-weight: 900; line-height: 1.08; letter-spacing: -0.04em; text-wrap: balance; } .spar-lat__direct-answer { margin: 25px auto 0; color: var(--spar-lat-blue-dark); font-size: clamp(1.05rem, 1.45vw, 1.2rem); font-weight: 650; line-height: 1.7; } .spar-lat__direct-answer strong { color: inherit; font-weight: 900; } .spar-lat__intro { margin: 15px auto 0; color: var(--spar-lat-muted); font-size: 1rem; line-height: 1.74; } /* ============================================================ RISPOSTA DIRETTA ============================================================ */ .spar-lat__answer { display: grid; grid-template-columns: 78px minmax(0, 1fr); align-items: center; gap: 23px; width: min(100%, 1000px); margin: clamp(36px, 5vw, 57px) auto 0; padding: clamp(23px, 3vw, 34px); border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 22px; background: var(--spar-lat-white); box-shadow: var(--spar-lat-shadow); } .spar-lat__answer-icon { display: grid; place-items: center; width: 72px; height: 72px; border-radius: 20px; background: var(--spar-lat-blue-dark); color: var(--spar-lat-teal-light); } .spar-lat__answer-icon svg { display: block; width: 43px; height: 43px; } .spar-lat__answer-content { min-width: 0; } .spar-lat__answer-label { margin: 0 0 7px; color: var(--spar-lat-orange-dark); font-size: 0.72rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-lat__answer-content h4 { margin: 0; color: var(--spar-lat-blue-dark); font-size: clamp(1.22rem, 2vw, 1.62rem); font-weight: 900; line-height: 1.3; } .spar-lat__answer-content > p:last-child { margin: 10px 0 0; color: var(--spar-lat-muted); font-size: 0.96rem; line-height: 1.68; } /* ============================================================ PERCORSI LATERALI ============================================================ */ .spar-lat__routes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin-top: clamp(40px, 5vw, 62px); } .spar-lat__route { position: relative; display: flex; min-width: 0; flex-direction: column; padding: clamp(22px, 2.5vw, 31px); border: 1px solid var(--spar-lat-border); border-top: 5px solid var(--spar-lat-blue-dark); border-radius: 20px; background: var(--spar-lat-white); box-shadow: 0 14px 36px rgba(6, 52, 59, 0.08); } .spar-lat__route--teal { border-top-color: var(--spar-lat-teal); } .spar-lat__route--orange { border-top-color: var(--spar-lat-orange); } .spar-lat__route-top { display: flex; align-items: center; justify-content: space-between; gap: 15px; } .spar-lat__route-number { color: rgba(7, 52, 59, 0.23); font-size: 1.75rem; font-weight: 950; line-height: 1; } .spar-lat__route-icon { display: grid; flex: 0 0 48px; place-items: center; width: 48px; height: 48px; border-radius: 15px; background: var(--spar-lat-light); color: var(--spar-lat-blue-dark); } .spar-lat__route-icon svg { display: block; width: 27px; height: 27px; } .spar-lat__route h4 { margin: 21px 0 13px; color: var(--spar-lat-blue-dark); font-size: clamp(1.2rem, 1.65vw, 1.43rem); font-weight: 900; line-height: 1.28; letter-spacing: -0.02em; } .spar-lat__route > p { margin: 0; color: var(--spar-lat-muted); font-size: 0.93rem; line-height: 1.68; } .spar-lat__route > p + p { margin-top: 12px; } .spar-lat__route-signal { display: grid; gap: 6px; margin-top: auto; padding: 15px; border-radius: 13px; background: var(--spar-lat-light); } .spar-lat__route > p + .spar-lat__route-signal { margin-top: 20px; } .spar-lat__route-signal strong { color: var(--spar-lat-orange-dark); font-size: 0.72rem; font-weight: 900; line-height: 1.3; letter-spacing: 0.055em; text-transform: uppercase; } .spar-lat__route-signal span { color: var(--spar-lat-blue-dark); font-size: 0.85rem; font-weight: 700; line-height: 1.52; } /* ============================================================ PERCORSO E DIAGRAMMA ============================================================ */ .spar-lat__path { display: grid; grid-template-columns: minmax(0, 0.93fr) minmax(430px, 1.07fr); align-items: center; gap: clamp(36px, 5vw, 68px); margin-top: clamp(58px, 7vw, 88px); } .spar-lat__path-content, .spar-lat__evaluation-content { min-width: 0; } .spar-lat__path-content h4, .spar-lat__clues-header h4, .spar-lat__evaluation-content h4, .spar-lat__analysis-header h4, .spar-lat__trust h4, .spar-lat__conversion h4 { margin: 0; color: var(--spar-lat-blue-dark); font-size: clamp(1.65rem, 2.9vw, 2.42rem); font-weight: 900; line-height: 1.16; letter-spacing: -0.032em; text-wrap: balance; } .spar-lat__path-content > p:not(.spar-lat__section-label), .spar-lat__evaluation-content > p:not(.spar-lat__section-label) { margin: 18px 0 0; color: var(--spar-lat-muted); font-size: 0.97rem; line-height: 1.72; } .spar-lat__path-content > p + p, .spar-lat__evaluation-content > p + p { margin-top: 12px; } .spar-lat__path-highlight, .spar-lat__evaluation-highlight { padding: 15px 17px; border-left: 4px solid var(--spar-lat-orange); border-radius: 0 12px 12px 0; background: #fff0e2; color: var(--spar-lat-blue-dark) !important; font-weight: 750; } /* ============================================================ DIAGRAMMA ============================================================ */ .spar-lat__diagram { min-width: 0; padding: 20px; border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 22px; background: var(--spar-lat-white); box-shadow: var(--spar-lat-shadow); } .spar-lat__diagram-ceiling, .spar-lat__diagram-floor { position: relative; display: flex; min-height: 46px; align-items: center; justify-content: center; padding: 9px 12px; border-radius: 9px; background: repeating-linear-gradient( 45deg, #cfdada, #cfdada 9px, #e2e8e8 9px, #e2e8e8 18px ); color: #3d5559; font-size: 0.69rem; font-weight: 900; line-height: 1.3; text-align: center; text-transform: uppercase; } .spar-lat__diagram-center { display: grid; grid-template-columns: minmax(0, 1fr) 68px minmax(0, 1fr); min-width: 0; min-height: 245px; } .spar-lat__diagram-source, .spar-lat__diagram-room { display: flex; min-width: 0; align-items: center; justify-content: center; flex-direction: column; padding: 20px 15px; text-align: center; } .spar-lat__diagram-source { background: #fff0e2; color: #703507; } .spar-lat__diagram-room { background: var(--spar-lat-light); color: var(--spar-lat-blue-dark); } .spar-lat__diagram-label { font-size: 0.72rem; font-weight: 900; line-height: 1.4; text-transform: uppercase; } .spar-lat__diagram-source strong, .spar-lat__diagram-room strong { margin-top: 10px; color: inherit; font-size: 0.84rem; line-height: 1.4; } .spar-lat__diagram-speaker { display: grid; place-items: center; width: 58px; height: 58px; margin-top: 19px; border-radius: 17px; background: var(--spar-lat-orange); color: #321705; } .spar-lat__diagram-speaker svg { width: 34px; height: 34px; } .spar-lat__diagram-wall { position: relative; display: flex; min-width: 0; align-items: center; justify-content: center; border-inline: 2px solid #909fa1; background: repeating-linear-gradient( 45deg, #d8dfdf, #d8dfdf 8px, #c9d2d2 8px, #c9d2d2 16px ); } .spar-lat__diagram-wall > span:first-child { writing-mode: vertical-rl; transform: rotate(180deg); color: #3c5357; font-size: 0.67rem; font-weight: 900; line-height: 1.2; text-transform: uppercase; } .spar-lat__diagram-direct { position: absolute; right: -24px; z-index: 2; display: grid; place-items: center; width: 47px; height: 36px; border-radius: 999px; background: var(--spar-lat-orange); color: #321705; font-size: 1.35rem; font-weight: 900; } .spar-lat__diagram-flow { position: absolute; left: 18%; color: var(--spar-lat-blue-medium); font-size: 0.82rem; font-weight: 900; letter-spacing: 0.08em; } .spar-lat__diagram-flow--top { top: 14px; } .spar-lat__diagram-flow--bottom { bottom: 14px; } .spar-lat__diagram-side { display: flex; gap: 12px; margin-top: 20px; color: var(--spar-lat-orange); font-size: 1.3rem; font-weight: 900; } .spar-lat__diagram-note { margin: 16px 0 0; color: var(--spar-lat-muted); font-size: 0.75rem; line-height: 1.5; text-align: center; } /* ============================================================ INDIZI ============================================================ */ .spar-lat__clues, .spar-lat__analysis { margin-top: clamp(60px, 8vw, 94px); } .spar-lat__clues-header, .spar-lat__analysis-header { width: min(100%, 850px); margin-inline: auto; text-align: center; } .spar-lat__clues-header > p:last-child, .spar-lat__analysis-header > p:last-child { margin: 17px auto 0; color: var(--spar-lat-muted); font-size: 0.97rem; line-height: 1.72; } .spar-lat__clues-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 17px; margin-top: 33px; } .spar-lat__clue { min-width: 0; padding: 22px; border: 1px solid var(--spar-lat-border); border-radius: 18px; background: var(--spar-lat-white); box-shadow: 0 12px 30px rgba(6, 52, 59, 0.07); } .spar-lat__clue-icon { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 14px; background: var(--spar-lat-light); color: var(--spar-lat-blue-dark); } .spar-lat__clue-icon svg { width: 27px; height: 27px; } .spar-lat__clue h5 { margin: 17px 0 0; color: var(--spar-lat-blue-dark); font-size: 1.03rem; font-weight: 900; line-height: 1.35; } .spar-lat__clue p { margin: 9px 0 0; color: var(--spar-lat-muted); font-size: 0.86rem; line-height: 1.62; } /* ============================================================ VALUTAZIONE ============================================================ */ .spar-lat__evaluation { display: grid; grid-template-columns: minmax(0, 0.95fr) minmax(390px, 1.05fr); align-items: center; gap: clamp(35px, 5vw, 68px); margin-top: clamp(58px, 7vw, 88px); padding: clamp(28px, 4vw, 48px); border-radius: 25px; background: radial-gradient( circle at 94% 8%, rgba(36, 191, 193, 0.2), transparent 30% ), linear-gradient( 135deg, var(--spar-lat-blue-deep), var(--spar-lat-blue-dark) ); box-shadow: 0 24px 62px rgba(3, 35, 40, 0.2); } .spar-lat__evaluation .spar-lat__section-label { color: var(--spar-lat-orange); } .spar-lat__evaluation-content h4 { color: var(--spar-lat-white); } .spar-lat__evaluation-content > p:not(.spar-lat__section-label) { color: rgba(255, 255, 255, 0.74); } .spar-lat__evaluation-highlight { border-left-color: var(--spar-lat-orange); background: rgba(255, 255, 255, 0.08); color: var(--spar-lat-white) !important; } .spar-lat__evaluation-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; min-width: 0; } .spar-lat__evaluation-card { min-width: 0; padding: 22px; border: 1px solid rgba(255, 255, 255, 0.14); border-top: 5px solid var(--spar-lat-teal); border-radius: 18px; background: rgba(255, 255, 255, 0.08); } .spar-lat__evaluation-card--extended { border-top-color: var(--spar-lat-orange); } .spar-lat__evaluation-symbol { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 13px; background: rgba(36, 191, 193, 0.16); color: var(--spar-lat-teal-light); font-size: 1rem; font-weight: 900; } .spar-lat__evaluation-card--extended .spar-lat__evaluation-symbol { background: rgba(255, 138, 42, 0.16); color: var(--spar-lat-orange); } .spar-lat__evaluation-card h5 { margin: 17px 0 0; color: var(--spar-lat-white); font-size: 1.07rem; font-weight: 900; line-height: 1.35; } .spar-lat__evaluation-card p { margin: 10px 0 0; color: rgba(255, 255, 255, 0.69); font-size: 0.84rem; line-height: 1.6; } /* ============================================================ ANALISI ============================================================ */ .spar-lat__analysis-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin: 33px 0 0; padding: 0; list-style: none; } .spar-lat__analysis-list li { min-width: 0; padding: 22px; border: 1px solid var(--spar-lat-border); border-radius: 18px; background: var(--spar-lat-white); box-shadow: 0 12px 30px rgba(6, 52, 59, 0.07); } .spar-lat__analysis-number { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; background: var(--spar-lat-blue-dark); color: var(--spar-lat-teal-light); font-size: 0.8rem; font-weight: 900; } .spar-lat__analysis-list strong { display: block; margin-top: 17px; color: var(--spar-lat-blue-dark); font-size: 0.94rem; font-weight: 900; line-height: 1.4; } .spar-lat__analysis-list p { margin: 8px 0 0; color: var(--spar-lat-muted); font-size: 0.84rem; line-height: 1.58; } /* ============================================================ FIDUCIA ============================================================ */ .spar-lat__trust { display: grid; grid-template-columns: 74px minmax(0, 1fr); align-items: center; gap: 23px; margin-top: clamp(44px, 6vw, 68px); padding: clamp(24px, 3vw, 35px); border: 1px solid rgba(255, 138, 42, 0.31); border-radius: 21px; background: #fff3e7; } .spar-lat__trust-icon { display: grid; place-items: center; width: 70px; height: 70px; border-radius: 20px; background: var(--spar-lat-orange); color: #321705; } .spar-lat__trust-icon svg { width: 41px; height: 41px; } .spar-lat__trust-content { min-width: 0; } .spar-lat__trust-label { margin: 0 0 7px; color: var(--spar-lat-orange-dark); font-size: 0.72rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-lat__trust h4 { font-size: clamp(1.35rem, 2.2vw, 1.88rem); } .spar-lat__trust-content > p:last-child { margin: 11px 0 0; color: var(--spar-lat-muted); font-size: 0.94rem; line-height: 1.68; } /* ============================================================ CTA ============================================================ */ .spar-lat__conversion { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(330px, 0.92fr); align-items: center; gap: clamp(31px, 5vw, 66px); margin-top: clamp(53px, 7vw, 84px); padding: clamp(27px, 4vw, 47px); border: 1px solid rgba(36, 191, 193, 0.24); border-radius: 24px; background: var(--spar-lat-white); box-shadow: var(--spar-lat-shadow); } .spar-lat__conversion-content { min-width: 0; } .spar-lat__conversion-label { margin: 0 0 12px; color: var(--spar-lat-orange-dark); font-size: 0.74rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-lat__conversion-content > p:not(.spar-lat__conversion-label) { margin: 16px 0 0; color: var(--spar-lat-muted); font-size: 0.96rem; line-height: 1.71; } .spar-lat__conversion-content > p + p { margin-top: 11px; } .spar-lat__actions { display: grid; gap: 11px; min-width: 0; } .spar-lat__button { display: flex; min-width: 0; min-height: 58px; align-items: center; justify-content: center; gap: 10px; padding: 13px 17px; border: 2px solid transparent; border-radius: 12px; font-family: inherit; font-size: 0.91rem; font-weight: 850; line-height: 1.3; text-align: center; text-decoration: none; transition: transform 180ms ease, box-shadow 180ms ease, background-color 180ms ease, border-color 180ms ease; } .spar-lat__button:hover { transform: translateY(-2px); } .spar-lat__button:focus-visible { outline: 3px solid var(--spar-lat-blue-dark); outline-offset: 4px; } .spar-lat__button svg { flex: 0 0 23px; width: 23px; height: 23px; } .spar-lat__button--primary { background: var(--spar-lat-orange); color: #2c1504; box-shadow: 0 12px 27px rgba(255, 138, 42, 0.22); } .spar-lat__button--primary:hover { background: #ff9b43; } .spar-lat__button--whatsapp { background: var(--spar-lat-green); color: var(--spar-lat-white); box-shadow: 0 12px 27px rgba(39, 173, 104, 0.2); } .spar-lat__button--whatsapp:hover { background: var(--spar-lat-green-dark); } .spar-lat__button--phone { border-color: rgba(7, 52, 59, 0.32); background: var(--spar-lat-white); color: var(--spar-lat-blue-dark); } .spar-lat__button--phone:hover { border-color: var(--spar-lat-teal); background: var(--spar-lat-light); } .spar-lat__phone-text { display: grid; min-width: 0; gap: 1px; text-align: left; } .spar-lat__phone-text small { font-size: 0.64rem; font-weight: 750; line-height: 1.1; letter-spacing: 0.055em; text-transform: uppercase; } .spar-lat__phone-text strong { color: inherit; font-size: 1rem; font-weight: 900; line-height: 1.15; } /* ============================================================ NOTEBOOK E TABLET ORIZZONTALE ============================================================ */ @media (max-width: 1080px) { .spar-lat__routes { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-lat__route:last-child { grid-column: 1 / -1; } .spar-lat__path, .spar-lat__evaluation, .spar-lat__conversion { grid-template-columns: minmax(0, 1fr); } .spar-lat__path-content, .spar-lat__evaluation-content, .spar-lat__conversion-content { max-width: 850px; } .spar-lat__diagram { max-width: 850px; } .spar-lat__clues-grid, .spar-lat__analysis-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-lat__actions { grid-template-columns: repeat(3, minmax(0, 1fr)); } } /* ============================================================ TABLET ============================================================ */ @media (max-width: 780px) { .spar-lat { padding-block: 60px 74px; } .spar-lat__container { width: min(calc(100% - 32px), 720px); } .spar-lat__answer { grid-template-columns: 62px minmax(0, 1fr); gap: 18px; } .spar-lat__answer-icon { width: 60px; height: 60px; border-radius: 17px; } .spar-lat__answer-icon svg { width: 36px; height: 36px; } .spar-lat__routes { grid-template-columns: minmax(0, 1fr); } .spar-lat__route:last-child { grid-column: auto; } .spar-lat__evaluation-cards { grid-template-columns: minmax(0, 1fr); } .spar-lat__actions { grid-template-columns: minmax(0, 1fr); } } /* ============================================================ MOBILE ============================================================ */ @media (max-width: 560px) { .spar-lat { padding-block: 50px 62px; } .spar-lat__container { width: calc(100% - 28px); } .spar-lat__header, .spar-lat__clues-header, .spar-lat__analysis-header { text-align: left; } .spar-lat__eyebrow, .spar-lat__section-label { font-size: 0.68rem; letter-spacing: 0.06em; } .spar-lat__title { font-size: clamp(1.85rem, 9.6vw, 2.65rem); line-height: 1.1; } .spar-lat__direct-answer { margin-top: 20px; font-size: 0.99rem; line-height: 1.63; } .spar-lat__intro { font-size: 0.92rem; line-height: 1.67; } .spar-lat__answer { grid-template-columns: minmax(0, 1fr); align-items: start; gap: 15px; padding: 20px 17px; border-radius: 18px; } .spar-lat__answer-icon { width: 53px; height: 53px; border-radius: 15px; } .spar-lat__answer-content h4 { font-size: 1.16rem; } .spar-lat__answer-content > p:last-child { font-size: 0.9rem; } .spar-lat__route { padding: 21px 17px; border-radius: 17px; } .spar-lat__route h4 { font-size: 1.19rem; } .spar-lat__route > p { font-size: 0.9rem; line-height: 1.65; } .spar-lat__path-content h4, .spar-lat__clues-header h4, .spar-lat__evaluation-content h4, .spar-lat__analysis-header h4, .spar-lat__conversion h4 { font-size: clamp(1.5rem, 7.5vw, 1.95rem); line-height: 1.19; } .spar-lat__path-content > p:not(.spar-lat__section-label), .spar-lat__clues-header > p:last-child, .spar-lat__evaluation-content > p:not(.spar-lat__section-label), .spar-lat__analysis-header > p:last-child, .spar-lat__conversion-content > p:not(.spar-lat__conversion-label) { font-size: 0.91rem; line-height: 1.66; } .spar-lat__diagram { padding: 16px 13px; border-radius: 18px; } .spar-lat__diagram-center { grid-template-columns: minmax(0, 1fr); min-height: auto; } .spar-lat__diagram-source, .spar-lat__diagram-room { min-height: 150px; padding: 18px 12px; } .spar-lat__diagram-wall { min-height: 60px; border: 2px solid #909fa1; } .spar-lat__diagram-wall > span:first-child { writing-mode: horizontal-tb; transform: none; } .spar-lat__diagram-direct { right: 50%; bottom: -18px; transform: translateX(50%) rotate(90deg); } .spar-lat__diagram-flow { display: none; } .spar-lat__clues-grid, .spar-lat__analysis-list { grid-template-columns: minmax(0, 1fr); } .spar-lat__clue, .spar-lat__analysis-list li { padding: 19px 17px; border-radius: 16px; } .spar-lat__evaluation { padding: 23px 17px; border-radius: 20px; } .spar-lat__evaluation-card { padding: 19px 17px; border-radius: 16px; } .spar-lat__trust { grid-template-columns: minmax(0, 1fr); align-items: start; gap: 15px; padding: 21px 17px; border-radius: 18px; } .spar-lat__trust-icon { width: 54px; height: 54px; border-radius: 15px; } .spar-lat__trust-icon svg { width: 31px; height: 31px; } .spar-lat__trust h4 { font-size: 1.28rem; } .spar-lat__trust-content > p:last-child { font-size: 0.9rem; line-height: 1.65; } .spar-lat__conversion { padding: 22px 17px; border-radius: 19px; } .spar-lat__button { width: 100%; min-height: 58px; padding-inline: 13px; font-size: 0.87rem; } } /* ============================================================ SMARTPHONE MOLTO STRETTI ============================================================ */ @media (max-width: 380px) { .spar-lat__container { width: calc(100% - 22px); } .spar-lat__title { font-size: 1.78rem; } .spar-lat__route, .spar-lat__diagram, .spar-lat__clue, .spar-lat__evaluation, .spar-lat__evaluation-card, .spar-lat__analysis-list li, .spar-lat__trust, .spar-lat__conversion { padding-inline: 14px; } .spar-lat__button { gap: 8px; padding-inline: 10px; font-size: 0.83rem; } .spar-lat__button svg { flex-basis: 21px; width: 21px; height: 21px; } } /* ============================================================ ACCESSIBILITÀ ============================================================ */ @media (prefers-reduced-motion: reduce) { .spar-lat__button { transition: none; } .spar-lat__button:hover { transform: none; } } /* ============================================================ STAMPA ============================================================ */ @media print { .spar-lat { padding: 30px 0; background: #ffffff; } .spar-lat__evaluation { border: 1px solid #ccdede; background: #ffffff; box-shadow: none; } .spar-lat__evaluation-content h4, .spar-lat__evaluation-card h5 { color: var(--spar-lat-text); } .spar-lat__evaluation-content > p:not(.spar-lat__section-label), .spar-lat__evaluation-card p { color: var(--spar-lat-muted); } .spar-lat__actions { display: none; } }#imCell_11 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHTMLObject_1726_11 { position: relative; align-self: start; justify-self: center; max-width: 100%; box-sizing: border-box; z-index: 3; } #imCellStyleGraphics_11 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imCellStyleBorders_11 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } /* ============================================================ H3 — PRESE ELETTRICHE, IMPIANTI E PUNTI DEBOLI Pagina: /isolamento-acustico-pareti-roma.html ============================================================ */ .spar-pip, .spar-pip *, .spar-pip *::before, .spar-pip *::after { box-sizing: border-box; } .spar-pip { --spar-pip-blue-dark: #07343b; --spar-pip-blue-deep: #05282e; --spar-pip-blue-medium: #0b5159; --spar-pip-teal: #24bfc1; --spar-pip-teal-light: #c7f1ef; --spar-pip-orange: #ff8a2a; --spar-pip-orange-dark: #d86812; --spar-pip-green: #27ad68; --spar-pip-green-dark: #19864f; --spar-pip-white: #ffffff; --spar-pip-cream: #fff8ed; --spar-pip-light: #edf8f7; --spar-pip-text: #173c41; --spar-pip-muted: #557277; --spar-pip-border: #d4e6e4; --spar-pip-shadow: 0 20px 52px rgba(6, 52, 59, 0.1); position: relative; width: 100%; max-width: 100%; overflow: hidden; padding-block: clamp(66px, 8vw, 108px); background: radial-gradient( circle at 96% 8%, rgba(36, 191, 193, 0.11), transparent 27% ), radial-gradient( circle at 4% 92%, rgba(255, 138, 42, 0.09), transparent 25% ), #ffffff; color: var(--spar-pip-text); } .spar-pip h3, .spar-pip h4, .spar-pip h5, .spar-pip p, .spar-pip li, .spar-pip span, .spar-pip strong, .spar-pip small, .spar-pip a { max-width: 100%; white-space: normal; overflow-wrap: break-word; word-break: normal; } .spar-pip__container { width: min(calc(100% - 40px), 1220px); max-width: 1220px; margin-inline: auto; } /* ============================================================ HEADER ============================================================ */ .spar-pip__header { width: min(100%, 950px); margin-inline: auto; text-align: center; } .spar-pip__eyebrow, .spar-pip__section-label { margin: 0 0 13px; color: var(--spar-pip-orange-dark); font-size: 0.76rem; font-weight: 900; line-height: 1.4; letter-spacing: 0.08em; text-transform: uppercase; } .spar-pip__title { margin: 0; color: var(--spar-pip-blue-dark); font-family: inherit; font-size: clamp(2rem, 4.1vw, 3.45rem); font-weight: 900; line-height: 1.08; letter-spacing: -0.04em; text-wrap: balance; } .spar-pip__direct-answer { margin: 25px auto 0; color: var(--spar-pip-blue-dark); font-size: clamp(1.05rem, 1.45vw, 1.2rem); font-weight: 650; line-height: 1.7; } .spar-pip__direct-answer strong { color: inherit; font-weight: 900; } .spar-pip__intro { margin: 15px auto 0; color: var(--spar-pip-muted); font-size: 1rem; line-height: 1.74; } /* ============================================================ RISPOSTA DIRETTA ============================================================ */ .spar-pip__answer { display: grid; grid-template-columns: 78px minmax(0, 1fr); align-items: center; gap: 23px; width: min(100%, 1000px); margin: clamp(36px, 5vw, 57px) auto 0; padding: clamp(23px, 3vw, 34px); border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 22px; background: var(--spar-pip-cream); box-shadow: var(--spar-pip-shadow); } .spar-pip__answer-icon { display: grid; place-items: center; width: 72px; height: 72px; border-radius: 20px; background: var(--spar-pip-blue-dark); color: var(--spar-pip-teal-light); } .spar-pip__answer-icon svg { display: block; width: 43px; height: 43px; } .spar-pip__answer-content { min-width: 0; } .spar-pip__answer-label { margin: 0 0 7px; color: var(--spar-pip-orange-dark); font-size: 0.72rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-pip__answer-content h4 { margin: 0; color: var(--spar-pip-blue-dark); font-size: clamp(1.22rem, 2vw, 1.62rem); font-weight: 900; line-height: 1.3; } .spar-pip__answer-content > p:last-child { margin: 10px 0 0; color: var(--spar-pip-muted); font-size: 0.96rem; line-height: 1.68; } /* ============================================================ PUNTI DEBOLI ============================================================ */ .spar-pip__weak-points { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin-top: clamp(40px, 5vw, 62px); } .spar-pip__weak-card { position: relative; display: flex; min-width: 0; flex-direction: column; padding: clamp(22px, 2.5vw, 31px); border: 1px solid var(--spar-pip-border); border-top: 5px solid var(--spar-pip-blue-dark); border-radius: 20px; background: var(--spar-pip-white); box-shadow: 0 14px 36px rgba(6, 52, 59, 0.08); } .spar-pip__weak-card--teal { border-top-color: var(--spar-pip-teal); } .spar-pip__weak-card--orange { border-top-color: var(--spar-pip-orange); } .spar-pip__weak-top { display: flex; align-items: center; justify-content: space-between; gap: 15px; } .spar-pip__weak-number { color: rgba(7, 52, 59, 0.23); font-size: 1.75rem; font-weight: 950; line-height: 1; } .spar-pip__weak-icon { display: grid; flex: 0 0 48px; place-items: center; width: 48px; height: 48px; border-radius: 15px; background: var(--spar-pip-light); color: var(--spar-pip-blue-dark); } .spar-pip__weak-icon svg { display: block; width: 27px; height: 27px; } .spar-pip__weak-card h4 { margin: 21px 0 13px; color: var(--spar-pip-blue-dark); font-size: clamp(1.2rem, 1.65vw, 1.43rem); font-weight: 900; line-height: 1.28; letter-spacing: -0.02em; } .spar-pip__weak-card > p { margin: 0; color: var(--spar-pip-muted); font-size: 0.93rem; line-height: 1.68; } .spar-pip__weak-card > p + p { margin-top: 12px; } .spar-pip__weak-signal { display: grid; gap: 6px; margin-top: auto; padding: 15px; border-radius: 13px; background: var(--spar-pip-light); } .spar-pip__weak-card > p + .spar-pip__weak-signal { margin-top: 20px; } .spar-pip__weak-signal strong { color: var(--spar-pip-orange-dark); font-size: 0.72rem; font-weight: 900; line-height: 1.3; letter-spacing: 0.055em; text-transform: uppercase; } .spar-pip__weak-signal span { color: var(--spar-pip-blue-dark); font-size: 0.85rem; font-weight: 700; line-height: 1.52; } /* ============================================================ PRESE CONTRAPPOSTE ============================================================ */ .spar-pip__opposed { display: grid; grid-template-columns: minmax(0, 0.94fr) minmax(420px, 1.06fr); align-items: center; gap: clamp(36px, 5vw, 68px); margin-top: clamp(58px, 7vw, 88px); } .spar-pip__opposed-content { min-width: 0; } .spar-pip__opposed-content h4, .spar-pip__project-header h4, .spar-pip__mistakes-content h4, .spar-pip__questions-header h4, .spar-pip__process-content h4, .spar-pip__conversion h4 { margin: 0; color: var(--spar-pip-blue-dark); font-size: clamp(1.65rem, 2.9vw, 2.42rem); font-weight: 900; line-height: 1.16; letter-spacing: -0.032em; text-wrap: balance; } .spar-pip__opposed-content > p:not(.spar-pip__section-label) { margin: 18px 0 0; color: var(--spar-pip-muted); font-size: 0.97rem; line-height: 1.72; } .spar-pip__opposed-content > p + p { margin-top: 12px; } .spar-pip__opposed-highlight { padding: 15px 17px; border-left: 4px solid var(--spar-pip-orange); border-radius: 0 12px 12px 0; background: #fff0e2; color: var(--spar-pip-blue-dark) !important; font-weight: 750; } .spar-pip__opposed-diagram { display: grid; grid-template-columns: minmax(0, 1fr) 82px minmax(0, 1fr); align-items: stretch; gap: 9px; min-width: 0; padding: 20px; border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 22px; background: var(--spar-pip-white); box-shadow: var(--spar-pip-shadow); } .spar-pip__opposed-room { display: flex; min-width: 0; min-height: 230px; align-items: center; justify-content: center; flex-direction: column; padding: 18px; border-radius: 14px; background: #fff0e2; color: #703507; text-align: center; } .spar-pip__opposed-room--protected { background: var(--spar-pip-light); color: var(--spar-pip-blue-dark); } .spar-pip__opposed-room > span:first-child { font-size: 0.72rem; font-weight: 900; line-height: 1.4; text-transform: uppercase; } .spar-pip__opposed-socket { display: flex; align-items: center; justify-content: center; gap: 9px; width: 66px; height: 66px; margin-top: 20px; border: 3px solid currentColor; border-radius: 17px; background: var(--spar-pip-white); } .spar-pip__opposed-socket i { display: block; width: 7px; height: 13px; border-radius: 999px; background: currentColor; } .spar-pip__opposed-wall { position: relative; display: flex; min-width: 0; align-items: center; justify-content: center; border-inline: 2px solid #909fa1; background: repeating-linear-gradient( 45deg, #d8dfdf, #d8dfdf 8px, #c9d2d2 8px, #c9d2d2 16px ); } .spar-pip__opposed-wall > span:first-child { writing-mode: vertical-rl; transform: rotate(180deg); color: #3c5357; font-size: 0.67rem; font-weight: 900; line-height: 1.2; text-transform: uppercase; } .spar-pip__opposed-path { position: absolute; right: -24px; z-index: 2; display: grid; place-items: center; width: 47px; height: 36px; border-radius: 999px; background: var(--spar-pip-orange); color: #321705; font-size: 1.35rem; font-weight: 900; } .spar-pip__opposed-note { grid-column: 1 / -1; margin: 7px 0 0; color: var(--spar-pip-muted); font-size: 0.76rem; line-height: 1.5; text-align: center; } /* ============================================================ PROGETTO ============================================================ */ .spar-pip__project, .spar-pip__questions { margin-top: clamp(60px, 8vw, 94px); } .spar-pip__project-header, .spar-pip__questions-header { width: min(100%, 860px); margin-inline: auto; text-align: center; } .spar-pip__project-header > p:last-child, .spar-pip__questions-header > p:last-child { margin: 17px auto 0; color: var(--spar-pip-muted); font-size: 0.97rem; line-height: 1.72; } .spar-pip__project-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 17px; margin-top: 33px; } .spar-pip__project-card { min-width: 0; padding: 22px; border: 1px solid var(--spar-pip-border); border-radius: 18px; background: var(--spar-pip-white); box-shadow: 0 12px 30px rgba(6, 52, 59, 0.07); } .spar-pip__project-icon { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 14px; background: var(--spar-pip-light); color: var(--spar-pip-blue-dark); } .spar-pip__project-icon svg { width: 27px; height: 27px; } .spar-pip__project-card h5 { margin: 17px 0 0; color: var(--spar-pip-blue-dark); font-size: 1.03rem; font-weight: 900; line-height: 1.35; } .spar-pip__project-card p { margin: 9px 0 0; color: var(--spar-pip-muted); font-size: 0.86rem; line-height: 1.62; } /* ============================================================ ERRORI ============================================================ */ .spar-pip__mistakes { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(420px, 1.1fr); align-items: center; gap: clamp(35px, 5vw, 68px); margin-top: clamp(58px, 7vw, 88px); padding: clamp(28px, 4vw, 48px); border-radius: 25px; background: radial-gradient( circle at 94% 8%, rgba(36, 191, 193, 0.2), transparent 30% ), linear-gradient( 135deg, var(--spar-pip-blue-deep), var(--spar-pip-blue-dark) ); box-shadow: 0 24px 62px rgba(3, 35, 40, 0.2); } .spar-pip__mistakes-content { min-width: 0; } .spar-pip__mistakes .spar-pip__section-label { color: var(--spar-pip-orange); } .spar-pip__mistakes-content h4 { color: var(--spar-pip-white); } .spar-pip__mistakes-content > p:not(.spar-pip__section-label) { margin: 17px 0 0; color: rgba(255, 255, 255, 0.74); font-size: 0.96rem; line-height: 1.7; } .spar-pip__mistakes-content > p + p { margin-top: 11px; } .spar-pip__mistakes-highlight { padding: 14px 16px; border-left: 4px solid var(--spar-pip-orange); border-radius: 0 11px 11px 0; background: rgba(255, 255, 255, 0.08); color: var(--spar-pip-white) !important; font-weight: 750; } .spar-pip__mistakes-list { display: grid; gap: 12px; min-width: 0; margin: 0; padding: 0; list-style: none; } .spar-pip__mistakes-list li { display: grid; grid-template-columns: 40px minmax(0, 1fr); align-items: start; gap: 12px; min-width: 0; padding: 14px; border: 1px solid rgba(255, 255, 255, 0.13); border-radius: 14px; background: rgba(255, 255, 255, 0.07); } .spar-pip__mistakes-list li > span { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: rgba(255, 138, 42, 0.16); color: var(--spar-pip-orange); font-size: 1.05rem; font-weight: 900; } .spar-pip__mistakes-list li > div { min-width: 0; } .spar-pip__mistakes-list strong { display: block; color: var(--spar-pip-white); font-size: 0.9rem; font-weight: 850; line-height: 1.35; } .spar-pip__mistakes-list p { margin: 5px 0 0; color: rgba(255, 255, 255, 0.67); font-size: 0.8rem; line-height: 1.53; } /* ============================================================ DOMANDE UTILI ============================================================ */ .spar-pip__questions-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; margin: 33px 0 0; padding: 0; list-style: none; } .spar-pip__questions-list li { display: grid; grid-template-columns: 40px minmax(0, 1fr); align-items: center; gap: 12px; min-width: 0; padding: 18px; border: 1px solid var(--spar-pip-border); border-radius: 17px; background: var(--spar-pip-cream); } .spar-pip__questions-number { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: var(--spar-pip-blue-dark); color: var(--spar-pip-teal-light); font-size: 0.75rem; font-weight: 900; } .spar-pip__questions-list p { margin: 0; color: var(--spar-pip-blue-dark); font-size: 0.9rem; font-weight: 750; line-height: 1.52; } /* ============================================================ PROCESSO ============================================================ */ .spar-pip__process { display: grid; grid-template-columns: minmax(0, 0.84fr) minmax(440px, 1.16fr); align-items: center; gap: clamp(35px, 5vw, 68px); margin-top: clamp(58px, 7vw, 88px); } .spar-pip__process-content { min-width: 0; } .spar-pip__process-content > p:not(.spar-pip__section-label) { margin: 17px 0 0; color: var(--spar-pip-muted); font-size: 0.96rem; line-height: 1.7; } .spar-pip__process-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; min-width: 0; margin: 0; padding: 0; list-style: none; } .spar-pip__process-list li { display: grid; grid-template-columns: 42px minmax(0, 1fr); align-items: start; gap: 12px; min-width: 0; padding: 15px; border: 1px solid var(--spar-pip-border); border-radius: 15px; background: var(--spar-pip-white); box-shadow: 0 10px 27px rgba(6, 52, 59, 0.07); } .spar-pip__process-list li > span { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; background: var(--spar-pip-blue-dark); color: var(--spar-pip-teal-light); font-size: 0.78rem; font-weight: 900; } .spar-pip__process-list li > div { min-width: 0; } .spar-pip__process-list strong { display: block; color: var(--spar-pip-blue-dark); font-size: 0.9rem; font-weight: 900; line-height: 1.4; } .spar-pip__process-list p { margin: 5px 0 0; color: var(--spar-pip-muted); font-size: 0.81rem; line-height: 1.55; } /* ============================================================ CTA ============================================================ */ .spar-pip__conversion { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(330px, 0.92fr); align-items: center; gap: clamp(31px, 5vw, 66px); margin-top: clamp(53px, 7vw, 84px); padding: clamp(27px, 4vw, 47px); border: 1px solid rgba(36, 191, 193, 0.24); border-radius: 24px; background: var(--spar-pip-cream); box-shadow: var(--spar-pip-shadow); } .spar-pip__conversion-content { min-width: 0; } .spar-pip__conversion-label { margin: 0 0 12px; color: var(--spar-pip-orange-dark); font-size: 0.74rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-pip__conversion-content > p:not(.spar-pip__conversion-label) { margin: 16px 0 0; color: var(--spar-pip-muted); font-size: 0.96rem; line-height: 1.71; } .spar-pip__conversion-content > p + p { margin-top: 11px; } .spar-pip__actions { display: grid; gap: 11px; min-width: 0; } .spar-pip__button { display: flex; min-width: 0; min-height: 58px; align-items: center; justify-content: center; gap: 10px; padding: 13px 17px; border: 2px solid transparent; border-radius: 12px; font-family: inherit; font-size: 0.91rem; font-weight: 850; line-height: 1.3; text-align: center; text-decoration: none; transition: transform 180ms ease, box-shadow 180ms ease, background-color 180ms ease, border-color 180ms ease; } .spar-pip__button:hover { transform: translateY(-2px); } .spar-pip__button:focus-visible { outline: 3px solid var(--spar-pip-blue-dark); outline-offset: 4px; } .spar-pip__button svg { flex: 0 0 23px; width: 23px; height: 23px; } .spar-pip__button--primary { background: var(--spar-pip-orange); color: #2c1504; box-shadow: 0 12px 27px rgba(255, 138, 42, 0.22); } .spar-pip__button--primary:hover { background: #ff9b43; } .spar-pip__button--whatsapp { background: var(--spar-pip-green); color: var(--spar-pip-white); box-shadow: 0 12px 27px rgba(39, 173, 104, 0.2); } .spar-pip__button--whatsapp:hover { background: var(--spar-pip-green-dark); } .spar-pip__button--phone { border-color: rgba(7, 52, 59, 0.32); background: var(--spar-pip-white); color: var(--spar-pip-blue-dark); } .spar-pip__button--phone:hover { border-color: var(--spar-pip-teal); background: var(--spar-pip-light); } .spar-pip__phone-text { display: grid; min-width: 0; gap: 1px; text-align: left; } .spar-pip__phone-text small { font-size: 0.64rem; font-weight: 750; line-height: 1.1; letter-spacing: 0.055em; text-transform: uppercase; } .spar-pip__phone-text strong { color: inherit; font-size: 1rem; font-weight: 900; line-height: 1.15; } /* ============================================================ NOTEBOOK E TABLET ORIZZONTALE ============================================================ */ @media (max-width: 1080px) { .spar-pip__weak-points { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-pip__weak-card:last-child { grid-column: 1 / -1; } .spar-pip__opposed, .spar-pip__mistakes, .spar-pip__process, .spar-pip__conversion { grid-template-columns: minmax(0, 1fr); } .spar-pip__opposed-content, .spar-pip__mistakes-content, .spar-pip__process-content, .spar-pip__conversion-content { max-width: 850px; } .spar-pip__opposed-diagram { max-width: 850px; } .spar-pip__project-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-pip__actions { grid-template-columns: repeat(3, minmax(0, 1fr)); } } /* ============================================================ TABLET ============================================================ */ @media (max-width: 780px) { .spar-pip { padding-block: 60px 74px; } .spar-pip__container { width: min(calc(100% - 32px), 720px); } .spar-pip__answer { grid-template-columns: 62px minmax(0, 1fr); gap: 18px; } .spar-pip__answer-icon { width: 60px; height: 60px; border-radius: 17px; } .spar-pip__answer-icon svg { width: 36px; height: 36px; } .spar-pip__weak-points { grid-template-columns: minmax(0, 1fr); } .spar-pip__weak-card:last-child { grid-column: auto; } .spar-pip__questions-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-pip__process-list { grid-template-columns: minmax(0, 1fr); } .spar-pip__actions { grid-template-columns: minmax(0, 1fr); } } /* ============================================================ MOBILE ============================================================ */ @media (max-width: 560px) { .spar-pip { padding-block: 50px 62px; } .spar-pip__container { width: calc(100% - 28px); } .spar-pip__header, .spar-pip__project-header, .spar-pip__questions-header { text-align: left; } .spar-pip__eyebrow, .spar-pip__section-label { font-size: 0.68rem; letter-spacing: 0.06em; } .spar-pip__title { font-size: clamp(1.9rem, 9.8vw, 2.7rem); line-height: 1.1; } .spar-pip__direct-answer { margin-top: 20px; font-size: 0.99rem; line-height: 1.63; } .spar-pip__intro { font-size: 0.92rem; line-height: 1.67; } .spar-pip__answer { grid-template-columns: minmax(0, 1fr); align-items: start; gap: 15px; padding: 20px 17px; border-radius: 18px; } .spar-pip__answer-icon { width: 53px; height: 53px; border-radius: 15px; } .spar-pip__answer-content h4 { font-size: 1.16rem; } .spar-pip__answer-content > p:last-child { font-size: 0.9rem; } .spar-pip__weak-card { padding: 21px 17px; border-radius: 17px; } .spar-pip__weak-card h4 { font-size: 1.19rem; } .spar-pip__weak-card > p { font-size: 0.9rem; line-height: 1.65; } .spar-pip__opposed-content h4, .spar-pip__project-header h4, .spar-pip__mistakes-content h4, .spar-pip__questions-header h4, .spar-pip__process-content h4, .spar-pip__conversion h4 { font-size: clamp(1.5rem, 7.5vw, 1.95rem); line-height: 1.19; } .spar-pip__opposed-content > p:not(.spar-pip__section-label), .spar-pip__project-header > p:last-child, .spar-pip__mistakes-content > p:not(.spar-pip__section-label), .spar-pip__questions-header > p:last-child, .spar-pip__process-content > p:not(.spar-pip__section-label), .spar-pip__conversion-content > p:not(.spar-pip__conversion-label) { font-size: 0.91rem; line-height: 1.66; } .spar-pip__opposed-diagram { grid-template-columns: minmax(0, 1fr); padding: 16px 13px; border-radius: 18px; } .spar-pip__opposed-room { min-height: 150px; padding: 18px 12px; } .spar-pip__opposed-wall { min-height: 60px; border: 2px solid #909fa1; } .spar-pip__opposed-wall > span:first-child { writing-mode: horizontal-tb; transform: none; } .spar-pip__opposed-path { right: 50%; bottom: -18px; transform: translateX(50%) rotate(90deg); } .spar-pip__opposed-note { grid-column: auto; } .spar-pip__project-grid, .spar-pip__questions-list { grid-template-columns: minmax(0, 1fr); } .spar-pip__project-card { padding: 19px 17px; border-radius: 16px; } .spar-pip__mistakes { padding: 23px 17px; border-radius: 20px; } .spar-pip__mistakes-list li { grid-template-columns: 38px minmax(0, 1fr); gap: 10px; padding: 12px; } .spar-pip__mistakes-list li > span { width: 38px; height: 38px; } .spar-pip__questions-list li { padding: 15px; } .spar-pip__process-list li { grid-template-columns: 38px minmax(0, 1fr); gap: 10px; padding: 12px; } .spar-pip__process-list li > span { width: 38px; height: 38px; } .spar-pip__conversion { padding: 22px 17px; border-radius: 19px; } .spar-pip__button { width: 100%; min-height: 58px; padding-inline: 13px; font-size: 0.87rem; } } /* ============================================================ SMARTPHONE MOLTO STRETTI ============================================================ */ @media (max-width: 380px) { .spar-pip__container { width: calc(100% - 22px); } .spar-pip__title { font-size: 1.82rem; } .spar-pip__weak-card, .spar-pip__opposed-diagram, .spar-pip__project-card, .spar-pip__mistakes, .spar-pip__questions-list li, .spar-pip__process-list li, .spar-pip__conversion { padding-inline: 14px; } .spar-pip__button { gap: 8px; padding-inline: 10px; font-size: 0.83rem; } .spar-pip__button svg { flex-basis: 21px; width: 21px; height: 21px; } } /* ============================================================ ACCESSIBILITÀ ============================================================ */ @media (prefers-reduced-motion: reduce) { .spar-pip__button { transition: none; } .spar-pip__button:hover { transform: none; } } /* ============================================================ STAMPA ============================================================ */ @media print { .spar-pip { padding: 30px 0; background: #ffffff; } .spar-pip__mistakes { border: 1px solid #ccdede; background: #ffffff; box-shadow: none; } .spar-pip__mistakes-content h4, .spar-pip__mistakes-list strong { color: var(--spar-pip-text); } .spar-pip__mistakes-content > p:not(.spar-pip__section-label), .spar-pip__mistakes-list p { color: var(--spar-pip-muted); } .spar-pip__actions { display: none; } }#imCell_12 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHTMLObject_1726_12 { position: relative; align-self: start; justify-self: center; max-width: 100%; box-sizing: border-box; z-index: 3; } #imCellStyleGraphics_12 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imCellStyleBorders_12 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } /* ============================================================ H2 — QUANDO INTERVENIRE SULLA SOLA PARETE PUÒ ESSERE SUFFICIENTE Pagina: /isolamento-acustico-pareti-roma.html ============================================================ */ .spar-suff, .spar-suff *, .spar-suff *::before, .spar-suff *::after { box-sizing: border-box; } .spar-suff { --spar-suff-blue-dark: #07343b; --spar-suff-blue-deep: #05282e; --spar-suff-blue-medium: #0b5159; --spar-suff-teal: #24bfc1; --spar-suff-teal-light: #c7f1ef; --spar-suff-orange: #ff8a2a; --spar-suff-orange-dark: #d86812; --spar-suff-green: #27ad68; --spar-suff-green-dark: #19864f; --spar-suff-white: #ffffff; --spar-suff-cream: #fff8ed; --spar-suff-light: #edf8f7; --spar-suff-text: #173c41; --spar-suff-muted: #557277; --spar-suff-border: #d4e6e4; --spar-suff-shadow: 0 20px 52px rgba(6, 52, 59, 0.1); position: relative; width: 100%; max-width: 100%; overflow: hidden; padding-block: clamp(66px, 8vw, 108px); background: radial-gradient( circle at 4% 8%, rgba(36, 191, 193, 0.11), transparent 27% ), radial-gradient( circle at 96% 92%, rgba(255, 138, 42, 0.09), transparent 25% ), var(--spar-suff-cream); color: var(--spar-suff-text); } .spar-suff h2, .spar-suff h3, .spar-suff h4, .spar-suff p, .spar-suff li, .spar-suff span, .spar-suff strong, .spar-suff small, .spar-suff a { max-width: 100%; white-space: normal; overflow-wrap: break-word; word-break: normal; } .spar-suff__container { width: min(calc(100% - 40px), 1220px); max-width: 1220px; margin-inline: auto; } /* ============================================================ HEADER ============================================================ */ .spar-suff__header { width: min(100%, 950px); margin-inline: auto; text-align: center; } .spar-suff__eyebrow, .spar-suff__section-label { margin: 0 0 13px; color: var(--spar-suff-orange-dark); font-size: 0.76rem; font-weight: 900; line-height: 1.4; letter-spacing: 0.08em; text-transform: uppercase; } .spar-suff__title { margin: 0; color: var(--spar-suff-blue-dark); font-family: inherit; font-size: clamp(2.05rem, 4.25vw, 3.6rem); font-weight: 900; line-height: 1.07; letter-spacing: -0.04em; text-wrap: balance; } .spar-suff__direct-answer { margin: 25px auto 0; color: var(--spar-suff-blue-dark); font-size: clamp(1.05rem, 1.45vw, 1.2rem); font-weight: 650; line-height: 1.7; } .spar-suff__direct-answer strong { color: inherit; font-weight: 900; } .spar-suff__intro { margin: 15px auto 0; color: var(--spar-suff-muted); font-size: 1rem; line-height: 1.74; } /* ============================================================ RISPOSTA IMMEDIATA ============================================================ */ .spar-suff__answer { display: grid; grid-template-columns: 78px minmax(0, 1fr); align-items: center; gap: 23px; width: min(100%, 1000px); margin: clamp(36px, 5vw, 57px) auto 0; padding: clamp(23px, 3vw, 34px); border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 22px; background: var(--spar-suff-white); box-shadow: var(--spar-suff-shadow); } .spar-suff__answer-icon { display: grid; place-items: center; width: 72px; height: 72px; border-radius: 20px; background: var(--spar-suff-blue-dark); color: var(--spar-suff-teal-light); } .spar-suff__answer-icon svg { display: block; width: 43px; height: 43px; } .spar-suff__answer-content { min-width: 0; } .spar-suff__answer-label { margin: 0 0 7px; color: var(--spar-suff-orange-dark); font-size: 0.72rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-suff__answer-content h3 { margin: 0; color: var(--spar-suff-blue-dark); font-size: clamp(1.22rem, 2vw, 1.62rem); font-weight: 900; line-height: 1.3; } .spar-suff__answer-content > p:last-child { margin: 10px 0 0; color: var(--spar-suff-muted); font-size: 0.96rem; line-height: 1.68; } /* ============================================================ SCENARI ============================================================ */ .spar-suff__scenarios { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; margin-top: clamp(42px, 5vw, 64px); } .spar-suff__scenario { position: relative; min-width: 0; padding: clamp(25px, 3vw, 37px); border: 1px solid rgba(36, 191, 193, 0.25); border-top: 6px solid var(--spar-suff-teal); border-radius: 22px; background: var(--spar-suff-white); box-shadow: 0 16px 42px rgba(6, 52, 59, 0.09); } .spar-suff__scenario--complex { border-color: rgba(255, 138, 42, 0.3); border-top-color: var(--spar-suff-orange); background: #fffaf5; } .spar-suff__scenario-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; } .spar-suff__scenario-number { color: rgba(7, 52, 59, 0.22); font-size: 1.85rem; font-weight: 950; line-height: 1; } .spar-suff__scenario-icon { display: grid; flex: 0 0 52px; place-items: center; width: 52px; height: 52px; border-radius: 16px; background: var(--spar-suff-light); color: var(--spar-suff-blue-dark); } .spar-suff__scenario--complex .spar-suff__scenario-icon { background: #fff0e2; color: var(--spar-suff-orange-dark); } .spar-suff__scenario-icon svg { width: 29px; height: 29px; } .spar-suff__scenario h3 { margin: 23px 0 0; color: var(--spar-suff-blue-dark); font-size: clamp(1.45rem, 2.3vw, 1.9rem); font-weight: 900; line-height: 1.23; letter-spacing: -0.025em; } .spar-suff__scenario > p { margin: 16px 0 0; color: var(--spar-suff-muted); font-size: 0.95rem; line-height: 1.71; } .spar-suff__scenario > p + p { margin-top: 12px; } .spar-suff__scenario-highlight { padding: 15px 17px; border-left: 4px solid var(--spar-suff-teal); border-radius: 0 12px 12px 0; background: var(--spar-suff-light); color: var(--spar-suff-blue-dark) !important; font-weight: 750; } .spar-suff__scenario--complex .spar-suff__scenario-highlight { border-left-color: var(--spar-suff-orange); background: #fff0e2; } .spar-suff__signals { margin-top: 24px; padding: 19px; border-radius: 16px; background: var(--spar-suff-cream); } .spar-suff__scenario--complex .spar-suff__signals { background: var(--spar-suff-white); } .spar-suff__signals-label { margin: 0; color: var(--spar-suff-orange-dark); font-size: 0.72rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.065em; text-transform: uppercase; } .spar-suff__signals ul { display: grid; gap: 10px; margin: 15px 0 0; padding: 0; list-style: none; } .spar-suff__signals li { position: relative; padding-left: 27px; color: var(--spar-suff-muted); font-size: 0.88rem; line-height: 1.58; } .spar-suff__signals li::before { content: "✓"; position: absolute; top: 0; left: 0; display: grid; place-items: center; width: 19px; height: 19px; border-radius: 50%; background: rgba(36, 191, 193, 0.13); color: var(--spar-suff-blue-medium); font-size: 0.68rem; font-weight: 900; } .spar-suff__scenario--complex .spar-suff__signals li::before { content: "!"; background: rgba(255, 138, 42, 0.14); color: var(--spar-suff-orange-dark); } /* ============================================================ CONFRONTO ============================================================ */ .spar-suff__comparison { display: grid; grid-template-columns: minmax(0, 0.92fr) minmax(430px, 1.08fr); align-items: center; gap: clamp(36px, 5vw, 68px); margin-top: clamp(60px, 8vw, 94px); } .spar-suff__comparison-content { min-width: 0; } .spar-suff__comparison-content h3, .spar-suff__limits-header h3, .spar-suff__analysis-content h3, .spar-suff__trust h3, .spar-suff__conversion h3 { margin: 0; color: var(--spar-suff-blue-dark); font-size: clamp(1.65rem, 2.9vw, 2.42rem); font-weight: 900; line-height: 1.16; letter-spacing: -0.032em; text-wrap: balance; } .spar-suff__comparison-content > p:not(.spar-suff__section-label) { margin: 18px 0 0; color: var(--spar-suff-muted); font-size: 0.97rem; line-height: 1.72; } .spar-suff__comparison-content > p + p { margin-top: 12px; } .spar-suff__comparison-highlight, .spar-suff__analysis-highlight { padding: 15px 17px; border-left: 4px solid var(--spar-suff-orange); border-radius: 0 12px 12px 0; background: #fff0e2; color: var(--spar-suff-blue-dark) !important; font-weight: 750; } .spar-suff__comparison-visual { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; min-width: 0; } .spar-suff__comparison-card { min-width: 0; padding: 22px; border: 1px solid rgba(36, 191, 193, 0.27); border-top: 5px solid var(--spar-suff-teal); border-radius: 19px; background: var(--spar-suff-white); box-shadow: 0 13px 34px rgba(6, 52, 59, 0.08); } .spar-suff__comparison-card--extended { border-color: rgba(255, 138, 42, 0.31); border-top-color: var(--spar-suff-orange); } .spar-suff__comparison-badge { display: inline-flex; width: fit-content; padding: 7px 10px; border-radius: 999px; background: var(--spar-suff-blue-dark); color: var(--spar-suff-white); font-size: 0.64rem; font-weight: 900; line-height: 1.3; letter-spacing: 0.055em; text-transform: uppercase; } .spar-suff__comparison-card--extended .spar-suff__comparison-badge { background: var(--spar-suff-orange); color: #321705; } .spar-suff__room-diagram { position: relative; display: grid; place-items: center; min-height: 145px; margin-top: 18px; overflow: hidden; border: 2px solid var(--spar-suff-blue-dark); border-radius: 13px; background: var(--spar-suff-light); } .spar-suff__room-wall { position: absolute; top: 0; bottom: 0; left: 0; display: grid; place-items: center; width: 34px; background: repeating-linear-gradient( 45deg, #d6dddd, #d6dddd 7px, #c7d0d0 7px, #c7d0d0 14px ); color: #3d5559; font-size: 0.59rem; font-weight: 900; writing-mode: vertical-rl; transform: rotate(180deg); text-transform: uppercase; } .spar-suff__room-focus, .spar-suff__room-flow { color: var(--spar-suff-orange); font-size: 1.15rem; font-weight: 900; } .spar-suff__room-flow { position: absolute; } .spar-suff__room-flow--top { top: 15px; left: 42%; } .spar-suff__room-flow--side { top: 55%; right: 14px; transform: rotate(90deg); } .spar-suff__room-flow--bottom { bottom: 14px; left: 42%; } .spar-suff__comparison-card h4 { margin: 18px 0 0; color: var(--spar-suff-blue-dark); font-size: 1.08rem; font-weight: 900; line-height: 1.35; } .spar-suff__comparison-card p { margin: 9px 0 0; color: var(--spar-suff-muted); font-size: 0.85rem; line-height: 1.6; } /* ============================================================ LIMITI ============================================================ */ .spar-suff__limits { margin-top: clamp(60px, 8vw, 94px); } .spar-suff__limits-header { width: min(100%, 860px); margin-inline: auto; text-align: center; } .spar-suff__limits-header > p:last-child { margin: 17px auto 0; color: var(--spar-suff-muted); font-size: 0.97rem; line-height: 1.72; } .spar-suff__limits-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 17px; margin-top: 33px; } .spar-suff__limit { min-width: 0; padding: 22px; border: 1px solid var(--spar-suff-border); border-radius: 18px; background: var(--spar-suff-white); box-shadow: 0 12px 30px rgba(6, 52, 59, 0.07); } .spar-suff__limit-icon { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 14px; background: var(--spar-suff-light); color: var(--spar-suff-blue-dark); } .spar-suff__limit-icon svg { width: 27px; height: 27px; } .spar-suff__limit h4 { margin: 17px 0 0; color: var(--spar-suff-blue-dark); font-size: 1.03rem; font-weight: 900; line-height: 1.35; } .spar-suff__limit p { margin: 9px 0 0; color: var(--spar-suff-muted); font-size: 0.86rem; line-height: 1.62; } /* ============================================================ ANALISI ============================================================ */ .spar-suff__analysis { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(430px, 1.1fr); align-items: center; gap: clamp(35px, 5vw, 68px); margin-top: clamp(58px, 7vw, 88px); padding: clamp(28px, 4vw, 48px); border-radius: 25px; background: radial-gradient( circle at 94% 8%, rgba(36, 191, 193, 0.2), transparent 30% ), linear-gradient( 135deg, var(--spar-suff-blue-deep), var(--spar-suff-blue-dark) ); box-shadow: 0 24px 62px rgba(3, 35, 40, 0.2); } .spar-suff__analysis-content { min-width: 0; } .spar-suff__analysis .spar-suff__section-label { color: var(--spar-suff-orange); } .spar-suff__analysis-content h3 { color: var(--spar-suff-white); } .spar-suff__analysis-content > p:not(.spar-suff__section-label) { margin: 17px 0 0; color: rgba(255, 255, 255, 0.74); font-size: 0.96rem; line-height: 1.7; } .spar-suff__analysis-content > p + p { margin-top: 11px; } .spar-suff__analysis-highlight { border-left-color: var(--spar-suff-orange); background: rgba(255, 255, 255, 0.08); color: var(--spar-suff-white) !important; } .spar-suff__analysis-list { display: grid; gap: 12px; min-width: 0; margin: 0; padding: 0; list-style: none; } .spar-suff__analysis-list li { display: grid; grid-template-columns: 42px minmax(0, 1fr); align-items: start; gap: 13px; min-width: 0; padding: 14px; border: 1px solid rgba(255, 255, 255, 0.13); border-radius: 14px; background: rgba(255, 255, 255, 0.07); } .spar-suff__analysis-list li > span { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: rgba(36, 191, 193, 0.16); color: var(--spar-suff-teal-light); font-size: 0.76rem; font-weight: 900; } .spar-suff__analysis-list li > div { min-width: 0; } .spar-suff__analysis-list strong { display: block; color: var(--spar-suff-white); font-size: 0.91rem; font-weight: 850; line-height: 1.35; } .spar-suff__analysis-list p { margin: 5px 0 0; color: rgba(255, 255, 255, 0.67); font-size: 0.81rem; line-height: 1.53; } /* ============================================================ FIDUCIA ============================================================ */ .spar-suff__trust { display: grid; grid-template-columns: 74px minmax(0, 1fr); align-items: center; gap: 23px; margin-top: clamp(44px, 6vw, 68px); padding: clamp(24px, 3vw, 35px); border: 1px solid rgba(255, 138, 42, 0.31); border-radius: 21px; background: #fff3e7; } .spar-suff__trust-icon { display: grid; place-items: center; width: 70px; height: 70px; border-radius: 20px; background: var(--spar-suff-orange); color: #321705; } .spar-suff__trust-icon svg { width: 41px; height: 41px; } .spar-suff__trust-content { min-width: 0; } .spar-suff__trust-label { margin: 0 0 7px; color: var(--spar-suff-orange-dark); font-size: 0.72rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-suff__trust h3 { font-size: clamp(1.35rem, 2.2vw, 1.88rem); } .spar-suff__trust-content > p:last-child { margin: 11px 0 0; color: var(--spar-suff-muted); font-size: 0.94rem; line-height: 1.68; } /* ============================================================ CTA ============================================================ */ .spar-suff__conversion { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(330px, 0.92fr); align-items: center; gap: clamp(31px, 5vw, 66px); margin-top: clamp(53px, 7vw, 84px); padding: clamp(27px, 4vw, 47px); border: 1px solid rgba(36, 191, 193, 0.24); border-radius: 24px; background: var(--spar-suff-white); box-shadow: var(--spar-suff-shadow); } .spar-suff__conversion-content { min-width: 0; } .spar-suff__conversion-label { margin: 0 0 12px; color: var(--spar-suff-orange-dark); font-size: 0.74rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-suff__conversion-content > p:not(.spar-suff__conversion-label) { margin: 16px 0 0; color: var(--spar-suff-muted); font-size: 0.96rem; line-height: 1.71; } .spar-suff__conversion-content > p + p { margin-top: 11px; } .spar-suff__actions { display: grid; gap: 11px; min-width: 0; } .spar-suff__button { display: flex; min-width: 0; min-height: 58px; align-items: center; justify-content: center; gap: 10px; padding: 13px 17px; border: 2px solid transparent; border-radius: 12px; font-family: inherit; font-size: 0.91rem; font-weight: 850; line-height: 1.3; text-align: center; text-decoration: none; transition: transform 180ms ease, box-shadow 180ms ease, background-color 180ms ease, border-color 180ms ease; } .spar-suff__button:hover { transform: translateY(-2px); } .spar-suff__button:focus-visible { outline: 3px solid var(--spar-suff-blue-dark); outline-offset: 4px; } .spar-suff__button svg { flex: 0 0 23px; width: 23px; height: 23px; } .spar-suff__button--primary { background: var(--spar-suff-orange); color: #2c1504; box-shadow: 0 12px 27px rgba(255, 138, 42, 0.22); } .spar-suff__button--primary:hover { background: #ff9b43; } .spar-suff__button--whatsapp { background: var(--spar-suff-green); color: var(--spar-suff-white); box-shadow: 0 12px 27px rgba(39, 173, 104, 0.2); } .spar-suff__button--whatsapp:hover { background: var(--spar-suff-green-dark); } .spar-suff__button--phone { border-color: rgba(7, 52, 59, 0.32); background: var(--spar-suff-white); color: var(--spar-suff-blue-dark); } .spar-suff__button--phone:hover { border-color: var(--spar-suff-teal); background: var(--spar-suff-light); } .spar-suff__phone-text { display: grid; min-width: 0; gap: 1px; text-align: left; } .spar-suff__phone-text small { font-size: 0.64rem; font-weight: 750; line-height: 1.1; letter-spacing: 0.055em; text-transform: uppercase; } .spar-suff__phone-text strong { color: inherit; font-size: 1rem; font-weight: 900; line-height: 1.15; } /* ============================================================ NOTEBOOK E TABLET ORIZZONTALE ============================================================ */ @media (max-width: 1080px) { .spar-suff__comparison, .spar-suff__analysis, .spar-suff__conversion { grid-template-columns: minmax(0, 1fr); } .spar-suff__comparison-content, .spar-suff__analysis-content, .spar-suff__conversion-content { max-width: 850px; } .spar-suff__comparison-visual { max-width: 850px; } .spar-suff__limits-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-suff__actions { grid-template-columns: repeat(3, minmax(0, 1fr)); } } /* ============================================================ TABLET ============================================================ */ @media (max-width: 780px) { .spar-suff { padding-block: 60px 74px; } .spar-suff__container { width: min(calc(100% - 32px), 720px); } .spar-suff__answer { grid-template-columns: 62px minmax(0, 1fr); gap: 18px; } .spar-suff__answer-icon { width: 60px; height: 60px; border-radius: 17px; } .spar-suff__answer-icon svg { width: 36px; height: 36px; } .spar-suff__scenarios { grid-template-columns: minmax(0, 1fr); } .spar-suff__comparison-visual { grid-template-columns: minmax(0, 1fr); } .spar-suff__actions { grid-template-columns: minmax(0, 1fr); } } /* ============================================================ MOBILE ============================================================ */ @media (max-width: 560px) { .spar-suff { padding-block: 50px 62px; } .spar-suff__container { width: calc(100% - 28px); } .spar-suff__header, .spar-suff__limits-header { text-align: left; } .spar-suff__eyebrow, .spar-suff__section-label { font-size: 0.68rem; letter-spacing: 0.06em; } .spar-suff__title { font-size: clamp(1.9rem, 9.7vw, 2.7rem); line-height: 1.1; } .spar-suff__direct-answer { margin-top: 20px; font-size: 0.99rem; line-height: 1.63; } .spar-suff__intro { font-size: 0.92rem; line-height: 1.67; } .spar-suff__answer { grid-template-columns: minmax(0, 1fr); align-items: start; gap: 15px; padding: 20px 17px; border-radius: 18px; } .spar-suff__answer-icon { width: 53px; height: 53px; border-radius: 15px; } .spar-suff__answer-content h3 { font-size: 1.16rem; } .spar-suff__answer-content > p:last-child { font-size: 0.9rem; } .spar-suff__scenario { padding: 22px 17px; border-radius: 18px; } .spar-suff__scenario h3 { font-size: 1.35rem; } .spar-suff__scenario > p { font-size: 0.91rem; line-height: 1.66; } .spar-suff__signals { padding: 16px; } .spar-suff__comparison-content h3, .spar-suff__limits-header h3, .spar-suff__analysis-content h3, .spar-suff__conversion h3 { font-size: clamp(1.5rem, 7.5vw, 1.95rem); line-height: 1.19; } .spar-suff__comparison-content > p:not(.spar-suff__section-label), .spar-suff__limits-header > p:last-child, .spar-suff__analysis-content > p:not(.spar-suff__section-label), .spar-suff__conversion-content > p:not(.spar-suff__conversion-label) { font-size: 0.91rem; line-height: 1.66; } .spar-suff__comparison-card { padding: 19px 17px; border-radius: 17px; } .spar-suff__limits-grid { grid-template-columns: minmax(0, 1fr); } .spar-suff__limit { padding: 19px 17px; border-radius: 16px; } .spar-suff__analysis { padding: 23px 17px; border-radius: 20px; } .spar-suff__analysis-list li { grid-template-columns: 38px minmax(0, 1fr); gap: 10px; padding: 12px; } .spar-suff__analysis-list li > span { width: 38px; height: 38px; } .spar-suff__trust { grid-template-columns: minmax(0, 1fr); align-items: start; gap: 15px; padding: 21px 17px; border-radius: 18px; } .spar-suff__trust-icon { width: 54px; height: 54px; border-radius: 15px; } .spar-suff__trust-icon svg { width: 31px; height: 31px; } .spar-suff__trust h3 { font-size: 1.28rem; } .spar-suff__trust-content > p:last-child { font-size: 0.9rem; line-height: 1.65; } .spar-suff__conversion { padding: 22px 17px; border-radius: 19px; } .spar-suff__button { width: 100%; min-height: 58px; padding-inline: 13px; font-size: 0.87rem; } } /* ============================================================ SMARTPHONE MOLTO STRETTI ============================================================ */ @media (max-width: 380px) { .spar-suff__container { width: calc(100% - 22px); } .spar-suff__title { font-size: 1.8rem; } .spar-suff__scenario, .spar-suff__comparison-card, .spar-suff__limit, .spar-suff__analysis, .spar-suff__trust, .spar-suff__conversion { padding-inline: 14px; } .spar-suff__button { gap: 8px; padding-inline: 10px; font-size: 0.83rem; } .spar-suff__button svg { flex-basis: 21px; width: 21px; height: 21px; } } /* ============================================================ ACCESSIBILITÀ ============================================================ */ @media (prefers-reduced-motion: reduce) { .spar-suff__button { transition: none; } .spar-suff__button:hover { transform: none; } } /* ============================================================ STAMPA ============================================================ */ @media print { .spar-suff { padding: 30px 0; background: #ffffff; } .spar-suff__analysis { border: 1px solid #ccdede; background: #ffffff; box-shadow: none; } .spar-suff__analysis-content h3, .spar-suff__analysis-list strong { color: var(--spar-suff-text); } .spar-suff__analysis-content > p:not(.spar-suff__section-label), .spar-suff__analysis-list p { color: var(--spar-suff-muted); } .spar-suff__actions { display: none; } }#imCell_13 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHTMLObject_1726_13 { position: relative; align-self: start; justify-self: center; max-width: 100%; box-sizing: border-box; z-index: 3; } #imCellStyleGraphics_13 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imCellStyleBorders_13 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } /* ============================================================ H3 — RUMORE CONCENTRATO SULLA PARETE CONFINANTE Pagina: /isolamento-acustico-pareti-roma.html ============================================================ */ .spar-rcp, .spar-rcp *, .spar-rcp *::before, .spar-rcp *::after { box-sizing: border-box; } .spar-rcp { --spar-rcp-blue-dark: #07343b; --spar-rcp-blue-deep: #05282e; --spar-rcp-blue-medium: #0b5159; --spar-rcp-teal: #24bfc1; --spar-rcp-teal-light: #c7f1ef; --spar-rcp-orange: #ff8a2a; --spar-rcp-orange-dark: #d86812; --spar-rcp-green: #27ad68; --spar-rcp-green-dark: #19864f; --spar-rcp-white: #ffffff; --spar-rcp-cream: #fff8ed; --spar-rcp-light: #edf8f7; --spar-rcp-text: #173c41; --spar-rcp-muted: #557277; --spar-rcp-border: #d4e6e4; --spar-rcp-shadow: 0 20px 52px rgba(6, 52, 59, 0.1); position: relative; width: 100%; max-width: 100%; overflow: hidden; padding-block: clamp(66px, 8vw, 108px); background: radial-gradient( circle at 96% 8%, rgba(36, 191, 193, 0.11), transparent 27% ), radial-gradient( circle at 4% 92%, rgba(255, 138, 42, 0.09), transparent 25% ), #ffffff; color: var(--spar-rcp-text); } .spar-rcp h3, .spar-rcp h4, .spar-rcp h5, .spar-rcp p, .spar-rcp li, .spar-rcp span, .spar-rcp strong, .spar-rcp small, .spar-rcp a { max-width: 100%; white-space: normal; overflow-wrap: break-word; word-break: normal; } .spar-rcp__container { width: min(calc(100% - 40px), 1220px); max-width: 1220px; margin-inline: auto; } /* ============================================================ HEADER ============================================================ */ .spar-rcp__header { width: min(100%, 950px); margin-inline: auto; text-align: center; } .spar-rcp__eyebrow, .spar-rcp__section-label { margin: 0 0 13px; color: var(--spar-rcp-orange-dark); font-size: 0.76rem; font-weight: 900; line-height: 1.4; letter-spacing: 0.08em; text-transform: uppercase; } .spar-rcp__title { margin: 0; color: var(--spar-rcp-blue-dark); font-family: inherit; font-size: clamp(2rem, 4.1vw, 3.45rem); font-weight: 900; line-height: 1.08; letter-spacing: -0.04em; text-wrap: balance; } .spar-rcp__direct-answer { margin: 25px auto 0; color: var(--spar-rcp-blue-dark); font-size: clamp(1.05rem, 1.45vw, 1.2rem); font-weight: 650; line-height: 1.7; } .spar-rcp__direct-answer strong { color: inherit; font-weight: 900; } .spar-rcp__intro { margin: 15px auto 0; color: var(--spar-rcp-muted); font-size: 1rem; line-height: 1.74; } /* ============================================================ RISPOSTA DIRETTA ============================================================ */ .spar-rcp__answer { display: grid; grid-template-columns: 78px minmax(0, 1fr); align-items: center; gap: 23px; width: min(100%, 1000px); margin: clamp(36px, 5vw, 57px) auto 0; padding: clamp(23px, 3vw, 34px); border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 22px; background: var(--spar-rcp-cream); box-shadow: var(--spar-rcp-shadow); } .spar-rcp__answer-icon { display: grid; place-items: center; width: 72px; height: 72px; border-radius: 20px; background: var(--spar-rcp-blue-dark); color: var(--spar-rcp-teal-light); } .spar-rcp__answer-icon svg { display: block; width: 43px; height: 43px; } .spar-rcp__answer-content { min-width: 0; } .spar-rcp__answer-label { margin: 0 0 7px; color: var(--spar-rcp-orange-dark); font-size: 0.72rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-rcp__answer-content h4 { margin: 0; color: var(--spar-rcp-blue-dark); font-size: clamp(1.22rem, 2vw, 1.62rem); font-weight: 900; line-height: 1.3; } .spar-rcp__answer-content > p:last-child { margin: 10px 0 0; color: var(--spar-rcp-muted); font-size: 0.96rem; line-height: 1.68; } /* ============================================================ SEGNALI ============================================================ */ .spar-rcp__signals { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 17px; margin-top: clamp(42px, 5vw, 64px); } .spar-rcp__signal { position: relative; display: flex; min-width: 0; flex-direction: column; padding: 22px; border: 1px solid var(--spar-rcp-border); border-top: 5px solid var(--spar-rcp-blue-dark); border-radius: 19px; background: var(--spar-rcp-white); box-shadow: 0 13px 34px rgba(6, 52, 59, 0.08); } .spar-rcp__signal--teal { border-top-color: var(--spar-rcp-teal); } .spar-rcp__signal--orange { border-top-color: var(--spar-rcp-orange); } .spar-rcp__signal--green { border-top-color: var(--spar-rcp-green); } .spar-rcp__signal-number { color: rgba(7, 52, 59, 0.22); font-size: 1.65rem; font-weight: 950; line-height: 1; } .spar-rcp__signal-icon { display: grid; place-items: center; width: 48px; height: 48px; margin-top: 17px; border-radius: 14px; background: var(--spar-rcp-light); color: var(--spar-rcp-blue-dark); } .spar-rcp__signal-icon svg { width: 27px; height: 27px; } .spar-rcp__signal h4 { margin: 18px 0 0; color: var(--spar-rcp-blue-dark); font-size: 1.08rem; font-weight: 900; line-height: 1.35; } .spar-rcp__signal > p { margin: 11px 0 0; color: var(--spar-rcp-muted); font-size: 0.87rem; line-height: 1.62; } .spar-rcp__signal-note { margin-top: auto !important; padding-top: 15px; border-top: 1px solid var(--spar-rcp-border); color: var(--spar-rcp-blue-dark) !important; font-weight: 750; } /* ============================================================ PERCORSO E DIAGRAMMA ============================================================ */ .spar-rcp__path, .spar-rcp__evaluation { display: grid; grid-template-columns: minmax(0, 0.92fr) minmax(430px, 1.08fr); align-items: center; gap: clamp(36px, 5vw, 68px); margin-top: clamp(60px, 8vw, 94px); } .spar-rcp__path-content, .spar-rcp__evaluation-content { min-width: 0; } .spar-rcp__path-content h4, .spar-rcp__evaluation-content h4, .spar-rcp__checks-header h4, .spar-rcp__mistakes-content h4, .spar-rcp__process-header h4, .spar-rcp__trust h4, .spar-rcp__conversion h4 { margin: 0; color: var(--spar-rcp-blue-dark); font-size: clamp(1.65rem, 2.9vw, 2.42rem); font-weight: 900; line-height: 1.16; letter-spacing: -0.032em; text-wrap: balance; } .spar-rcp__path-content > p:not(.spar-rcp__section-label), .spar-rcp__evaluation-content > p:not(.spar-rcp__section-label) { margin: 18px 0 0; color: var(--spar-rcp-muted); font-size: 0.97rem; line-height: 1.72; } .spar-rcp__path-content > p + p, .spar-rcp__evaluation-content > p + p { margin-top: 12px; } .spar-rcp__path-highlight, .spar-rcp__evaluation-highlight { padding: 15px 17px; border-left: 4px solid var(--spar-rcp-orange); border-radius: 0 12px 12px 0; background: #fff0e2; color: var(--spar-rcp-blue-dark) !important; font-weight: 750; } /* ============================================================ DIAGRAMMA ============================================================ */ .spar-rcp__diagram { display: grid; grid-template-columns: minmax(130px, 1fr) 48px minmax(72px, 0.5fr) 48px minmax(130px, 1fr); align-items: stretch; gap: 8px; min-width: 0; padding: 20px; border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 22px; background: var(--spar-rcp-white); box-shadow: var(--spar-rcp-shadow); } .spar-rcp__diagram-room, .spar-rcp__diagram-wall { display: flex; min-width: 0; min-height: 225px; align-items: center; justify-content: center; flex-direction: column; padding: 16px; border-radius: 14px; text-align: center; } .spar-rcp__diagram-room--source { background: #fff0e2; color: #703507; } .spar-rcp__diagram-room--protected { background: var(--spar-rcp-light); color: var(--spar-rcp-blue-dark); } .spar-rcp__diagram-label { font-size: 0.7rem; font-weight: 900; line-height: 1.4; text-transform: uppercase; } .spar-rcp__diagram-room strong { margin-top: 10px; color: inherit; font-size: 0.84rem; line-height: 1.4; } .spar-rcp__diagram-speaker { display: grid; place-items: center; width: 58px; height: 58px; margin-top: 20px; border-radius: 17px; background: var(--spar-rcp-orange); color: #321705; } .spar-rcp__diagram-speaker svg { width: 34px; height: 34px; } .spar-rcp__diagram-wave { display: grid; place-items: center; color: var(--spar-rcp-orange); font-size: 1.2rem; font-weight: 900; } .spar-rcp__diagram-wall { border: 2px solid #909fa1; background: repeating-linear-gradient( 45deg, #d8dfdf, #d8dfdf 8px, #c9d2d2 8px, #c9d2d2 16px ); color: #3c5357; } .spar-rcp__diagram-wall > span:first-child { writing-mode: vertical-rl; transform: rotate(180deg); font-size: 0.67rem; font-weight: 900; line-height: 1.2; text-transform: uppercase; } .spar-rcp__diagram-vibration { margin-top: 16px; padding: 7px 9px; border-radius: 9px; background: var(--spar-rcp-orange); color: #321705; font-size: 0.63rem; font-weight: 900; line-height: 1.3; text-transform: uppercase; } .spar-rcp__diagram-note { grid-column: 1 / -1; margin: 7px 0 0; color: var(--spar-rcp-muted); font-size: 0.75rem; line-height: 1.5; text-align: center; } /* ============================================================ REQUISITI ============================================================ */ .spar-rcp__requirements { display: grid; gap: 12px; min-width: 0; } .spar-rcp__requirement { display: grid; grid-template-columns: 42px minmax(0, 1fr); align-items: start; gap: 13px; min-width: 0; padding: 15px; border: 1px solid var(--spar-rcp-border); border-radius: 15px; background: var(--spar-rcp-white); box-shadow: 0 10px 27px rgba(6, 52, 59, 0.07); } .spar-rcp__requirement > span { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: var(--spar-rcp-light); color: var(--spar-rcp-blue-medium); font-size: 0.85rem; font-weight: 900; } .spar-rcp__requirement > div { min-width: 0; } .spar-rcp__requirement h5 { margin: 0; color: var(--spar-rcp-blue-dark); font-size: 0.93rem; font-weight: 900; line-height: 1.4; } .spar-rcp__requirement p { margin: 5px 0 0; color: var(--spar-rcp-muted); font-size: 0.82rem; line-height: 1.56; } /* ============================================================ VERIFICHE ============================================================ */ .spar-rcp__checks, .spar-rcp__process { margin-top: clamp(60px, 8vw, 94px); } .spar-rcp__checks-header, .spar-rcp__process-header { width: min(100%, 860px); margin-inline: auto; text-align: center; } .spar-rcp__checks-header > p:last-child, .spar-rcp__process-header > p:last-child { margin: 17px auto 0; color: var(--spar-rcp-muted); font-size: 0.97rem; line-height: 1.72; } .spar-rcp__checks-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 17px; margin-top: 33px; } .spar-rcp__check { min-width: 0; padding: 22px; border: 1px solid var(--spar-rcp-border); border-radius: 18px; background: var(--spar-rcp-white); box-shadow: 0 12px 30px rgba(6, 52, 59, 0.07); } .spar-rcp__check-icon { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 14px; background: var(--spar-rcp-light); color: var(--spar-rcp-blue-dark); } .spar-rcp__check-icon svg { width: 27px; height: 27px; } .spar-rcp__check h5 { margin: 17px 0 0; color: var(--spar-rcp-blue-dark); font-size: 1.03rem; font-weight: 900; line-height: 1.35; } .spar-rcp__check p { margin: 9px 0 0; color: var(--spar-rcp-muted); font-size: 0.86rem; line-height: 1.62; } /* ============================================================ ERRORI ============================================================ */ .spar-rcp__mistakes { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(420px, 1.1fr); align-items: center; gap: clamp(35px, 5vw, 68px); margin-top: clamp(58px, 7vw, 88px); padding: clamp(28px, 4vw, 48px); border-radius: 25px; background: radial-gradient( circle at 94% 8%, rgba(36, 191, 193, 0.2), transparent 30% ), linear-gradient( 135deg, var(--spar-rcp-blue-deep), var(--spar-rcp-blue-dark) ); box-shadow: 0 24px 62px rgba(3, 35, 40, 0.2); } .spar-rcp__mistakes-content { min-width: 0; } .spar-rcp__mistakes .spar-rcp__section-label { color: var(--spar-rcp-orange); } .spar-rcp__mistakes-content h4 { color: var(--spar-rcp-white); } .spar-rcp__mistakes-content > p:not(.spar-rcp__section-label) { margin: 17px 0 0; color: rgba(255, 255, 255, 0.74); font-size: 0.96rem; line-height: 1.7; } .spar-rcp__mistakes-content > p + p { margin-top: 11px; } .spar-rcp__mistakes-highlight { padding: 14px 16px; border-left: 4px solid var(--spar-rcp-orange); border-radius: 0 11px 11px 0; background: rgba(255, 255, 255, 0.08); color: var(--spar-rcp-white) !important; font-weight: 750; } .spar-rcp__mistakes-list { display: grid; gap: 12px; min-width: 0; margin: 0; padding: 0; list-style: none; } .spar-rcp__mistakes-list li { display: grid; grid-template-columns: 40px minmax(0, 1fr); align-items: start; gap: 12px; min-width: 0; padding: 14px; border: 1px solid rgba(255, 255, 255, 0.13); border-radius: 14px; background: rgba(255, 255, 255, 0.07); } .spar-rcp__mistakes-list li > span { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: rgba(255, 138, 42, 0.16); color: var(--spar-rcp-orange); font-size: 1.05rem; font-weight: 900; } .spar-rcp__mistakes-list li > div { min-width: 0; } .spar-rcp__mistakes-list strong { display: block; color: var(--spar-rcp-white); font-size: 0.9rem; font-weight: 850; line-height: 1.35; } .spar-rcp__mistakes-list p { margin: 5px 0 0; color: rgba(255, 255, 255, 0.67); font-size: 0.8rem; line-height: 1.53; } /* ============================================================ PROCESSO ============================================================ */ .spar-rcp__process-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin: 33px 0 0; padding: 0; list-style: none; } .spar-rcp__process-list li { min-width: 0; padding: 22px; border: 1px solid var(--spar-rcp-border); border-radius: 18px; background: var(--spar-rcp-white); box-shadow: 0 12px 30px rgba(6, 52, 59, 0.07); } .spar-rcp__process-number { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; background: var(--spar-rcp-blue-dark); color: var(--spar-rcp-teal-light); font-size: 0.8rem; font-weight: 900; } .spar-rcp__process-list strong { display: block; margin-top: 17px; color: var(--spar-rcp-blue-dark); font-size: 0.94rem; font-weight: 900; line-height: 1.4; } .spar-rcp__process-list p { margin: 8px 0 0; color: var(--spar-rcp-muted); font-size: 0.84rem; line-height: 1.58; } /* ============================================================ FIDUCIA ============================================================ */ .spar-rcp__trust { display: grid; grid-template-columns: 74px minmax(0, 1fr); align-items: center; gap: 23px; margin-top: clamp(44px, 6vw, 68px); padding: clamp(24px, 3vw, 35px); border: 1px solid rgba(255, 138, 42, 0.31); border-radius: 21px; background: #fff3e7; } .spar-rcp__trust-icon { display: grid; place-items: center; width: 70px; height: 70px; border-radius: 20px; background: var(--spar-rcp-orange); color: #321705; } .spar-rcp__trust-icon svg { width: 41px; height: 41px; } .spar-rcp__trust-content { min-width: 0; } .spar-rcp__trust-label { margin: 0 0 7px; color: var(--spar-rcp-orange-dark); font-size: 0.72rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-rcp__trust h4 { font-size: clamp(1.35rem, 2.2vw, 1.88rem); } .spar-rcp__trust-content > p:last-child { margin: 11px 0 0; color: var(--spar-rcp-muted); font-size: 0.94rem; line-height: 1.68; } /* ============================================================ CTA ============================================================ */ .spar-rcp__conversion { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(330px, 0.92fr); align-items: center; gap: clamp(31px, 5vw, 66px); margin-top: clamp(53px, 7vw, 84px); padding: clamp(27px, 4vw, 47px); border: 1px solid rgba(36, 191, 193, 0.24); border-radius: 24px; background: var(--spar-rcp-cream); box-shadow: var(--spar-rcp-shadow); } .spar-rcp__conversion-content { min-width: 0; } .spar-rcp__conversion-label { margin: 0 0 12px; color: var(--spar-rcp-orange-dark); font-size: 0.74rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-rcp__conversion-content > p:not(.spar-rcp__conversion-label) { margin: 16px 0 0; color: var(--spar-rcp-muted); font-size: 0.96rem; line-height: 1.71; } .spar-rcp__conversion-content > p + p { margin-top: 11px; } .spar-rcp__actions { display: grid; gap: 11px; min-width: 0; } .spar-rcp__button { display: flex; min-width: 0; min-height: 58px; align-items: center; justify-content: center; gap: 10px; padding: 13px 17px; border: 2px solid transparent; border-radius: 12px; font-family: inherit; font-size: 0.91rem; font-weight: 850; line-height: 1.3; text-align: center; text-decoration: none; transition: transform 180ms ease, box-shadow 180ms ease, background-color 180ms ease, border-color 180ms ease; } .spar-rcp__button:hover { transform: translateY(-2px); } .spar-rcp__button:focus-visible { outline: 3px solid var(--spar-rcp-blue-dark); outline-offset: 4px; } .spar-rcp__button svg { flex: 0 0 23px; width: 23px; height: 23px; } .spar-rcp__button--primary { background: var(--spar-rcp-orange); color: #2c1504; box-shadow: 0 12px 27px rgba(255, 138, 42, 0.22); } .spar-rcp__button--primary:hover { background: #ff9b43; } .spar-rcp__button--whatsapp { background: var(--spar-rcp-green); color: var(--spar-rcp-white); box-shadow: 0 12px 27px rgba(39, 173, 104, 0.2); } .spar-rcp__button--whatsapp:hover { background: var(--spar-rcp-green-dark); } .spar-rcp__button--phone { border-color: rgba(7, 52, 59, 0.32); background: var(--spar-rcp-white); color: var(--spar-rcp-blue-dark); } .spar-rcp__button--phone:hover { border-color: var(--spar-rcp-teal); background: var(--spar-rcp-light); } .spar-rcp__phone-text { display: grid; min-width: 0; gap: 1px; text-align: left; } .spar-rcp__phone-text small { font-size: 0.64rem; font-weight: 750; line-height: 1.1; letter-spacing: 0.055em; text-transform: uppercase; } .spar-rcp__phone-text strong { color: inherit; font-size: 1rem; font-weight: 900; line-height: 1.15; } /* ============================================================ NOTEBOOK E TABLET ORIZZONTALE ============================================================ */ @media (max-width: 1080px) { .spar-rcp__signals { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-rcp__path, .spar-rcp__evaluation, .spar-rcp__mistakes, .spar-rcp__conversion { grid-template-columns: minmax(0, 1fr); } .spar-rcp__path-content, .spar-rcp__evaluation-content, .spar-rcp__mistakes-content, .spar-rcp__conversion-content { max-width: 850px; } .spar-rcp__diagram, .spar-rcp__requirements { max-width: 850px; } .spar-rcp__checks-grid, .spar-rcp__process-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-rcp__actions { grid-template-columns: repeat(3, minmax(0, 1fr)); } } /* ============================================================ TABLET ============================================================ */ @media (max-width: 780px) { .spar-rcp { padding-block: 60px 74px; } .spar-rcp__container { width: min(calc(100% - 32px), 720px); } .spar-rcp__answer { grid-template-columns: 62px minmax(0, 1fr); gap: 18px; } .spar-rcp__answer-icon { width: 60px; height: 60px; border-radius: 17px; } .spar-rcp__answer-icon svg { width: 36px; height: 36px; } .spar-rcp__actions { grid-template-columns: minmax(0, 1fr); } } /* ============================================================ MOBILE ============================================================ */ @media (max-width: 560px) { .spar-rcp { padding-block: 50px 62px; } .spar-rcp__container { width: calc(100% - 28px); } .spar-rcp__header, .spar-rcp__checks-header, .spar-rcp__process-header { text-align: left; } .spar-rcp__eyebrow, .spar-rcp__section-label { font-size: 0.68rem; letter-spacing: 0.06em; } .spar-rcp__title { font-size: clamp(1.9rem, 9.7vw, 2.7rem); line-height: 1.1; } .spar-rcp__direct-answer { margin-top: 20px; font-size: 0.99rem; line-height: 1.63; } .spar-rcp__intro { font-size: 0.92rem; line-height: 1.67; } .spar-rcp__answer { grid-template-columns: minmax(0, 1fr); align-items: start; gap: 15px; padding: 20px 17px; border-radius: 18px; } .spar-rcp__answer-icon { width: 53px; height: 53px; border-radius: 15px; } .spar-rcp__answer-content h4 { font-size: 1.16rem; } .spar-rcp__answer-content > p:last-child { font-size: 0.9rem; } .spar-rcp__signals, .spar-rcp__checks-grid, .spar-rcp__process-list { grid-template-columns: minmax(0, 1fr); } .spar-rcp__signal, .spar-rcp__check, .spar-rcp__process-list li { padding: 19px 17px; border-radius: 16px; } .spar-rcp__path-content h4, .spar-rcp__evaluation-content h4, .spar-rcp__checks-header h4, .spar-rcp__mistakes-content h4, .spar-rcp__process-header h4, .spar-rcp__conversion h4 { font-size: clamp(1.5rem, 7.5vw, 1.95rem); line-height: 1.19; } .spar-rcp__path-content > p:not(.spar-rcp__section-label), .spar-rcp__evaluation-content > p:not(.spar-rcp__section-label), .spar-rcp__checks-header > p:last-child, .spar-rcp__mistakes-content > p:not(.spar-rcp__section-label), .spar-rcp__process-header > p:last-child, .spar-rcp__conversion-content > p:not(.spar-rcp__conversion-label) { font-size: 0.91rem; line-height: 1.66; } .spar-rcp__diagram { grid-template-columns: minmax(0, 1fr); padding: 16px 13px; border-radius: 18px; } .spar-rcp__diagram-room, .spar-rcp__diagram-wall { min-height: auto; padding: 18px 14px; } .spar-rcp__diagram-wave { min-height: 30px; transform: rotate(90deg); } .spar-rcp__diagram-wall > span:first-child { writing-mode: horizontal-tb; transform: none; } .spar-rcp__diagram-note { grid-column: auto; } .spar-rcp__requirement { grid-template-columns: 38px minmax(0, 1fr); gap: 10px; padding: 12px; } .spar-rcp__requirement > span { width: 38px; height: 38px; } .spar-rcp__mistakes { padding: 23px 17px; border-radius: 20px; } .spar-rcp__mistakes-list li { grid-template-columns: 38px minmax(0, 1fr); gap: 10px; padding: 12px; } .spar-rcp__mistakes-list li > span { width: 38px; height: 38px; } .spar-rcp__trust { grid-template-columns: minmax(0, 1fr); align-items: start; gap: 15px; padding: 21px 17px; border-radius: 18px; } .spar-rcp__trust-icon { width: 54px; height: 54px; border-radius: 15px; } .spar-rcp__trust-icon svg { width: 31px; height: 31px; } .spar-rcp__trust h4 { font-size: 1.28rem; } .spar-rcp__trust-content > p:last-child { font-size: 0.9rem; line-height: 1.65; } .spar-rcp__conversion { padding: 22px 17px; border-radius: 19px; } .spar-rcp__button { width: 100%; min-height: 58px; padding-inline: 13px; font-size: 0.87rem; } } /* ============================================================ SMARTPHONE MOLTO STRETTI ============================================================ */ @media (max-width: 380px) { .spar-rcp__container { width: calc(100% - 22px); } .spar-rcp__title { font-size: 1.8rem; } .spar-rcp__signal, .spar-rcp__diagram, .spar-rcp__check, .spar-rcp__mistakes, .spar-rcp__process-list li, .spar-rcp__trust, .spar-rcp__conversion { padding-inline: 14px; } .spar-rcp__button { gap: 8px; padding-inline: 10px; font-size: 0.83rem; } .spar-rcp__button svg { flex-basis: 21px; width: 21px; height: 21px; } } /* ============================================================ ACCESSIBILITÀ ============================================================ */ @media (prefers-reduced-motion: reduce) { .spar-rcp__button { transition: none; } .spar-rcp__button:hover { transform: none; } } /* ============================================================ STAMPA ============================================================ */ @media print { .spar-rcp { padding: 30px 0; background: #ffffff; } .spar-rcp__mistakes { border: 1px solid #ccdede; background: #ffffff; box-shadow: none; } .spar-rcp__mistakes-content h4, .spar-rcp__mistakes-list strong { color: var(--spar-rcp-text); } .spar-rcp__mistakes-content > p:not(.spar-rcp__section-label), .spar-rcp__mistakes-list p { color: var(--spar-rcp-muted); } .spar-rcp__actions { display: none; } }#imCell_14 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHTMLObject_1726_14 { position: relative; align-self: start; justify-self: center; max-width: 100%; box-sizing: border-box; z-index: 3; } #imCellStyleGraphics_14 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imCellStyleBorders_14 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } /* ============================================================ H3 — QUANDO SERVONO VERIFICHE SUGLI ALTRI ELEMENTI DELLA STANZA Pagina: /isolamento-acustico-pareti-roma.html ============================================================ */ .spar-ves, .spar-ves *, .spar-ves *::before, .spar-ves *::after { box-sizing: border-box; } .spar-ves { --spar-ves-blue-dark: #07343b; --spar-ves-blue-deep: #05282e; --spar-ves-blue-medium: #0b5159; --spar-ves-teal: #24bfc1; --spar-ves-teal-light: #c7f1ef; --spar-ves-orange: #ff8a2a; --spar-ves-orange-dark: #d86812; --spar-ves-green: #27ad68; --spar-ves-green-dark: #19864f; --spar-ves-white: #ffffff; --spar-ves-cream: #fff8ed; --spar-ves-light: #edf8f7; --spar-ves-text: #173c41; --spar-ves-muted: #557277; --spar-ves-border: #d4e6e4; --spar-ves-shadow: 0 20px 52px rgba(6, 52, 59, 0.1); position: relative; width: 100%; max-width: 100%; overflow: hidden; padding-block: clamp(66px, 8vw, 108px); background: radial-gradient( circle at 4% 9%, rgba(36, 191, 193, 0.11), transparent 27% ), radial-gradient( circle at 96% 92%, rgba(255, 138, 42, 0.09), transparent 25% ), var(--spar-ves-cream); color: var(--spar-ves-text); } .spar-ves h3, .spar-ves h4, .spar-ves h5, .spar-ves p, .spar-ves li, .spar-ves span, .spar-ves strong, .spar-ves small, .spar-ves a { max-width: 100%; white-space: normal; overflow-wrap: break-word; word-break: normal; } .spar-ves__container { width: min(calc(100% - 40px), 1220px); max-width: 1220px; margin-inline: auto; } /* ============================================================ HEADER ============================================================ */ .spar-ves__header { width: min(100%, 960px); margin-inline: auto; text-align: center; } .spar-ves__eyebrow, .spar-ves__section-label { margin: 0 0 13px; color: var(--spar-ves-orange-dark); font-size: 0.76rem; font-weight: 900; line-height: 1.4; letter-spacing: 0.08em; text-transform: uppercase; } .spar-ves__title { margin: 0; color: var(--spar-ves-blue-dark); font-family: inherit; font-size: clamp(2rem, 4.1vw, 3.45rem); font-weight: 900; line-height: 1.08; letter-spacing: -0.04em; text-wrap: balance; } .spar-ves__direct-answer { margin: 25px auto 0; color: var(--spar-ves-blue-dark); font-size: clamp(1.05rem, 1.45vw, 1.2rem); font-weight: 650; line-height: 1.7; } .spar-ves__direct-answer strong { color: inherit; font-weight: 900; } .spar-ves__intro { margin: 15px auto 0; color: var(--spar-ves-muted); font-size: 1rem; line-height: 1.74; } /* ============================================================ RISPOSTA DIRETTA ============================================================ */ .spar-ves__answer { display: grid; grid-template-columns: 78px minmax(0, 1fr); align-items: center; gap: 23px; width: min(100%, 1000px); margin: clamp(36px, 5vw, 57px) auto 0; padding: clamp(23px, 3vw, 34px); border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 22px; background: var(--spar-ves-white); box-shadow: var(--spar-ves-shadow); } .spar-ves__answer-icon { display: grid; place-items: center; width: 72px; height: 72px; border-radius: 20px; background: var(--spar-ves-blue-dark); color: var(--spar-ves-teal-light); } .spar-ves__answer-icon svg { display: block; width: 43px; height: 43px; } .spar-ves__answer-content { min-width: 0; } .spar-ves__answer-label { margin: 0 0 7px; color: var(--spar-ves-orange-dark); font-size: 0.72rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-ves__answer-content h4 { margin: 0; color: var(--spar-ves-blue-dark); font-size: clamp(1.22rem, 2vw, 1.62rem); font-weight: 900; line-height: 1.3; } .spar-ves__answer-content > p:last-child { margin: 10px 0 0; color: var(--spar-ves-muted); font-size: 0.96rem; line-height: 1.68; } /* ============================================================ SEGNALI ============================================================ */ .spar-ves__signals { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 17px; margin-top: clamp(42px, 5vw, 64px); } .spar-ves__signal { display: flex; min-width: 0; flex-direction: column; padding: 22px; border: 1px solid var(--spar-ves-border); border-top: 5px solid var(--spar-ves-blue-dark); border-radius: 19px; background: var(--spar-ves-white); box-shadow: 0 13px 34px rgba(6, 52, 59, 0.08); } .spar-ves__signal--teal { border-top-color: var(--spar-ves-teal); } .spar-ves__signal--orange { border-top-color: var(--spar-ves-orange); } .spar-ves__signal--green { border-top-color: var(--spar-ves-green); } .spar-ves__signal-top { display: flex; align-items: center; justify-content: space-between; gap: 15px; } .spar-ves__signal-number { color: rgba(7, 52, 59, 0.23); font-size: 1.7rem; font-weight: 950; line-height: 1; } .spar-ves__signal-icon { display: grid; flex: 0 0 48px; place-items: center; width: 48px; height: 48px; border-radius: 14px; background: var(--spar-ves-light); color: var(--spar-ves-blue-dark); } .spar-ves__signal-icon svg { width: 27px; height: 27px; } .spar-ves__signal h4 { margin: 20px 0 0; color: var(--spar-ves-blue-dark); font-size: 1.08rem; font-weight: 900; line-height: 1.35; } .spar-ves__signal > p { margin: 11px 0 0; color: var(--spar-ves-muted); font-size: 0.87rem; line-height: 1.62; } .spar-ves__signal-note { margin-top: auto !important; padding-top: 15px; border-top: 1px solid var(--spar-ves-border); color: var(--spar-ves-blue-dark) !important; font-weight: 750; } /* ============================================================ TITOLI INTERNI ============================================================ */ .spar-ves__elements-content h4, .spar-ves__distribution-content h4, .spar-ves__conditions-header h4, .spar-ves__precision-content h4, .spar-ves__analysis-content h4, .spar-ves__trust h4, .spar-ves__conversion h4 { margin: 0; color: var(--spar-ves-blue-dark); font-size: clamp(1.65rem, 2.9vw, 2.42rem); font-weight: 900; line-height: 1.16; letter-spacing: -0.032em; text-wrap: balance; } /* ============================================================ ELEMENTI DA VERIFICARE ============================================================ */ .spar-ves__elements { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(430px, 1.1fr); align-items: center; gap: clamp(36px, 5vw, 68px); margin-top: clamp(60px, 8vw, 94px); } .spar-ves__elements-content { min-width: 0; } .spar-ves__elements-content > p:not(.spar-ves__section-label), .spar-ves__distribution-content > p:not(.spar-ves__section-label), .spar-ves__precision-content > p:not(.spar-ves__section-label), .spar-ves__analysis-content > p:not(.spar-ves__section-label) { margin: 18px 0 0; color: var(--spar-ves-muted); font-size: 0.97rem; line-height: 1.72; } .spar-ves__elements-content > p + p, .spar-ves__distribution-content > p + p, .spar-ves__precision-content > p + p, .spar-ves__analysis-content > p + p { margin-top: 12px; } .spar-ves__elements-highlight, .spar-ves__distribution-highlight, .spar-ves__precision-highlight, .spar-ves__analysis-highlight { padding: 15px 17px; border-left: 4px solid var(--spar-ves-orange); border-radius: 0 12px 12px 0; background: #fff0e2; color: var(--spar-ves-blue-dark) !important; font-weight: 750; } .spar-ves__elements-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; min-width: 0; } .spar-ves__element { display: grid; grid-template-columns: 48px minmax(0, 1fr); align-items: start; gap: 13px; min-width: 0; padding: 18px; border: 1px solid var(--spar-ves-border); border-radius: 17px; background: var(--spar-ves-white); box-shadow: 0 11px 29px rgba(6, 52, 59, 0.07); } .spar-ves__element-icon { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 14px; background: var(--spar-ves-light); color: var(--spar-ves-blue-dark); } .spar-ves__element-icon svg { width: 27px; height: 27px; } .spar-ves__element > div { min-width: 0; } .spar-ves__element h5 { margin: 0; color: var(--spar-ves-blue-dark); font-size: 0.95rem; font-weight: 900; line-height: 1.4; } .spar-ves__element p { margin: 7px 0 0; color: var(--spar-ves-muted); font-size: 0.82rem; line-height: 1.57; } /* ============================================================ DISTRIBUZIONE E DIAGRAMMA ============================================================ */ .spar-ves__distribution { display: grid; grid-template-columns: minmax(430px, 1.08fr) minmax(0, 0.92fr); align-items: center; gap: clamp(36px, 5vw, 68px); margin-top: clamp(60px, 8vw, 94px); } .spar-ves__distribution-content { min-width: 0; } .spar-ves__diagram { min-width: 0; padding: 20px; border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 22px; background: var(--spar-ves-white); box-shadow: var(--spar-ves-shadow); } .spar-ves__diagram-ceiling, .spar-ves__diagram-floor { position: relative; display: flex; min-height: 46px; align-items: center; justify-content: center; padding: 9px 12px; border-radius: 9px; background: repeating-linear-gradient( 45deg, #cfdada, #cfdada 9px, #e2e8e8 9px, #e2e8e8 18px ); color: #3d5559; font-size: 0.69rem; font-weight: 900; line-height: 1.3; text-transform: uppercase; } .spar-ves__diagram-flow { position: absolute; left: 18%; color: var(--spar-ves-blue-medium); font-size: 0.82rem; letter-spacing: 0.08em; } .spar-ves__diagram-center { display: grid; grid-template-columns: minmax(0, 1fr) 68px minmax(0, 1fr); min-width: 0; min-height: 245px; } .spar-ves__diagram-source, .spar-ves__diagram-room { display: flex; min-width: 0; align-items: center; justify-content: center; flex-direction: column; padding: 20px 15px; text-align: center; } .spar-ves__diagram-source { background: #fff0e2; color: #703507; } .spar-ves__diagram-room { background: var(--spar-ves-light); color: var(--spar-ves-blue-dark); } .spar-ves__diagram-label { font-size: 0.72rem; font-weight: 900; line-height: 1.4; text-transform: uppercase; } .spar-ves__diagram-source strong, .spar-ves__diagram-room strong { margin-top: 10px; color: inherit; font-size: 0.84rem; line-height: 1.4; } .spar-ves__diagram-speaker { display: grid; place-items: center; width: 58px; height: 58px; margin-top: 19px; border-radius: 17px; background: var(--spar-ves-orange); color: #321705; } .spar-ves__diagram-speaker svg { width: 34px; height: 34px; } .spar-ves__diagram-wall { position: relative; display: flex; min-width: 0; align-items: center; justify-content: center; border-inline: 2px solid #909fa1; background: repeating-linear-gradient( 45deg, #d8dfdf, #d8dfdf 8px, #c9d2d2 8px, #c9d2d2 16px ); } .spar-ves__diagram-wall > span:first-child { writing-mode: vertical-rl; transform: rotate(180deg); color: #3c5357; font-size: 0.67rem; font-weight: 900; line-height: 1.2; text-transform: uppercase; } .spar-ves__diagram-direct { position: absolute; right: -24px; z-index: 2; display: grid; place-items: center; width: 47px; height: 36px; border-radius: 999px; background: var(--spar-ves-orange); color: #321705; font-size: 1.35rem; font-weight: 900; } .spar-ves__diagram-arrows { display: flex; gap: 12px; margin-top: 20px; color: var(--spar-ves-orange); font-size: 1.3rem; font-weight: 900; } .spar-ves__diagram-note { margin: 16px 0 0; color: var(--spar-ves-muted); font-size: 0.75rem; line-height: 1.5; text-align: center; } /* ============================================================ CONDIZIONI ============================================================ */ .spar-ves__conditions { margin-top: clamp(60px, 8vw, 94px); } .spar-ves__conditions-header { width: min(100%, 860px); margin-inline: auto; text-align: center; } .spar-ves__conditions-header > p:last-child { margin: 17px auto 0; color: var(--spar-ves-muted); font-size: 0.97rem; line-height: 1.72; } .spar-ves__conditions-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 17px; margin-top: 33px; } .spar-ves__condition { display: grid; grid-template-columns: 42px minmax(0, 1fr); align-items: start; gap: 12px; min-width: 0; padding: 20px; border: 1px solid rgba(255, 138, 42, 0.29); border-radius: 18px; background: var(--spar-ves-white); box-shadow: 0 12px 30px rgba(6, 52, 59, 0.07); } .spar-ves__condition > span { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; background: #fff0e2; color: var(--spar-ves-orange-dark); font-size: 0.9rem; font-weight: 900; } .spar-ves__condition > div { min-width: 0; } .spar-ves__condition h5 { margin: 0; color: var(--spar-ves-blue-dark); font-size: 0.94rem; font-weight: 900; line-height: 1.4; } .spar-ves__condition p { margin: 7px 0 0; color: var(--spar-ves-muted); font-size: 0.82rem; line-height: 1.57; } /* ============================================================ PRECISIONE DELL'INTERVENTO ============================================================ */ .spar-ves__precision { display: grid; grid-template-columns: minmax(0, 0.95fr) minmax(390px, 1.05fr); align-items: center; gap: clamp(35px, 5vw, 68px); margin-top: clamp(58px, 7vw, 88px); padding: clamp(28px, 4vw, 48px); border-radius: 25px; background: radial-gradient( circle at 94% 8%, rgba(36, 191, 193, 0.2), transparent 30% ), linear-gradient( 135deg, var(--spar-ves-blue-deep), var(--spar-ves-blue-dark) ); box-shadow: 0 24px 62px rgba(3, 35, 40, 0.2); } .spar-ves__precision-content { min-width: 0; } .spar-ves__precision .spar-ves__section-label { color: var(--spar-ves-orange); } .spar-ves__precision-content h4 { color: var(--spar-ves-white); } .spar-ves__precision-content > p:not(.spar-ves__section-label) { color: rgba(255, 255, 255, 0.74); } .spar-ves__precision-highlight { border-left-color: var(--spar-ves-orange); background: rgba(255, 255, 255, 0.08); color: var(--spar-ves-white) !important; } .spar-ves__precision-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; min-width: 0; } .spar-ves__precision-card { min-width: 0; padding: 22px; border: 1px solid rgba(255, 255, 255, 0.14); border-top: 5px solid var(--spar-ves-teal); border-radius: 18px; background: rgba(255, 255, 255, 0.08); } .spar-ves__precision-card--extended { border-top-color: var(--spar-ves-orange); } .spar-ves__precision-symbol { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 13px; background: rgba(36, 191, 193, 0.16); color: var(--spar-ves-teal-light); font-size: 1rem; font-weight: 900; } .spar-ves__precision-card--extended .spar-ves__precision-symbol { background: rgba(255, 138, 42, 0.16); color: var(--spar-ves-orange); } .spar-ves__precision-card h5 { margin: 17px 0 0; color: var(--spar-ves-white); font-size: 1.07rem; font-weight: 900; line-height: 1.35; } .spar-ves__precision-card p { margin: 10px 0 0; color: rgba(255, 255, 255, 0.69); font-size: 0.84rem; line-height: 1.6; } /* ============================================================ ANALISI ============================================================ */ .spar-ves__analysis { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(430px, 1.1fr); align-items: center; gap: clamp(35px, 5vw, 68px); margin-top: clamp(60px, 8vw, 94px); } .spar-ves__analysis-content { min-width: 0; } .spar-ves__analysis-list { display: grid; gap: 12px; min-width: 0; margin: 0; padding: 0; list-style: none; } .spar-ves__analysis-list li { display: grid; grid-template-columns: 42px minmax(0, 1fr); align-items: start; gap: 13px; min-width: 0; padding: 15px; border: 1px solid var(--spar-ves-border); border-radius: 15px; background: var(--spar-ves-white); box-shadow: 0 10px 27px rgba(6, 52, 59, 0.07); } .spar-ves__analysis-list li > span { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: var(--spar-ves-blue-dark); color: var(--spar-ves-teal-light); font-size: 0.76rem; font-weight: 900; } .spar-ves__analysis-list li > div { min-width: 0; } .spar-ves__analysis-list strong { display: block; color: var(--spar-ves-blue-dark); font-size: 0.91rem; font-weight: 900; line-height: 1.4; } .spar-ves__analysis-list p { margin: 5px 0 0; color: var(--spar-ves-muted); font-size: 0.81rem; line-height: 1.55; } /* ============================================================ FIDUCIA ============================================================ */ .spar-ves__trust { display: grid; grid-template-columns: 74px minmax(0, 1fr); align-items: center; gap: 23px; margin-top: clamp(44px, 6vw, 68px); padding: clamp(24px, 3vw, 35px); border: 1px solid rgba(255, 138, 42, 0.31); border-radius: 21px; background: #fff3e7; } .spar-ves__trust-icon { display: grid; place-items: center; width: 70px; height: 70px; border-radius: 20px; background: var(--spar-ves-orange); color: #321705; } .spar-ves__trust-icon svg { width: 41px; height: 41px; } .spar-ves__trust-content { min-width: 0; } .spar-ves__trust-label { margin: 0 0 7px; color: var(--spar-ves-orange-dark); font-size: 0.72rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-ves__trust h4 { font-size: clamp(1.35rem, 2.2vw, 1.88rem); } .spar-ves__trust-content > p:last-child { margin: 11px 0 0; color: var(--spar-ves-muted); font-size: 0.94rem; line-height: 1.68; } /* ============================================================ CTA ============================================================ */ .spar-ves__conversion { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(330px, 0.92fr); align-items: center; gap: clamp(31px, 5vw, 66px); margin-top: clamp(53px, 7vw, 84px); padding: clamp(27px, 4vw, 47px); border: 1px solid rgba(36, 191, 193, 0.24); border-radius: 24px; background: var(--spar-ves-white); box-shadow: var(--spar-ves-shadow); } .spar-ves__conversion-content { min-width: 0; } .spar-ves__conversion-label { margin: 0 0 12px; color: var(--spar-ves-orange-dark); font-size: 0.74rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-ves__conversion-content > p:not(.spar-ves__conversion-label) { margin: 16px 0 0; color: var(--spar-ves-muted); font-size: 0.96rem; line-height: 1.71; } .spar-ves__conversion-content > p + p { margin-top: 11px; } .spar-ves__actions { display: grid; gap: 11px; min-width: 0; } .spar-ves__button { display: flex; min-width: 0; min-height: 58px; align-items: center; justify-content: center; gap: 10px; padding: 13px 17px; border: 2px solid transparent; border-radius: 12px; font-family: inherit; font-size: 0.91rem; font-weight: 850; line-height: 1.3; text-align: center; text-decoration: none; transition: transform 180ms ease, box-shadow 180ms ease, background-color 180ms ease, border-color 180ms ease; } .spar-ves__button:hover { transform: translateY(-2px); } .spar-ves__button:focus-visible { outline: 3px solid var(--spar-ves-blue-dark); outline-offset: 4px; } .spar-ves__button svg { flex: 0 0 23px; width: 23px; height: 23px; } .spar-ves__button--primary { background: var(--spar-ves-orange); color: #2c1504; box-shadow: 0 12px 27px rgba(255, 138, 42, 0.22); } .spar-ves__button--primary:hover { background: #ff9b43; } .spar-ves__button--whatsapp { background: var(--spar-ves-green); color: var(--spar-ves-white); box-shadow: 0 12px 27px rgba(39, 173, 104, 0.2); } .spar-ves__button--whatsapp:hover { background: var(--spar-ves-green-dark); } .spar-ves__button--phone { border-color: rgba(7, 52, 59, 0.32); background: var(--spar-ves-white); color: var(--spar-ves-blue-dark); } .spar-ves__button--phone:hover { border-color: var(--spar-ves-teal); background: var(--spar-ves-light); } .spar-ves__phone-text { display: grid; min-width: 0; gap: 1px; text-align: left; } .spar-ves__phone-text small { font-size: 0.64rem; font-weight: 750; line-height: 1.1; letter-spacing: 0.055em; text-transform: uppercase; } .spar-ves__phone-text strong { color: inherit; font-size: 1rem; font-weight: 900; line-height: 1.15; } /* ============================================================ NOTEBOOK E TABLET ORIZZONTALE ============================================================ */ @media (max-width: 1080px) { .spar-ves__signals { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-ves__elements, .spar-ves__distribution, .spar-ves__precision, .spar-ves__analysis, .spar-ves__conversion { grid-template-columns: minmax(0, 1fr); } .spar-ves__elements-content, .spar-ves__distribution-content, .spar-ves__precision-content, .spar-ves__analysis-content, .spar-ves__conversion-content { max-width: 850px; } .spar-ves__elements-grid, .spar-ves__diagram, .spar-ves__precision-cards, .spar-ves__analysis-list { max-width: 850px; } .spar-ves__conditions-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-ves__actions { grid-template-columns: repeat(3, minmax(0, 1fr)); } } /* ============================================================ TABLET ============================================================ */ @media (max-width: 780px) { .spar-ves { padding-block: 60px 74px; } .spar-ves__container { width: min(calc(100% - 32px), 720px); } .spar-ves__answer { grid-template-columns: 62px minmax(0, 1fr); gap: 18px; } .spar-ves__answer-icon { width: 60px; height: 60px; border-radius: 17px; } .spar-ves__answer-icon svg { width: 36px; height: 36px; } .spar-ves__elements-grid, .spar-ves__precision-cards { grid-template-columns: minmax(0, 1fr); } .spar-ves__actions { grid-template-columns: minmax(0, 1fr); } } /* ============================================================ MOBILE ============================================================ */ @media (max-width: 560px) { .spar-ves { padding-block: 50px 62px; } .spar-ves__container { width: calc(100% - 28px); } .spar-ves__header, .spar-ves__conditions-header { text-align: left; } .spar-ves__eyebrow, .spar-ves__section-label { font-size: 0.68rem; letter-spacing: 0.06em; } .spar-ves__title { font-size: clamp(1.85rem, 9.5vw, 2.65rem); line-height: 1.1; } .spar-ves__direct-answer { margin-top: 20px; font-size: 0.99rem; line-height: 1.63; } .spar-ves__intro { font-size: 0.92rem; line-height: 1.67; } .spar-ves__answer { grid-template-columns: minmax(0, 1fr); align-items: start; gap: 15px; padding: 20px 17px; border-radius: 18px; } .spar-ves__answer-icon { width: 53px; height: 53px; border-radius: 15px; } .spar-ves__answer-content h4 { font-size: 1.16rem; } .spar-ves__answer-content > p:last-child { font-size: 0.9rem; } .spar-ves__signals, .spar-ves__conditions-grid { grid-template-columns: minmax(0, 1fr); } .spar-ves__signal { padding: 19px 17px; border-radius: 16px; } .spar-ves__elements-content h4, .spar-ves__distribution-content h4, .spar-ves__conditions-header h4, .spar-ves__precision-content h4, .spar-ves__analysis-content h4, .spar-ves__conversion h4 { font-size: clamp(1.5rem, 7.5vw, 1.95rem); line-height: 1.19; } .spar-ves__elements-content > p:not(.spar-ves__section-label), .spar-ves__distribution-content > p:not(.spar-ves__section-label), .spar-ves__conditions-header > p:last-child, .spar-ves__precision-content > p:not(.spar-ves__section-label), .spar-ves__analysis-content > p:not(.spar-ves__section-label), .spar-ves__conversion-content > p:not(.spar-ves__conversion-label) { font-size: 0.91rem; line-height: 1.66; } .spar-ves__element { grid-template-columns: 43px minmax(0, 1fr); gap: 11px; padding: 15px; } .spar-ves__element-icon { width: 43px; height: 43px; } .spar-ves__diagram { padding: 16px 13px; border-radius: 18px; } .spar-ves__diagram-center { grid-template-columns: minmax(0, 1fr); min-height: auto; } .spar-ves__diagram-source, .spar-ves__diagram-room { min-height: 150px; padding: 18px 12px; } .spar-ves__diagram-wall { min-height: 60px; border: 2px solid #909fa1; } .spar-ves__diagram-wall > span:first-child { writing-mode: horizontal-tb; transform: none; } .spar-ves__diagram-direct { right: 50%; bottom: -18px; transform: translateX(50%) rotate(90deg); } .spar-ves__diagram-flow { display: none; } .spar-ves__condition { padding: 17px; } .spar-ves__precision { padding: 23px 17px; border-radius: 20px; } .spar-ves__precision-card { padding: 19px 17px; border-radius: 16px; } .spar-ves__analysis-list li { grid-template-columns: 38px minmax(0, 1fr); gap: 10px; padding: 12px; } .spar-ves__analysis-list li > span { width: 38px; height: 38px; } .spar-ves__trust { grid-template-columns: minmax(0, 1fr); align-items: start; gap: 15px; padding: 21px 17px; border-radius: 18px; } .spar-ves__trust-icon { width: 54px; height: 54px; border-radius: 15px; } .spar-ves__trust-icon svg { width: 31px; height: 31px; } .spar-ves__trust h4 { font-size: 1.28rem; } .spar-ves__trust-content > p:last-child { font-size: 0.9rem; line-height: 1.65; } .spar-ves__conversion { padding: 22px 17px; border-radius: 19px; } .spar-ves__button { width: 100%; min-height: 58px; padding-inline: 13px; font-size: 0.87rem; } } /* ============================================================ SMARTPHONE MOLTO STRETTI ============================================================ */ @media (max-width: 380px) { .spar-ves__container { width: calc(100% - 22px); } .spar-ves__title { font-size: 1.76rem; } .spar-ves__signal, .spar-ves__element, .spar-ves__diagram, .spar-ves__condition, .spar-ves__precision, .spar-ves__precision-card, .spar-ves__analysis-list li, .spar-ves__trust, .spar-ves__conversion { padding-inline: 14px; } .spar-ves__button { gap: 8px; padding-inline: 10px; font-size: 0.83rem; } .spar-ves__button svg { flex-basis: 21px; width: 21px; height: 21px; } } /* ============================================================ ACCESSIBILITÀ ============================================================ */ @media (prefers-reduced-motion: reduce) { .spar-ves__button { transition: none; } .spar-ves__button:hover { transform: none; } } /* ============================================================ STAMPA ============================================================ */ @media print { .spar-ves { padding: 30px 0; background: #ffffff; } .spar-ves__precision { border: 1px solid #ccdede; background: #ffffff; box-shadow: none; } .spar-ves__precision-content h4, .spar-ves__precision-card h5 { color: var(--spar-ves-text); } .spar-ves__precision-content > p:not(.spar-ves__section-label), .spar-ves__precision-card p { color: var(--spar-ves-muted); } .spar-ves__actions { display: none; } }#imCell_15 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHTMLObject_1726_15 { position: relative; align-self: start; justify-self: center; max-width: 100%; box-sizing: border-box; z-index: 3; } #imCellStyleGraphics_15 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imCellStyleBorders_15 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } /* ============================================================ H2 — COME REALIZZIAMO L’ISOLAMENTO ACUSTICO DELLE PARETI Pagina: /isolamento-acustico-pareti-roma.html ============================================================ */ .spar-real, .spar-real *, .spar-real *::before, .spar-real *::after { box-sizing: border-box; } .spar-real { --spar-real-blue-dark: #07343b; --spar-real-blue-deep: #05282e; --spar-real-blue-medium: #0b5159; --spar-real-teal: #24bfc1; --spar-real-teal-light: #c7f1ef; --spar-real-orange: #ff8a2a; --spar-real-orange-dark: #d86812; --spar-real-green: #27ad68; --spar-real-green-dark: #19864f; --spar-real-white: #ffffff; --spar-real-cream: #fff8ed; --spar-real-light: #edf8f7; --spar-real-text: #173c41; --spar-real-muted: #557277; --spar-real-border: #d4e6e4; --spar-real-shadow: 0 20px 52px rgba(6, 52, 59, 0.1); position: relative; width: 100%; max-width: 100%; overflow: hidden; padding-block: clamp(66px, 8vw, 108px); background: radial-gradient( circle at 96% 8%, rgba(36, 191, 193, 0.11), transparent 27% ), radial-gradient( circle at 4% 92%, rgba(255, 138, 42, 0.09), transparent 25% ), #ffffff; color: var(--spar-real-text); } .spar-real h2, .spar-real h3, .spar-real h4, .spar-real p, .spar-real li, .spar-real span, .spar-real strong, .spar-real small, .spar-real a { max-width: 100%; white-space: normal; overflow-wrap: break-word; word-break: normal; } .spar-real__container { width: min(calc(100% - 40px), 1220px); max-width: 1220px; margin-inline: auto; } /* ============================================================ HEADER ============================================================ */ .spar-real__header { width: min(100%, 950px); margin-inline: auto; text-align: center; } .spar-real__eyebrow, .spar-real__section-label { margin: 0 0 13px; color: var(--spar-real-orange-dark); font-size: 0.76rem; font-weight: 900; line-height: 1.4; letter-spacing: 0.08em; text-transform: uppercase; } .spar-real__title { margin: 0; color: var(--spar-real-blue-dark); font-family: inherit; font-size: clamp(2.05rem, 4.25vw, 3.6rem); font-weight: 900; line-height: 1.07; letter-spacing: -0.04em; text-wrap: balance; } .spar-real__direct-answer { margin: 25px auto 0; color: var(--spar-real-blue-dark); font-size: clamp(1.05rem, 1.45vw, 1.2rem); font-weight: 650; line-height: 1.7; } .spar-real__direct-answer strong { color: inherit; font-weight: 900; } .spar-real__intro { margin: 15px auto 0; color: var(--spar-real-muted); font-size: 1rem; line-height: 1.74; } /* ============================================================ RISPOSTA DIRETTA ============================================================ */ .spar-real__answer { display: grid; grid-template-columns: 78px minmax(0, 1fr); align-items: center; gap: 23px; width: min(100%, 1000px); margin: clamp(36px, 5vw, 57px) auto 0; padding: clamp(23px, 3vw, 34px); border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 22px; background: var(--spar-real-cream); box-shadow: var(--spar-real-shadow); } .spar-real__answer-icon { display: grid; place-items: center; width: 72px; height: 72px; border-radius: 20px; background: var(--spar-real-blue-dark); color: var(--spar-real-teal-light); } .spar-real__answer-icon svg { display: block; width: 43px; height: 43px; } .spar-real__answer-content { min-width: 0; } .spar-real__answer-label { margin: 0 0 7px; color: var(--spar-real-orange-dark); font-size: 0.72rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-real__answer-content h3 { margin: 0; color: var(--spar-real-blue-dark); font-size: clamp(1.22rem, 2vw, 1.62rem); font-weight: 900; line-height: 1.3; } .spar-real__answer-content > p:last-child { margin: 10px 0 0; color: var(--spar-real-muted); font-size: 0.96rem; line-height: 1.68; } /* ============================================================ QUATTRO PRINCIPI ============================================================ */ .spar-real__principles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; margin-top: clamp(42px, 5vw, 64px); } .spar-real__principle { position: relative; display: flex; min-width: 0; flex-direction: column; padding: clamp(23px, 3vw, 34px); border: 1px solid var(--spar-real-border); border-top: 6px solid var(--spar-real-blue-dark); border-radius: 21px; background: var(--spar-real-white); box-shadow: 0 15px 39px rgba(6, 52, 59, 0.08); } .spar-real__principle--teal { border-top-color: var(--spar-real-teal); } .spar-real__principle--orange { border-top-color: var(--spar-real-orange); } .spar-real__principle--green { border-top-color: var(--spar-real-green); } .spar-real__principle-top { display: flex; align-items: center; justify-content: space-between; gap: 15px; } .spar-real__principle-number { color: rgba(7, 52, 59, 0.22); font-size: 1.85rem; font-weight: 950; line-height: 1; } .spar-real__principle-icon { display: grid; flex: 0 0 52px; place-items: center; width: 52px; height: 52px; border-radius: 16px; background: var(--spar-real-light); color: var(--spar-real-blue-dark); } .spar-real__principle-icon svg { width: 29px; height: 29px; } .spar-real__principle h3 { margin: 23px 0 0; color: var(--spar-real-blue-dark); font-size: clamp(1.38rem, 2.15vw, 1.78rem); font-weight: 900; line-height: 1.24; letter-spacing: -0.025em; } .spar-real__principle > p { margin: 15px 0 0; color: var(--spar-real-muted); font-size: 0.94rem; line-height: 1.7; } .spar-real__principle > p + p { margin-top: 11px; } .spar-real__principle-note { display: grid; gap: 6px; margin-top: auto; padding: 16px; border-radius: 14px; background: var(--spar-real-light); } .spar-real__principle > p + .spar-real__principle-note { margin-top: 22px; } .spar-real__principle-note strong { color: var(--spar-real-orange-dark); font-size: 0.71rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.055em; text-transform: uppercase; } .spar-real__principle-note span { color: var(--spar-real-blue-dark); font-size: 0.86rem; font-weight: 700; line-height: 1.55; } /* ============================================================ TITOLI INTERNI ============================================================ */ .spar-real__system-content h3, .spar-real__details-header h3, .spar-real__difference-content h3, .spar-real__process-header h3, .spar-real__trust h3, .spar-real__conversion h3 { margin: 0; color: var(--spar-real-blue-dark); font-size: clamp(1.65rem, 2.9vw, 2.42rem); font-weight: 900; line-height: 1.16; letter-spacing: -0.032em; text-wrap: balance; } /* ============================================================ SISTEMA E DIAGRAMMA ============================================================ */ .spar-real__system { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(470px, 1.1fr); align-items: center; gap: clamp(36px, 5vw, 68px); margin-top: clamp(60px, 8vw, 94px); } .spar-real__system-content { min-width: 0; } .spar-real__system-content > p:not(.spar-real__section-label), .spar-real__difference-content > p:not(.spar-real__section-label) { margin: 18px 0 0; color: var(--spar-real-muted); font-size: 0.97rem; line-height: 1.72; } .spar-real__system-content > p + p, .spar-real__difference-content > p + p { margin-top: 12px; } .spar-real__system-highlight, .spar-real__difference-highlight { padding: 15px 17px; border-left: 4px solid var(--spar-real-orange); border-radius: 0 12px 12px 0; background: #fff0e2; color: var(--spar-real-blue-dark) !important; font-weight: 750; } .spar-real__diagram { display: grid; grid-template-columns: minmax(90px, 1fr) minmax(54px, 0.55fr) minmax(60px, 0.62fr) minmax(82px, 0.82fr) minmax(105px, 1.08fr) minmax(90px, 1fr); align-items: stretch; gap: 7px; min-width: 0; padding: 20px; border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 22px; background: var(--spar-real-white); box-shadow: var(--spar-real-shadow); } .spar-real__diagram-layer { display: flex; min-width: 0; min-height: 250px; align-items: center; justify-content: center; flex-direction: column; padding: 12px; border-radius: 12px; text-align: center; } .spar-real__diagram-layer--source { background: #fff0e2; color: #703507; } .spar-real__diagram-layer--existing { border: 2px solid #919fa1; background: repeating-linear-gradient( 45deg, #d9e0e0, #d9e0e0 8px, #c9d2d2 8px, #c9d2d2 16px ); color: #40575b; } .spar-real__diagram-layer--air { border: 1px dashed var(--spar-real-teal); background: #f3fbfa; color: var(--spar-real-blue-medium); } .spar-real__diagram-layer--frame { border: 2px solid var(--spar-real-blue-dark); background: linear-gradient( 90deg, transparent 0 25%, rgba(7, 52, 59, 0.15) 25% 34%, transparent 34% 66%, rgba(7, 52, 59, 0.15) 66% 75%, transparent 75% ), var(--spar-real-light); color: var(--spar-real-blue-dark); } .spar-real__diagram-layer--technical { background: repeating-linear-gradient( 135deg, #d9f1ef, #d9f1ef 8px, #c3e8e5 8px, #c3e8e5 16px ); color: var(--spar-real-blue-dark); } .spar-real__diagram-layer--room { background: var(--spar-real-blue-dark); color: var(--spar-real-white); } .spar-real__diagram-layer > span { font-size: 0.67rem; font-weight: 900; line-height: 1.35; text-transform: uppercase; } .spar-real__diagram-layer--existing > span, .spar-real__diagram-layer--air > span, .spar-real__diagram-layer--frame > span { writing-mode: vertical-rl; transform: rotate(180deg); } .spar-real__diagram-layer strong { margin-top: 10px; color: inherit; font-size: 0.82rem; line-height: 1.4; } .spar-real__diagram-note { grid-column: 1 / -1; margin: 8px 0 0; color: var(--spar-real-muted); font-size: 0.75rem; line-height: 1.5; text-align: center; } /* ============================================================ DETTAGLI TECNICI ============================================================ */ .spar-real__details, .spar-real__process { margin-top: clamp(60px, 8vw, 94px); } .spar-real__details-header, .spar-real__process-header { width: min(100%, 860px); margin-inline: auto; text-align: center; } .spar-real__details-header > p:last-child, .spar-real__process-header > p:last-child { margin: 17px auto 0; color: var(--spar-real-muted); font-size: 0.97rem; line-height: 1.72; } .spar-real__details-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 17px; margin-top: 33px; } .spar-real__detail { min-width: 0; padding: 22px; border: 1px solid var(--spar-real-border); border-radius: 18px; background: var(--spar-real-white); box-shadow: 0 12px 30px rgba(6, 52, 59, 0.07); } .spar-real__detail-icon { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 14px; background: var(--spar-real-light); color: var(--spar-real-blue-dark); } .spar-real__detail-icon svg { width: 27px; height: 27px; } .spar-real__detail h4 { margin: 17px 0 0; color: var(--spar-real-blue-dark); font-size: 1.05rem; font-weight: 900; line-height: 1.35; } .spar-real__detail p { margin: 9px 0 0; color: var(--spar-real-muted); font-size: 0.86rem; line-height: 1.62; } /* ============================================================ DIFFERENZA TRA PANNELLO E SISTEMA ============================================================ */ .spar-real__difference { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(430px, 1.1fr); align-items: center; gap: clamp(35px, 5vw, 68px); margin-top: clamp(58px, 7vw, 88px); padding: clamp(28px, 4vw, 48px); border-radius: 25px; background: radial-gradient( circle at 94% 8%, rgba(36, 191, 193, 0.2), transparent 30% ), linear-gradient( 135deg, var(--spar-real-blue-deep), var(--spar-real-blue-dark) ); box-shadow: 0 24px 62px rgba(3, 35, 40, 0.2); } .spar-real__difference-content { min-width: 0; } .spar-real__difference .spar-real__section-label { color: var(--spar-real-orange); } .spar-real__difference-content h3 { color: var(--spar-real-white); } .spar-real__difference-content > p:not(.spar-real__section-label) { color: rgba(255, 255, 255, 0.74); } .spar-real__difference-highlight { border-left-color: var(--spar-real-orange); background: rgba(255, 255, 255, 0.08); color: var(--spar-real-white) !important; } .spar-real__comparison { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; min-width: 0; } .spar-real__comparison-card { min-width: 0; padding: 22px; border: 1px solid rgba(255, 255, 255, 0.14); border-top: 5px solid #e1705b; border-radius: 18px; background: rgba(255, 255, 255, 0.08); } .spar-real__comparison-card--right { border-top-color: var(--spar-real-teal); } .spar-real__comparison-symbol { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 13px; background: rgba(225, 112, 91, 0.16); color: #ffb9ac; font-size: 1.05rem; font-weight: 900; } .spar-real__comparison-card--right .spar-real__comparison-symbol { background: rgba(36, 191, 193, 0.16); color: var(--spar-real-teal-light); } .spar-real__comparison-card h4 { margin: 17px 0 0; color: var(--spar-real-white); font-size: 1.06rem; font-weight: 900; line-height: 1.35; } .spar-real__comparison-card ul { display: grid; gap: 9px; margin: 16px 0 0; padding: 0; list-style: none; } .spar-real__comparison-card li { position: relative; padding-left: 20px; color: rgba(255, 255, 255, 0.7); font-size: 0.82rem; line-height: 1.56; } .spar-real__comparison-card li::before { content: ""; position: absolute; top: 0.62em; left: 0; width: 7px; height: 7px; border-radius: 50%; background: #e1705b; } .spar-real__comparison-card--right li::before { background: var(--spar-real-teal); } /* ============================================================ PROCESSO ============================================================ */ .spar-real__process-list { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 15px; margin: 33px 0 0; padding: 0; list-style: none; } .spar-real__process-list li { min-width: 0; padding: 21px; border: 1px solid var(--spar-real-border); border-radius: 18px; background: var(--spar-real-white); box-shadow: 0 12px 30px rgba(6, 52, 59, 0.07); } .spar-real__process-number { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; background: var(--spar-real-blue-dark); color: var(--spar-real-teal-light); font-size: 0.8rem; font-weight: 900; } .spar-real__process-list strong { display: block; margin-top: 17px; color: var(--spar-real-blue-dark); font-size: 0.92rem; font-weight: 900; line-height: 1.4; } .spar-real__process-list p { margin: 8px 0 0; color: var(--spar-real-muted); font-size: 0.82rem; line-height: 1.58; } /* ============================================================ FIDUCIA ============================================================ */ .spar-real__trust { display: grid; grid-template-columns: 74px minmax(0, 1fr); align-items: center; gap: 23px; margin-top: clamp(44px, 6vw, 68px); padding: clamp(24px, 3vw, 35px); border: 1px solid rgba(255, 138, 42, 0.31); border-radius: 21px; background: #fff3e7; } .spar-real__trust-icon { display: grid; place-items: center; width: 70px; height: 70px; border-radius: 20px; background: var(--spar-real-orange); color: #321705; } .spar-real__trust-icon svg { width: 41px; height: 41px; } .spar-real__trust-content { min-width: 0; } .spar-real__trust-label { margin: 0 0 7px; color: var(--spar-real-orange-dark); font-size: 0.72rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-real__trust h3 { font-size: clamp(1.35rem, 2.2vw, 1.88rem); } .spar-real__trust-content > p:last-child { margin: 11px 0 0; color: var(--spar-real-muted); font-size: 0.94rem; line-height: 1.68; } /* ============================================================ CTA ============================================================ */ .spar-real__conversion { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(330px, 0.92fr); align-items: center; gap: clamp(31px, 5vw, 66px); margin-top: clamp(53px, 7vw, 84px); padding: clamp(27px, 4vw, 47px); border: 1px solid rgba(36, 191, 193, 0.24); border-radius: 24px; background: var(--spar-real-cream); box-shadow: var(--spar-real-shadow); } .spar-real__conversion-content { min-width: 0; } .spar-real__conversion-label { margin: 0 0 12px; color: var(--spar-real-orange-dark); font-size: 0.74rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-real__conversion-content > p:not(.spar-real__conversion-label) { margin: 16px 0 0; color: var(--spar-real-muted); font-size: 0.96rem; line-height: 1.71; } .spar-real__conversion-content > p + p { margin-top: 11px; } .spar-real__actions { display: grid; gap: 11px; min-width: 0; } .spar-real__button { display: flex; min-width: 0; min-height: 58px; align-items: center; justify-content: center; gap: 10px; padding: 13px 17px; border: 2px solid transparent; border-radius: 12px; font-family: inherit; font-size: 0.91rem; font-weight: 850; line-height: 1.3; text-align: center; text-decoration: none; transition: transform 180ms ease, box-shadow 180ms ease, background-color 180ms ease, border-color 180ms ease; } .spar-real__button:hover { transform: translateY(-2px); } .spar-real__button:focus-visible { outline: 3px solid var(--spar-real-blue-dark); outline-offset: 4px; } .spar-real__button svg { flex: 0 0 23px; width: 23px; height: 23px; } .spar-real__button--primary { background: var(--spar-real-orange); color: #2c1504; box-shadow: 0 12px 27px rgba(255, 138, 42, 0.22); } .spar-real__button--primary:hover { background: #ff9b43; } .spar-real__button--whatsapp { background: var(--spar-real-green); color: var(--spar-real-white); box-shadow: 0 12px 27px rgba(39, 173, 104, 0.2); } .spar-real__button--whatsapp:hover { background: var(--spar-real-green-dark); } .spar-real__button--phone { border-color: rgba(7, 52, 59, 0.32); background: var(--spar-real-white); color: var(--spar-real-blue-dark); } .spar-real__button--phone:hover { border-color: var(--spar-real-teal); background: var(--spar-real-light); } .spar-real__phone-text { display: grid; min-width: 0; gap: 1px; text-align: left; } .spar-real__phone-text small { font-size: 0.64rem; font-weight: 750; line-height: 1.1; letter-spacing: 0.055em; text-transform: uppercase; } .spar-real__phone-text strong { color: inherit; font-size: 1rem; font-weight: 900; line-height: 1.15; } /* ============================================================ NOTEBOOK E TABLET ORIZZONTALE ============================================================ */ @media (max-width: 1100px) { .spar-real__system, .spar-real__difference, .spar-real__conversion { grid-template-columns: minmax(0, 1fr); } .spar-real__system-content, .spar-real__difference-content, .spar-real__conversion-content { max-width: 850px; } .spar-real__diagram, .spar-real__comparison { max-width: 850px; } .spar-real__process-list { grid-template-columns: repeat(3, minmax(0, 1fr)); } .spar-real__process-list li:nth-child(4), .spar-real__process-list li:nth-child(5) { grid-column: span 1; } .spar-real__actions { grid-template-columns: repeat(3, minmax(0, 1fr)); } } /* ============================================================ TABLET ============================================================ */ @media (max-width: 820px) { .spar-real { padding-block: 60px 74px; } .spar-real__container { width: min(calc(100% - 32px), 760px); } .spar-real__answer { grid-template-columns: 62px minmax(0, 1fr); gap: 18px; } .spar-real__answer-icon { width: 60px; height: 60px; border-radius: 17px; } .spar-real__answer-icon svg { width: 36px; height: 36px; } .spar-real__principles { grid-template-columns: minmax(0, 1fr); } .spar-real__details-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-real__comparison { grid-template-columns: minmax(0, 1fr); } .spar-real__process-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-real__process-list li:last-child { grid-column: 1 / -1; } .spar-real__actions { grid-template-columns: minmax(0, 1fr); } } /* ============================================================ MOBILE ============================================================ */ @media (max-width: 580px) { .spar-real { padding-block: 50px 62px; } .spar-real__container { width: calc(100% - 28px); } .spar-real__header, .spar-real__details-header, .spar-real__process-header { text-align: left; } .spar-real__eyebrow, .spar-real__section-label { font-size: 0.68rem; letter-spacing: 0.06em; } .spar-real__title { font-size: clamp(1.9rem, 9.7vw, 2.7rem); line-height: 1.1; } .spar-real__direct-answer { margin-top: 20px; font-size: 0.99rem; line-height: 1.63; } .spar-real__intro { font-size: 0.92rem; line-height: 1.67; } .spar-real__answer { grid-template-columns: minmax(0, 1fr); align-items: start; gap: 15px; padding: 20px 17px; border-radius: 18px; } .spar-real__answer-icon { width: 53px; height: 53px; border-radius: 15px; } .spar-real__answer-content h3 { font-size: 1.16rem; } .spar-real__answer-content > p:last-child { font-size: 0.9rem; } .spar-real__principle { padding: 22px 17px; border-radius: 18px; } .spar-real__principle h3 { font-size: 1.35rem; } .spar-real__principle > p { font-size: 0.91rem; line-height: 1.66; } .spar-real__system-content h3, .spar-real__details-header h3, .spar-real__difference-content h3, .spar-real__process-header h3, .spar-real__conversion h3 { font-size: clamp(1.5rem, 7.5vw, 1.95rem); line-height: 1.19; } .spar-real__system-content > p:not(.spar-real__section-label), .spar-real__details-header > p:last-child, .spar-real__difference-content > p:not(.spar-real__section-label), .spar-real__process-header > p:last-child, .spar-real__conversion-content > p:not(.spar-real__conversion-label) { font-size: 0.91rem; line-height: 1.66; } .spar-real__diagram { grid-template-columns: minmax(0, 1fr); padding: 16px 13px; border-radius: 18px; } .spar-real__diagram-layer { min-height: auto; padding: 15px; } .spar-real__diagram-layer--existing > span, .spar-real__diagram-layer--air > span, .spar-real__diagram-layer--frame > span { writing-mode: horizontal-tb; transform: none; } .spar-real__diagram-note { grid-column: auto; } .spar-real__details-grid, .spar-real__process-list { grid-template-columns: minmax(0, 1fr); } .spar-real__process-list li:last-child { grid-column: auto; } .spar-real__detail, .spar-real__process-list li { padding: 19px 17px; border-radius: 16px; } .spar-real__difference { padding: 23px 17px; border-radius: 20px; } .spar-real__comparison-card { padding: 19px 17px; border-radius: 16px; } .spar-real__trust { grid-template-columns: minmax(0, 1fr); align-items: start; gap: 15px; padding: 21px 17px; border-radius: 18px; } .spar-real__trust-icon { width: 54px; height: 54px; border-radius: 15px; } .spar-real__trust-icon svg { width: 31px; height: 31px; } .spar-real__trust h3 { font-size: 1.28rem; } .spar-real__trust-content > p:last-child { font-size: 0.9rem; line-height: 1.65; } .spar-real__conversion { padding: 22px 17px; border-radius: 19px; } .spar-real__button { width: 100%; min-height: 58px; padding-inline: 13px; font-size: 0.87rem; } } /* ============================================================ SMARTPHONE MOLTO STRETTI ============================================================ */ @media (max-width: 380px) { .spar-real__container { width: calc(100% - 22px); } .spar-real__title { font-size: 1.8rem; } .spar-real__principle, .spar-real__diagram, .spar-real__detail, .spar-real__difference, .spar-real__comparison-card, .spar-real__process-list li, .spar-real__trust, .spar-real__conversion { padding-inline: 14px; } .spar-real__button { gap: 8px; padding-inline: 10px; font-size: 0.83rem; } .spar-real__button svg { flex-basis: 21px; width: 21px; height: 21px; } } /* ============================================================ ACCESSIBILITÀ ============================================================ */ @media (prefers-reduced-motion: reduce) { .spar-real__button { transition: none; } .spar-real__button:hover { transform: none; } } /* ============================================================ STAMPA ============================================================ */ @media print { .spar-real { padding: 30px 0; background: #ffffff; } .spar-real__difference { border: 1px solid #ccdede; background: #ffffff; box-shadow: none; } .spar-real__difference-content h3, .spar-real__comparison-card h4 { color: var(--spar-real-text); } .spar-real__difference-content > p:not(.spar-real__section-label), .spar-real__comparison-card li { color: var(--spar-real-muted); } .spar-real__actions { display: none; } }#imCell_16 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHTMLObject_1726_16 { position: relative; align-self: start; justify-self: center; max-width: 100%; box-sizing: border-box; z-index: 3; } #imCellStyleGraphics_16 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imCellStyleBorders_16 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } /* ============================================================ H3 — CONTROPARETE ACUSTICA AUTOPORTANTE Pagina: /isolamento-acustico-pareti-roma.html ============================================================ */ .spar-caa, .spar-caa *, .spar-caa *::before, .spar-caa *::after { box-sizing: border-box; } .spar-caa { --spar-caa-blue-dark: #07343b; --spar-caa-blue-deep: #05282e; --spar-caa-blue-medium: #0b5159; --spar-caa-teal: #24bfc1; --spar-caa-teal-light: #c7f1ef; --spar-caa-orange: #ff8a2a; --spar-caa-orange-dark: #d86812; --spar-caa-green: #27ad68; --spar-caa-green-dark: #19864f; --spar-caa-white: #ffffff; --spar-caa-cream: #fff8ed; --spar-caa-light: #edf8f7; --spar-caa-text: #173c41; --spar-caa-muted: #557277; --spar-caa-border: #d4e6e4; --spar-caa-shadow: 0 20px 52px rgba(6, 52, 59, 0.1); position: relative; width: 100%; max-width: 100%; overflow: hidden; padding-block: clamp(66px, 8vw, 108px); background: radial-gradient( circle at 4% 8%, rgba(36, 191, 193, 0.11), transparent 27% ), radial-gradient( circle at 96% 92%, rgba(255, 138, 42, 0.09), transparent 25% ), var(--spar-caa-cream); color: var(--spar-caa-text); } .spar-caa h3, .spar-caa h4, .spar-caa h5, .spar-caa p, .spar-caa li, .spar-caa span, .spar-caa strong, .spar-caa small, .spar-caa a { max-width: 100%; white-space: normal; overflow-wrap: break-word; word-break: normal; } .spar-caa__container { width: min(calc(100% - 40px), 1220px); max-width: 1220px; margin-inline: auto; } /* ============================================================ HEADER ============================================================ */ .spar-caa__header { width: min(100%, 950px); margin-inline: auto; text-align: center; } .spar-caa__eyebrow, .spar-caa__section-label { margin: 0 0 13px; color: var(--spar-caa-orange-dark); font-size: 0.76rem; font-weight: 900; line-height: 1.4; letter-spacing: 0.08em; text-transform: uppercase; } .spar-caa__title { margin: 0; color: var(--spar-caa-blue-dark); font-family: inherit; font-size: clamp(2rem, 4.1vw, 3.45rem); font-weight: 900; line-height: 1.08; letter-spacing: -0.04em; text-wrap: balance; } .spar-caa__direct-answer { margin: 25px auto 0; color: var(--spar-caa-blue-dark); font-size: clamp(1.05rem, 1.45vw, 1.2rem); font-weight: 650; line-height: 1.7; } .spar-caa__direct-answer strong { color: inherit; font-weight: 900; } .spar-caa__intro { margin: 15px auto 0; color: var(--spar-caa-muted); font-size: 1rem; line-height: 1.74; } /* ============================================================ RISPOSTA DIRETTA ============================================================ */ .spar-caa__answer { display: grid; grid-template-columns: 78px minmax(0, 1fr); align-items: center; gap: 23px; width: min(100%, 1000px); margin: clamp(36px, 5vw, 57px) auto 0; padding: clamp(23px, 3vw, 34px); border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 22px; background: var(--spar-caa-white); box-shadow: var(--spar-caa-shadow); } .spar-caa__answer-icon { display: grid; place-items: center; width: 72px; height: 72px; border-radius: 20px; background: var(--spar-caa-blue-dark); color: var(--spar-caa-teal-light); } .spar-caa__answer-icon svg { display: block; width: 43px; height: 43px; } .spar-caa__answer-content { min-width: 0; } .spar-caa__answer-label { margin: 0 0 7px; color: var(--spar-caa-orange-dark); font-size: 0.72rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-caa__answer-content h4 { margin: 0; color: var(--spar-caa-blue-dark); font-size: clamp(1.22rem, 2vw, 1.62rem); font-weight: 900; line-height: 1.3; } .spar-caa__answer-content > p:last-child { margin: 10px 0 0; color: var(--spar-caa-muted); font-size: 0.96rem; line-height: 1.68; } /* ============================================================ TITOLI INTERNI ============================================================ */ .spar-caa__difference-content h4, .spar-caa__structure-content h4, .spar-caa__components-header h4, .spar-caa__benefits-content h4, .spar-caa__mistakes-header h4, .spar-caa__checks-content h4, .spar-caa__trust h4, .spar-caa__conversion h4 { margin: 0; color: var(--spar-caa-blue-dark); font-size: clamp(1.65rem, 2.9vw, 2.42rem); font-weight: 900; line-height: 1.16; letter-spacing: -0.032em; text-wrap: balance; } /* ============================================================ DIFFERENZA E CONFRONTO ============================================================ */ .spar-caa__difference { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(430px, 1.1fr); align-items: center; gap: clamp(36px, 5vw, 68px); margin-top: clamp(60px, 8vw, 94px); } .spar-caa__difference-content, .spar-caa__structure-content, .spar-caa__benefits-content, .spar-caa__checks-content { min-width: 0; } .spar-caa__difference-content > p:not(.spar-caa__section-label), .spar-caa__structure-content > p:not(.spar-caa__section-label), .spar-caa__benefits-content > p:not(.spar-caa__section-label), .spar-caa__checks-content > p:not(.spar-caa__section-label) { margin: 18px 0 0; color: var(--spar-caa-muted); font-size: 0.97rem; line-height: 1.72; } .spar-caa__difference-content > p + p, .spar-caa__structure-content > p + p, .spar-caa__benefits-content > p + p, .spar-caa__checks-content > p + p { margin-top: 12px; } .spar-caa__difference-highlight, .spar-caa__structure-highlight, .spar-caa__benefits-highlight, .spar-caa__checks-highlight { padding: 15px 17px; border-left: 4px solid var(--spar-caa-orange); border-radius: 0 12px 12px 0; background: #fff0e2; color: var(--spar-caa-blue-dark) !important; font-weight: 750; } .spar-caa__comparison { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; min-width: 0; } .spar-caa__comparison-card { min-width: 0; padding: 23px; border: 1px solid var(--spar-caa-border); border-top: 5px solid #d56652; border-radius: 19px; background: var(--spar-caa-white); box-shadow: 0 13px 34px rgba(6, 52, 59, 0.08); } .spar-caa__comparison-card--right { border-top-color: var(--spar-caa-teal); } .spar-caa__comparison-symbol { display: grid; place-items: center; width: 45px; height: 45px; border-radius: 14px; background: #fff0ed; color: #a23b2a; font-size: 1.15rem; font-weight: 900; } .spar-caa__comparison-card--right .spar-caa__comparison-symbol { background: var(--spar-caa-light); color: var(--spar-caa-blue-medium); } .spar-caa__comparison-card h5 { margin: 17px 0 0; color: var(--spar-caa-blue-dark); font-size: 1.08rem; font-weight: 900; line-height: 1.35; } .spar-caa__comparison-card > p { margin: 10px 0 0; color: var(--spar-caa-muted); font-size: 0.85rem; line-height: 1.6; } .spar-caa__comparison-card ul { display: grid; gap: 9px; margin: 16px 0 0; padding: 0; list-style: none; } .spar-caa__comparison-card li { position: relative; padding-left: 19px; color: var(--spar-caa-muted); font-size: 0.83rem; line-height: 1.55; } .spar-caa__comparison-card li::before { content: ""; position: absolute; top: 0.6em; left: 0; width: 7px; height: 7px; border-radius: 50%; background: #d56652; } .spar-caa__comparison-card--right li::before { background: var(--spar-caa-teal); } /* ============================================================ STRUTTURA E DIAGRAMMA ============================================================ */ .spar-caa__structure { display: grid; grid-template-columns: minmax(480px, 1.1fr) minmax(0, 0.9fr); align-items: center; gap: clamp(36px, 5vw, 68px); margin-top: clamp(60px, 8vw, 94px); } .spar-caa__diagram { display: grid; grid-template-columns: minmax(92px, 1fr) minmax(55px, 0.55fr) minmax(64px, 0.65fr) minmax(86px, 0.88fr) minmax(108px, 1.08fr) minmax(92px, 1fr); align-items: stretch; gap: 7px; min-width: 0; padding: 20px; border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 22px; background: var(--spar-caa-white); box-shadow: var(--spar-caa-shadow); } .spar-caa__diagram-layer { display: flex; min-width: 0; min-height: 265px; align-items: center; justify-content: center; flex-direction: column; padding: 12px; border-radius: 12px; text-align: center; } .spar-caa__diagram-layer--neighbor { background: #fff0e2; color: #703507; } .spar-caa__diagram-layer--wall { border: 2px solid #919fa1; background: repeating-linear-gradient( 45deg, #d9e0e0, #d9e0e0 8px, #c9d2d2 8px, #c9d2d2 16px ); color: #40575b; } .spar-caa__diagram-layer--gap { border: 1px dashed var(--spar-caa-teal); background: #f3fbfa; color: var(--spar-caa-blue-medium); } .spar-caa__diagram-layer--frame { border: 2px solid var(--spar-caa-blue-dark); background: linear-gradient( 90deg, transparent 0 24%, rgba(7, 52, 59, 0.16) 24% 34%, transparent 34% 66%, rgba(7, 52, 59, 0.16) 66% 76%, transparent 76% ), var(--spar-caa-light); color: var(--spar-caa-blue-dark); } .spar-caa__diagram-layer--mass { background: repeating-linear-gradient( 135deg, #d9f1ef, #d9f1ef 8px, #c3e8e5 8px, #c3e8e5 16px ); color: var(--spar-caa-blue-dark); } .spar-caa__diagram-layer--room { background: var(--spar-caa-blue-dark); color: var(--spar-caa-white); } .spar-caa__diagram-layer > span { font-size: 0.66rem; font-weight: 900; line-height: 1.35; text-transform: uppercase; } .spar-caa__diagram-layer--wall > span, .spar-caa__diagram-layer--gap > span, .spar-caa__diagram-layer--frame > span, .spar-caa__diagram-layer--mass > span { writing-mode: vertical-rl; transform: rotate(180deg); } .spar-caa__diagram-layer strong, .spar-caa__diagram-layer small { margin-top: 10px; color: inherit; font-size: 0.75rem; font-weight: 750; line-height: 1.4; } .spar-caa__diagram-note { grid-column: 1 / -1; margin: 8px 0 0; color: var(--spar-caa-muted); font-size: 0.75rem; line-height: 1.5; text-align: center; } /* ============================================================ COMPONENTI ============================================================ */ .spar-caa__components, .spar-caa__mistakes { margin-top: clamp(60px, 8vw, 94px); } .spar-caa__components-header, .spar-caa__mistakes-header { width: min(100%, 870px); margin-inline: auto; text-align: center; } .spar-caa__components-header > p:last-child, .spar-caa__mistakes-header > p:last-child { margin: 17px auto 0; color: var(--spar-caa-muted); font-size: 0.97rem; line-height: 1.72; } .spar-caa__components-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 17px; margin-top: 33px; } .spar-caa__component { min-width: 0; padding: 22px; border: 1px solid var(--spar-caa-border); border-radius: 18px; background: var(--spar-caa-white); box-shadow: 0 12px 30px rgba(6, 52, 59, 0.07); } .spar-caa__component-icon { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 14px; background: var(--spar-caa-light); color: var(--spar-caa-blue-dark); } .spar-caa__component-icon svg { width: 27px; height: 27px; } .spar-caa__component h5 { margin: 17px 0 0; color: var(--spar-caa-blue-dark); font-size: 1.03rem; font-weight: 900; line-height: 1.35; } .spar-caa__component p { margin: 9px 0 0; color: var(--spar-caa-muted); font-size: 0.86rem; line-height: 1.62; } /* ============================================================ BENEFICI ============================================================ */ .spar-caa__benefits { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(420px, 1.1fr); align-items: center; gap: clamp(35px, 5vw, 68px); margin-top: clamp(58px, 7vw, 88px); padding: clamp(28px, 4vw, 48px); border-radius: 25px; background: radial-gradient( circle at 94% 8%, rgba(36, 191, 193, 0.2), transparent 30% ), linear-gradient( 135deg, var(--spar-caa-blue-deep), var(--spar-caa-blue-dark) ); box-shadow: 0 24px 62px rgba(3, 35, 40, 0.2); } .spar-caa__benefits .spar-caa__section-label { color: var(--spar-caa-orange); } .spar-caa__benefits-content h4 { color: var(--spar-caa-white); } .spar-caa__benefits-content > p:not(.spar-caa__section-label) { color: rgba(255, 255, 255, 0.74); } .spar-caa__benefits-highlight { border-left-color: var(--spar-caa-orange); background: rgba(255, 255, 255, 0.08); color: var(--spar-caa-white) !important; } .spar-caa__benefits-list { display: grid; gap: 12px; min-width: 0; margin: 0; padding: 0; list-style: none; } .spar-caa__benefits-list li { display: grid; grid-template-columns: 40px minmax(0, 1fr); align-items: start; gap: 12px; min-width: 0; padding: 14px; border: 1px solid rgba(255, 255, 255, 0.13); border-radius: 14px; background: rgba(255, 255, 255, 0.07); } .spar-caa__benefits-list li > span { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: rgba(36, 191, 193, 0.16); color: var(--spar-caa-teal-light); font-size: 0.9rem; font-weight: 900; } .spar-caa__benefits-list li > div { min-width: 0; } .spar-caa__benefits-list strong { display: block; color: var(--spar-caa-white); font-size: 0.9rem; font-weight: 850; line-height: 1.35; } .spar-caa__benefits-list p { margin: 5px 0 0; color: rgba(255, 255, 255, 0.67); font-size: 0.8rem; line-height: 1.53; } /* ============================================================ ERRORI ============================================================ */ .spar-caa__mistakes-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 17px; margin-top: 33px; } .spar-caa__mistake { min-width: 0; padding: 22px; border: 1px solid rgba(255, 138, 42, 0.27); border-radius: 18px; background: var(--spar-caa-white); box-shadow: 0 12px 30px rgba(6, 52, 59, 0.07); } .spar-caa__mistake-symbol { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 13px; background: #fff0e2; color: var(--spar-caa-orange-dark); font-size: 1.05rem; font-weight: 900; } .spar-caa__mistake h5 { margin: 17px 0 0; color: var(--spar-caa-blue-dark); font-size: 1rem; font-weight: 900; line-height: 1.4; } .spar-caa__mistake p { margin: 9px 0 0; color: var(--spar-caa-muted); font-size: 0.84rem; line-height: 1.6; } /* ============================================================ VERIFICHE ============================================================ */ .spar-caa__checks { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(430px, 1.1fr); align-items: center; gap: clamp(35px, 5vw, 68px); margin-top: clamp(60px, 8vw, 94px); } .spar-caa__checks-list { display: grid; gap: 12px; min-width: 0; margin: 0; padding: 0; list-style: none; } .spar-caa__checks-list li { display: grid; grid-template-columns: 42px minmax(0, 1fr); align-items: start; gap: 13px; min-width: 0; padding: 15px; border: 1px solid var(--spar-caa-border); border-radius: 15px; background: var(--spar-caa-white); box-shadow: 0 10px 27px rgba(6, 52, 59, 0.07); } .spar-caa__checks-list li > span { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: var(--spar-caa-blue-dark); color: var(--spar-caa-teal-light); font-size: 0.76rem; font-weight: 900; } .spar-caa__checks-list li > div { min-width: 0; } .spar-caa__checks-list strong { display: block; color: var(--spar-caa-blue-dark); font-size: 0.91rem; font-weight: 900; line-height: 1.4; } .spar-caa__checks-list p { margin: 5px 0 0; color: var(--spar-caa-muted); font-size: 0.81rem; line-height: 1.55; } /* ============================================================ FIDUCIA ============================================================ */ .spar-caa__trust { display: grid; grid-template-columns: 74px minmax(0, 1fr); align-items: center; gap: 23px; margin-top: clamp(44px, 6vw, 68px); padding: clamp(24px, 3vw, 35px); border: 1px solid rgba(255, 138, 42, 0.31); border-radius: 21px; background: #fff3e7; } .spar-caa__trust-icon { display: grid; place-items: center; width: 70px; height: 70px; border-radius: 20px; background: var(--spar-caa-orange); color: #321705; } .spar-caa__trust-icon svg { width: 41px; height: 41px; } .spar-caa__trust-content { min-width: 0; } .spar-caa__trust-label { margin: 0 0 7px; color: var(--spar-caa-orange-dark); font-size: 0.72rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-caa__trust h4 { font-size: clamp(1.35rem, 2.2vw, 1.88rem); } .spar-caa__trust-content > p:last-child { margin: 11px 0 0; color: var(--spar-caa-muted); font-size: 0.94rem; line-height: 1.68; } /* ============================================================ CTA ============================================================ */ .spar-caa__conversion { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(330px, 0.92fr); align-items: center; gap: clamp(31px, 5vw, 66px); margin-top: clamp(53px, 7vw, 84px); padding: clamp(27px, 4vw, 47px); border: 1px solid rgba(36, 191, 193, 0.24); border-radius: 24px; background: var(--spar-caa-white); box-shadow: var(--spar-caa-shadow); } .spar-caa__conversion-content { min-width: 0; } .spar-caa__conversion-label { margin: 0 0 12px; color: var(--spar-caa-orange-dark); font-size: 0.74rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-caa__conversion-content > p:not(.spar-caa__conversion-label) { margin: 16px 0 0; color: var(--spar-caa-muted); font-size: 0.96rem; line-height: 1.71; } .spar-caa__conversion-content > p + p { margin-top: 11px; } .spar-caa__actions { display: grid; gap: 11px; min-width: 0; } .spar-caa__button { display: flex; min-width: 0; min-height: 58px; align-items: center; justify-content: center; gap: 10px; padding: 13px 17px; border: 2px solid transparent; border-radius: 12px; font-family: inherit; font-size: 0.91rem; font-weight: 850; line-height: 1.3; text-align: center; text-decoration: none; transition: transform 180ms ease, box-shadow 180ms ease, background-color 180ms ease, border-color 180ms ease; } .spar-caa__button:hover { transform: translateY(-2px); } .spar-caa__button:focus-visible { outline: 3px solid var(--spar-caa-blue-dark); outline-offset: 4px; } .spar-caa__button svg { flex: 0 0 23px; width: 23px; height: 23px; } .spar-caa__button--primary { background: var(--spar-caa-orange); color: #2c1504; box-shadow: 0 12px 27px rgba(255, 138, 42, 0.22); } .spar-caa__button--primary:hover { background: #ff9b43; } .spar-caa__button--whatsapp { background: var(--spar-caa-green); color: var(--spar-caa-white); box-shadow: 0 12px 27px rgba(39, 173, 104, 0.2); } .spar-caa__button--whatsapp:hover { background: var(--spar-caa-green-dark); } .spar-caa__button--phone { border-color: rgba(7, 52, 59, 0.32); background: var(--spar-caa-white); color: var(--spar-caa-blue-dark); } .spar-caa__button--phone:hover { border-color: var(--spar-caa-teal); background: var(--spar-caa-light); } .spar-caa__phone-text { display: grid; min-width: 0; gap: 1px; text-align: left; } .spar-caa__phone-text small { font-size: 0.64rem; font-weight: 750; line-height: 1.1; letter-spacing: 0.055em; text-transform: uppercase; } .spar-caa__phone-text strong { color: inherit; font-size: 1rem; font-weight: 900; line-height: 1.15; } /* ============================================================ NOTEBOOK E TABLET ORIZZONTALE ============================================================ */ @media (max-width: 1100px) { .spar-caa__difference, .spar-caa__structure, .spar-caa__benefits, .spar-caa__checks, .spar-caa__conversion { grid-template-columns: minmax(0, 1fr); } .spar-caa__difference-content, .spar-caa__structure-content, .spar-caa__benefits-content, .spar-caa__checks-content, .spar-caa__conversion-content { max-width: 850px; } .spar-caa__comparison, .spar-caa__diagram, .spar-caa__benefits-list, .spar-caa__checks-list { max-width: 850px; } .spar-caa__mistakes-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-caa__actions { grid-template-columns: repeat(3, minmax(0, 1fr)); } } /* ============================================================ TABLET ============================================================ */ @media (max-width: 820px) { .spar-caa { padding-block: 60px 74px; } .spar-caa__container { width: min(calc(100% - 32px), 760px); } .spar-caa__answer { grid-template-columns: 62px minmax(0, 1fr); gap: 18px; } .spar-caa__answer-icon { width: 60px; height: 60px; border-radius: 17px; } .spar-caa__answer-icon svg { width: 36px; height: 36px; } .spar-caa__comparison { grid-template-columns: minmax(0, 1fr); } .spar-caa__components-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-caa__actions { grid-template-columns: minmax(0, 1fr); } } /* ============================================================ MOBILE ============================================================ */ @media (max-width: 580px) { .spar-caa { padding-block: 50px 62px; } .spar-caa__container { width: calc(100% - 28px); } .spar-caa__header, .spar-caa__components-header, .spar-caa__mistakes-header { text-align: left; } .spar-caa__eyebrow, .spar-caa__section-label { font-size: 0.68rem; letter-spacing: 0.06em; } .spar-caa__title { font-size: clamp(1.9rem, 9.7vw, 2.7rem); line-height: 1.1; } .spar-caa__direct-answer { margin-top: 20px; font-size: 0.99rem; line-height: 1.63; } .spar-caa__intro { font-size: 0.92rem; line-height: 1.67; } .spar-caa__answer { grid-template-columns: minmax(0, 1fr); align-items: start; gap: 15px; padding: 20px 17px; border-radius: 18px; } .spar-caa__answer-icon { width: 53px; height: 53px; border-radius: 15px; } .spar-caa__answer-content h4 { font-size: 1.16rem; } .spar-caa__answer-content > p:last-child { font-size: 0.9rem; } .spar-caa__difference-content h4, .spar-caa__structure-content h4, .spar-caa__components-header h4, .spar-caa__benefits-content h4, .spar-caa__mistakes-header h4, .spar-caa__checks-content h4, .spar-caa__conversion h4 { font-size: clamp(1.5rem, 7.5vw, 1.95rem); line-height: 1.19; } .spar-caa__difference-content > p:not(.spar-caa__section-label), .spar-caa__structure-content > p:not(.spar-caa__section-label), .spar-caa__components-header > p:last-child, .spar-caa__benefits-content > p:not(.spar-caa__section-label), .spar-caa__mistakes-header > p:last-child, .spar-caa__checks-content > p:not(.spar-caa__section-label), .spar-caa__conversion-content > p:not(.spar-caa__conversion-label) { font-size: 0.91rem; line-height: 1.66; } .spar-caa__comparison-card { padding: 20px 17px; border-radius: 17px; } .spar-caa__diagram { grid-template-columns: minmax(0, 1fr); padding: 16px 13px; border-radius: 18px; } .spar-caa__diagram-layer { min-height: auto; padding: 15px; } .spar-caa__diagram-layer--wall > span, .spar-caa__diagram-layer--gap > span, .spar-caa__diagram-layer--frame > span, .spar-caa__diagram-layer--mass > span { writing-mode: horizontal-tb; transform: none; } .spar-caa__diagram-note { grid-column: auto; } .spar-caa__components-grid, .spar-caa__mistakes-grid { grid-template-columns: minmax(0, 1fr); } .spar-caa__component, .spar-caa__mistake { padding: 19px 17px; border-radius: 16px; } .spar-caa__benefits { padding: 23px 17px; border-radius: 20px; } .spar-caa__benefits-list li, .spar-caa__checks-list li { grid-template-columns: 38px minmax(0, 1fr); gap: 10px; padding: 12px; } .spar-caa__benefits-list li > span, .spar-caa__checks-list li > span { width: 38px; height: 38px; } .spar-caa__trust { grid-template-columns: minmax(0, 1fr); align-items: start; gap: 15px; padding: 21px 17px; border-radius: 18px; } .spar-caa__trust-icon { width: 54px; height: 54px; border-radius: 15px; } .spar-caa__trust-icon svg { width: 31px; height: 31px; } .spar-caa__trust h4 { font-size: 1.28rem; } .spar-caa__trust-content > p:last-child { font-size: 0.9rem; line-height: 1.65; } .spar-caa__conversion { padding: 22px 17px; border-radius: 19px; } .spar-caa__button { width: 100%; min-height: 58px; padding-inline: 13px; font-size: 0.87rem; } } /* ============================================================ SMARTPHONE MOLTO STRETTI ============================================================ */ @media (max-width: 380px) { .spar-caa__container { width: calc(100% - 22px); } .spar-caa__title { font-size: 1.8rem; } .spar-caa__comparison-card, .spar-caa__diagram, .spar-caa__component, .spar-caa__benefits, .spar-caa__mistake, .spar-caa__checks-list li, .spar-caa__trust, .spar-caa__conversion { padding-inline: 14px; } .spar-caa__button { gap: 8px; padding-inline: 10px; font-size: 0.83rem; } .spar-caa__button svg { flex-basis: 21px; width: 21px; height: 21px; } } /* ============================================================ ACCESSIBILITÀ ============================================================ */ @media (prefers-reduced-motion: reduce) { .spar-caa__button { transition: none; } .spar-caa__button:hover { transform: none; } } /* ============================================================ STAMPA ============================================================ */ @media print { .spar-caa { padding: 30px 0; background: #ffffff; } .spar-caa__benefits { border: 1px solid #ccdede; background: #ffffff; box-shadow: none; } .spar-caa__benefits-content h4, .spar-caa__benefits-list strong { color: var(--spar-caa-text); } .spar-caa__benefits-content > p:not(.spar-caa__section-label), .spar-caa__benefits-list p { color: var(--spar-caa-muted); } .spar-caa__actions { display: none; } }#imCell_17 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHTMLObject_1726_17 { position: relative; align-self: start; justify-self: center; max-width: 100%; box-sizing: border-box; z-index: 3; } #imCellStyleGraphics_17 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imCellStyleBorders_17 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } /* ============================================================ H3 — DISACCOPPIAMENTO DALLA STRUTTURA ESISTENTE Pagina: /isolamento-acustico-pareti-roma.html ============================================================ */ .spar-dis, .spar-dis *, .spar-dis *::before, .spar-dis *::after { box-sizing: border-box; } .spar-dis { --spar-dis-blue-dark: #07343b; --spar-dis-blue-deep: #05282e; --spar-dis-blue-medium: #0b5159; --spar-dis-teal: #24bfc1; --spar-dis-teal-light: #c7f1ef; --spar-dis-orange: #ff8a2a; --spar-dis-orange-dark: #d86812; --spar-dis-green: #27ad68; --spar-dis-green-dark: #19864f; --spar-dis-white: #ffffff; --spar-dis-cream: #fff8ed; --spar-dis-light: #edf8f7; --spar-dis-text: #173c41; --spar-dis-muted: #557277; --spar-dis-border: #d4e6e4; --spar-dis-shadow: 0 20px 52px rgba(6, 52, 59, 0.1); position: relative; width: 100%; max-width: 100%; overflow: hidden; padding-block: clamp(66px, 8vw, 108px); background: radial-gradient( circle at 96% 8%, rgba(36, 191, 193, 0.11), transparent 27% ), radial-gradient( circle at 4% 92%, rgba(255, 138, 42, 0.09), transparent 25% ), #ffffff; color: var(--spar-dis-text); } .spar-dis h3, .spar-dis h4, .spar-dis h5, .spar-dis p, .spar-dis li, .spar-dis span, .spar-dis strong, .spar-dis small, .spar-dis a { max-width: 100%; white-space: normal; overflow-wrap: break-word; word-break: normal; } .spar-dis__container { width: min(calc(100% - 40px), 1220px); max-width: 1220px; margin-inline: auto; } /* ============================================================ HEADER ============================================================ */ .spar-dis__header { width: min(100%, 960px); margin-inline: auto; text-align: center; } .spar-dis__eyebrow, .spar-dis__section-label { margin: 0 0 13px; color: var(--spar-dis-orange-dark); font-size: 0.76rem; font-weight: 900; line-height: 1.4; letter-spacing: 0.08em; text-transform: uppercase; } .spar-dis__title { margin: 0; color: var(--spar-dis-blue-dark); font-family: inherit; font-size: clamp(2rem, 4.1vw, 3.45rem); font-weight: 900; line-height: 1.08; letter-spacing: -0.04em; text-wrap: balance; } .spar-dis__direct-answer { margin: 25px auto 0; color: var(--spar-dis-blue-dark); font-size: clamp(1.05rem, 1.45vw, 1.2rem); font-weight: 650; line-height: 1.7; } .spar-dis__direct-answer strong { color: inherit; font-weight: 900; } .spar-dis__intro { margin: 15px auto 0; color: var(--spar-dis-muted); font-size: 1rem; line-height: 1.74; } /* ============================================================ RISPOSTA DIRETTA ============================================================ */ .spar-dis__answer { display: grid; grid-template-columns: 78px minmax(0, 1fr); align-items: center; gap: 23px; width: min(100%, 1000px); margin: clamp(36px, 5vw, 57px) auto 0; padding: clamp(23px, 3vw, 34px); border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 22px; background: var(--spar-dis-cream); box-shadow: var(--spar-dis-shadow); } .spar-dis__answer-icon { display: grid; place-items: center; width: 72px; height: 72px; border-radius: 20px; background: var(--spar-dis-blue-dark); color: var(--spar-dis-teal-light); } .spar-dis__answer-icon svg { display: block; width: 43px; height: 43px; } .spar-dis__answer-content { min-width: 0; } .spar-dis__answer-label { margin: 0 0 7px; color: var(--spar-dis-orange-dark); font-size: 0.72rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-dis__answer-content h4 { margin: 0; color: var(--spar-dis-blue-dark); font-size: clamp(1.22rem, 2vw, 1.62rem); font-weight: 900; line-height: 1.3; } .spar-dis__answer-content > p:last-child { margin: 10px 0 0; color: var(--spar-dis-muted); font-size: 0.96rem; line-height: 1.68; } /* ============================================================ TITOLI INTERNI ============================================================ */ .spar-dis__meaning-content h4, .spar-dis__system-content h4, .spar-dis__contacts-header h4, .spar-dis__elastic-content h4, .spar-dis__mistakes-content h4, .spar-dis__balance-content h4, .spar-dis__checks-header h4, .spar-dis__process-content h4, .spar-dis__trust h4, .spar-dis__conversion h4 { margin: 0; color: var(--spar-dis-blue-dark); font-size: clamp(1.65rem, 2.9vw, 2.42rem); font-weight: 900; line-height: 1.16; letter-spacing: -0.032em; text-wrap: balance; } /* ============================================================ SIGNIFICATO E CONFRONTO ============================================================ */ .spar-dis__meaning { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(430px, 1.1fr); align-items: center; gap: clamp(36px, 5vw, 68px); margin-top: clamp(60px, 8vw, 94px); } .spar-dis__meaning-content, .spar-dis__system-content, .spar-dis__elastic-content, .spar-dis__mistakes-content, .spar-dis__balance-content, .spar-dis__process-content { min-width: 0; } .spar-dis__meaning-content > p:not(.spar-dis__section-label), .spar-dis__system-content > p:not(.spar-dis__section-label), .spar-dis__elastic-content > p:not(.spar-dis__section-label), .spar-dis__mistakes-content > p:not(.spar-dis__section-label), .spar-dis__balance-content > p:not(.spar-dis__section-label), .spar-dis__process-content > p:not(.spar-dis__section-label) { margin: 18px 0 0; color: var(--spar-dis-muted); font-size: 0.97rem; line-height: 1.72; } .spar-dis__meaning-content > p + p, .spar-dis__system-content > p + p, .spar-dis__elastic-content > p + p, .spar-dis__mistakes-content > p + p, .spar-dis__balance-content > p + p, .spar-dis__process-content > p + p { margin-top: 12px; } .spar-dis__meaning-highlight, .spar-dis__system-highlight, .spar-dis__elastic-highlight, .spar-dis__mistakes-highlight, .spar-dis__balance-highlight { padding: 15px 17px; border-left: 4px solid var(--spar-dis-orange); border-radius: 0 12px 12px 0; background: #fff0e2; color: var(--spar-dis-blue-dark) !important; font-weight: 750; } .spar-dis__comparison { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; min-width: 0; } .spar-dis__comparison-card { min-width: 0; padding: 23px; border: 1px solid var(--spar-dis-border); border-top: 5px solid #d56652; border-radius: 19px; background: var(--spar-dis-white); box-shadow: 0 13px 34px rgba(6, 52, 59, 0.08); } .spar-dis__comparison-card--decoupled { border-top-color: var(--spar-dis-teal); } .spar-dis__comparison-symbol { display: grid; place-items: center; width: 45px; height: 45px; border-radius: 14px; background: #fff0ed; color: #a23b2a; font-size: 1.15rem; font-weight: 900; } .spar-dis__comparison-card--decoupled .spar-dis__comparison-symbol { background: var(--spar-dis-light); color: var(--spar-dis-blue-medium); } .spar-dis__comparison-label { margin: 17px 0 0; color: var(--spar-dis-orange-dark); font-size: 0.68rem; font-weight: 900; line-height: 1.3; letter-spacing: 0.06em; text-transform: uppercase; } .spar-dis__comparison-card h5 { margin: 7px 0 0; color: var(--spar-dis-blue-dark); font-size: 1.08rem; font-weight: 900; line-height: 1.35; } .spar-dis__comparison-card > p:last-child { margin: 14px 0 0; color: var(--spar-dis-muted); font-size: 0.85rem; line-height: 1.6; } /* ============================================================ MINI DIAGRAMMA ============================================================ */ .spar-dis__mini-diagram { display: grid; grid-template-columns: 1fr 42px 1fr; align-items: stretch; min-height: 125px; margin-top: 18px; padding: 12px; border-radius: 14px; background: var(--spar-dis-light); } .spar-dis__mini-wall { border: 2px solid #87999b; border-radius: 8px; background: repeating-linear-gradient( 45deg, #d8dfdf, #d8dfdf 7px, #c9d2d2 7px, #c9d2d2 14px ); } .spar-dis__mini-frame { border: 2px solid var(--spar-dis-blue-dark); border-radius: 8px; background: linear-gradient( 90deg, transparent 0 35%, rgba(7, 52, 59, 0.2) 35% 48%, transparent 48% 100% ), #d9f1ef; } .spar-dis__mini-bridge { position: relative; } .spar-dis__mini-bridge::before, .spar-dis__mini-bridge::after { content: ""; position: absolute; top: 29%; right: -4px; left: -4px; height: 8px; border-radius: 999px; background: #d56652; } .spar-dis__mini-bridge::after { top: auto; bottom: 29%; } .spar-dis__mini-gap { border-inline: 1px dashed var(--spar-dis-teal); background: rgba(255, 255, 255, 0.55); } /* ============================================================ SISTEMA E DIAGRAMMA ============================================================ */ .spar-dis__system { display: grid; grid-template-columns: minmax(480px, 1.1fr) minmax(0, 0.9fr); align-items: center; gap: clamp(36px, 5vw, 68px); margin-top: clamp(60px, 8vw, 94px); } .spar-dis__diagram { display: grid; grid-template-columns: minmax(92px, 1fr) minmax(60px, 0.62fr) minmax(66px, 0.68fr) minmax(90px, 0.92fr) minmax(108px, 1.08fr) minmax(92px, 1fr); align-items: stretch; gap: 7px; min-width: 0; padding: 20px; border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 22px; background: var(--spar-dis-white); box-shadow: var(--spar-dis-shadow); } .spar-dis__diagram-layer { display: flex; min-width: 0; min-height: 270px; align-items: center; justify-content: center; flex-direction: column; padding: 12px; border-radius: 12px; text-align: center; } .spar-dis__diagram-layer--neighbor { background: #fff0e2; color: #703507; } .spar-dis__diagram-layer--existing { border: 2px solid #919fa1; background: repeating-linear-gradient( 45deg, #d9e0e0, #d9e0e0 8px, #c9d2d2 8px, #c9d2d2 16px ); color: #40575b; } .spar-dis__diagram-layer--separation { border: 1px dashed var(--spar-dis-teal); background: #f3fbfa; color: var(--spar-dis-blue-medium); } .spar-dis__diagram-layer--frame { border: 2px solid var(--spar-dis-blue-dark); background: linear-gradient( 90deg, transparent 0 24%, rgba(7, 52, 59, 0.16) 24% 34%, transparent 34% 66%, rgba(7, 52, 59, 0.16) 66% 76%, transparent 76% ), var(--spar-dis-light); color: var(--spar-dis-blue-dark); } .spar-dis__diagram-layer--mass { background: repeating-linear-gradient( 135deg, #d9f1ef, #d9f1ef 8px, #c3e8e5 8px, #c3e8e5 16px ); color: var(--spar-dis-blue-dark); } .spar-dis__diagram-layer--room { background: var(--spar-dis-blue-dark); color: var(--spar-dis-white); } .spar-dis__diagram-layer > span { font-size: 0.66rem; font-weight: 900; line-height: 1.35; text-transform: uppercase; } .spar-dis__diagram-layer--existing > span, .spar-dis__diagram-layer--separation > span, .spar-dis__diagram-layer--frame > span, .spar-dis__diagram-layer--mass > span { writing-mode: vertical-rl; transform: rotate(180deg); } .spar-dis__diagram-layer strong, .spar-dis__diagram-layer small { margin-top: 10px; color: inherit; font-size: 0.74rem; font-weight: 750; line-height: 1.4; } .spar-dis__diagram-note { grid-column: 1 / -1; margin: 8px 0 0; color: var(--spar-dis-muted); font-size: 0.75rem; line-height: 1.5; text-align: center; } /* ============================================================ PUNTI DI CONTATTO ============================================================ */ .spar-dis__contacts, .spar-dis__checks { margin-top: clamp(60px, 8vw, 94px); } .spar-dis__contacts-header, .spar-dis__checks-header { width: min(100%, 870px); margin-inline: auto; text-align: center; } .spar-dis__contacts-header > p:last-child, .spar-dis__checks-header > p:last-child { margin: 17px auto 0; color: var(--spar-dis-muted); font-size: 0.97rem; line-height: 1.72; } .spar-dis__contacts-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 17px; margin-top: 33px; } .spar-dis__contact { min-width: 0; padding: 22px; border: 1px solid var(--spar-dis-border); border-radius: 18px; background: var(--spar-dis-white); box-shadow: 0 12px 30px rgba(6, 52, 59, 0.07); } .spar-dis__contact-icon { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 14px; background: var(--spar-dis-light); color: var(--spar-dis-blue-dark); } .spar-dis__contact-icon svg { width: 27px; height: 27px; } .spar-dis__contact h5 { margin: 17px 0 0; color: var(--spar-dis-blue-dark); font-size: 1.02rem; font-weight: 900; line-height: 1.35; } .spar-dis__contact p { margin: 9px 0 0; color: var(--spar-dis-muted); font-size: 0.85rem; line-height: 1.62; } /* ============================================================ EPDM ============================================================ */ .spar-dis__elastic { display: grid; grid-template-columns: minmax(0, 0.92fr) minmax(390px, 1.08fr); align-items: center; gap: clamp(36px, 5vw, 68px); margin-top: clamp(60px, 8vw, 94px); } .spar-dis__elastic-visual { display: grid; gap: 7px; min-width: 0; padding: 22px; border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 22px; background: var(--spar-dis-white); box-shadow: var(--spar-dis-shadow); } .spar-dis__elastic-layer { display: grid; place-items: center; min-height: 60px; padding: 12px; border-radius: 11px; text-align: center; } .spar-dis__elastic-layer span { font-size: 0.72rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.045em; text-transform: uppercase; } .spar-dis__elastic-layer--floor { background: repeating-linear-gradient( 45deg, #d9e0e0, #d9e0e0 8px, #c9d2d2 8px, #c9d2d2 16px ); color: #40575b; } .spar-dis__elastic-layer--epdm { min-height: 38px; background: var(--spar-dis-orange); color: #321705; } .spar-dis__elastic-layer--guide { min-height: 46px; border: 2px solid var(--spar-dis-blue-dark); background: var(--spar-dis-light); color: var(--spar-dis-blue-dark); } .spar-dis__elastic-layer--frame { min-height: 115px; border: 2px solid var(--spar-dis-blue-dark); background: linear-gradient( 90deg, transparent 0 20%, rgba(7, 52, 59, 0.17) 20% 28%, transparent 28% 72%, rgba(7, 52, 59, 0.17) 72% 80%, transparent 80% ), #d9f1ef; color: var(--spar-dis-blue-dark); } .spar-dis__elastic-visual > p { margin: 9px 0 0; color: var(--spar-dis-muted); font-size: 0.76rem; line-height: 1.5; text-align: center; } /* ============================================================ ERRORI ============================================================ */ .spar-dis__mistakes { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(420px, 1.1fr); align-items: center; gap: clamp(35px, 5vw, 68px); margin-top: clamp(58px, 7vw, 88px); padding: clamp(28px, 4vw, 48px); border-radius: 25px; background: radial-gradient( circle at 94% 8%, rgba(36, 191, 193, 0.2), transparent 30% ), linear-gradient( 135deg, var(--spar-dis-blue-deep), var(--spar-dis-blue-dark) ); box-shadow: 0 24px 62px rgba(3, 35, 40, 0.2); } .spar-dis__mistakes .spar-dis__section-label { color: var(--spar-dis-orange); } .spar-dis__mistakes-content h4 { color: var(--spar-dis-white); } .spar-dis__mistakes-content > p:not(.spar-dis__section-label) { color: rgba(255, 255, 255, 0.74); } .spar-dis__mistakes-highlight { border-left-color: var(--spar-dis-orange); background: rgba(255, 255, 255, 0.08); color: var(--spar-dis-white) !important; } .spar-dis__mistakes-list { display: grid; gap: 12px; min-width: 0; margin: 0; padding: 0; list-style: none; } .spar-dis__mistakes-list li { display: grid; grid-template-columns: 40px minmax(0, 1fr); align-items: start; gap: 12px; min-width: 0; padding: 14px; border: 1px solid rgba(255, 255, 255, 0.13); border-radius: 14px; background: rgba(255, 255, 255, 0.07); } .spar-dis__mistakes-list li > span { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: rgba(255, 138, 42, 0.16); color: var(--spar-dis-orange); font-size: 1.05rem; font-weight: 900; } .spar-dis__mistakes-list li > div { min-width: 0; } .spar-dis__mistakes-list strong { display: block; color: var(--spar-dis-white); font-size: 0.9rem; font-weight: 850; line-height: 1.35; } .spar-dis__mistakes-list p { margin: 5px 0 0; color: rgba(255, 255, 255, 0.67); font-size: 0.8rem; line-height: 1.53; } /* ============================================================ EQUILIBRIO TRA SEPARAZIONE E STABILITÀ ============================================================ */ .spar-dis__balance { display: grid; grid-template-columns: minmax(0, 0.94fr) minmax(420px, 1.06fr); align-items: center; gap: clamp(36px, 5vw, 68px); margin-top: clamp(60px, 8vw, 94px); } .spar-dis__balance-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; min-width: 0; } .spar-dis__balance-card { min-width: 0; padding: 20px; border: 1px solid var(--spar-dis-border); border-top: 5px solid var(--spar-dis-teal); border-radius: 18px; background: var(--spar-dis-white); box-shadow: 0 12px 30px rgba(6, 52, 59, 0.07); } .spar-dis__balance-card:nth-child(2) { border-top-color: var(--spar-dis-orange); } .spar-dis__balance-card:nth-child(3) { border-top-color: var(--spar-dis-green); } .spar-dis__balance-icon { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 14px; background: var(--spar-dis-light); color: var(--spar-dis-blue-dark); } .spar-dis__balance-icon svg { width: 26px; height: 26px; } .spar-dis__balance-card h5 { margin: 17px 0 0; color: var(--spar-dis-blue-dark); font-size: 1rem; font-weight: 900; line-height: 1.35; } .spar-dis__balance-card p { margin: 9px 0 0; color: var(--spar-dis-muted); font-size: 0.83rem; line-height: 1.58; } /* ============================================================ VERIFICHE ============================================================ */ .spar-dis__checks-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin: 33px 0 0; padding: 0; list-style: none; } .spar-dis__checks-list li { min-width: 0; padding: 22px; border: 1px solid var(--spar-dis-border); border-radius: 18px; background: var(--spar-dis-white); box-shadow: 0 12px 30px rgba(6, 52, 59, 0.07); } .spar-dis__checks-number { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; background: var(--spar-dis-blue-dark); color: var(--spar-dis-teal-light); font-size: 0.8rem; font-weight: 900; } .spar-dis__checks-list strong { display: block; margin-top: 17px; color: var(--spar-dis-blue-dark); font-size: 0.94rem; font-weight: 900; line-height: 1.4; } .spar-dis__checks-list p { margin: 8px 0 0; color: var(--spar-dis-muted); font-size: 0.84rem; line-height: 1.58; } /* ============================================================ PROCESSO ============================================================ */ .spar-dis__process { display: grid; grid-template-columns: minmax(0, 0.84fr) minmax(440px, 1.16fr); align-items: center; gap: clamp(35px, 5vw, 68px); margin-top: clamp(60px, 8vw, 94px); } .spar-dis__process-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; min-width: 0; margin: 0; padding: 0; list-style: none; } .spar-dis__process-list li { display: grid; grid-template-columns: 42px minmax(0, 1fr); align-items: start; gap: 12px; min-width: 0; padding: 15px; border: 1px solid var(--spar-dis-border); border-radius: 15px; background: var(--spar-dis-white); box-shadow: 0 10px 27px rgba(6, 52, 59, 0.07); } .spar-dis__process-list li > span { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; background: var(--spar-dis-blue-dark); color: var(--spar-dis-teal-light); font-size: 0.78rem; font-weight: 900; } .spar-dis__process-list li > div { min-width: 0; } .spar-dis__process-list strong { display: block; color: var(--spar-dis-blue-dark); font-size: 0.9rem; font-weight: 900; line-height: 1.4; } .spar-dis__process-list p { margin: 5px 0 0; color: var(--spar-dis-muted); font-size: 0.81rem; line-height: 1.55; } /* ============================================================ FIDUCIA ============================================================ */ .spar-dis__trust { display: grid; grid-template-columns: 74px minmax(0, 1fr); align-items: center; gap: 23px; margin-top: clamp(44px, 6vw, 68px); padding: clamp(24px, 3vw, 35px); border: 1px solid rgba(255, 138, 42, 0.31); border-radius: 21px; background: #fff3e7; } .spar-dis__trust-icon { display: grid; place-items: center; width: 70px; height: 70px; border-radius: 20px; background: var(--spar-dis-orange); color: #321705; } .spar-dis__trust-icon svg { width: 41px; height: 41px; } .spar-dis__trust-content { min-width: 0; } .spar-dis__trust-label { margin: 0 0 7px; color: var(--spar-dis-orange-dark); font-size: 0.72rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-dis__trust h4 { font-size: clamp(1.35rem, 2.2vw, 1.88rem); } .spar-dis__trust-content > p:last-child { margin: 11px 0 0; color: var(--spar-dis-muted); font-size: 0.94rem; line-height: 1.68; } /* ============================================================ CTA ============================================================ */ .spar-dis__conversion { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(330px, 0.92fr); align-items: center; gap: clamp(31px, 5vw, 66px); margin-top: clamp(53px, 7vw, 84px); padding: clamp(27px, 4vw, 47px); border: 1px solid rgba(36, 191, 193, 0.24); border-radius: 24px; background: var(--spar-dis-cream); box-shadow: var(--spar-dis-shadow); } .spar-dis__conversion-content { min-width: 0; } .spar-dis__conversion-label { margin: 0 0 12px; color: var(--spar-dis-orange-dark); font-size: 0.74rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-dis__conversion-content > p:not(.spar-dis__conversion-label) { margin: 16px 0 0; color: var(--spar-dis-muted); font-size: 0.96rem; line-height: 1.71; } .spar-dis__conversion-content > p + p { margin-top: 11px; } .spar-dis__actions { display: grid; gap: 11px; min-width: 0; } .spar-dis__button { display: flex; min-width: 0; min-height: 58px; align-items: center; justify-content: center; gap: 10px; padding: 13px 17px; border: 2px solid transparent; border-radius: 12px; font-family: inherit; font-size: 0.91rem; font-weight: 850; line-height: 1.3; text-align: center; text-decoration: none; transition: transform 180ms ease, box-shadow 180ms ease, background-color 180ms ease, border-color 180ms ease; } .spar-dis__button:hover { transform: translateY(-2px); } .spar-dis__button:focus-visible { outline: 3px solid var(--spar-dis-blue-dark); outline-offset: 4px; } .spar-dis__button svg { flex: 0 0 23px; width: 23px; height: 23px; } .spar-dis__button--primary { background: var(--spar-dis-orange); color: #2c1504; box-shadow: 0 12px 27px rgba(255, 138, 42, 0.22); } .spar-dis__button--primary:hover { background: #ff9b43; } .spar-dis__button--whatsapp { background: var(--spar-dis-green); color: var(--spar-dis-white); box-shadow: 0 12px 27px rgba(39, 173, 104, 0.2); } .spar-dis__button--whatsapp:hover { background: var(--spar-dis-green-dark); } .spar-dis__button--phone { border-color: rgba(7, 52, 59, 0.32); background: var(--spar-dis-white); color: var(--spar-dis-blue-dark); } .spar-dis__button--phone:hover { border-color: var(--spar-dis-teal); background: var(--spar-dis-light); } .spar-dis__phone-text { display: grid; min-width: 0; gap: 1px; text-align: left; } .spar-dis__phone-text small { font-size: 0.64rem; font-weight: 750; line-height: 1.1; letter-spacing: 0.055em; text-transform: uppercase; } .spar-dis__phone-text strong { color: inherit; font-size: 1rem; font-weight: 900; line-height: 1.15; } /* ============================================================ NOTEBOOK E TABLET ORIZZONTALE ============================================================ */ @media (max-width: 1100px) { .spar-dis__meaning, .spar-dis__system, .spar-dis__elastic, .spar-dis__mistakes, .spar-dis__balance, .spar-dis__process, .spar-dis__conversion { grid-template-columns: minmax(0, 1fr); } .spar-dis__meaning-content, .spar-dis__system-content, .spar-dis__elastic-content, .spar-dis__mistakes-content, .spar-dis__balance-content, .spar-dis__process-content, .spar-dis__conversion-content { max-width: 850px; } .spar-dis__comparison, .spar-dis__diagram, .spar-dis__elastic-visual, .spar-dis__mistakes-list, .spar-dis__balance-cards, .spar-dis__process-list { max-width: 850px; } .spar-dis__contacts-grid, .spar-dis__checks-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-dis__actions { grid-template-columns: repeat(3, minmax(0, 1fr)); } } /* ============================================================ TABLET ============================================================ */ @media (max-width: 820px) { .spar-dis { padding-block: 60px 74px; } .spar-dis__container { width: min(calc(100% - 32px), 760px); } .spar-dis__answer { grid-template-columns: 62px minmax(0, 1fr); gap: 18px; } .spar-dis__answer-icon { width: 60px; height: 60px; border-radius: 17px; } .spar-dis__answer-icon svg { width: 36px; height: 36px; } .spar-dis__comparison, .spar-dis__balance-cards { grid-template-columns: minmax(0, 1fr); } .spar-dis__actions { grid-template-columns: minmax(0, 1fr); } } /* ============================================================ MOBILE ============================================================ */ @media (max-width: 580px) { .spar-dis { padding-block: 50px 62px; } .spar-dis__container { width: calc(100% - 28px); } .spar-dis__header, .spar-dis__contacts-header, .spar-dis__checks-header { text-align: left; } .spar-dis__eyebrow, .spar-dis__section-label { font-size: 0.68rem; letter-spacing: 0.06em; } .spar-dis__title { font-size: clamp(1.88rem, 9.6vw, 2.68rem); line-height: 1.1; } .spar-dis__direct-answer { margin-top: 20px; font-size: 0.99rem; line-height: 1.63; } .spar-dis__intro { font-size: 0.92rem; line-height: 1.67; } .spar-dis__answer { grid-template-columns: minmax(0, 1fr); align-items: start; gap: 15px; padding: 20px 17px; border-radius: 18px; } .spar-dis__answer-icon { width: 53px; height: 53px; border-radius: 15px; } .spar-dis__answer-content h4 { font-size: 1.16rem; } .spar-dis__answer-content > p:last-child { font-size: 0.9rem; } .spar-dis__meaning-content h4, .spar-dis__system-content h4, .spar-dis__contacts-header h4, .spar-dis__elastic-content h4, .spar-dis__mistakes-content h4, .spar-dis__balance-content h4, .spar-dis__checks-header h4, .spar-dis__process-content h4, .spar-dis__conversion h4 { font-size: clamp(1.5rem, 7.5vw, 1.95rem); line-height: 1.19; } .spar-dis__meaning-content > p:not(.spar-dis__section-label), .spar-dis__system-content > p:not(.spar-dis__section-label), .spar-dis__contacts-header > p:last-child, .spar-dis__elastic-content > p:not(.spar-dis__section-label), .spar-dis__mistakes-content > p:not(.spar-dis__section-label), .spar-dis__balance-content > p:not(.spar-dis__section-label), .spar-dis__checks-header > p:last-child, .spar-dis__process-content > p:not(.spar-dis__section-label), .spar-dis__conversion-content > p:not(.spar-dis__conversion-label) { font-size: 0.91rem; line-height: 1.66; } .spar-dis__comparison-card { padding: 20px 17px; border-radius: 17px; } .spar-dis__diagram { grid-template-columns: minmax(0, 1fr); padding: 16px 13px; border-radius: 18px; } .spar-dis__diagram-layer { min-height: auto; padding: 15px; } .spar-dis__diagram-layer--existing > span, .spar-dis__diagram-layer--separation > span, .spar-dis__diagram-layer--frame > span, .spar-dis__diagram-layer--mass > span { writing-mode: horizontal-tb; transform: none; } .spar-dis__diagram-note { grid-column: auto; } .spar-dis__contacts-grid, .spar-dis__checks-list, .spar-dis__process-list { grid-template-columns: minmax(0, 1fr); } .spar-dis__contact, .spar-dis__checks-list li { padding: 19px 17px; border-radius: 16px; } .spar-dis__elastic-visual { padding: 17px; border-radius: 18px; } .spar-dis__mistakes { padding: 23px 17px; border-radius: 20px; } .spar-dis__mistakes-list li, .spar-dis__process-list li { grid-template-columns: 38px minmax(0, 1fr); gap: 10px; padding: 12px; } .spar-dis__mistakes-list li > span, .spar-dis__process-list li > span { width: 38px; height: 38px; } .spar-dis__balance-card { padding: 19px 17px; border-radius: 16px; } .spar-dis__trust { grid-template-columns: minmax(0, 1fr); align-items: start; gap: 15px; padding: 21px 17px; border-radius: 18px; } .spar-dis__trust-icon { width: 54px; height: 54px; border-radius: 15px; } .spar-dis__trust-icon svg { width: 31px; height: 31px; } .spar-dis__trust h4 { font-size: 1.28rem; } .spar-dis__trust-content > p:last-child { font-size: 0.9rem; line-height: 1.65; } .spar-dis__conversion { padding: 22px 17px; border-radius: 19px; } .spar-dis__button { width: 100%; min-height: 58px; padding-inline: 13px; font-size: 0.87rem; } } /* ============================================================ SMARTPHONE MOLTO STRETTI ============================================================ */ @media (max-width: 380px) { .spar-dis__container { width: calc(100% - 22px); } .spar-dis__title { font-size: 1.78rem; } .spar-dis__comparison-card, .spar-dis__diagram, .spar-dis__contact, .spar-dis__elastic-visual, .spar-dis__mistakes, .spar-dis__balance-card, .spar-dis__checks-list li, .spar-dis__process-list li, .spar-dis__trust, .spar-dis__conversion { padding-inline: 14px; } .spar-dis__button { gap: 8px; padding-inline: 10px; font-size: 0.83rem; } .spar-dis__button svg { flex-basis: 21px; width: 21px; height: 21px; } } /* ============================================================ ACCESSIBILITÀ ============================================================ */ @media (prefers-reduced-motion: reduce) { .spar-dis__button { transition: none; } .spar-dis__button:hover { transform: none; } } /* ============================================================ STAMPA ============================================================ */ @media print { .spar-dis { padding: 30px 0; background: #ffffff; } .spar-dis__mistakes { border: 1px solid #ccdede; background: #ffffff; box-shadow: none; } .spar-dis__mistakes-content h4, .spar-dis__mistakes-list strong { color: var(--spar-dis-text); } .spar-dis__mistakes-content > p:not(.spar-dis__section-label), .spar-dis__mistakes-list p { color: var(--spar-dis-muted); } .spar-dis__actions { display: none; } }#imCell_18 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHTMLObject_1726_18 { position: relative; align-self: start; justify-self: center; max-width: 100%; box-sizing: border-box; z-index: 3; } #imCellStyleGraphics_18 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imCellStyleBorders_18 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } /* ============================================================ H3 — MASSA, CAMERA D’ARIA E MATERIALI FONOISOLANTI Pagina: /isolamento-acustico-pareti-roma.html ============================================================ */ .spar-mcm, .spar-mcm *, .spar-mcm *::before, .spar-mcm *::after { box-sizing: border-box; } .spar-mcm { --spar-mcm-blue-dark: #07343b; --spar-mcm-blue-deep: #05282e; --spar-mcm-blue-medium: #0b5159; --spar-mcm-teal: #24bfc1; --spar-mcm-teal-light: #c7f1ef; --spar-mcm-orange: #ff8a2a; --spar-mcm-orange-dark: #d86812; --spar-mcm-green: #27ad68; --spar-mcm-green-dark: #19864f; --spar-mcm-white: #ffffff; --spar-mcm-cream: #fff8ed; --spar-mcm-light: #edf8f7; --spar-mcm-text: #173c41; --spar-mcm-muted: #557277; --spar-mcm-border: #d4e6e4; --spar-mcm-shadow: 0 20px 52px rgba(6, 52, 59, 0.1); position: relative; width: 100%; max-width: 100%; overflow: hidden; padding-block: clamp(66px, 8vw, 108px); background: radial-gradient( circle at 4% 8%, rgba(36, 191, 193, 0.11), transparent 27% ), radial-gradient( circle at 96% 92%, rgba(255, 138, 42, 0.09), transparent 25% ), var(--spar-mcm-cream); color: var(--spar-mcm-text); } .spar-mcm h3, .spar-mcm h4, .spar-mcm h5, .spar-mcm p, .spar-mcm li, .spar-mcm span, .spar-mcm strong, .spar-mcm small, .spar-mcm a { max-width: 100%; white-space: normal; overflow-wrap: break-word; word-break: normal; } .spar-mcm__container { width: min(calc(100% - 40px), 1220px); max-width: 1220px; margin-inline: auto; } /* ============================================================ HEADER ============================================================ */ .spar-mcm__header { width: min(100%, 960px); margin-inline: auto; text-align: center; } .spar-mcm__eyebrow, .spar-mcm__section-label { margin: 0 0 13px; color: var(--spar-mcm-orange-dark); font-size: 0.76rem; font-weight: 900; line-height: 1.4; letter-spacing: 0.08em; text-transform: uppercase; } .spar-mcm__title { margin: 0; color: var(--spar-mcm-blue-dark); font-family: inherit; font-size: clamp(2rem, 4.1vw, 3.45rem); font-weight: 900; line-height: 1.08; letter-spacing: -0.04em; text-wrap: balance; } .spar-mcm__direct-answer { margin: 25px auto 0; color: var(--spar-mcm-blue-dark); font-size: clamp(1.05rem, 1.45vw, 1.2rem); font-weight: 650; line-height: 1.7; } .spar-mcm__direct-answer strong { color: inherit; font-weight: 900; } .spar-mcm__intro { margin: 15px auto 0; color: var(--spar-mcm-muted); font-size: 1rem; line-height: 1.74; } /* ============================================================ RISPOSTA DIRETTA ============================================================ */ .spar-mcm__answer { display: grid; grid-template-columns: 78px minmax(0, 1fr); align-items: center; gap: 23px; width: min(100%, 1000px); margin: clamp(36px, 5vw, 57px) auto 0; padding: clamp(23px, 3vw, 34px); border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 22px; background: var(--spar-mcm-white); box-shadow: var(--spar-mcm-shadow); } .spar-mcm__answer-icon { display: grid; place-items: center; width: 72px; height: 72px; border-radius: 20px; background: var(--spar-mcm-blue-dark); color: var(--spar-mcm-teal-light); } .spar-mcm__answer-icon svg { display: block; width: 43px; height: 43px; } .spar-mcm__answer-content { min-width: 0; } .spar-mcm__answer-label { margin: 0 0 7px; color: var(--spar-mcm-orange-dark); font-size: 0.72rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-mcm__answer-content h4 { margin: 0; color: var(--spar-mcm-blue-dark); font-size: clamp(1.22rem, 2vw, 1.62rem); font-weight: 900; line-height: 1.3; } .spar-mcm__answer-content > p:last-child { margin: 10px 0 0; color: var(--spar-mcm-muted); font-size: 0.96rem; line-height: 1.68; } /* ============================================================ TRE PILASTRI ============================================================ */ .spar-mcm__pillars { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: clamp(42px, 5vw, 64px); } .spar-mcm__pillar { display: flex; min-width: 0; flex-direction: column; padding: clamp(22px, 2.7vw, 31px); border: 1px solid var(--spar-mcm-border); border-top: 6px solid var(--spar-mcm-blue-dark); border-radius: 20px; background: var(--spar-mcm-white); box-shadow: 0 14px 36px rgba(6, 52, 59, 0.08); } .spar-mcm__pillar--teal { border-top-color: var(--spar-mcm-teal); } .spar-mcm__pillar--orange { border-top-color: var(--spar-mcm-orange); } .spar-mcm__pillar-top { display: flex; align-items: center; justify-content: space-between; gap: 15px; } .spar-mcm__pillar-number { color: rgba(7, 52, 59, 0.22); font-size: 1.8rem; font-weight: 950; line-height: 1; } .spar-mcm__pillar-icon { display: grid; flex: 0 0 52px; place-items: center; width: 52px; height: 52px; border-radius: 16px; background: var(--spar-mcm-light); color: var(--spar-mcm-blue-dark); } .spar-mcm__pillar-icon svg { width: 29px; height: 29px; } .spar-mcm__pillar h4 { margin: 22px 0 0; color: var(--spar-mcm-blue-dark); font-size: clamp(1.32rem, 2vw, 1.66rem); font-weight: 900; line-height: 1.25; } .spar-mcm__pillar > p { margin: 14px 0 0; color: var(--spar-mcm-muted); font-size: 0.92rem; line-height: 1.68; } .spar-mcm__pillar > p + p { margin-top: 11px; } .spar-mcm__pillar-note { display: grid; gap: 6px; margin-top: auto; padding: 16px; border-radius: 14px; background: var(--spar-mcm-light); } .spar-mcm__pillar > p + .spar-mcm__pillar-note { margin-top: 22px; } .spar-mcm__pillar-note strong { color: var(--spar-mcm-orange-dark); font-size: 0.7rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.055em; text-transform: uppercase; } .spar-mcm__pillar-note span { color: var(--spar-mcm-blue-dark); font-size: 0.85rem; font-weight: 700; line-height: 1.54; } /* ============================================================ TITOLI INTERNI ============================================================ */ .spar-mcm__system-content h4, .spar-mcm__materials-header h4, .spar-mcm__selection-content h4, .spar-mcm__mistakes-content h4, .spar-mcm__clarity-content h4, .spar-mcm__analysis-header h4, .spar-mcm__trust h4, .spar-mcm__conversion h4 { margin: 0; color: var(--spar-mcm-blue-dark); font-size: clamp(1.65rem, 2.9vw, 2.42rem); font-weight: 900; line-height: 1.16; letter-spacing: -0.032em; text-wrap: balance; } /* ============================================================ SISTEMA MASSA-MOLLA-MASSA ============================================================ */ .spar-mcm__system { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(470px, 1.1fr); align-items: center; gap: clamp(36px, 5vw, 68px); margin-top: clamp(60px, 8vw, 94px); } .spar-mcm__system-content, .spar-mcm__selection-content, .spar-mcm__mistakes-content, .spar-mcm__clarity-content { min-width: 0; } .spar-mcm__system-content > p:not(.spar-mcm__section-label), .spar-mcm__selection-content > p:not(.spar-mcm__section-label), .spar-mcm__mistakes-content > p:not(.spar-mcm__section-label), .spar-mcm__clarity-content > p:not(.spar-mcm__section-label) { margin: 18px 0 0; color: var(--spar-mcm-muted); font-size: 0.97rem; line-height: 1.72; } .spar-mcm__system-content > p + p, .spar-mcm__selection-content > p + p, .spar-mcm__mistakes-content > p + p, .spar-mcm__clarity-content > p + p { margin-top: 12px; } .spar-mcm__system-highlight, .spar-mcm__selection-highlight, .spar-mcm__mistakes-highlight, .spar-mcm__clarity-highlight { padding: 15px 17px; border-left: 4px solid var(--spar-mcm-orange); border-radius: 0 12px 12px 0; background: #fff0e2; color: var(--spar-mcm-blue-dark) !important; font-weight: 750; } /* ============================================================ DIAGRAMMA ============================================================ */ .spar-mcm__diagram { display: grid; grid-template-columns: minmax(100px, 1fr) minmax(72px, 0.72fr) minmax(130px, 1.3fr) minmax(92px, 0.92fr) minmax(100px, 1fr); align-items: stretch; gap: 7px; min-width: 0; padding: 20px; border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 22px; background: var(--spar-mcm-white); box-shadow: var(--spar-mcm-shadow); } .spar-mcm__diagram-source, .spar-mcm__diagram-mass, .spar-mcm__diagram-spring, .spar-mcm__diagram-room { display: flex; min-width: 0; min-height: 270px; align-items: center; justify-content: center; flex-direction: column; padding: 13px; border-radius: 12px; text-align: center; } .spar-mcm__diagram-source { background: #fff0e2; color: #703507; } .spar-mcm__diagram-mass--first { border: 2px solid #919fa1; background: repeating-linear-gradient( 45deg, #d9e0e0, #d9e0e0 8px, #c9d2d2 8px, #c9d2d2 16px ); color: #40575b; } .spar-mcm__diagram-spring { border: 1px dashed var(--spar-mcm-teal); background: #f3fbfa; color: var(--spar-mcm-blue-medium); } .spar-mcm__diagram-mass--second { border: 2px solid var(--spar-mcm-blue-dark); background: repeating-linear-gradient( 135deg, #d9f1ef, #d9f1ef 8px, #c3e8e5 8px, #c3e8e5 16px ); color: var(--spar-mcm-blue-dark); } .spar-mcm__diagram-room { background: var(--spar-mcm-blue-dark); color: var(--spar-mcm-white); } .spar-mcm__diagram-source > span, .spar-mcm__diagram-mass > span, .spar-mcm__diagram-spring > span, .spar-mcm__diagram-room > span { font-size: 0.66rem; font-weight: 900; line-height: 1.35; text-transform: uppercase; } .spar-mcm__diagram-mass > span, .spar-mcm__diagram-spring > span { writing-mode: vertical-rl; transform: rotate(180deg); } .spar-mcm__diagram-source strong, .spar-mcm__diagram-mass strong, .spar-mcm__diagram-spring strong { margin-top: 10px; color: inherit; font-size: 0.75rem; line-height: 1.4; } .spar-mcm__diagram-wave { margin-top: 18px; color: var(--spar-mcm-orange); font-size: 1.35rem !important; font-weight: 900; letter-spacing: 0.08em; writing-mode: horizontal-tb !important; transform: none !important; } .spar-mcm__diagram-note { grid-column: 1 / -1; margin: 8px 0 0; color: var(--spar-mcm-muted); font-size: 0.75rem; line-height: 1.5; text-align: center; } /* ============================================================ MATERIALI ============================================================ */ .spar-mcm__materials, .spar-mcm__analysis { margin-top: clamp(60px, 8vw, 94px); } .spar-mcm__materials-header, .spar-mcm__analysis-header { width: min(100%, 880px); margin-inline: auto; text-align: center; } .spar-mcm__materials-header > p:last-child, .spar-mcm__analysis-header > p:last-child { margin: 17px auto 0; color: var(--spar-mcm-muted); font-size: 0.97rem; line-height: 1.72; } .spar-mcm__materials-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 17px; margin-top: 33px; } .spar-mcm__material { min-width: 0; padding: 22px; border: 1px solid var(--spar-mcm-border); border-radius: 18px; background: var(--spar-mcm-white); box-shadow: 0 12px 30px rgba(6, 52, 59, 0.07); } .spar-mcm__material-icon { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 14px; background: var(--spar-mcm-light); color: var(--spar-mcm-blue-dark); } .spar-mcm__material-icon svg { width: 27px; height: 27px; } .spar-mcm__material h5 { margin: 17px 0 0; color: var(--spar-mcm-blue-dark); font-size: 1.03rem; font-weight: 900; line-height: 1.35; } .spar-mcm__material p { margin: 9px 0 0; color: var(--spar-mcm-muted); font-size: 0.86rem; line-height: 1.62; } /* ============================================================ SCELTA DELLA STRATIGRAFIA ============================================================ */ .spar-mcm__selection { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(430px, 1.1fr); align-items: center; gap: clamp(36px, 5vw, 68px); margin-top: clamp(60px, 8vw, 94px); } .spar-mcm__selection-list { display: grid; gap: 12px; min-width: 0; margin: 0; padding: 0; list-style: none; } .spar-mcm__selection-list li { display: grid; grid-template-columns: 42px minmax(0, 1fr); align-items: start; gap: 13px; min-width: 0; padding: 15px; border: 1px solid var(--spar-mcm-border); border-radius: 15px; background: var(--spar-mcm-white); box-shadow: 0 10px 27px rgba(6, 52, 59, 0.07); } .spar-mcm__selection-list li > span { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: var(--spar-mcm-blue-dark); color: var(--spar-mcm-teal-light); font-size: 0.76rem; font-weight: 900; } .spar-mcm__selection-list li > div { min-width: 0; } .spar-mcm__selection-list strong { display: block; color: var(--spar-mcm-blue-dark); font-size: 0.91rem; font-weight: 900; line-height: 1.4; } .spar-mcm__selection-list p { margin: 5px 0 0; color: var(--spar-mcm-muted); font-size: 0.81rem; line-height: 1.55; } /* ============================================================ ERRORI ============================================================ */ .spar-mcm__mistakes { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(420px, 1.1fr); align-items: center; gap: clamp(35px, 5vw, 68px); margin-top: clamp(58px, 7vw, 88px); padding: clamp(28px, 4vw, 48px); border-radius: 25px; background: radial-gradient( circle at 94% 8%, rgba(36, 191, 193, 0.2), transparent 30% ), linear-gradient( 135deg, var(--spar-mcm-blue-deep), var(--spar-mcm-blue-dark) ); box-shadow: 0 24px 62px rgba(3, 35, 40, 0.2); } .spar-mcm__mistakes .spar-mcm__section-label { color: var(--spar-mcm-orange); } .spar-mcm__mistakes-content h4 { color: var(--spar-mcm-white); } .spar-mcm__mistakes-content > p:not(.spar-mcm__section-label) { color: rgba(255, 255, 255, 0.74); } .spar-mcm__mistakes-highlight { border-left-color: var(--spar-mcm-orange); background: rgba(255, 255, 255, 0.08); color: var(--spar-mcm-white) !important; } .spar-mcm__mistakes-list { display: grid; gap: 12px; min-width: 0; margin: 0; padding: 0; list-style: none; } .spar-mcm__mistakes-list li { display: grid; grid-template-columns: 40px minmax(0, 1fr); align-items: start; gap: 12px; min-width: 0; padding: 14px; border: 1px solid rgba(255, 255, 255, 0.13); border-radius: 14px; background: rgba(255, 255, 255, 0.07); } .spar-mcm__mistakes-list li > span { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: rgba(255, 138, 42, 0.16); color: var(--spar-mcm-orange); font-size: 1.05rem; font-weight: 900; } .spar-mcm__mistakes-list li > div { min-width: 0; } .spar-mcm__mistakes-list strong { display: block; color: var(--spar-mcm-white); font-size: 0.9rem; font-weight: 850; line-height: 1.35; } .spar-mcm__mistakes-list p { margin: 5px 0 0; color: rgba(255, 255, 255, 0.67); font-size: 0.8rem; line-height: 1.53; } /* ============================================================ CHIAREZZA FONOASSORBENTE / FONOISOLANTE ============================================================ */ .spar-mcm__clarity { display: grid; grid-template-columns: minmax(0, 0.92fr) minmax(410px, 1.08fr); align-items: center; gap: clamp(36px, 5vw, 68px); margin-top: clamp(60px, 8vw, 94px); } .spar-mcm__clarity-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; min-width: 0; } .spar-mcm__clarity-card { min-width: 0; padding: 23px; border: 1px solid var(--spar-mcm-border); border-top: 5px solid var(--spar-mcm-teal); border-radius: 19px; background: var(--spar-mcm-white); box-shadow: 0 13px 34px rgba(6, 52, 59, 0.08); } .spar-mcm__clarity-card--room { border-top-color: var(--spar-mcm-orange); } .spar-mcm__clarity-symbol { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 14px; background: var(--spar-mcm-light); color: var(--spar-mcm-blue-dark); font-size: 0.7rem; font-weight: 900; letter-spacing: 0.04em; } .spar-mcm__clarity-card--room .spar-mcm__clarity-symbol { background: #fff0e2; color: var(--spar-mcm-orange-dark); } .spar-mcm__clarity-card h5 { margin: 17px 0 0; color: var(--spar-mcm-blue-dark); font-size: 1.05rem; font-weight: 900; line-height: 1.35; } .spar-mcm__clarity-card p { margin: 9px 0 0; color: var(--spar-mcm-muted); font-size: 0.85rem; line-height: 1.6; } /* ============================================================ ANALISI ============================================================ */ .spar-mcm__analysis-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin: 33px 0 0; padding: 0; list-style: none; } .spar-mcm__analysis-list li { min-width: 0; padding: 22px; border: 1px solid var(--spar-mcm-border); border-radius: 18px; background: var(--spar-mcm-white); box-shadow: 0 12px 30px rgba(6, 52, 59, 0.07); } .spar-mcm__analysis-number { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; background: var(--spar-mcm-blue-dark); color: var(--spar-mcm-teal-light); font-size: 0.8rem; font-weight: 900; } .spar-mcm__analysis-list strong { display: block; margin-top: 17px; color: var(--spar-mcm-blue-dark); font-size: 0.94rem; font-weight: 900; line-height: 1.4; } .spar-mcm__analysis-list p { margin: 8px 0 0; color: var(--spar-mcm-muted); font-size: 0.84rem; line-height: 1.58; } /* ============================================================ FIDUCIA ============================================================ */ .spar-mcm__trust { display: grid; grid-template-columns: 74px minmax(0, 1fr); align-items: center; gap: 23px; margin-top: clamp(44px, 6vw, 68px); padding: clamp(24px, 3vw, 35px); border: 1px solid rgba(255, 138, 42, 0.31); border-radius: 21px; background: #fff3e7; } .spar-mcm__trust-icon { display: grid; place-items: center; width: 70px; height: 70px; border-radius: 20px; background: var(--spar-mcm-orange); color: #321705; } .spar-mcm__trust-icon svg { width: 41px; height: 41px; } .spar-mcm__trust-content { min-width: 0; } .spar-mcm__trust-label { margin: 0 0 7px; color: var(--spar-mcm-orange-dark); font-size: 0.72rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-mcm__trust h4 { font-size: clamp(1.35rem, 2.2vw, 1.88rem); } .spar-mcm__trust-content > p:last-child { margin: 11px 0 0; color: var(--spar-mcm-muted); font-size: 0.94rem; line-height: 1.68; } /* ============================================================ CTA ============================================================ */ .spar-mcm__conversion { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(330px, 0.92fr); align-items: center; gap: clamp(31px, 5vw, 66px); margin-top: clamp(53px, 7vw, 84px); padding: clamp(27px, 4vw, 47px); border: 1px solid rgba(36, 191, 193, 0.24); border-radius: 24px; background: var(--spar-mcm-white); box-shadow: var(--spar-mcm-shadow); } .spar-mcm__conversion-content { min-width: 0; } .spar-mcm__conversion-label { margin: 0 0 12px; color: var(--spar-mcm-orange-dark); font-size: 0.74rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-mcm__conversion-content > p:not(.spar-mcm__conversion-label) { margin: 16px 0 0; color: var(--spar-mcm-muted); font-size: 0.96rem; line-height: 1.71; } .spar-mcm__conversion-content > p + p { margin-top: 11px; } .spar-mcm__actions { display: grid; gap: 11px; min-width: 0; } .spar-mcm__button { display: flex; min-width: 0; min-height: 58px; align-items: center; justify-content: center; gap: 10px; padding: 13px 17px; border: 2px solid transparent; border-radius: 12px; font-family: inherit; font-size: 0.91rem; font-weight: 850; line-height: 1.3; text-align: center; text-decoration: none; transition: transform 180ms ease, box-shadow 180ms ease, background-color 180ms ease, border-color 180ms ease; } .spar-mcm__button:hover { transform: translateY(-2px); } .spar-mcm__button:focus-visible { outline: 3px solid var(--spar-mcm-blue-dark); outline-offset: 4px; } .spar-mcm__button svg { flex: 0 0 23px; width: 23px; height: 23px; } .spar-mcm__button--primary { background: var(--spar-mcm-orange); color: #2c1504; box-shadow: 0 12px 27px rgba(255, 138, 42, 0.22); } .spar-mcm__button--primary:hover { background: #ff9b43; } .spar-mcm__button--whatsapp { background: var(--spar-mcm-green); color: var(--spar-mcm-white); box-shadow: 0 12px 27px rgba(39, 173, 104, 0.2); } .spar-mcm__button--whatsapp:hover { background: var(--spar-mcm-green-dark); } .spar-mcm__button--phone { border-color: rgba(7, 52, 59, 0.32); background: var(--spar-mcm-white); color: var(--spar-mcm-blue-dark); } .spar-mcm__button--phone:hover { border-color: var(--spar-mcm-teal); background: var(--spar-mcm-light); } .spar-mcm__phone-text { display: grid; min-width: 0; gap: 1px; text-align: left; } .spar-mcm__phone-text small { font-size: 0.64rem; font-weight: 750; line-height: 1.1; letter-spacing: 0.055em; text-transform: uppercase; } .spar-mcm__phone-text strong { color: inherit; font-size: 1rem; font-weight: 900; line-height: 1.15; } /* ============================================================ NOTEBOOK E TABLET ORIZZONTALE ============================================================ */ @media (max-width: 1100px) { .spar-mcm__system, .spar-mcm__selection, .spar-mcm__mistakes, .spar-mcm__clarity, .spar-mcm__conversion { grid-template-columns: minmax(0, 1fr); } .spar-mcm__system-content, .spar-mcm__selection-content, .spar-mcm__mistakes-content, .spar-mcm__clarity-content, .spar-mcm__conversion-content { max-width: 850px; } .spar-mcm__diagram, .spar-mcm__selection-list, .spar-mcm__mistakes-list, .spar-mcm__clarity-cards { max-width: 850px; } .spar-mcm__analysis-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-mcm__actions { grid-template-columns: repeat(3, minmax(0, 1fr)); } } /* ============================================================ TABLET ============================================================ */ @media (max-width: 840px) { .spar-mcm { padding-block: 60px 74px; } .spar-mcm__container { width: min(calc(100% - 32px), 780px); } .spar-mcm__answer { grid-template-columns: 62px minmax(0, 1fr); gap: 18px; } .spar-mcm__answer-icon { width: 60px; height: 60px; border-radius: 17px; } .spar-mcm__answer-icon svg { width: 36px; height: 36px; } .spar-mcm__pillars { grid-template-columns: minmax(0, 1fr); } .spar-mcm__materials-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-mcm__clarity-cards { grid-template-columns: minmax(0, 1fr); } .spar-mcm__actions { grid-template-columns: minmax(0, 1fr); } } /* ============================================================ MOBILE ============================================================ */ @media (max-width: 580px) { .spar-mcm { padding-block: 50px 62px; } .spar-mcm__container { width: calc(100% - 28px); } .spar-mcm__header, .spar-mcm__materials-header, .spar-mcm__analysis-header { text-align: left; } .spar-mcm__eyebrow, .spar-mcm__section-label { font-size: 0.68rem; letter-spacing: 0.06em; } .spar-mcm__title { font-size: clamp(1.87rem, 9.6vw, 2.66rem); line-height: 1.1; } .spar-mcm__direct-answer { margin-top: 20px; font-size: 0.99rem; line-height: 1.63; } .spar-mcm__intro { font-size: 0.92rem; line-height: 1.67; } .spar-mcm__answer { grid-template-columns: minmax(0, 1fr); align-items: start; gap: 15px; padding: 20px 17px; border-radius: 18px; } .spar-mcm__answer-icon { width: 53px; height: 53px; border-radius: 15px; } .spar-mcm__answer-content h4 { font-size: 1.16rem; } .spar-mcm__answer-content > p:last-child { font-size: 0.9rem; } .spar-mcm__pillar { padding: 21px 17px; border-radius: 17px; } .spar-mcm__system-content h4, .spar-mcm__materials-header h4, .spar-mcm__selection-content h4, .spar-mcm__mistakes-content h4, .spar-mcm__clarity-content h4, .spar-mcm__analysis-header h4, .spar-mcm__conversion h4 { font-size: clamp(1.5rem, 7.5vw, 1.95rem); line-height: 1.19; } .spar-mcm__system-content > p:not(.spar-mcm__section-label), .spar-mcm__materials-header > p:last-child, .spar-mcm__selection-content > p:not(.spar-mcm__section-label), .spar-mcm__mistakes-content > p:not(.spar-mcm__section-label), .spar-mcm__clarity-content > p:not(.spar-mcm__section-label), .spar-mcm__analysis-header > p:last-child, .spar-mcm__conversion-content > p:not(.spar-mcm__conversion-label) { font-size: 0.91rem; line-height: 1.66; } .spar-mcm__diagram { grid-template-columns: minmax(0, 1fr); padding: 16px 13px; border-radius: 18px; } .spar-mcm__diagram-source, .spar-mcm__diagram-mass, .spar-mcm__diagram-spring, .spar-mcm__diagram-room { min-height: auto; padding: 16px; } .spar-mcm__diagram-mass > span, .spar-mcm__diagram-spring > span { writing-mode: horizontal-tb; transform: none; } .spar-mcm__diagram-note { grid-column: auto; } .spar-mcm__materials-grid, .spar-mcm__analysis-list { grid-template-columns: minmax(0, 1fr); } .spar-mcm__material, .spar-mcm__analysis-list li { padding: 19px 17px; border-radius: 16px; } .spar-mcm__selection-list li { grid-template-columns: 38px minmax(0, 1fr); gap: 10px; padding: 12px; } .spar-mcm__selection-list li > span { width: 38px; height: 38px; } .spar-mcm__mistakes { padding: 23px 17px; border-radius: 20px; } .spar-mcm__mistakes-list li { grid-template-columns: 38px minmax(0, 1fr); gap: 10px; padding: 12px; } .spar-mcm__mistakes-list li > span { width: 38px; height: 38px; } .spar-mcm__clarity-card { padding: 19px 17px; border-radius: 16px; } .spar-mcm__trust { grid-template-columns: minmax(0, 1fr); align-items: start; gap: 15px; padding: 21px 17px; border-radius: 18px; } .spar-mcm__trust-icon { width: 54px; height: 54px; border-radius: 15px; } .spar-mcm__trust-icon svg { width: 31px; height: 31px; } .spar-mcm__trust h4 { font-size: 1.28rem; } .spar-mcm__trust-content > p:last-child { font-size: 0.9rem; line-height: 1.65; } .spar-mcm__conversion { padding: 22px 17px; border-radius: 19px; } .spar-mcm__button { width: 100%; min-height: 58px; padding-inline: 13px; font-size: 0.87rem; } } /* ============================================================ SMARTPHONE MOLTO STRETTI ============================================================ */ @media (max-width: 380px) { .spar-mcm__container { width: calc(100% - 22px); } .spar-mcm__title { font-size: 1.76rem; } .spar-mcm__pillar, .spar-mcm__diagram, .spar-mcm__material, .spar-mcm__selection-list li, .spar-mcm__mistakes, .spar-mcm__clarity-card, .spar-mcm__analysis-list li, .spar-mcm__trust, .spar-mcm__conversion { padding-inline: 14px; } .spar-mcm__button { gap: 8px; padding-inline: 10px; font-size: 0.83rem; } .spar-mcm__button svg { flex-basis: 21px; width: 21px; height: 21px; } } /* ============================================================ ACCESSIBILITÀ ============================================================ */ @media (prefers-reduced-motion: reduce) { .spar-mcm__button { transition: none; } .spar-mcm__button:hover { transform: none; } } /* ============================================================ STAMPA ============================================================ */ @media print { .spar-mcm { padding: 30px 0; background: #ffffff; } .spar-mcm__mistakes { border: 1px solid #ccdede; background: #ffffff; box-shadow: none; } .spar-mcm__mistakes-content h4, .spar-mcm__mistakes-list strong { color: var(--spar-mcm-text); } .spar-mcm__mistakes-content > p:not(.spar-mcm__section-label), .spar-mcm__mistakes-list p { color: var(--spar-mcm-muted); } .spar-mcm__actions { display: none; } }#imCell_19 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHTMLObject_1726_19 { position: relative; align-self: start; justify-self: center; max-width: 100%; box-sizing: border-box; z-index: 3; } #imCellStyleGraphics_19 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imCellStyleBorders_19 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } /* ============================================================ H3 — SIGILLATURA DEI COLLEGAMENTI E DEI PUNTI CRITICI Pagina: /isolamento-acustico-pareti-roma.html ============================================================ */ .spar-scp, .spar-scp *, .spar-scp *::before, .spar-scp *::after { box-sizing: border-box; } .spar-scp { --spar-scp-blue-dark: #07343b; --spar-scp-blue-deep: #05282e; --spar-scp-blue-medium: #0b5159; --spar-scp-teal: #24bfc1; --spar-scp-teal-light: #c7f1ef; --spar-scp-orange: #ff8a2a; --spar-scp-orange-dark: #d86812; --spar-scp-green: #27ad68; --spar-scp-green-dark: #19864f; --spar-scp-white: #ffffff; --spar-scp-cream: #fff8ed; --spar-scp-light: #edf8f7; --spar-scp-text: #173c41; --spar-scp-muted: #557277; --spar-scp-border: #d4e6e4; --spar-scp-shadow: 0 20px 52px rgba(6, 52, 59, 0.1); position: relative; width: 100%; max-width: 100%; overflow: hidden; padding-block: clamp(66px, 8vw, 108px); background: radial-gradient( circle at 96% 8%, rgba(36, 191, 193, 0.11), transparent 27% ), radial-gradient( circle at 4% 92%, rgba(255, 138, 42, 0.09), transparent 25% ), #ffffff; color: var(--spar-scp-text); } .spar-scp h3, .spar-scp h4, .spar-scp h5, .spar-scp p, .spar-scp li, .spar-scp span, .spar-scp strong, .spar-scp small, .spar-scp a { max-width: 100%; white-space: normal; overflow-wrap: break-word; word-break: normal; } .spar-scp__container { width: min(calc(100% - 40px), 1220px); max-width: 1220px; margin-inline: auto; } /* ============================================================ HEADER ============================================================ */ .spar-scp__header { width: min(100%, 960px); margin-inline: auto; text-align: center; } .spar-scp__eyebrow, .spar-scp__section-label { margin: 0 0 13px; color: var(--spar-scp-orange-dark); font-size: 0.76rem; font-weight: 900; line-height: 1.4; letter-spacing: 0.08em; text-transform: uppercase; } .spar-scp__title { margin: 0; color: var(--spar-scp-blue-dark); font-family: inherit; font-size: clamp(2rem, 4.1vw, 3.45rem); font-weight: 900; line-height: 1.08; letter-spacing: -0.04em; text-wrap: balance; } .spar-scp__direct-answer { margin: 25px auto 0; color: var(--spar-scp-blue-dark); font-size: clamp(1.05rem, 1.45vw, 1.2rem); font-weight: 650; line-height: 1.7; } .spar-scp__direct-answer strong { color: inherit; font-weight: 900; } .spar-scp__intro { margin: 15px auto 0; color: var(--spar-scp-muted); font-size: 1rem; line-height: 1.74; } /* ============================================================ RISPOSTA DIRETTA ============================================================ */ .spar-scp__answer { display: grid; grid-template-columns: 78px minmax(0, 1fr); align-items: center; gap: 23px; width: min(100%, 1000px); margin: clamp(36px, 5vw, 57px) auto 0; padding: clamp(23px, 3vw, 34px); border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 22px; background: var(--spar-scp-cream); box-shadow: var(--spar-scp-shadow); } .spar-scp__answer-icon { display: grid; place-items: center; width: 72px; height: 72px; border-radius: 20px; background: var(--spar-scp-blue-dark); color: var(--spar-scp-teal-light); } .spar-scp__answer-icon svg { display: block; width: 43px; height: 43px; } .spar-scp__answer-content { min-width: 0; } .spar-scp__answer-label { margin: 0 0 7px; color: var(--spar-scp-orange-dark); font-size: 0.72rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-scp__answer-content h4 { margin: 0; color: var(--spar-scp-blue-dark); font-size: clamp(1.22rem, 2vw, 1.62rem); font-weight: 900; line-height: 1.3; } .spar-scp__answer-content > p:last-child { margin: 10px 0 0; color: var(--spar-scp-muted); font-size: 0.96rem; line-height: 1.68; } /* ============================================================ QUATTRO PUNTI CRITICI ============================================================ */ .spar-scp__critical-points { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 17px; margin-top: clamp(42px, 5vw, 64px); } .spar-scp__critical { display: flex; min-width: 0; flex-direction: column; padding: 22px; border: 1px solid var(--spar-scp-border); border-top: 5px solid var(--spar-scp-blue-dark); border-radius: 19px; background: var(--spar-scp-white); box-shadow: 0 13px 34px rgba(6, 52, 59, 0.08); } .spar-scp__critical--teal { border-top-color: var(--spar-scp-teal); } .spar-scp__critical--orange { border-top-color: var(--spar-scp-orange); } .spar-scp__critical--green { border-top-color: var(--spar-scp-green); } .spar-scp__critical-top { display: flex; align-items: center; justify-content: space-between; gap: 15px; } .spar-scp__critical-number { color: rgba(7, 52, 59, 0.22); font-size: 1.7rem; font-weight: 950; line-height: 1; } .spar-scp__critical-icon { display: grid; flex: 0 0 48px; place-items: center; width: 48px; height: 48px; border-radius: 14px; background: var(--spar-scp-light); color: var(--spar-scp-blue-dark); } .spar-scp__critical-icon svg { width: 27px; height: 27px; } .spar-scp__critical h4 { margin: 20px 0 0; color: var(--spar-scp-blue-dark); font-size: 1.08rem; font-weight: 900; line-height: 1.35; } .spar-scp__critical > p { margin: 11px 0 0; color: var(--spar-scp-muted); font-size: 0.87rem; line-height: 1.62; } .spar-scp__critical-note { margin-top: auto !important; padding-top: 15px; border-top: 1px solid var(--spar-scp-border); color: var(--spar-scp-blue-dark) !important; font-weight: 750; } /* ============================================================ TITOLI INTERNI ============================================================ */ .spar-scp__continuity-content h4, .spar-scp__perimeter-content h4, .spar-scp__systems-header h4, .spar-scp__joints-content h4, .spar-scp__mistakes-content h4, .spar-scp__checks-header h4, .spar-scp__process-content h4, .spar-scp__trust h4, .spar-scp__conversion h4 { margin: 0; color: var(--spar-scp-blue-dark); font-size: clamp(1.65rem, 2.9vw, 2.42rem); font-weight: 900; line-height: 1.16; letter-spacing: -0.032em; text-wrap: balance; } /* ============================================================ CONTINUITÀ ============================================================ */ .spar-scp__continuity, .spar-scp__perimeter, .spar-scp__joints { display: grid; grid-template-columns: minmax(0, 0.92fr) minmax(430px, 1.08fr); align-items: center; gap: clamp(36px, 5vw, 68px); margin-top: clamp(60px, 8vw, 94px); } .spar-scp__continuity-content, .spar-scp__perimeter-content, .spar-scp__joints-content, .spar-scp__mistakes-content, .spar-scp__process-content { min-width: 0; } .spar-scp__continuity-content > p:not(.spar-scp__section-label), .spar-scp__perimeter-content > p:not(.spar-scp__section-label), .spar-scp__joints-content > p:not(.spar-scp__section-label), .spar-scp__mistakes-content > p:not(.spar-scp__section-label), .spar-scp__process-content > p:not(.spar-scp__section-label) { margin: 18px 0 0; color: var(--spar-scp-muted); font-size: 0.97rem; line-height: 1.72; } .spar-scp__continuity-content > p + p, .spar-scp__perimeter-content > p + p, .spar-scp__joints-content > p + p, .spar-scp__mistakes-content > p + p, .spar-scp__process-content > p + p { margin-top: 12px; } .spar-scp__continuity-highlight, .spar-scp__perimeter-highlight, .spar-scp__joints-highlight, .spar-scp__mistakes-highlight { padding: 15px 17px; border-left: 4px solid var(--spar-scp-orange); border-radius: 0 12px 12px 0; background: #fff0e2; color: var(--spar-scp-blue-dark) !important; font-weight: 750; } /* ============================================================ CONFRONTO VISIVO ============================================================ */ .spar-scp__diagram { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; min-width: 0; } .spar-scp__diagram-card { min-width: 0; padding: 22px; border: 1px solid var(--spar-scp-border); border-top: 5px solid #d56652; border-radius: 19px; background: var(--spar-scp-white); box-shadow: 0 13px 34px rgba(6, 52, 59, 0.08); } .spar-scp__diagram-card--sealed { border-top-color: var(--spar-scp-teal); } .spar-scp__diagram-symbol { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 13px; background: #fff0ed; color: #a23b2a; font-size: 1.05rem; font-weight: 900; } .spar-scp__diagram-card--sealed .spar-scp__diagram-symbol { background: var(--spar-scp-light); color: var(--spar-scp-blue-medium); } .spar-scp__diagram-card h5 { margin: 17px 0 0; color: var(--spar-scp-blue-dark); font-size: 1.06rem; font-weight: 900; line-height: 1.35; } .spar-scp__diagram-card > p { margin: 13px 0 0; color: var(--spar-scp-muted); font-size: 0.84rem; line-height: 1.58; } .spar-scp__diagram-wall { position: relative; min-height: 185px; margin-top: 18px; border-radius: 13px; background: repeating-linear-gradient( 135deg, #d9f1ef, #d9f1ef 9px, #c3e8e5 9px, #c3e8e5 18px ); } .spar-scp__diagram-edge { position: absolute; background: #d56652; } .spar-scp__diagram-card--sealed .spar-scp__diagram-edge { background: var(--spar-scp-teal); } .spar-scp__diagram-edge--top { top: 0; right: 0; left: 0; height: 7px; border-radius: 13px 13px 0 0; } .spar-scp__diagram-edge--right { top: 0; right: 0; bottom: 0; width: 7px; border-radius: 0 13px 13px 0; } .spar-scp__diagram-edge--bottom { right: 0; bottom: 0; left: 0; height: 7px; border-radius: 0 0 13px 13px; } .spar-scp__diagram-edge--left { top: 0; bottom: 0; left: 0; width: 7px; border-radius: 13px 0 0 13px; } .spar-scp__diagram-card--open .spar-scp__diagram-edge--top { right: 38%; } .spar-scp__diagram-card--open .spar-scp__diagram-edge--bottom { left: 46%; } .spar-scp__diagram-socket { position: absolute; top: 50%; left: 50%; width: 45px; height: 55px; border: 4px solid #d56652; border-radius: 8px; background: var(--spar-scp-white); transform: translate(-50%, -50%); } .spar-scp__diagram-socket::before, .spar-scp__diagram-socket::after { content: ""; position: absolute; top: 18px; width: 7px; height: 7px; border-radius: 50%; background: #d56652; } .spar-scp__diagram-socket::before { left: 8px; } .spar-scp__diagram-socket::after { right: 8px; } .spar-scp__diagram-socket--sealed { border-color: var(--spar-scp-teal); } .spar-scp__diagram-socket--sealed::before, .spar-scp__diagram-socket--sealed::after { background: var(--spar-scp-teal); } .spar-scp__diagram-gap { position: absolute; top: 0; right: 18%; width: 21%; height: 14px; background: var(--spar-scp-white); } /* ============================================================ PERIMETRO ============================================================ */ .spar-scp__perimeter { grid-template-columns: minmax(430px, 1.08fr) minmax(0, 0.92fr); } .spar-scp__perimeter-visual { min-width: 0; padding: 22px; border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 22px; background: var(--spar-scp-white); box-shadow: var(--spar-scp-shadow); } .spar-scp__room-frame { position: relative; min-height: 330px; border: 18px solid #cbd6d6; border-radius: 12px; background: var(--spar-scp-light); } .spar-scp__room-wall { position: absolute; top: 34px; right: 34px; bottom: 34px; left: 34px; display: grid; place-items: center; border: 2px solid var(--spar-scp-blue-dark); border-radius: 8px; background: repeating-linear-gradient( 135deg, #d9f1ef, #d9f1ef 10px, #c3e8e5 10px, #c3e8e5 20px ); } .spar-scp__room-wall span { padding: 9px 12px; border-radius: 9px; background: var(--spar-scp-blue-dark); color: var(--spar-scp-white); font-size: 0.72rem; font-weight: 900; line-height: 1.35; text-align: center; text-transform: uppercase; } .spar-scp__seal { position: absolute; z-index: 2; background: var(--spar-scp-orange); } .spar-scp__seal--top { top: 28px; right: 28px; left: 28px; height: 7px; } .spar-scp__seal--bottom { right: 28px; bottom: 28px; left: 28px; height: 7px; } .spar-scp__seal--side { top: 28px; bottom: 28px; left: 28px; width: 7px; } .spar-scp__room-label { position: absolute; z-index: 3; padding: 5px 8px; border-radius: 999px; background: var(--spar-scp-white); color: var(--spar-scp-blue-dark); font-size: 0.61rem; font-weight: 900; line-height: 1.3; text-transform: uppercase; } .spar-scp__room-label--ceiling { top: -14px; left: 50%; transform: translateX(-50%); } .spar-scp__room-label--floor { bottom: -14px; left: 50%; transform: translateX(-50%); } .spar-scp__room-label--side { top: 50%; left: -43px; transform: rotate(-90deg) translateY(-50%); } .spar-scp__perimeter-visual > p { margin: 16px 0 0; color: var(--spar-scp-muted); font-size: 0.76rem; line-height: 1.5; text-align: center; } /* ============================================================ IMPIANTI ============================================================ */ .spar-scp__systems, .spar-scp__checks { margin-top: clamp(60px, 8vw, 94px); } .spar-scp__systems-header, .spar-scp__checks-header { width: min(100%, 880px); margin-inline: auto; text-align: center; } .spar-scp__systems-header > p:last-child, .spar-scp__checks-header > p:last-child { margin: 17px auto 0; color: var(--spar-scp-muted); font-size: 0.97rem; line-height: 1.72; } .spar-scp__systems-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 17px; margin-top: 33px; } .spar-scp__system-card { min-width: 0; padding: 22px; border: 1px solid var(--spar-scp-border); border-radius: 18px; background: var(--spar-scp-white); box-shadow: 0 12px 30px rgba(6, 52, 59, 0.07); } .spar-scp__system-icon { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 14px; background: var(--spar-scp-light); color: var(--spar-scp-blue-dark); } .spar-scp__system-icon svg { width: 27px; height: 27px; } .spar-scp__system-card h5 { margin: 17px 0 0; color: var(--spar-scp-blue-dark); font-size: 1.02rem; font-weight: 900; line-height: 1.35; } .spar-scp__system-card p { margin: 9px 0 0; color: var(--spar-scp-muted); font-size: 0.85rem; line-height: 1.62; } /* ============================================================ GIUNTI ============================================================ */ .spar-scp__joints-visual { display: grid; gap: 17px; min-width: 0; padding: 23px; border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 22px; background: var(--spar-scp-white); box-shadow: var(--spar-scp-shadow); } .spar-scp__joint-row { min-width: 0; } .spar-scp__joint-label { display: block; margin-bottom: 8px; color: var(--spar-scp-blue-dark); font-size: 0.7rem; font-weight: 900; line-height: 1.3; text-transform: uppercase; } .spar-scp__joint-panels { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 5px; min-height: 62px; } .spar-scp__joint-panels span { border: 2px solid var(--spar-scp-blue-dark); border-radius: 7px; background: var(--spar-scp-light); } .spar-scp__joint-panels--shifted { grid-template-columns: 0.55fr 1fr 0.55fr; } .spar-scp__joint-panels--shifted span { border-color: var(--spar-scp-teal); background: #d9f1ef; } .spar-scp__joint-panels--finish { grid-template-columns: minmax(0, 1fr); } .spar-scp__joint-panels--finish span { border-color: var(--spar-scp-orange); background: #fff0e2; } .spar-scp__joints-visual > p { margin: 2px 0 0; color: var(--spar-scp-muted); font-size: 0.76rem; line-height: 1.5; text-align: center; } /* ============================================================ ERRORI ============================================================ */ .spar-scp__mistakes { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(420px, 1.1fr); align-items: center; gap: clamp(35px, 5vw, 68px); margin-top: clamp(58px, 7vw, 88px); padding: clamp(28px, 4vw, 48px); border-radius: 25px; background: radial-gradient( circle at 94% 8%, rgba(36, 191, 193, 0.2), transparent 30% ), linear-gradient( 135deg, var(--spar-scp-blue-deep), var(--spar-scp-blue-dark) ); box-shadow: 0 24px 62px rgba(3, 35, 40, 0.2); } .spar-scp__mistakes .spar-scp__section-label { color: var(--spar-scp-orange); } .spar-scp__mistakes-content h4 { color: var(--spar-scp-white); } .spar-scp__mistakes-content > p:not(.spar-scp__section-label) { color: rgba(255, 255, 255, 0.74); } .spar-scp__mistakes-highlight { border-left-color: var(--spar-scp-orange); background: rgba(255, 255, 255, 0.08); color: var(--spar-scp-white) !important; } .spar-scp__mistakes-list { display: grid; gap: 12px; min-width: 0; margin: 0; padding: 0; list-style: none; } .spar-scp__mistakes-list li { display: grid; grid-template-columns: 40px minmax(0, 1fr); align-items: start; gap: 12px; min-width: 0; padding: 14px; border: 1px solid rgba(255, 255, 255, 0.13); border-radius: 14px; background: rgba(255, 255, 255, 0.07); } .spar-scp__mistakes-list li > span { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: rgba(255, 138, 42, 0.16); color: var(--spar-scp-orange); font-size: 1.05rem; font-weight: 900; } .spar-scp__mistakes-list li > div { min-width: 0; } .spar-scp__mistakes-list strong { display: block; color: var(--spar-scp-white); font-size: 0.9rem; font-weight: 850; line-height: 1.35; } .spar-scp__mistakes-list p { margin: 5px 0 0; color: rgba(255, 255, 255, 0.67); font-size: 0.8rem; line-height: 1.53; } /* ============================================================ VERIFICHE ============================================================ */ .spar-scp__checks-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin: 33px 0 0; padding: 0; list-style: none; } .spar-scp__checks-list li { min-width: 0; padding: 22px; border: 1px solid var(--spar-scp-border); border-radius: 18px; background: var(--spar-scp-white); box-shadow: 0 12px 30px rgba(6, 52, 59, 0.07); } .spar-scp__checks-number { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; background: var(--spar-scp-blue-dark); color: var(--spar-scp-teal-light); font-size: 0.8rem; font-weight: 900; } .spar-scp__checks-list strong { display: block; margin-top: 17px; color: var(--spar-scp-blue-dark); font-size: 0.94rem; font-weight: 900; line-height: 1.4; } .spar-scp__checks-list p { margin: 8px 0 0; color: var(--spar-scp-muted); font-size: 0.84rem; line-height: 1.58; } /* ============================================================ PROCESSO ============================================================ */ .spar-scp__process { display: grid; grid-template-columns: minmax(0, 0.84fr) minmax(440px, 1.16fr); align-items: center; gap: clamp(35px, 5vw, 68px); margin-top: clamp(60px, 8vw, 94px); } .spar-scp__process-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; min-width: 0; margin: 0; padding: 0; list-style: none; } .spar-scp__process-list li { display: grid; grid-template-columns: 42px minmax(0, 1fr); align-items: start; gap: 12px; min-width: 0; padding: 15px; border: 1px solid var(--spar-scp-border); border-radius: 15px; background: var(--spar-scp-white); box-shadow: 0 10px 27px rgba(6, 52, 59, 0.07); } .spar-scp__process-list li > span { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; background: var(--spar-scp-blue-dark); color: var(--spar-scp-teal-light); font-size: 0.78rem; font-weight: 900; } .spar-scp__process-list li > div { min-width: 0; } .spar-scp__process-list strong { display: block; color: var(--spar-scp-blue-dark); font-size: 0.9rem; font-weight: 900; line-height: 1.4; } .spar-scp__process-list p { margin: 5px 0 0; color: var(--spar-scp-muted); font-size: 0.81rem; line-height: 1.55; } /* ============================================================ FIDUCIA ============================================================ */ .spar-scp__trust { display: grid; grid-template-columns: 74px minmax(0, 1fr); align-items: center; gap: 23px; margin-top: clamp(44px, 6vw, 68px); padding: clamp(24px, 3vw, 35px); border: 1px solid rgba(255, 138, 42, 0.31); border-radius: 21px; background: #fff3e7; } .spar-scp__trust-icon { display: grid; place-items: center; width: 70px; height: 70px; border-radius: 20px; background: var(--spar-scp-orange); color: #321705; } .spar-scp__trust-icon svg { width: 41px; height: 41px; } .spar-scp__trust-content { min-width: 0; } .spar-scp__trust-label { margin: 0 0 7px; color: var(--spar-scp-orange-dark); font-size: 0.72rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-scp__trust h4 { font-size: clamp(1.35rem, 2.2vw, 1.88rem); } .spar-scp__trust-content > p:last-child { margin: 11px 0 0; color: var(--spar-scp-muted); font-size: 0.94rem; line-height: 1.68; } /* ============================================================ CTA ============================================================ */ .spar-scp__conversion { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(330px, 0.92fr); align-items: center; gap: clamp(31px, 5vw, 66px); margin-top: clamp(53px, 7vw, 84px); padding: clamp(27px, 4vw, 47px); border: 1px solid rgba(36, 191, 193, 0.24); border-radius: 24px; background: var(--spar-scp-cream); box-shadow: var(--spar-scp-shadow); } .spar-scp__conversion-content { min-width: 0; } .spar-scp__conversion-label { margin: 0 0 12px; color: var(--spar-scp-orange-dark); font-size: 0.74rem; font-weight: 900; line-height: 1.35; letter-spacing: 0.075em; text-transform: uppercase; } .spar-scp__conversion-content > p:not(.spar-scp__conversion-label) { margin: 16px 0 0; color: var(--spar-scp-muted); font-size: 0.96rem; line-height: 1.71; } .spar-scp__conversion-content > p + p { margin-top: 11px; } .spar-scp__actions { display: grid; gap: 11px; min-width: 0; } .spar-scp__button { display: flex; min-width: 0; min-height: 58px; align-items: center; justify-content: center; gap: 10px; padding: 13px 17px; border: 2px solid transparent; border-radius: 12px; font-family: inherit; font-size: 0.91rem; font-weight: 850; line-height: 1.3; text-align: center; text-decoration: none; transition: transform 180ms ease, box-shadow 180ms ease, background-color 180ms ease, border-color 180ms ease; } .spar-scp__button:hover { transform: translateY(-2px); } .spar-scp__button:focus-visible { outline: 3px solid var(--spar-scp-blue-dark); outline-offset: 4px; } .spar-scp__button svg { flex: 0 0 23px; width: 23px; height: 23px; } .spar-scp__button--primary { background: var(--spar-scp-orange); color: #2c1504; box-shadow: 0 12px 27px rgba(255, 138, 42, 0.22); } .spar-scp__button--primary:hover { background: #ff9b43; } .spar-scp__button--whatsapp { background: var(--spar-scp-green); color: var(--spar-scp-white); box-shadow: 0 12px 27px rgba(39, 173, 104, 0.2); } .spar-scp__button--whatsapp:hover { background: var(--spar-scp-green-dark); } .spar-scp__button--phone { border-color: rgba(7, 52, 59, 0.32); background: var(--spar-scp-white); color: var(--spar-scp-blue-dark); } .spar-scp__button--phone:hover { border-color: var(--spar-scp-teal); background: var(--spar-scp-light); } .spar-scp__phone-text { display: grid; min-width: 0; gap: 1px; text-align: left; } .spar-scp__phone-text small { font-size: 0.64rem; font-weight: 750; line-height: 1.1; letter-spacing: 0.055em; text-transform: uppercase; } .spar-scp__phone-text strong { color: inherit; font-size: 1rem; font-weight: 900; line-height: 1.15; } /* ============================================================ NOTEBOOK E TABLET ORIZZONTALE ============================================================ */ @media (max-width: 1100px) { .spar-scp__critical-points, .spar-scp__systems-grid, .spar-scp__checks-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-scp__continuity, .spar-scp__perimeter, .spar-scp__joints, .spar-scp__mistakes, .spar-scp__process, .spar-scp__conversion { grid-template-columns: minmax(0, 1fr); } .spar-scp__continuity-content, .spar-scp__perimeter-content, .spar-scp__joints-content, .spar-scp__mistakes-content, .spar-scp__process-content, .spar-scp__conversion-content { max-width: 850px; } .spar-scp__diagram, .spar-scp__perimeter-visual, .spar-scp__joints-visual, .spar-scp__mistakes-list, .spar-scp__process-list { max-width: 850px; } .spar-scp__actions { grid-template-columns: repeat(3, minmax(0, 1fr)); } } /* ============================================================ TABLET ============================================================ */ @media (max-width: 820px) { .spar-scp { padding-block: 60px 74px; } .spar-scp__container { width: min(calc(100% - 32px), 760px); } .spar-scp__answer { grid-template-columns: 62px minmax(0, 1fr); gap: 18px; } .spar-scp__answer-icon { width: 60px; height: 60px; border-radius: 17px; } .spar-scp__answer-icon svg { width: 36px; height: 36px; } .spar-scp__diagram { grid-template-columns: minmax(0, 1fr); } .spar-scp__actions { grid-template-columns: minmax(0, 1fr); } } /* ============================================================ MOBILE ============================================================ */ @media (max-width: 580px) { .spar-scp { padding-block: 50px 62px; } .spar-scp__container { width: calc(100% - 28px); } .spar-scp__header, .spar-scp__systems-header, .spar-scp__checks-header { text-align: left; } .spar-scp__eyebrow, .spar-scp__section-label { font-size: 0.68rem; letter-spacing: 0.06em; } .spar-scp__title { font-size: clamp(1.86rem, 9.5vw, 2.64rem); line-height: 1.1; } .spar-scp__direct-answer { margin-top: 20px; font-size: 0.99rem; line-height: 1.63; } .spar-scp__intro { font-size: 0.92rem; line-height: 1.67; } .spar-scp__answer { grid-template-columns: minmax(0, 1fr); align-items: start; gap: 15px; padding: 20px 17px; border-radius: 18px; } .spar-scp__answer-icon { width: 53px; height: 53px; border-radius: 15px; } .spar-scp__answer-content h4 { font-size: 1.16rem; } .spar-scp__answer-content > p:last-child { font-size: 0.9rem; } .spar-scp__critical-points, .spar-scp__systems-grid, .spar-scp__checks-list, .spar-scp__process-list { grid-template-columns: minmax(0, 1fr); } .spar-scp__critical, .spar-scp__system-card, .spar-scp__checks-list li { padding: 19px 17px; border-radius: 16px; } .spar-scp__continuity-content h4, .spar-scp__perimeter-content h4, .spar-scp__systems-header h4, .spar-scp__joints-content h4, .spar-scp__mistakes-content h4, .spar-scp__checks-header h4, .spar-scp__process-content h4, .spar-scp__conversion h4 { font-size: clamp(1.5rem, 7.5vw, 1.95rem); line-height: 1.19; } .spar-scp__continuity-content > p:not(.spar-scp__section-label), .spar-scp__perimeter-content > p:not(.spar-scp__section-label), .spar-scp__systems-header > p:last-child, .spar-scp__joints-content > p:not(.spar-scp__section-label), .spar-scp__mistakes-content > p:not(.spar-scp__section-label), .spar-scp__checks-header > p:last-child, .spar-scp__process-content > p:not(.spar-scp__section-label), .spar-scp__conversion-content > p:not(.spar-scp__conversion-label) { font-size: 0.91rem; line-height: 1.66; } .spar-scp__diagram-card { padding: 19px 17px; border-radius: 16px; } .spar-scp__perimeter-visual, .spar-scp__joints-visual { padding: 17px; border-radius: 18px; } .spar-scp__room-frame { min-height: 270px; border-width: 14px; } .spar-scp__room-wall { top: 26px; right: 26px; bottom: 26px; left: 26px; } .spar-scp__seal--top { top: 20px; right: 20px; left: 20px; } .spar-scp__seal--bottom { right: 20px; bottom: 20px; left: 20px; } .spar-scp__seal--side { top: 20px; bottom: 20px; left: 20px; } .spar-scp__room-label--side { display: none; } .spar-scp__mistakes { padding: 23px 17px; border-radius: 20px; } .spar-scp__mistakes-list li, .spar-scp__process-list li { grid-template-columns: 38px minmax(0, 1fr); gap: 10px; padding: 12px; } .spar-scp__mistakes-list li > span, .spar-scp__process-list li > span { width: 38px; height: 38px; } .spar-scp__trust { grid-template-columns: minmax(0, 1fr); align-items: start; gap: 15px; padding: 21px 17px; border-radius: 18px; } .spar-scp__trust-icon { width: 54px; height: 54px; border-radius: 15px; } .spar-scp__trust-icon svg { width: 31px; height: 31px; } .spar-scp__trust h4 { font-size: 1.28rem; } .spar-scp__trust-content > p:last-child { font-size: 0.9rem; line-height: 1.65; } .spar-scp__conversion { padding: 22px 17px; border-radius: 19px; } .spar-scp__button { width: 100%; min-height: 58px; padding-inline: 13px; font-size: 0.87rem; } } /* ============================================================ SMARTPHONE MOLTO STRETTI ============================================================ */ @media (max-width: 380px) { .spar-scp__container { width: calc(100% - 22px); } .spar-scp__title { font-size: 1.74rem; } .spar-scp__critical, .spar-scp__diagram-card, .spar-scp__perimeter-visual, .spar-scp__system-card, .spar-scp__joints-visual, .spar-scp__mistakes, .spar-scp__checks-list li, .spar-scp__process-list li, .spar-scp__trust, .spar-scp__conversion { padding-inline: 14px; } .spar-scp__room-wall span { font-size: 0.63rem; } .spar-scp__button { gap: 8px; padding-inline: 10px; font-size: 0.83rem; } .spar-scp__button svg { flex-basis: 21px; width: 21px; height: 21px; } } /* ============================================================ ACCESSIBILITÀ ============================================================ */ @media (prefers-reduced-motion: reduce) { .spar-scp__button { transition: none; } .spar-scp__button:hover { transform: none; } } /* ============================================================ STAMPA ============================================================ */ @media print { .spar-scp { padding: 30px 0; background: #ffffff; } .spar-scp__mistakes { border: 1px solid #ccdede; background: #ffffff; box-shadow: none; } .spar-scp__mistakes-content h4, .spar-scp__mistakes-list strong { color: var(--spar-scp-text); } .spar-scp__mistakes-content > p:not(.spar-scp__section-label), .spar-scp__mistakes-list p { color: var(--spar-scp-muted); } .spar-scp__actions { display: none; } }#imCell_20 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHTMLObject_1726_20 { position: relative; align-self: start; justify-self: center; max-width: 100%; box-sizing: border-box; z-index: 3; } #imCellStyleGraphics_20 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imCellStyleBorders_20 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } /* ============================================================ H2 — ISOLAMENTO ACUSTICO DI PARETI INTERNE GIÀ ESISTENTI ============================================================ */ .spar-pes, .spar-pes *, .spar-pes *::before, .spar-pes *::after { box-sizing: border-box; } .spar-pes { --pes-dark: #07343b; --pes-deep: #05282e; --pes-teal: #24bfc1; --pes-teal-light: #d9f4f2; --pes-orange: #ff8a2a; --pes-orange-dark: #c85c0a; --pes-green: #27ad68; --pes-green-dark: #19864f; --pes-white: #ffffff; --pes-cream: #fff8ed; --pes-light: #edf8f7; --pes-text: #173c41; --pes-muted: #557277; --pes-border: #d4e6e4; --pes-shadow: 0 20px 52px rgba(6, 52, 59, 0.10); width: 100%; max-width: 100%; overflow: hidden; padding-block: clamp(64px, 8vw, 105px); background: radial-gradient( circle at 5% 5%, rgba(36, 191, 193, 0.12), transparent 27% ), radial-gradient( circle at 95% 95%, rgba(255, 138, 42, 0.09), transparent 25% ), var(--pes-cream); color: var(--pes-text); } .spar-pes h2, .spar-pes h3, .spar-pes h4, .spar-pes p, .spar-pes li, .spar-pes a, .spar-pes span, .spar-pes strong, .spar-pes small { max-width: 100%; overflow-wrap: break-word; } .spar-pes__container { width: min(calc(100% - 40px), 1220px); margin-inline: auto; } /* HEADER */ .spar-pes__header { width: min(100%, 960px); margin-inline: auto; text-align: center; } .spar-pes__eyebrow, .spar-pes__section-label, .spar-pes__answer-label, .spar-pes__conversion-label { margin: 0 0 12px; color: var(--pes-orange-dark); font-size: 0.74rem; font-weight: 900; line-height: 1.4; letter-spacing: 0.075em; text-transform: uppercase; } .spar-pes__title { margin: 0; color: var(--pes-dark); font-size: clamp(2rem, 4.2vw, 3.55rem); font-weight: 900; line-height: 1.08; letter-spacing: -0.04em; text-wrap: balance; } .spar-pes__direct-answer { margin: 24px auto 0; color: var(--pes-dark); font-size: clamp(1.04rem, 1.5vw, 1.2rem); font-weight: 650; line-height: 1.7; } .spar-pes__direct-answer strong { font-weight: 900; } .spar-pes__intro { margin: 14px auto 0; color: var(--pes-muted); font-size: 1rem; line-height: 1.72; } /* RISPOSTA */ .spar-pes__answer { display: grid; grid-template-columns: 76px minmax(0, 1fr); align-items: center; gap: 22px; width: min(100%, 1000px); margin: clamp(35px, 5vw, 56px) auto 0; padding: clamp(22px, 3vw, 33px); border: 1px solid rgba(36, 191, 193, 0.28); border-radius: 22px; background: var(--pes-white); box-shadow: var(--pes-shadow); } .spar-pes__answer-icon { display: grid; place-items: center; width: 70px; height: 70px; border-radius: 19px; background: var(--pes-dark); color: var(--pes-teal-light); } .spar-pes__answer-icon svg { width: 42px; height: 42px; } .spar-pes__answer-content { min-width: 0; } .spar-pes__answer-content h3, .spar-pes__overview-header h3, .spar-pes__topics-content h3, .spar-pes__evaluation-content h3, .spar-pes__process-header h3, .spar-pes__conversion h3 { margin: 0; color: var(--pes-dark); font-size: clamp(1.45rem, 2.8vw, 2.25rem); font-weight: 900; line-height: 1.2; letter-spacing: -0.03em; text-wrap: balance; } .spar-pes__answer-content h3 { font-size: clamp(1.2rem, 2vw, 1.6rem); } .spar-pes__answer-content > p:last-child { margin: 9px 0 0; color: var(--pes-muted); font-size: 0.95rem; line-height: 1.66; } /* OVERVIEW */ .spar-pes__overview, .spar-pes__process { margin-top: clamp(58px, 8vw, 92px); } .spar-pes__overview-header, .spar-pes__process-header { width: min(100%, 870px); margin-inline: auto; text-align: center; } .spar-pes__overview-header > p:last-child, .spar-pes__process-header > p:last-child { margin: 16px auto 0; color: var(--pes-muted); font-size: 0.97rem; line-height: 1.7; } .spar-pes__overview-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 32px; } .spar-pes__overview-card { min-width: 0; padding: 24px; border: 1px solid var(--pes-border); border-top: 5px solid var(--pes-dark); border-radius: 19px; background: var(--pes-white); box-shadow: 0 13px 34px rgba(6, 52, 59, 0.08); } .spar-pes__overview-card--teal { border-top-color: var(--pes-teal); } .spar-pes__overview-card--orange { border-top-color: var(--pes-orange); } .spar-pes__overview-number { color: rgba(7, 52, 59, 0.24); font-size: 1.65rem; font-weight: 950; } .spar-pes__overview-card h4 { margin: 17px 0 0; color: var(--pes-dark); font-size: 1.08rem; font-weight: 900; line-height: 1.35; } .spar-pes__overview-card p { margin: 9px 0 0; color: var(--pes-muted); font-size: 0.87rem; line-height: 1.62; } /* APPROFONDIMENTI */ .spar-pes__topics, .spar-pes__evaluation { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(430px, 1.1fr); align-items: center; gap: clamp(35px, 5vw, 66px); margin-top: clamp(58px, 8vw, 92px); } .spar-pes__topics-content, .spar-pes__evaluation-content { min-width: 0; } .spar-pes__topics-content > p:not(.spar-pes__section-label), .spar-pes__evaluation-content > p:not(.spar-pes__section-label) { margin: 17px 0 0; color: var(--pes-muted); font-size: 0.97rem; line-height: 1.7; } .spar-pes__topics-content > p + p, .spar-pes__evaluation-content > p + p { margin-top: 11px; } .spar-pes__topic-links { display: grid; gap: 14px; min-width: 0; } .spar-pes__topic-link { display: grid; grid-template-columns: 52px minmax(0, 1fr) 32px; align-items: center; gap: 14px; min-width: 0; padding: 18px; border: 1px solid var(--pes-border); border-radius: 17px; background: var(--pes-white); color: var(--pes-dark); text-decoration: none; box-shadow: 0 11px 29px rgba(6, 52, 59, 0.07); transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease; } .spar-pes__topic-link:hover { transform: translateY(-2px); border-color: var(--pes-teal); box-shadow: 0 16px 36px rgba(6, 52, 59, 0.11); } .spar-pes__topic-link:focus-visible { outline: 3px solid var(--pes-orange); outline-offset: 4px; } .spar-pes__topic-icon { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 15px; background: var(--pes-light); color: var(--pes-dark); } .spar-pes__topic-icon svg { width: 29px; height: 29px; } .spar-pes__topic-text { display: grid; min-width: 0; gap: 5px; } .spar-pes__topic-text strong { color: var(--pes-dark); font-size: 0.96rem; font-weight: 900; line-height: 1.4; } .spar-pes__topic-text small { color: var(--pes-muted); font-size: 0.8rem; line-height: 1.5; } .spar-pes__topic-arrow { color: var(--pes-orange-dark); font-size: 1.35rem; font-weight: 900; } /* VALUTAZIONE */ .spar-pes__evaluation { padding: clamp(27px, 4vw, 46px); border-radius: 24px; background: radial-gradient( circle at 96% 4%, rgba(36, 191, 193, 0.2), transparent 30% ), linear-gradient(135deg, var(--pes-deep), var(--pes-dark)); box-shadow: 0 24px 60px rgba(3, 35, 40, 0.20); } .spar-pes__evaluation .spar-pes__section-label { color: var(--pes-orange); } .spar-pes__evaluation-content h3 { color: var(--pes-white); } .spar-pes__evaluation-content > p:not(.spar-pes__section-label) { color: rgba(255, 255, 255, 0.75); } .spar-pes__evaluation-highlight { padding: 15px 17px; border-left: 4px solid var(--pes-orange); border-radius: 0 12px 12px 0; background: rgba(255, 255, 255, 0.08); color: var(--pes-white) !important; font-weight: 750; } .spar-pes__evaluation-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; min-width: 0; } .spar-pes__evaluation-card { min-width: 0; padding: 17px; border: 1px solid rgba(255, 255, 255, 0.13); border-radius: 15px; background: rgba(255, 255, 255, 0.07); } .spar-pes__evaluation-card > span { display: grid; place-items: center; width: 39px; height: 39px; border-radius: 12px; background: rgba(36, 191, 193, 0.16); color: var(--pes-teal-light); font-weight: 900; } .spar-pes__evaluation-card h4 { margin: 13px 0 0; color: var(--pes-white); font-size: 0.95rem; font-weight: 900; line-height: 1.35; } .spar-pes__evaluation-card p { margin: 7px 0 0; color: rgba(255, 255, 255, 0.68); font-size: 0.8rem; line-height: 1.54; } /* PROCESSO */ .spar-pes__process-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 15px; margin: 32px 0 0; padding: 0; list-style: none; } .spar-pes__process-list li { min-width: 0; padding: 20px; border: 1px solid var(--pes-border); border-radius: 17px; background: var(--pes-white); box-shadow: 0 11px 29px rgba(6, 52, 59, 0.07); } .spar-pes__process-list li > span { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; background: var(--pes-dark); color: var(--pes-teal-light); font-size: 0.78rem; font-weight: 900; } .spar-pes__process-list strong { display: block; margin-top: 16px; color: var(--pes-dark); font-size: 0.91rem; font-weight: 900; line-height: 1.4; } .spar-pes__process-list p { margin: 7px 0 0; color: var(--pes-muted); font-size: 0.82rem; line-height: 1.57; } /* CTA */ .spar-pes__conversion { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(330px, 0.92fr); align-items: center; gap: clamp(30px, 5vw, 64px); margin-top: clamp(52px, 7vw, 82px); padding: clamp(26px, 4vw, 45px); border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 23px; background: var(--pes-white); box-shadow: var(--pes-shadow); } .spar-pes__conversion-content > p:not(.spar-pes__conversion-label) { margin: 15px 0 0; color: var(--pes-muted); font-size: 0.95rem; line-height: 1.69; } .spar-pes__conversion-content > p + p { margin-top: 10px; } .spar-pes__actions { display: grid; gap: 11px; min-width: 0; } .spar-pes__button { display: flex; min-height: 57px; align-items: center; justify-content: center; padding: 13px 17px; border: 2px solid transparent; border-radius: 12px; font-family: inherit; font-size: 0.9rem; font-weight: 850; line-height: 1.3; text-align: center; text-decoration: none; transition: transform 180ms ease, background-color 180ms ease, border-color 180ms ease; } .spar-pes__button:hover { transform: translateY(-2px); } .spar-pes__button:focus-visible { outline: 3px solid var(--pes-dark); outline-offset: 4px; } .spar-pes__button--primary { background: var(--pes-orange); color: #2c1504; } .spar-pes__button--whatsapp { background: var(--pes-green); color: var(--pes-white); } .spar-pes__button--whatsapp:hover { background: var(--pes-green-dark); } .spar-pes__button--phone { border-color: rgba(7, 52, 59, 0.3); background: var(--pes-white); color: var(--pes-dark); } .spar-pes__button--phone span { display: grid; gap: 1px; font-size: 0.7rem; text-transform: uppercase; } .spar-pes__button--phone strong { font-size: 1rem; } /* RESPONSIVE */ @media (max-width: 1050px) { .spar-pes__topics, .spar-pes__evaluation, .spar-pes__conversion { grid-template-columns: minmax(0, 1fr); } .spar-pes__process-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-pes__actions { grid-template-columns: repeat(3, minmax(0, 1fr)); } } @media (max-width: 780px) { .spar-pes__container { width: min(calc(100% - 32px), 740px); } .spar-pes__answer { grid-template-columns: 60px minmax(0, 1fr); gap: 17px; } .spar-pes__answer-icon { width: 58px; height: 58px; } .spar-pes__overview-grid { grid-template-columns: minmax(0, 1fr); } .spar-pes__actions { grid-template-columns: minmax(0, 1fr); } } @media (max-width: 560px) { .spar-pes { padding-block: 50px 62px; } .spar-pes__container { width: calc(100% - 28px); } .spar-pes__header, .spar-pes__overview-header, .spar-pes__process-header { text-align: left; } .spar-pes__title { font-size: clamp(1.86rem, 9.5vw, 2.65rem); } .spar-pes__direct-answer { font-size: 0.98rem; line-height: 1.63; } .spar-pes__intro { font-size: 0.91rem; line-height: 1.66; } .spar-pes__answer { grid-template-columns: minmax(0, 1fr); padding: 20px 17px; border-radius: 18px; } .spar-pes__answer-icon { width: 52px; height: 52px; } .spar-pes__topic-link { grid-template-columns: 47px minmax(0, 1fr); padding: 15px; } .spar-pes__topic-icon { width: 47px; height: 47px; } .spar-pes__topic-arrow { display: none; } .spar-pes__evaluation { padding: 22px 17px; border-radius: 19px; } .spar-pes__evaluation-grid, .spar-pes__process-list { grid-template-columns: minmax(0, 1fr); } .spar-pes__conversion { padding: 22px 17px; border-radius: 19px; } .spar-pes__button { width: 100%; } } @media (max-width: 380px) { .spar-pes__container { width: calc(100% - 22px); } .spar-pes__title { font-size: 1.74rem; } .spar-pes__overview-card, .spar-pes__topic-link, .spar-pes__evaluation, .spar-pes__process-list li, .spar-pes__conversion { padding-inline: 14px; } } @media (prefers-reduced-motion: reduce) { .spar-pes__button, .spar-pes__topic-link { transition: none; } .spar-pes__button:hover, .spar-pes__topic-link:hover { transform: none; } }#imCell_21 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHTMLObject_1726_21 { position: relative; align-self: start; justify-self: center; max-width: 100%; box-sizing: border-box; z-index: 3; } #imCellStyleGraphics_21 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imCellStyleBorders_21 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } /* ============================================================ H3 — INTERVENTO SENZA DEMOLIRE COMPLETAMENTE LA PARETE ============================================================ */ .spar-sdp, .spar-sdp *, .spar-sdp *::before, .spar-sdp *::after { box-sizing: border-box; } .spar-sdp { --sdp-dark: #07343b; --sdp-deep: #05282e; --sdp-teal: #24bfc1; --sdp-teal-light: #d9f4f2; --sdp-orange: #ff8a2a; --sdp-orange-dark: #c85c0a; --sdp-green: #27ad68; --sdp-green-dark: #19864f; --sdp-white: #ffffff; --sdp-cream: #fff8ed; --sdp-light: #edf8f7; --sdp-text: #173c41; --sdp-muted: #557277; --sdp-border: #d4e6e4; --sdp-shadow: 0 20px 52px rgba(6, 52, 59, 0.10); width: 100%; max-width: 100%; overflow: hidden; padding-block: clamp(64px, 8vw, 105px); background: radial-gradient( circle at 95% 5%, rgba(36, 191, 193, 0.11), transparent 27% ), radial-gradient( circle at 5% 95%, rgba(255, 138, 42, 0.09), transparent 25% ), var(--sdp-white); color: var(--sdp-text); } .spar-sdp h3, .spar-sdp h4, .spar-sdp h5, .spar-sdp p, .spar-sdp li, .spar-sdp a, .spar-sdp span, .spar-sdp strong, .spar-sdp small { max-width: 100%; overflow-wrap: break-word; } .spar-sdp__container { width: min(calc(100% - 40px), 1220px); margin-inline: auto; } /* HEADER */ .spar-sdp__header { width: min(100%, 960px); margin-inline: auto; text-align: center; } .spar-sdp__eyebrow, .spar-sdp__section-label, .spar-sdp__answer-label, .spar-sdp__conversion-label { margin: 0 0 12px; color: var(--sdp-orange-dark); font-size: 0.74rem; font-weight: 900; line-height: 1.4; letter-spacing: 0.075em; text-transform: uppercase; } .spar-sdp__title { margin: 0; color: var(--sdp-dark); font-size: clamp(1.95rem, 4vw, 3.35rem); font-weight: 900; line-height: 1.08; letter-spacing: -0.04em; text-wrap: balance; } .spar-sdp__direct-answer { margin: 24px auto 0; color: var(--sdp-dark); font-size: clamp(1.04rem, 1.5vw, 1.2rem); font-weight: 650; line-height: 1.7; } .spar-sdp__direct-answer strong { font-weight: 900; } .spar-sdp__intro { margin: 14px auto 0; color: var(--sdp-muted); font-size: 1rem; line-height: 1.72; } /* RISPOSTA */ .spar-sdp__answer { display: grid; grid-template-columns: 76px minmax(0, 1fr); align-items: center; gap: 22px; width: min(100%, 1000px); margin: clamp(35px, 5vw, 56px) auto 0; padding: clamp(22px, 3vw, 33px); border: 1px solid rgba(36, 191, 193, 0.28); border-radius: 22px; background: var(--sdp-cream); box-shadow: var(--sdp-shadow); } .spar-sdp__answer-icon { display: grid; place-items: center; width: 70px; height: 70px; border-radius: 19px; background: var(--sdp-dark); color: var(--sdp-teal-light); } .spar-sdp__answer-icon svg { width: 42px; height: 42px; } .spar-sdp__answer-content { min-width: 0; } .spar-sdp__answer-content h4, .spar-sdp__meaning-content h4, .spar-sdp__system-content h4, .spar-sdp__changes-header h4, .spar-sdp__feasibility-content h4, .spar-sdp__warning-content h4, .spar-sdp__process-header h4, .spar-sdp__conversion h4 { margin: 0; color: var(--sdp-dark); font-size: clamp(1.45rem, 2.8vw, 2.25rem); font-weight: 900; line-height: 1.2; letter-spacing: -0.03em; text-wrap: balance; } .spar-sdp__answer-content h4 { font-size: clamp(1.2rem, 2vw, 1.6rem); } .spar-sdp__answer-content > p:last-child { margin: 9px 0 0; color: var(--sdp-muted); font-size: 0.95rem; line-height: 1.66; } /* TESTI COMUNI */ .spar-sdp__meaning, .spar-sdp__system, .spar-sdp__feasibility, .spar-sdp__warning { display: grid; grid-template-columns: minmax(0, 0.92fr) minmax(430px, 1.08fr); align-items: center; gap: clamp(35px, 5vw, 66px); margin-top: clamp(58px, 8vw, 92px); } .spar-sdp__meaning-content, .spar-sdp__system-content, .spar-sdp__feasibility-content, .spar-sdp__warning-content { min-width: 0; } .spar-sdp__meaning-content > p:not(.spar-sdp__section-label), .spar-sdp__system-content > p:not(.spar-sdp__section-label), .spar-sdp__feasibility-content > p:not(.spar-sdp__section-label), .spar-sdp__warning-content > p:not(.spar-sdp__section-label) { margin: 17px 0 0; color: var(--sdp-muted); font-size: 0.97rem; line-height: 1.7; } .spar-sdp__meaning-content > p + p, .spar-sdp__system-content > p + p, .spar-sdp__feasibility-content > p + p, .spar-sdp__warning-content > p + p { margin-top: 11px; } .spar-sdp__highlight, .spar-sdp__feasibility-highlight, .spar-sdp__warning-highlight { padding: 15px 17px; border-left: 4px solid var(--sdp-orange); border-radius: 0 12px 12px 0; background: #fff0e2; color: var(--sdp-dark) !important; font-weight: 750; } /* CONFRONTO */ .spar-sdp__comparison { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; min-width: 0; } .spar-sdp__comparison-card { min-width: 0; padding: 22px; border: 1px solid var(--sdp-border); border-top: 5px solid #d56652; border-radius: 18px; background: var(--sdp-white); box-shadow: 0 12px 31px rgba(6, 52, 59, 0.08); } .spar-sdp__comparison-card--right { border-top-color: var(--sdp-teal); } .spar-sdp__comparison-symbol { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 13px; background: #fff0ed; color: #a23b2a; font-weight: 900; } .spar-sdp__comparison-card--right .spar-sdp__comparison-symbol { background: var(--sdp-light); color: var(--sdp-dark); } .spar-sdp__comparison-card h5 { margin: 16px 0 0; color: var(--sdp-dark); font-size: 1.04rem; font-weight: 900; line-height: 1.35; } .spar-sdp__comparison-card ul { display: grid; gap: 8px; margin: 15px 0 0; padding: 0; list-style: none; } .spar-sdp__comparison-card li { position: relative; padding-left: 18px; color: var(--sdp-muted); font-size: 0.83rem; line-height: 1.55; } .spar-sdp__comparison-card li::before { content: ""; position: absolute; top: 0.62em; left: 0; width: 7px; height: 7px; border-radius: 50%; background: #d56652; } .spar-sdp__comparison-card--right li::before { background: var(--sdp-teal); } /* DIAGRAMMA */ .spar-sdp__system { grid-template-columns: minmax(480px, 1.1fr) minmax(0, 0.9fr); } .spar-sdp__diagram { display: grid; grid-template-columns: minmax(92px, 1fr) minmax(62px, 0.62fr) minmax(68px, 0.68fr) minmax(88px, 0.88fr) minmax(108px, 1.08fr) minmax(92px, 1fr); gap: 7px; min-width: 0; padding: 20px; border: 1px solid rgba(36, 191, 193, 0.26); border-radius: 21px; background: var(--sdp-white); box-shadow: var(--sdp-shadow); } .spar-sdp__diagram-layer { display: flex; min-width: 0; min-height: 255px; align-items: center; justify-content: center; flex-direction: column; padding: 12px; border-radius: 11px; text-align: center; } .spar-sdp__diagram-layer--neighbor { background: #fff0e2; color: #703507; } .spar-sdp__diagram-layer--existing { border: 2px solid #919fa1; background: repeating-linear-gradient( 45deg, #d9e0e0, #d9e0e0 8px, #c9d2d2 8px, #c9d2d2 16px ); color: #40575b; } .spar-sdp__diagram-layer--gap { border: 1px dashed var(--sdp-teal); background: #f3fbfa; color: var(--sdp-dark); } .spar-sdp__diagram-layer--frame { border: 2px solid var(--sdp-dark); background: var(--sdp-light); color: var(--sdp-dark); } .spar-sdp__diagram-layer--mass { background: repeating-linear-gradient( 135deg, #d9f1ef, #d9f1ef 8px, #c3e8e5 8px, #c3e8e5 16px ); color: var(--sdp-dark); } .spar-sdp__diagram-layer--room { background: var(--sdp-dark); color: var(--sdp-white); } .spar-sdp__diagram-layer > span { font-size: 0.65rem; font-weight: 900; line-height: 1.35; text-transform: uppercase; } .spar-sdp__diagram-layer--existing > span, .spar-sdp__diagram-layer--gap > span, .spar-sdp__diagram-layer--frame > span, .spar-sdp__diagram-layer--mass > span { writing-mode: vertical-rl; transform: rotate(180deg); } .spar-sdp__diagram-layer strong, .spar-sdp__diagram-layer small { margin-top: 9px; color: inherit; font-size: 0.73rem; font-weight: 750; line-height: 1.4; } .spar-sdp__diagram-note { grid-column: 1 / -1; margin: 7px 0 0; color: var(--sdp-muted); font-size: 0.74rem; line-height: 1.5; text-align: center; } /* MODIFICHE */ .spar-sdp__changes, .spar-sdp__process { margin-top: clamp(58px, 8vw, 92px); } .spar-sdp__changes-header, .spar-sdp__process-header { width: min(100%, 880px); margin-inline: auto; text-align: center; } .spar-sdp__changes-header > p:last-child, .spar-sdp__process-header > p:last-child { margin: 16px auto 0; color: var(--sdp-muted); font-size: 0.97rem; line-height: 1.7; } .spar-sdp__changes-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 31px; } .spar-sdp__change-card { min-width: 0; padding: 21px; border: 1px solid var(--sdp-border); border-top: 5px solid var(--sdp-teal); border-radius: 17px; background: var(--sdp-white); box-shadow: 0 11px 29px rgba(6, 52, 59, 0.07); } .spar-sdp__change-card--adapt { border-top-color: var(--sdp-orange); } .spar-sdp__change-card > span { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; background: var(--sdp-light); color: var(--sdp-dark); font-weight: 900; } .spar-sdp__change-card--adapt > span { background: #fff0e2; color: var(--sdp-orange-dark); } .spar-sdp__change-card h5 { margin: 15px 0 0; color: var(--sdp-dark); font-size: 0.98rem; font-weight: 900; line-height: 1.35; } .spar-sdp__change-card p { margin: 7px 0 0; color: var(--sdp-muted); font-size: 0.83rem; line-height: 1.58; } /* FATTIBILITÀ */ .spar-sdp__feasibility { padding: clamp(27px, 4vw, 46px); border-radius: 24px; background: radial-gradient( circle at 96% 4%, rgba(36, 191, 193, 0.2), transparent 30% ), linear-gradient(135deg, var(--sdp-deep), var(--sdp-dark)); box-shadow: 0 24px 60px rgba(3, 35, 40, 0.20); } .spar-sdp__feasibility .spar-sdp__section-label { color: var(--sdp-orange); } .spar-sdp__feasibility-content h4 { color: var(--sdp-white); } .spar-sdp__feasibility-content > p:not(.spar-sdp__section-label) { color: rgba(255, 255, 255, 0.74); } .spar-sdp__feasibility-highlight { border-left-color: var(--sdp-orange); background: rgba(255, 255, 255, 0.08); color: var(--sdp-white) !important; } .spar-sdp__feasibility-list { display: grid; gap: 11px; margin: 0; padding: 0; list-style: none; } .spar-sdp__feasibility-list li { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 11px; padding: 14px; border: 1px solid rgba(255, 255, 255, 0.13); border-radius: 14px; background: rgba(255, 255, 255, 0.07); } .spar-sdp__feasibility-list li > span { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: rgba(36, 191, 193, 0.16); color: var(--sdp-teal-light); font-weight: 900; } .spar-sdp__feasibility-list strong { color: var(--sdp-white); font-size: 0.89rem; font-weight: 900; } .spar-sdp__feasibility-list p { margin: 5px 0 0; color: rgba(255, 255, 255, 0.67); font-size: 0.8rem; line-height: 1.52; } /* AVVISI */ .spar-sdp__warning-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; } .spar-sdp__warning-card { min-width: 0; padding: 19px; border: 1px solid rgba(255, 138, 42, 0.3); border-radius: 16px; background: var(--sdp-white); box-shadow: 0 11px 29px rgba(6, 52, 59, 0.07); } .spar-sdp__warning-card > span { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: #fff0e2; color: var(--sdp-orange-dark); font-weight: 900; } .spar-sdp__warning-card h5 { margin: 14px 0 0; color: var(--sdp-dark); font-size: 0.96rem; font-weight: 900; } .spar-sdp__warning-card p { margin: 7px 0 0; color: var(--sdp-muted); font-size: 0.82rem; line-height: 1.56; } /* PROCESSO */ .spar-sdp__process-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 15px; margin: 31px 0 0; padding: 0; list-style: none; } .spar-sdp__process-list li { min-width: 0; padding: 20px; border: 1px solid var(--sdp-border); border-radius: 17px; background: var(--sdp-white); box-shadow: 0 11px 29px rgba(6, 52, 59, 0.07); } .spar-sdp__process-list li > span { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; background: var(--sdp-dark); color: var(--sdp-teal-light); font-size: 0.78rem; font-weight: 900; } .spar-sdp__process-list strong { display: block; margin-top: 16px; color: var(--sdp-dark); font-size: 0.9rem; font-weight: 900; } .spar-sdp__process-list p { margin: 7px 0 0; color: var(--sdp-muted); font-size: 0.82rem; line-height: 1.57; } /* CTA */ .spar-sdp__conversion { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(330px, 0.92fr); align-items: center; gap: clamp(30px, 5vw, 64px); margin-top: clamp(52px, 7vw, 82px); padding: clamp(26px, 4vw, 45px); border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 23px; background: var(--sdp-cream); box-shadow: var(--sdp-shadow); } .spar-sdp__conversion-content > p:not(.spar-sdp__conversion-label) { margin: 15px 0 0; color: var(--sdp-muted); font-size: 0.95rem; line-height: 1.69; } .spar-sdp__conversion-content > p + p { margin-top: 10px; } .spar-sdp__actions { display: grid; gap: 11px; min-width: 0; } .spar-sdp__button { display: flex; min-height: 57px; align-items: center; justify-content: center; padding: 13px 17px; border: 2px solid transparent; border-radius: 12px; font-family: inherit; font-size: 0.9rem; font-weight: 850; line-height: 1.3; text-align: center; text-decoration: none; transition: transform 180ms ease, background-color 180ms ease, border-color 180ms ease; } .spar-sdp__button:hover { transform: translateY(-2px); } .spar-sdp__button:focus-visible { outline: 3px solid var(--sdp-dark); outline-offset: 4px; } .spar-sdp__button--primary { background: var(--sdp-orange); color: #2c1504; } .spar-sdp__button--whatsapp { background: var(--sdp-green); color: var(--sdp-white); } .spar-sdp__button--whatsapp:hover { background: var(--sdp-green-dark); } .spar-sdp__button--phone { border-color: rgba(7, 52, 59, 0.3); background: var(--sdp-white); color: var(--sdp-dark); } .spar-sdp__button--phone span { display: grid; gap: 1px; font-size: 0.7rem; text-transform: uppercase; } .spar-sdp__button--phone strong { font-size: 1rem; } /* RESPONSIVE */ @media (max-width: 1050px) { .spar-sdp__meaning, .spar-sdp__system, .spar-sdp__feasibility, .spar-sdp__warning, .spar-sdp__conversion { grid-template-columns: minmax(0, 1fr); } .spar-sdp__changes-grid, .spar-sdp__process-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-sdp__actions { grid-template-columns: repeat(3, minmax(0, 1fr)); } } @media (max-width: 800px) { .spar-sdp__container { width: min(calc(100% - 32px), 760px); } .spar-sdp__answer { grid-template-columns: 60px minmax(0, 1fr); gap: 17px; } .spar-sdp__answer-icon { width: 58px; height: 58px; } .spar-sdp__comparison { grid-template-columns: minmax(0, 1fr); } .spar-sdp__diagram { grid-template-columns: repeat(3, minmax(0, 1fr)); } .spar-sdp__diagram-layer { min-height: 165px; } .spar-sdp__diagram-layer--existing > span, .spar-sdp__diagram-layer--gap > span, .spar-sdp__diagram-layer--frame > span, .spar-sdp__diagram-layer--mass > span { writing-mode: horizontal-tb; transform: none; } .spar-sdp__actions { grid-template-columns: minmax(0, 1fr); } } @media (max-width: 560px) { .spar-sdp { padding-block: 50px 62px; } .spar-sdp__container { width: calc(100% - 28px); } .spar-sdp__header, .spar-sdp__changes-header, .spar-sdp__process-header { text-align: left; } .spar-sdp__title { font-size: clamp(1.84rem, 9.4vw, 2.6rem); } .spar-sdp__direct-answer { font-size: 0.98rem; line-height: 1.63; } .spar-sdp__intro { font-size: 0.91rem; line-height: 1.66; } .spar-sdp__answer { grid-template-columns: minmax(0, 1fr); padding: 20px 17px; border-radius: 18px; } .spar-sdp__answer-icon { width: 52px; height: 52px; } .spar-sdp__diagram { grid-template-columns: minmax(0, 1fr); padding: 16px 13px; border-radius: 18px; } .spar-sdp__diagram-layer { min-height: auto; padding: 15px; } .spar-sdp__diagram-note { grid-column: auto; } .spar-sdp__changes-grid, .spar-sdp__warning-grid, .spar-sdp__process-list { grid-template-columns: minmax(0, 1fr); } .spar-sdp__feasibility { padding: 22px 17px; border-radius: 19px; } .spar-sdp__conversion { padding: 22px 17px; border-radius: 19px; } .spar-sdp__button { width: 100%; } } @media (max-width: 380px) { .spar-sdp__container { width: calc(100% - 22px); } .spar-sdp__title { font-size: 1.72rem; } .spar-sdp__comparison-card, .spar-sdp__diagram, .spar-sdp__change-card, .spar-sdp__feasibility, .spar-sdp__warning-card, .spar-sdp__process-list li, .spar-sdp__conversion { padding-inline: 14px; } } @media (prefers-reduced-motion: reduce) { .spar-sdp__button { transition: none; } .spar-sdp__button:hover { transform: none; } }#imCell_22 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHTMLObject_1726_22 { position: relative; align-self: start; justify-self: center; max-width: 100%; box-sizing: border-box; z-index: 3; } #imCellStyleGraphics_22 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imCellStyleBorders_22 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } /* ============================================================ H3 — ADATTAMENTO A CAMERE DA LETTO, SOGGIORNI E APPARTAMENTI Pagina: /isolamento-acustico-pareti-roma.html ============================================================ */ .spar-aca, .spar-aca *, .spar-aca *::before, .spar-aca *::after { box-sizing: border-box; } .spar-aca { --spar-aca-dark: #07343b; --spar-aca-deep: #05282e; --spar-aca-medium: #0b5159; --spar-aca-teal: #24bfc1; --spar-aca-teal-light: #d9f4f2; --spar-aca-orange: #ff8a2a; --spar-aca-orange-dark: #c85c0a; --spar-aca-green: #27ad68; --spar-aca-green-dark: #19864f; --spar-aca-white: #ffffff; --spar-aca-cream: #fff8ed; --spar-aca-light: #edf8f7; --spar-aca-text: #173c41; --spar-aca-muted: #557277; --spar-aca-border: #d4e6e4; --spar-aca-shadow: 0 20px 52px rgba(6, 52, 59, 0.1); width: 100%; max-width: 100%; overflow: hidden; padding-block: clamp(64px, 8vw, 105px); background: radial-gradient( circle at 5% 7%, rgba(36, 191, 193, 0.11), transparent 27% ), radial-gradient( circle at 96% 93%, rgba(255, 138, 42, 0.09), transparent 25% ), var(--spar-aca-cream); color: var(--spar-aca-text); } .spar-aca h3, .spar-aca h4, .spar-aca h5, .spar-aca p, .spar-aca li, .spar-aca span, .spar-aca strong, .spar-aca small, .spar-aca a { max-width: 100%; white-space: normal; overflow-wrap: break-word; word-break: normal; } .spar-aca__container { width: min(calc(100% - 40px), 1220px); margin-inline: auto; } /* ============================================================ INTESTAZIONE ============================================================ */ .spar-aca__header { width: min(100%, 960px); margin-inline: auto; text-align: center; } .spar-aca__eyebrow, .spar-aca__section-label, .spar-aca__answer-label, .spar-aca__trust-label, .spar-aca__conversion-label { margin: 0 0 12px; color: var(--spar-aca-orange-dark); font-size: 0.74rem; font-weight: 900; line-height: 1.4; letter-spacing: 0.075em; text-transform: uppercase; } .spar-aca__title { margin: 0; color: var(--spar-aca-dark); font-size: clamp(1.95rem, 4.1vw, 3.4rem); font-weight: 900; line-height: 1.08; letter-spacing: -0.04em; text-wrap: balance; } .spar-aca__direct-answer { margin: 24px auto 0; color: var(--spar-aca-dark); font-size: clamp(1.04rem, 1.5vw, 1.2rem); font-weight: 650; line-height: 1.7; } .spar-aca__direct-answer strong { color: inherit; font-weight: 900; } .spar-aca__intro { margin: 14px auto 0; color: var(--spar-aca-muted); font-size: 1rem; line-height: 1.72; } /* ============================================================ RISPOSTA DIRETTA ============================================================ */ .spar-aca__answer { display: grid; grid-template-columns: 76px minmax(0, 1fr); align-items: center; gap: 22px; width: min(100%, 1000px); margin: clamp(35px, 5vw, 56px) auto 0; padding: clamp(22px, 3vw, 33px); border: 1px solid rgba(36, 191, 193, 0.28); border-radius: 22px; background: var(--spar-aca-white); box-shadow: var(--spar-aca-shadow); } .spar-aca__answer-icon { display: grid; place-items: center; width: 70px; height: 70px; border-radius: 19px; background: var(--spar-aca-dark); color: var(--spar-aca-teal-light); } .spar-aca__answer-icon svg { width: 42px; height: 42px; } .spar-aca__answer-content { min-width: 0; } .spar-aca__answer-content h4 { margin: 0; color: var(--spar-aca-dark); font-size: clamp(1.2rem, 2vw, 1.6rem); font-weight: 900; line-height: 1.3; } .spar-aca__answer-content > p:last-child { margin: 9px 0 0; color: var(--spar-aca-muted); font-size: 0.95rem; line-height: 1.66; } /* ============================================================ TITOLI INTERNI ============================================================ */ .spar-aca__rooms-header h4, .spar-aca__integration-content h4, .spar-aca__space-content h4, .spar-aca__comparison-content h4, .spar-aca__limits-content h4, .spar-aca__process-header h4, .spar-aca__trust h4, .spar-aca__conversion h4 { margin: 0; color: var(--spar-aca-dark); font-size: clamp(1.45rem, 2.8vw, 2.25rem); font-weight: 900; line-height: 1.2; letter-spacing: -0.03em; text-wrap: balance; } /* ============================================================ AMBIENTI ============================================================ */ .spar-aca__rooms, .spar-aca__process { margin-top: clamp(58px, 8vw, 92px); } .spar-aca__rooms-header, .spar-aca__process-header { width: min(100%, 880px); margin-inline: auto; text-align: center; } .spar-aca__rooms-header > p:last-child, .spar-aca__process-header > p:last-child { margin: 16px auto 0; color: var(--spar-aca-muted); font-size: 0.97rem; line-height: 1.7; } .spar-aca__rooms-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 17px; margin-top: 32px; } .spar-aca__room-card { display: flex; min-width: 0; flex-direction: column; padding: 22px; border: 1px solid var(--spar-aca-border); border-top: 5px solid var(--spar-aca-dark); border-radius: 18px; background: var(--spar-aca-white); box-shadow: 0 12px 30px rgba(6, 52, 59, 0.07); } .spar-aca__room-card--teal { border-top-color: var(--spar-aca-teal); } .spar-aca__room-card--orange { border-top-color: var(--spar-aca-orange); } .spar-aca__room-card--green { border-top-color: var(--spar-aca-green); } .spar-aca__room-icon { display: grid; place-items: center; width: 50px; height: 50px; border-radius: 15px; background: var(--spar-aca-light); color: var(--spar-aca-dark); } .spar-aca__room-icon svg { width: 28px; height: 28px; } .spar-aca__room-card h5 { margin: 18px 0 0; color: var(--spar-aca-dark); font-size: 1.07rem; font-weight: 900; line-height: 1.35; } .spar-aca__room-card > p { margin: 10px 0 0; color: var(--spar-aca-muted); font-size: 0.86rem; line-height: 1.62; } .spar-aca__room-note { margin-top: auto !important; padding-top: 15px; border-top: 1px solid var(--spar-aca-border); color: var(--spar-aca-dark) !important; font-weight: 750; } /* ============================================================ BLOCCHI A DUE COLONNE ============================================================ */ .spar-aca__integration, .spar-aca__space, .spar-aca__comparison, .spar-aca__limits { display: grid; grid-template-columns: minmax(0, 0.92fr) minmax(430px, 1.08fr); align-items: center; gap: clamp(35px, 5vw, 66px); margin-top: clamp(58px, 8vw, 92px); } .spar-aca__integration-content, .spar-aca__space-content, .spar-aca__comparison-content, .spar-aca__limits-content { min-width: 0; } .spar-aca__integration-content > p:not(.spar-aca__section-label), .spar-aca__space-content > p:not(.spar-aca__section-label), .spar-aca__comparison-content > p:not(.spar-aca__section-label), .spar-aca__limits-content > p:not(.spar-aca__section-label) { margin: 17px 0 0; color: var(--spar-aca-muted); font-size: 0.97rem; line-height: 1.7; } .spar-aca__integration-content > p + p, .spar-aca__space-content > p + p, .spar-aca__comparison-content > p + p, .spar-aca__limits-content > p + p { margin-top: 11px; } .spar-aca__integration-highlight, .spar-aca__space-highlight, .spar-aca__comparison-highlight, .spar-aca__limits-highlight { padding: 15px 17px; border-left: 4px solid var(--spar-aca-orange); border-radius: 0 12px 12px 0; background: #fff0e2; color: var(--spar-aca-dark) !important; font-weight: 750; } /* ============================================================ ELEMENTI DA INTEGRARE ============================================================ */ .spar-aca__integration-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; min-width: 0; } .spar-aca__integration-card { min-width: 0; padding: 19px; border: 1px solid var(--spar-aca-border); border-radius: 16px; background: var(--spar-aca-white); box-shadow: 0 11px 29px rgba(6, 52, 59, 0.07); } .spar-aca__integration-card > span { color: rgba(7, 52, 59, 0.27); font-size: 1.45rem; font-weight: 950; line-height: 1; } .spar-aca__integration-card h5 { margin: 14px 0 0; color: var(--spar-aca-dark); font-size: 0.97rem; font-weight: 900; line-height: 1.35; } .spar-aca__integration-card p { margin: 7px 0 0; color: var(--spar-aca-muted); font-size: 0.82rem; line-height: 1.57; } /* ============================================================ SCHEMA SPAZIO ============================================================ */ .spar-aca__space { grid-template-columns: minmax(430px, 1.08fr) minmax(0, 0.92fr); } .spar-aca__space-visual { min-width: 0; padding: 22px; border: 1px solid rgba(36, 191, 193, 0.27); border-radius: 21px; background: var(--spar-aca-white); box-shadow: var(--spar-aca-shadow); } .spar-aca__space-room { position: relative; min-height: 340px; overflow: hidden; border: 15px solid #d2dddd; border-radius: 13px; background: var(--spar-aca-light); } .spar-aca__space-existing, .spar-aca__space-system, .spar-aca__space-bed, .spar-aca__space-passage { position: absolute; display: grid; place-items: center; padding: 8px; font-size: 0.68rem; font-weight: 900; line-height: 1.3; text-align: center; text-transform: uppercase; } .spar-aca__space-existing { top: 0; right: 0; bottom: 0; width: 19%; background: repeating-linear-gradient( 45deg, #d9e0e0, #d9e0e0 8px, #c9d2d2 8px, #c9d2d2 16px ); color: #40575b; writing-mode: vertical-rl; transform: rotate(180deg); } .spar-aca__space-system { top: 0; right: 19%; bottom: 0; width: 16%; background: repeating-linear-gradient( 135deg, #cbeae8, #cbeae8 8px, #b5dfdc 8px, #b5dfdc 16px ); color: var(--spar-aca-dark); writing-mode: vertical-rl; transform: rotate(180deg); } .spar-aca__space-bed { right: 43%; bottom: 20px; width: 39%; height: 105px; border: 2px solid var(--spar-aca-dark); border-radius: 11px; background: var(--spar-aca-white); color: var(--spar-aca-dark); } .spar-aca__space-passage { top: 40px; right: 40%; left: 7%; min-height: 75px; border: 2px dashed var(--spar-aca-orange); border-radius: 11px; color: var(--spar-aca-orange-dark); } .spar-aca__space-visual > p { margin: 15px 0 0; color: var(--spar-aca-muted); font-size: 0.75rem; line-height: 1.5; text-align: center; } /* ============================================================ CONFRONTO ============================================================ */ .spar-aca__comparison { padding: clamp(27px, 4vw, 46px); border-radius: 24px; background: radial-gradient( circle at 96% 4%, rgba(36, 191, 193, 0.2), transparent 30% ), linear-gradient( 135deg, var(--spar-aca-deep), var(--spar-aca-dark) ); box-shadow: 0 24px 60px rgba(3, 35, 40, 0.2); } .spar-aca__comparison .spar-aca__section-label { color: var(--spar-aca-orange); } .spar-aca__comparison-content h4 { color: var(--spar-aca-white); } .spar-aca__comparison-content > p:not(.spar-aca__section-label) { color: rgba(255, 255, 255, 0.74); } .spar-aca__comparison-highlight { border-left-color: var(--spar-aca-orange); background: rgba(255, 255, 255, 0.08); color: var(--spar-aca-white) !important; } .spar-aca__comparison-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; min-width: 0; } .spar-aca__comparison-card { min-width: 0; padding: 20px; border: 1px solid rgba(255, 255, 255, 0.14); border-top: 5px solid #e46f5a; border-radius: 17px; background: rgba(255, 255, 255, 0.08); } .spar-aca__comparison-card--right { border-top-color: var(--spar-aca-teal); } .spar-aca__comparison-symbol { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; background: rgba(228, 111, 90, 0.16); color: #ffb0a3; font-weight: 900; } .spar-aca__comparison-card--right .spar-aca__comparison-symbol { background: rgba(36, 191, 193, 0.16); color: var(--spar-aca-teal-light); } .spar-aca__comparison-card h5 { margin: 15px 0 0; color: var(--spar-aca-white); font-size: 1rem; font-weight: 900; line-height: 1.35; } .spar-aca__comparison-card ul { display: grid; gap: 8px; margin: 14px 0 0; padding: 0; list-style: none; } .spar-aca__comparison-card li { position: relative; padding-left: 18px; color: rgba(255, 255, 255, 0.7); font-size: 0.8rem; line-height: 1.53; } .spar-aca__comparison-card li::before { content: ""; position: absolute; top: 0.62em; left: 0; width: 7px; height: 7px; border-radius: 50%; background: #e46f5a; } .spar-aca__comparison-card--right li::before { background: var(--spar-aca-teal); } /* ============================================================ LIMITI ============================================================ */ .spar-aca__limits-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; min-width: 0; } .spar-aca__limit-card { min-width: 0; padding: 19px; border: 1px solid rgba(255, 138, 42, 0.3); border-radius: 16px; background: var(--spar-aca-white); box-shadow: 0 11px 29px rgba(6, 52, 59, 0.07); } .spar-aca__limit-card > span { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: #fff0e2; color: var(--spar-aca-orange-dark); font-weight: 900; } .spar-aca__limit-card h5 { margin: 14px 0 0; color: var(--spar-aca-dark); font-size: 0.96rem; font-weight: 900; line-height: 1.35; } .spar-aca__limit-card p { margin: 7px 0 0; color: var(--spar-aca-muted); font-size: 0.82rem; line-height: 1.56; } /* ============================================================ PROCESSO ============================================================ */ .spar-aca__process-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 15px; margin: 31px 0 0; padding: 0; list-style: none; } .spar-aca__process-list li { min-width: 0; padding: 20px; border: 1px solid var(--spar-aca-border); border-radius: 17px; background: var(--spar-aca-white); box-shadow: 0 11px 29px rgba(6, 52, 59, 0.07); } .spar-aca__process-list li > span { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; background: var(--spar-aca-dark); color: var(--spar-aca-teal-light); font-size: 0.78rem; font-weight: 900; } .spar-aca__process-list strong { display: block; margin-top: 16px; color: var(--spar-aca-dark); font-size: 0.9rem; font-weight: 900; line-height: 1.4; } .spar-aca__process-list p { margin: 7px 0 0; color: var(--spar-aca-muted); font-size: 0.82rem; line-height: 1.57; } /* ============================================================ BLOCCO FIDUCIA ============================================================ */ .spar-aca__trust { display: grid; grid-template-columns: 74px minmax(0, 1fr); align-items: center; gap: 23px; margin-top: clamp(44px, 6vw, 68px); padding: clamp(24px, 3vw, 35px); border: 1px solid rgba(255, 138, 42, 0.31); border-radius: 21px; background: #fff3e7; } .spar-aca__trust-icon { display: grid; place-items: center; width: 70px; height: 70px; border-radius: 20px; background: var(--spar-aca-orange); color: #321705; } .spar-aca__trust-icon svg { width: 41px; height: 41px; } .spar-aca__trust-content { min-width: 0; } .spar-aca__trust h4 { font-size: clamp(1.3rem, 2.2vw, 1.85rem); } .spar-aca__trust-content > p:last-child { margin: 10px 0 0; color: var(--spar-aca-muted); font-size: 0.93rem; line-height: 1.66; } /* ============================================================ CTA ============================================================ */ .spar-aca__conversion { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(330px, 0.92fr); align-items: center; gap: clamp(30px, 5vw, 64px); margin-top: clamp(52px, 7vw, 82px); padding: clamp(26px, 4vw, 45px); border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 23px; background: var(--spar-aca-white); box-shadow: var(--spar-aca-shadow); } .spar-aca__conversion-content { min-width: 0; } .spar-aca__conversion-content > p:not(.spar-aca__conversion-label) { margin: 15px 0 0; color: var(--spar-aca-muted); font-size: 0.95rem; line-height: 1.69; } .spar-aca__conversion-content > p + p { margin-top: 10px; } .spar-aca__actions { display: grid; gap: 11px; min-width: 0; } .spar-aca__button { display: flex; min-width: 0; min-height: 57px; align-items: center; justify-content: center; gap: 10px; padding: 13px 17px; border: 2px solid transparent; border-radius: 12px; font-family: inherit; font-size: 0.9rem; font-weight: 850; line-height: 1.3; text-align: center; text-decoration: none; transition: transform 180ms ease, background-color 180ms ease, border-color 180ms ease, box-shadow 180ms ease; } .spar-aca__button:hover { transform: translateY(-2px); } .spar-aca__button:focus-visible { outline: 3px solid var(--spar-aca-dark); outline-offset: 4px; } .spar-aca__button svg { flex: 0 0 23px; width: 23px; height: 23px; } .spar-aca__button--primary { background: var(--spar-aca-orange); color: #2c1504; box-shadow: 0 12px 27px rgba(255, 138, 42, 0.22); } .spar-aca__button--primary:hover { background: #ff9b43; } .spar-aca__button--whatsapp { background: var(--spar-aca-green); color: var(--spar-aca-white); box-shadow: 0 12px 27px rgba(39, 173, 104, 0.2); } .spar-aca__button--whatsapp:hover { background: var(--spar-aca-green-dark); } .spar-aca__button--phone { border-color: rgba(7, 52, 59, 0.3); background: var(--spar-aca-white); color: var(--spar-aca-dark); } .spar-aca__button--phone:hover { border-color: var(--spar-aca-teal); background: var(--spar-aca-light); } .spar-aca__phone-text { display: grid; min-width: 0; gap: 1px; text-align: left; } .spar-aca__phone-text small { font-size: 0.64rem; font-weight: 750; line-height: 1.1; letter-spacing: 0.055em; text-transform: uppercase; } .spar-aca__phone-text strong { color: inherit; font-size: 1rem; font-weight: 900; line-height: 1.15; } /* ============================================================ NOTEBOOK E TABLET ORIZZONTALE ============================================================ */ @media (max-width: 1050px) { .spar-aca__integration, .spar-aca__space, .spar-aca__comparison, .spar-aca__limits, .spar-aca__conversion { grid-template-columns: minmax(0, 1fr); } .spar-aca__rooms-grid, .spar-aca__process-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-aca__integration-content, .spar-aca__space-content, .spar-aca__comparison-content, .spar-aca__limits-content, .spar-aca__conversion-content { max-width: 850px; } .spar-aca__integration-grid, .spar-aca__space-visual, .spar-aca__comparison-cards, .spar-aca__limits-grid { max-width: 850px; } .spar-aca__actions { grid-template-columns: repeat(3, minmax(0, 1fr)); } } /* ============================================================ TABLET ============================================================ */ @media (max-width: 800px) { .spar-aca__container { width: min(calc(100% - 32px), 760px); } .spar-aca__answer { grid-template-columns: 60px minmax(0, 1fr); gap: 17px; } .spar-aca__answer-icon { width: 58px; height: 58px; } .spar-aca__comparison-cards { grid-template-columns: minmax(0, 1fr); } .spar-aca__actions { grid-template-columns: minmax(0, 1fr); } } /* ============================================================ MOBILE ============================================================ */ @media (max-width: 560px) { .spar-aca { padding-block: 50px 62px; } .spar-aca__container { width: calc(100% - 28px); } .spar-aca__header, .spar-aca__rooms-header, .spar-aca__process-header { text-align: left; } .spar-aca__eyebrow, .spar-aca__section-label, .spar-aca__answer-label, .spar-aca__trust-label, .spar-aca__conversion-label { font-size: 0.67rem; letter-spacing: 0.06em; } .spar-aca__title { font-size: clamp(1.84rem, 9.4vw, 2.6rem); line-height: 1.1; } .spar-aca__direct-answer { font-size: 0.98rem; line-height: 1.63; } .spar-aca__intro { font-size: 0.91rem; line-height: 1.66; } .spar-aca__answer { grid-template-columns: minmax(0, 1fr); padding: 20px 17px; border-radius: 18px; } .spar-aca__answer-icon { width: 52px; height: 52px; border-radius: 15px; } .spar-aca__answer-icon svg { width: 32px; height: 32px; } .spar-aca__rooms-header h4, .spar-aca__integration-content h4, .spar-aca__space-content h4, .spar-aca__comparison-content h4, .spar-aca__limits-content h4, .spar-aca__process-header h4, .spar-aca__conversion h4 { font-size: clamp(1.42rem, 7.4vw, 1.92rem); } .spar-aca__rooms-grid, .spar-aca__integration-grid, .spar-aca__limits-grid, .spar-aca__process-list { grid-template-columns: minmax(0, 1fr); } .spar-aca__room-card, .spar-aca__integration-card, .spar-aca__limit-card, .spar-aca__process-list li { padding: 18px 16px; border-radius: 16px; } .spar-aca__space-visual { padding: 16px; border-radius: 18px; } .spar-aca__space-room { min-height: 290px; border-width: 11px; } .spar-aca__space-existing, .spar-aca__space-system { font-size: 0.58rem; } .spar-aca__space-bed { right: 43%; width: 48%; height: 90px; font-size: 0.6rem; } .spar-aca__space-passage { right: 39%; left: 5%; font-size: 0.59rem; } .spar-aca__comparison { padding: 22px 17px; border-radius: 19px; } .spar-aca__comparison-card { padding: 18px 16px; border-radius: 16px; } .spar-aca__trust { grid-template-columns: minmax(0, 1fr); align-items: start; gap: 15px; padding: 21px 17px; border-radius: 18px; } .spar-aca__trust-icon { width: 54px; height: 54px; border-radius: 15px; } .spar-aca__trust-icon svg { width: 31px; height: 31px; } .spar-aca__trust h4 { font-size: 1.27rem; } .spar-aca__conversion { padding: 22px 17px; border-radius: 19px; } .spar-aca__button { width: 100%; min-height: 57px; padding-inline: 13px; font-size: 0.86rem; } } /* ============================================================ SMARTPHONE MOLTO STRETTI ============================================================ */ @media (max-width: 380px) { .spar-aca__container { width: calc(100% - 22px); } .spar-aca__title { font-size: 1.71rem; } .spar-aca__room-card, .spar-aca__integration-card, .spar-aca__space-visual, .spar-aca__comparison, .spar-aca__comparison-card, .spar-aca__limit-card, .spar-aca__process-list li, .spar-aca__trust, .spar-aca__conversion { padding-inline: 14px; } .spar-aca__button { gap: 8px; padding-inline: 10px; font-size: 0.82rem; } .spar-aca__button svg { flex-basis: 21px; width: 21px; height: 21px; } } /* ============================================================ ACCESSIBILITÀ ============================================================ */ @media (prefers-reduced-motion: reduce) { .spar-aca__button { transition: none; } .spar-aca__button:hover { transform: none; } } /* ============================================================ STAMPA ============================================================ */ @media print { .spar-aca { padding: 30px 0; background: #ffffff; } .spar-aca__comparison { border: 1px solid var(--spar-aca-border); background: #ffffff; box-shadow: none; } .spar-aca__comparison-content h4, .spar-aca__comparison-card h5 { color: var(--spar-aca-dark); } .spar-aca__comparison-content > p:not(.spar-aca__section-label), .spar-aca__comparison-card li { color: var(--spar-aca-muted); } .spar-aca__actions { display: none; } }#imCell_23 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHTMLObject_1726_23 { position: relative; align-self: start; justify-self: center; max-width: 100%; box-sizing: border-box; z-index: 3; } #imCellStyleGraphics_23 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imCellStyleBorders_23 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } /* ============================================================ H2 — QUANTO SPAZIO OCCUPA UNA PARETE INSONORIZZATA Pagina: /isolamento-acustico-pareti-roma.html ============================================================ */ .spar-qsp, .spar-qsp *, .spar-qsp *::before, .spar-qsp *::after { box-sizing: border-box; } .spar-qsp { --spar-qsp-dark: #07343b; --spar-qsp-deep: #05282e; --spar-qsp-medium: #0b5159; --spar-qsp-teal: #24bfc1; --spar-qsp-teal-light: #d9f4f2; --spar-qsp-orange: #ff8a2a; --spar-qsp-orange-dark: #c85c0a; --spar-qsp-green: #27ad68; --spar-qsp-green-dark: #19864f; --spar-qsp-white: #ffffff; --spar-qsp-cream: #fff8ed; --spar-qsp-light: #edf8f7; --spar-qsp-text: #173c41; --spar-qsp-muted: #557277; --spar-qsp-border: #d4e6e4; --spar-qsp-shadow: 0 20px 52px rgba(6, 52, 59, 0.1); width: 100%; max-width: 100%; overflow: hidden; padding-block: clamp(64px, 8vw, 105px); background: radial-gradient( circle at 5% 7%, rgba(36, 191, 193, 0.11), transparent 27% ), radial-gradient( circle at 96% 93%, rgba(255, 138, 42, 0.09), transparent 25% ), #ffffff; color: var(--spar-qsp-text); } .spar-qsp h2, .spar-qsp h3, .spar-qsp h4, .spar-qsp h5, .spar-qsp p, .spar-qsp li, .spar-qsp span, .spar-qsp strong, .spar-qsp small, .spar-qsp a { max-width: 100%; white-space: normal; overflow-wrap: break-word; word-break: normal; } .spar-qsp__container { width: min(calc(100% - 40px), 1220px); margin-inline: auto; } /* ============================================================ INTESTAZIONE ============================================================ */ .spar-qsp__header { width: min(100%, 960px); margin-inline: auto; text-align: center; } .spar-qsp__eyebrow, .spar-qsp__section-label, .spar-qsp__answer-label, .spar-qsp__comparison-label, .spar-qsp__trust-label, .spar-qsp__conversion-label { margin: 0 0 12px; color: var(--spar-qsp-orange-dark); font-size: 0.74rem; font-weight: 900; line-height: 1.4; letter-spacing: 0.075em; text-transform: uppercase; } .spar-qsp__title { margin: 0; color: var(--spar-qsp-dark); font-size: clamp(2rem, 4.2vw, 3.55rem); font-weight: 900; line-height: 1.08; letter-spacing: -0.04em; text-wrap: balance; } .spar-qsp__direct-answer { margin: 24px auto 0; color: var(--spar-qsp-dark); font-size: clamp(1.04rem, 1.5vw, 1.2rem); font-weight: 650; line-height: 1.7; } .spar-qsp__direct-answer strong { color: inherit; font-weight: 900; } .spar-qsp__intro { margin: 14px auto 0; color: var(--spar-qsp-muted); font-size: 1rem; line-height: 1.72; } /* ============================================================ RISPOSTA DIRETTA ============================================================ */ .spar-qsp__answer { display: grid; grid-template-columns: 76px minmax(0, 1fr); align-items: center; gap: 22px; width: min(100%, 1000px); margin: clamp(35px, 5vw, 56px) auto 0; padding: clamp(22px, 3vw, 33px); border: 1px solid rgba(36, 191, 193, 0.28); border-radius: 22px; background: var(--spar-qsp-cream); box-shadow: var(--spar-qsp-shadow); } .spar-qsp__answer-icon { display: grid; place-items: center; width: 70px; height: 70px; border-radius: 19px; background: var(--spar-qsp-dark); color: var(--spar-qsp-teal-light); } .spar-qsp__answer-icon svg { width: 42px; height: 42px; } .spar-qsp__answer-content { min-width: 0; } .spar-qsp__answer-content h3 { margin: 0; color: var(--spar-qsp-dark); font-size: clamp(1.2rem, 2vw, 1.6rem); font-weight: 900; line-height: 1.3; } .spar-qsp__answer-content > p:last-child { margin: 9px 0 0; color: var(--spar-qsp-muted); font-size: 0.95rem; line-height: 1.66; } /* ============================================================ TITOLI INTERNI ============================================================ */ .spar-qsp__factors-header h3, .spar-qsp__system-content h3, .spar-qsp__comparison-header h3, .spar-qsp__room-content h3, .spar-qsp__mistakes-content h3, .spar-qsp__topics-content h3, .spar-qsp__process-header h3, .spar-qsp__trust h3, .spar-qsp__conversion h3 { margin: 0; color: var(--spar-qsp-dark); font-size: clamp(1.45rem, 2.8vw, 2.25rem); font-weight: 900; line-height: 1.2; letter-spacing: -0.03em; text-wrap: balance; } /* ============================================================ FATTORI ============================================================ */ .spar-qsp__factors, .spar-qsp__comparison, .spar-qsp__process { margin-top: clamp(58px, 8vw, 92px); } .spar-qsp__factors-header, .spar-qsp__comparison-header, .spar-qsp__process-header { width: min(100%, 880px); margin-inline: auto; text-align: center; } .spar-qsp__factors-header > p:last-child, .spar-qsp__comparison-header > p:last-child, .spar-qsp__process-header > p:last-child { margin: 16px auto 0; color: var(--spar-qsp-muted); font-size: 0.97rem; line-height: 1.7; } .spar-qsp__factors-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 17px; margin-top: 32px; } .spar-qsp__factor { min-width: 0; padding: 22px; border: 1px solid var(--spar-qsp-border); border-top: 5px solid var(--spar-qsp-dark); border-radius: 18px; background: var(--spar-qsp-white); box-shadow: 0 12px 30px rgba(6, 52, 59, 0.07); } .spar-qsp__factor--teal { border-top-color: var(--spar-qsp-teal); } .spar-qsp__factor--orange { border-top-color: var(--spar-qsp-orange); } .spar-qsp__factor--green { border-top-color: var(--spar-qsp-green); } .spar-qsp__factor-number { color: rgba(7, 52, 59, 0.23); font-size: 1.55rem; font-weight: 950; line-height: 1; } .spar-qsp__factor-icon { display: grid; place-items: center; width: 48px; height: 48px; margin-top: 18px; border-radius: 14px; background: var(--spar-qsp-light); color: var(--spar-qsp-dark); } .spar-qsp__factor-icon svg { width: 27px; height: 27px; } .spar-qsp__factor h4 { margin: 17px 0 0; color: var(--spar-qsp-dark); font-size: 1.02rem; font-weight: 900; line-height: 1.35; } .spar-qsp__factor p { margin: 9px 0 0; color: var(--spar-qsp-muted); font-size: 0.85rem; line-height: 1.62; } /* ============================================================ BLOCCHI A DUE COLONNE ============================================================ */ .spar-qsp__system, .spar-qsp__room, .spar-qsp__mistakes, .spar-qsp__topics { display: grid; grid-template-columns: minmax(0, 0.92fr) minmax(430px, 1.08fr); align-items: center; gap: clamp(35px, 5vw, 66px); margin-top: clamp(58px, 8vw, 92px); } .spar-qsp__system { grid-template-columns: minmax(500px, 1.12fr) minmax(0, 0.88fr); } .spar-qsp__system-content, .spar-qsp__room-content, .spar-qsp__mistakes-content, .spar-qsp__topics-content { min-width: 0; } .spar-qsp__system-content > p:not(.spar-qsp__section-label), .spar-qsp__room-content > p:not(.spar-qsp__section-label), .spar-qsp__mistakes-content > p:not(.spar-qsp__section-label), .spar-qsp__topics-content > p:not(.spar-qsp__section-label) { margin: 17px 0 0; color: var(--spar-qsp-muted); font-size: 0.97rem; line-height: 1.7; } .spar-qsp__system-content > p + p, .spar-qsp__room-content > p + p, .spar-qsp__mistakes-content > p + p, .spar-qsp__topics-content > p + p { margin-top: 11px; } .spar-qsp__system-highlight, .spar-qsp__room-highlight, .spar-qsp__mistakes-highlight { padding: 15px 17px; border-left: 4px solid var(--spar-qsp-orange); border-radius: 0 12px 12px 0; background: #fff0e2; color: var(--spar-qsp-dark) !important; font-weight: 750; } /* ============================================================ DIAGRAMMA ============================================================ */ .spar-qsp__diagram { display: grid; grid-template-columns: minmax(82px, 1fr) minmax(64px, 0.72fr) minmax(76px, 0.84fr) minmax(92px, 1fr) minmax(100px, 1.08fr) minmax(88px, 0.96fr); gap: 7px; min-width: 0; padding: 20px; border: 1px solid rgba(36, 191, 193, 0.26); border-radius: 21px; background: var(--spar-qsp-white); box-shadow: var(--spar-qsp-shadow); } .spar-qsp__diagram-layer { display: flex; min-width: 0; min-height: 265px; align-items: center; justify-content: center; flex-direction: column; padding: 11px; border-radius: 11px; text-align: center; } .spar-qsp__diagram-layer--existing { border: 2px solid #919fa1; background: repeating-linear-gradient( 45deg, #d9e0e0, #d9e0e0 8px, #c9d2d2 8px, #c9d2d2 16px ); color: #40575b; } .spar-qsp__diagram-layer--gap { border: 1px dashed var(--spar-qsp-teal); background: #f5fbfa; color: var(--spar-qsp-medium); } .spar-qsp__diagram-layer--frame { border: 2px solid var(--spar-qsp-dark); background: linear-gradient( 90deg, transparent 0 25%, rgba(7, 52, 59, 0.17) 25% 35%, transparent 35% 65%, rgba(7, 52, 59, 0.17) 65% 75%, transparent 75% ), var(--spar-qsp-light); color: var(--spar-qsp-dark); } .spar-qsp__diagram-layer--materials { background: repeating-linear-gradient( 45deg, #dff3f1, #dff3f1 8px, #caeae7 8px, #caeae7 16px ); color: var(--spar-qsp-dark); } .spar-qsp__diagram-layer--mass { border: 2px solid var(--spar-qsp-dark); background: repeating-linear-gradient( 135deg, #cbeae8, #cbeae8 8px, #b4dfdb 8px, #b4dfdb 16px ); color: var(--spar-qsp-dark); } .spar-qsp__diagram-layer--room { background: var(--spar-qsp-dark); color: var(--spar-qsp-white); } .spar-qsp__diagram-layer > span { font-size: 0.64rem; font-weight: 900; line-height: 1.35; text-transform: uppercase; writing-mode: vertical-rl; transform: rotate(180deg); } .spar-qsp__diagram-layer small { margin-top: 10px; color: inherit; font-size: 0.7rem; font-weight: 750; line-height: 1.4; } .spar-qsp__diagram-measure { grid-column: 2 / 7; display: grid; grid-template-columns: minmax(20px, 1fr) auto minmax(20px, 1fr); align-items: center; gap: 10px; margin-top: 7px; } .spar-qsp__diagram-measure span { position: relative; height: 2px; background: var(--spar-qsp-orange); } .spar-qsp__diagram-measure span:first-child::before, .spar-qsp__diagram-measure span:last-child::after { content: ""; position: absolute; top: 50%; width: 8px; height: 8px; border-top: 2px solid var(--spar-qsp-orange); border-left: 2px solid var(--spar-qsp-orange); } .spar-qsp__diagram-measure span:first-child::before { left: 0; transform: translateY(-50%) rotate(-45deg); } .spar-qsp__diagram-measure span:last-child::after { right: 0; transform: translateY(-50%) rotate(135deg); } .spar-qsp__diagram-measure strong { color: var(--spar-qsp-orange-dark); font-size: 0.68rem; font-weight: 900; line-height: 1.3; text-align: center; text-transform: uppercase; } .spar-qsp__diagram-note { grid-column: 1 / -1; margin: 7px 0 0; color: var(--spar-qsp-muted); font-size: 0.74rem; line-height: 1.5; text-align: center; } /* ============================================================ CONFRONTO ============================================================ */ .spar-qsp__comparison-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 17px; margin-top: 32px; } .spar-qsp__comparison-card { min-width: 0; padding: 23px; border: 1px solid var(--spar-qsp-border); border-top: 5px solid #d56652; border-radius: 18px; background: var(--spar-qsp-white); box-shadow: 0 12px 30px rgba(6, 52, 59, 0.07); } .spar-qsp__comparison-card--correct { border-top-color: var(--spar-qsp-teal); } .spar-qsp__comparison-card--excess { border-top-color: var(--spar-qsp-orange); } .spar-qsp__comparison-symbol { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 13px; background: #fff0ed; color: #a23b2a; font-size: 1rem; font-weight: 900; } .spar-qsp__comparison-card--correct .spar-qsp__comparison-symbol { background: var(--spar-qsp-light); color: var(--spar-qsp-medium); } .spar-qsp__comparison-card--excess .spar-qsp__comparison-symbol { background: #fff0e2; color: var(--spar-qsp-orange-dark); } .spar-qsp__comparison-label { margin-top: 17px; margin-bottom: 0; font-size: 0.67rem; } .spar-qsp__comparison-card h4 { margin: 7px 0 0; color: var(--spar-qsp-dark); font-size: 1.07rem; font-weight: 900; line-height: 1.35; } .spar-qsp__comparison-card > p:last-child { margin: 10px 0 0; color: var(--spar-qsp-muted); font-size: 0.85rem; line-height: 1.62; } /* ============================================================ STANZA ============================================================ */ .spar-qsp__room-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; min-width: 0; } .spar-qsp__room-card { min-width: 0; padding: 19px; border: 1px solid var(--spar-qsp-border); border-radius: 16px; background: var(--spar-qsp-white); box-shadow: 0 11px 29px rgba(6, 52, 59, 0.07); } .spar-qsp__room-icon { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 14px; background: var(--spar-qsp-light); color: var(--spar-qsp-dark); } .spar-qsp__room-icon svg { width: 26px; height: 26px; } .spar-qsp__room-card h4 { margin: 15px 0 0; color: var(--spar-qsp-dark); font-size: 0.97rem; font-weight: 900; line-height: 1.35; } .spar-qsp__room-card p { margin: 7px 0 0; color: var(--spar-qsp-muted); font-size: 0.82rem; line-height: 1.57; } /* ============================================================ ERRORI ============================================================ */ .spar-qsp__mistakes { padding: clamp(27px, 4vw, 46px); border-radius: 24px; background: radial-gradient( circle at 96% 4%, rgba(36, 191, 193, 0.2), transparent 30% ), linear-gradient( 135deg, var(--spar-qsp-deep), var(--spar-qsp-dark) ); box-shadow: 0 24px 60px rgba(3, 35, 40, 0.2); } .spar-qsp__mistakes .spar-qsp__section-label { color: var(--spar-qsp-orange); } .spar-qsp__mistakes-content h3 { color: var(--spar-qsp-white); } .spar-qsp__mistakes-content > p:not(.spar-qsp__section-label) { color: rgba(255, 255, 255, 0.74); } .spar-qsp__mistakes-highlight { border-left-color: var(--spar-qsp-orange); background: rgba(255, 255, 255, 0.08); color: var(--spar-qsp-white) !important; } .spar-qsp__mistakes-list { display: grid; gap: 11px; min-width: 0; margin: 0; padding: 0; list-style: none; } .spar-qsp__mistakes-list li { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 11px; min-width: 0; padding: 14px; border: 1px solid rgba(255, 255, 255, 0.13); border-radius: 14px; background: rgba(255, 255, 255, 0.07); } .spar-qsp__mistakes-list li > span { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: rgba(255, 138, 42, 0.16); color: var(--spar-qsp-orange); font-size: 1rem; font-weight: 900; } .spar-qsp__mistakes-list li > div { min-width: 0; } .spar-qsp__mistakes-list strong { display: block; color: var(--spar-qsp-white); font-size: 0.89rem; font-weight: 900; line-height: 1.4; } .spar-qsp__mistakes-list p { margin: 5px 0 0; color: rgba(255, 255, 255, 0.67); font-size: 0.8rem; line-height: 1.52; } /* ============================================================ APPROFONDIMENTI ============================================================ */ .spar-qsp__topic-links { display: grid; gap: 14px; min-width: 0; } .spar-qsp__topic-link { display: grid; grid-template-columns: 52px minmax(0, 1fr) 32px; align-items: center; gap: 14px; min-width: 0; padding: 18px; border: 1px solid var(--spar-qsp-border); border-radius: 17px; background: var(--spar-qsp-white); color: var(--spar-qsp-dark); text-decoration: none; box-shadow: 0 11px 29px rgba(6, 52, 59, 0.07); transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease; } .spar-qsp__topic-link:hover { transform: translateY(-2px); border-color: var(--spar-qsp-teal); box-shadow: 0 16px 36px rgba(6, 52, 59, 0.11); } .spar-qsp__topic-link:focus-visible { outline: 3px solid var(--spar-qsp-orange); outline-offset: 4px; } .spar-qsp__topic-icon { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 15px; background: var(--spar-qsp-light); color: var(--spar-qsp-dark); } .spar-qsp__topic-icon svg { width: 29px; height: 29px; } .spar-qsp__topic-text { display: grid; min-width: 0; gap: 5px; } .spar-qsp__topic-text strong { color: var(--spar-qsp-dark); font-size: 0.96rem; font-weight: 900; line-height: 1.4; } .spar-qsp__topic-text small { color: var(--spar-qsp-muted); font-size: 0.8rem; line-height: 1.5; } .spar-qsp__topic-arrow { color: var(--spar-qsp-orange-dark); font-size: 1.35rem; font-weight: 900; } /* ============================================================ PROCESSO ============================================================ */ .spar-qsp__process-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 15px; margin: 31px 0 0; padding: 0; list-style: none; } .spar-qsp__process-list li { min-width: 0; padding: 20px; border: 1px solid var(--spar-qsp-border); border-radius: 17px; background: var(--spar-qsp-white); box-shadow: 0 11px 29px rgba(6, 52, 59, 0.07); } .spar-qsp__process-list li > span { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; background: var(--spar-qsp-dark); color: var(--spar-qsp-teal-light); font-size: 0.78rem; font-weight: 900; } .spar-qsp__process-list strong { display: block; margin-top: 16px; color: var(--spar-qsp-dark); font-size: 0.9rem; font-weight: 900; line-height: 1.4; } .spar-qsp__process-list p { margin: 7px 0 0; color: var(--spar-qsp-muted); font-size: 0.82rem; line-height: 1.57; } /* ============================================================ FIDUCIA ============================================================ */ .spar-qsp__trust { display: grid; grid-template-columns: 74px minmax(0, 1fr); align-items: center; gap: 23px; margin-top: clamp(44px, 6vw, 68px); padding: clamp(24px, 3vw, 35px); border: 1px solid rgba(255, 138, 42, 0.31); border-radius: 21px; background: #fff3e7; } .spar-qsp__trust-icon { display: grid; place-items: center; width: 70px; height: 70px; border-radius: 20px; background: var(--spar-qsp-orange); color: #321705; } .spar-qsp__trust-icon svg { width: 41px; height: 41px; } .spar-qsp__trust-content { min-width: 0; } .spar-qsp__trust h3 { font-size: clamp(1.3rem, 2.2vw, 1.85rem); } .spar-qsp__trust-content > p:last-child { margin: 10px 0 0; color: var(--spar-qsp-muted); font-size: 0.93rem; line-height: 1.66; } /* ============================================================ CTA ============================================================ */ .spar-qsp__conversion { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(330px, 0.92fr); align-items: center; gap: clamp(30px, 5vw, 64px); margin-top: clamp(52px, 7vw, 82px); padding: clamp(26px, 4vw, 45px); border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 23px; background: var(--spar-qsp-cream); box-shadow: var(--spar-qsp-shadow); } .spar-qsp__conversion-content { min-width: 0; } .spar-qsp__conversion-content > p:not(.spar-qsp__conversion-label) { margin: 15px 0 0; color: var(--spar-qsp-muted); font-size: 0.95rem; line-height: 1.69; } .spar-qsp__conversion-content > p + p { margin-top: 10px; } .spar-qsp__actions { display: grid; gap: 11px; min-width: 0; } .spar-qsp__button { display: flex; min-width: 0; min-height: 57px; align-items: center; justify-content: center; gap: 10px; padding: 13px 17px; border: 2px solid transparent; border-radius: 12px; font-family: inherit; font-size: 0.9rem; font-weight: 850; line-height: 1.3; text-align: center; text-decoration: none; transition: transform 180ms ease, background-color 180ms ease, border-color 180ms ease, box-shadow 180ms ease; } .spar-qsp__button:hover { transform: translateY(-2px); } .spar-qsp__button:focus-visible { outline: 3px solid var(--spar-qsp-dark); outline-offset: 4px; } .spar-qsp__button svg { flex: 0 0 23px; width: 23px; height: 23px; } .spar-qsp__button--primary { background: var(--spar-qsp-orange); color: #2c1504; box-shadow: 0 12px 27px rgba(255, 138, 42, 0.22); } .spar-qsp__button--primary:hover { background: #ff9b43; } .spar-qsp__button--whatsapp { background: var(--spar-qsp-green); color: var(--spar-qsp-white); box-shadow: 0 12px 27px rgba(39, 173, 104, 0.2); } .spar-qsp__button--whatsapp:hover { background: var(--spar-qsp-green-dark); } .spar-qsp__button--phone { border-color: rgba(7, 52, 59, 0.3); background: var(--spar-qsp-white); color: var(--spar-qsp-dark); } .spar-qsp__button--phone:hover { border-color: var(--spar-qsp-teal); background: var(--spar-qsp-light); } .spar-qsp__phone-text { display: grid; min-width: 0; gap: 1px; text-align: left; } .spar-qsp__phone-text small { font-size: 0.64rem; font-weight: 750; line-height: 1.1; letter-spacing: 0.055em; text-transform: uppercase; } .spar-qsp__phone-text strong { color: inherit; font-size: 1rem; font-weight: 900; line-height: 1.15; } /* ============================================================ NOTEBOOK E TABLET ORIZZONTALE ============================================================ */ @media (max-width: 1100px) { .spar-qsp__system, .spar-qsp__room, .spar-qsp__mistakes, .spar-qsp__topics, .spar-qsp__conversion { grid-template-columns: minmax(0, 1fr); } .spar-qsp__factors-grid, .spar-qsp__process-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-qsp__system-content, .spar-qsp__room-content, .spar-qsp__mistakes-content, .spar-qsp__topics-content, .spar-qsp__conversion-content { max-width: 850px; } .spar-qsp__diagram, .spar-qsp__room-grid, .spar-qsp__mistakes-list, .spar-qsp__topic-links { max-width: 850px; } .spar-qsp__actions { grid-template-columns: repeat(3, minmax(0, 1fr)); } } /* ============================================================ TABLET ============================================================ */ @media (max-width: 820px) { .spar-qsp__container { width: min(calc(100% - 32px), 780px); } .spar-qsp__answer { grid-template-columns: 60px minmax(0, 1fr); gap: 17px; } .spar-qsp__answer-icon { width: 58px; height: 58px; } .spar-qsp__comparison-grid { grid-template-columns: minmax(0, 1fr); } .spar-qsp__diagram { grid-template-columns: repeat(3, minmax(0, 1fr)); } .spar-qsp__diagram-layer { min-height: 170px; } .spar-qsp__diagram-layer > span { writing-mode: horizontal-tb; transform: none; } .spar-qsp__diagram-measure { grid-column: 1 / -1; } .spar-qsp__diagram-note { grid-column: 1 / -1; } .spar-qsp__actions { grid-template-columns: minmax(0, 1fr); } } /* ============================================================ MOBILE ============================================================ */ @media (max-width: 580px) { .spar-qsp { padding-block: 50px 62px; } .spar-qsp__container { width: calc(100% - 28px); } .spar-qsp__header, .spar-qsp__factors-header, .spar-qsp__comparison-header, .spar-qsp__process-header { text-align: left; } .spar-qsp__eyebrow, .spar-qsp__section-label, .spar-qsp__answer-label, .spar-qsp__comparison-label, .spar-qsp__trust-label, .spar-qsp__conversion-label { font-size: 0.67rem; letter-spacing: 0.06em; } .spar-qsp__title { font-size: clamp(1.86rem, 9.5vw, 2.65rem); line-height: 1.1; } .spar-qsp__direct-answer { font-size: 0.98rem; line-height: 1.63; } .spar-qsp__intro { font-size: 0.91rem; line-height: 1.66; } .spar-qsp__answer { grid-template-columns: minmax(0, 1fr); padding: 20px 17px; border-radius: 18px; } .spar-qsp__answer-icon { width: 52px; height: 52px; border-radius: 15px; } .spar-qsp__answer-icon svg { width: 32px; height: 32px; } .spar-qsp__factors-header h3, .spar-qsp__system-content h3, .spar-qsp__comparison-header h3, .spar-qsp__room-content h3, .spar-qsp__mistakes-content h3, .spar-qsp__topics-content h3, .spar-qsp__process-header h3, .spar-qsp__conversion h3 { font-size: clamp(1.42rem, 7.4vw, 1.92rem); } .spar-qsp__factors-grid, .spar-qsp__room-grid, .spar-qsp__process-list { grid-template-columns: minmax(0, 1fr); } .spar-qsp__factor, .spar-qsp__room-card, .spar-qsp__process-list li { padding: 18px 16px; border-radius: 16px; } .spar-qsp__diagram { grid-template-columns: minmax(0, 1fr); padding: 16px 13px; border-radius: 18px; } .spar-qsp__diagram-layer { min-height: auto; padding: 15px; } .spar-qsp__diagram-measure { grid-column: auto; } .spar-qsp__diagram-measure strong { font-size: 0.59rem; } .spar-qsp__diagram-note { grid-column: auto; } .spar-qsp__comparison-card { padding: 19px 17px; border-radius: 16px; } .spar-qsp__mistakes { padding: 22px 17px; border-radius: 19px; } .spar-qsp__mistakes-list li { grid-template-columns: 38px minmax(0, 1fr); padding: 12px; } .spar-qsp__mistakes-list li > span { width: 38px; height: 38px; } .spar-qsp__topic-link { grid-template-columns: 47px minmax(0, 1fr); padding: 15px; } .spar-qsp__topic-icon { width: 47px; height: 47px; } .spar-qsp__topic-arrow { display: none; } .spar-qsp__trust { grid-template-columns: minmax(0, 1fr); align-items: start; gap: 15px; padding: 21px 17px; border-radius: 18px; } .spar-qsp__trust-icon { width: 54px; height: 54px; border-radius: 15px; } .spar-qsp__trust-icon svg { width: 31px; height: 31px; } .spar-qsp__trust h3 { font-size: 1.27rem; } .spar-qsp__conversion { padding: 22px 17px; border-radius: 19px; } .spar-qsp__button { width: 100%; min-height: 57px; padding-inline: 13px; font-size: 0.86rem; } } /* ============================================================ SMARTPHONE MOLTO STRETTI ============================================================ */ @media (max-width: 380px) { .spar-qsp__container { width: calc(100% - 22px); } .spar-qsp__title { font-size: 1.72rem; } .spar-qsp__factor, .spar-qsp__diagram, .spar-qsp__comparison-card, .spar-qsp__room-card, .spar-qsp__mistakes, .spar-qsp__topic-link, .spar-qsp__process-list li, .spar-qsp__trust, .spar-qsp__conversion { padding-inline: 14px; } .spar-qsp__button { gap: 8px; padding-inline: 10px; font-size: 0.82rem; } .spar-qsp__button svg { flex-basis: 21px; width: 21px; height: 21px; } } /* ============================================================ ACCESSIBILITÀ ============================================================ */ @media (prefers-reduced-motion: reduce) { .spar-qsp__button, .spar-qsp__topic-link { transition: none; } .spar-qsp__button:hover, .spar-qsp__topic-link:hover { transform: none; } } /* ============================================================ STAMPA ============================================================ */ @media print { .spar-qsp { padding: 30px 0; background: #ffffff; } .spar-qsp__mistakes { border: 1px solid var(--spar-qsp-border); background: #ffffff; box-shadow: none; } .spar-qsp__mistakes-content h3, .spar-qsp__mistakes-list strong { color: var(--spar-qsp-dark); } .spar-qsp__mistakes-content > p:not(.spar-qsp__section-label), .spar-qsp__mistakes-list p { color: var(--spar-qsp-muted); } .spar-qsp__actions { display: none; } }#imCell_24 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHTMLObject_1726_24 { position: relative; align-self: start; justify-self: center; max-width: 100%; box-sizing: border-box; z-index: 3; } #imCellStyleGraphics_24 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imCellStyleBorders_24 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } /* ============================================================ H3 — DA COSA DIPENDE LO SPESSORE Pagina: /isolamento-acustico-pareti-roma.html ============================================================ */ .spar-dsp, .spar-dsp *, .spar-dsp *::before, .spar-dsp *::after { box-sizing: border-box; } .spar-dsp { --spar-dsp-dark: #07343b; --spar-dsp-deep: #05282e; --spar-dsp-medium: #0b5159; --spar-dsp-teal: #24bfc1; --spar-dsp-teal-light: #d9f4f2; --spar-dsp-orange: #ff8a2a; --spar-dsp-orange-dark: #c85c0a; --spar-dsp-green: #27ad68; --spar-dsp-green-dark: #19864f; --spar-dsp-white: #ffffff; --spar-dsp-cream: #fff8ed; --spar-dsp-light: #edf8f7; --spar-dsp-text: #173c41; --spar-dsp-muted: #557277; --spar-dsp-border: #d4e6e4; --spar-dsp-shadow: 0 20px 52px rgba(6, 52, 59, 0.1); width: 100%; max-width: 100%; overflow: hidden; padding-block: clamp(64px, 8vw, 105px); background: radial-gradient( circle at 96% 6%, rgba(36, 191, 193, 0.11), transparent 27% ), radial-gradient( circle at 5% 94%, rgba(255, 138, 42, 0.09), transparent 25% ), var(--spar-dsp-cream); color: var(--spar-dsp-text); } .spar-dsp h3, .spar-dsp h4, .spar-dsp h5, .spar-dsp p, .spar-dsp li, .spar-dsp span, .spar-dsp strong, .spar-dsp small, .spar-dsp a { max-width: 100%; white-space: normal; overflow-wrap: break-word; word-break: normal; } .spar-dsp__container { width: min(calc(100% - 40px), 1220px); max-width: 1220px; margin-inline: auto; } /* ============================================================ HEADER ============================================================ */ .spar-dsp__header { width: min(100%, 960px); margin-inline: auto; text-align: center; } .spar-dsp__eyebrow, .spar-dsp__section-label, .spar-dsp__answer-label, .spar-dsp__trust-label, .spar-dsp__conversion-label { margin: 0 0 12px; color: var(--spar-dsp-orange-dark); font-size: 0.74rem; font-weight: 900; line-height: 1.4; letter-spacing: 0.075em; text-transform: uppercase; } .spar-dsp__title { margin: 0; color: var(--spar-dsp-dark); font-size: clamp(1.95rem, 4.1vw, 3.4rem); font-weight: 900; line-height: 1.08; letter-spacing: -0.04em; text-wrap: balance; } .spar-dsp__direct-answer { margin: 24px auto 0; color: var(--spar-dsp-dark); font-size: clamp(1.04rem, 1.5vw, 1.2rem); font-weight: 650; line-height: 1.7; } .spar-dsp__direct-answer strong { color: inherit; font-weight: 900; } .spar-dsp__intro { margin: 14px auto 0; color: var(--spar-dsp-muted); font-size: 1rem; line-height: 1.72; } /* ============================================================ RISPOSTA DIRETTA ============================================================ */ .spar-dsp__answer { display: grid; grid-template-columns: 76px minmax(0, 1fr); align-items: center; gap: 22px; width: min(100%, 1000px); margin: clamp(35px, 5vw, 56px) auto 0; padding: clamp(22px, 3vw, 33px); border: 1px solid rgba(36, 191, 193, 0.28); border-radius: 22px; background: var(--spar-dsp-white); box-shadow: var(--spar-dsp-shadow); } .spar-dsp__answer-icon { display: grid; place-items: center; width: 70px; height: 70px; border-radius: 19px; background: var(--spar-dsp-dark); color: var(--spar-dsp-teal-light); } .spar-dsp__answer-icon svg { width: 42px; height: 42px; } .spar-dsp__answer-content { min-width: 0; } .spar-dsp__answer-content h4 { margin: 0; color: var(--spar-dsp-dark); font-size: clamp(1.2rem, 2vw, 1.6rem); font-weight: 900; line-height: 1.3; } .spar-dsp__answer-content > p:last-child { margin: 9px 0 0; color: var(--spar-dsp-muted); font-size: 0.95rem; line-height: 1.66; } /* ============================================================ TITOLI INTERNI ============================================================ */ .spar-dsp__factors-header h4, .spar-dsp__system-content h4, .spar-dsp__existing-content h4, .spar-dsp__noise-content h4, .spar-dsp__space-content h4, .spar-dsp__misconceptions-content h4, .spar-dsp__checks-header h4, .spar-dsp__process-content h4, .spar-dsp__trust h4, .spar-dsp__conversion h4 { margin: 0; color: var(--spar-dsp-dark); font-size: clamp(1.45rem, 2.8vw, 2.25rem); font-weight: 900; line-height: 1.2; letter-spacing: -0.03em; text-wrap: balance; } /* ============================================================ FATTORI ============================================================ */ .spar-dsp__factors, .spar-dsp__checks { margin-top: clamp(58px, 8vw, 92px); } .spar-dsp__factors-header, .spar-dsp__checks-header { width: min(100%, 880px); margin-inline: auto; text-align: center; } .spar-dsp__factors-header > p:last-child, .spar-dsp__checks-header > p:last-child { margin: 16px auto 0; color: var(--spar-dsp-muted); font-size: 0.97rem; line-height: 1.7; } .spar-dsp__factors-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 17px; margin-top: 32px; } .spar-dsp__factor { display: flex; min-width: 0; flex-direction: column; padding: 22px; border: 1px solid var(--spar-dsp-border); border-top: 5px solid var(--spar-dsp-dark); border-radius: 18px; background: var(--spar-dsp-white); box-shadow: 0 12px 30px rgba(6, 52, 59, 0.07); } .spar-dsp__factor--teal { border-top-color: var(--spar-dsp-teal); } .spar-dsp__factor--orange { border-top-color: var(--spar-dsp-orange); } .spar-dsp__factor--green { border-top-color: var(--spar-dsp-green); } .spar-dsp__factor--blue { border-top-color: var(--spar-dsp-medium); } .spar-dsp__factor--cream { border-top-color: #d6a33a; } .spar-dsp__factor-top { display: flex; align-items: center; justify-content: space-between; gap: 14px; } .spar-dsp__factor-number { color: rgba(7, 52, 59, 0.23); font-size: 1.55rem; font-weight: 950; line-height: 1; } .spar-dsp__factor-icon { display: grid; flex: 0 0 48px; place-items: center; width: 48px; height: 48px; border-radius: 14px; background: var(--spar-dsp-light); color: var(--spar-dsp-dark); } .spar-dsp__factor-icon svg { width: 27px; height: 27px; } .spar-dsp__factor h5 { margin: 18px 0 0; color: var(--spar-dsp-dark); font-size: 1.03rem; font-weight: 900; line-height: 1.35; } .spar-dsp__factor > p { margin: 9px 0 0; color: var(--spar-dsp-muted); font-size: 0.85rem; line-height: 1.62; } .spar-dsp__factor-note { margin-top: auto !important; padding-top: 14px; border-top: 1px solid var(--spar-dsp-border); color: var(--spar-dsp-dark) !important; font-weight: 750; } /* ============================================================ BLOCCHI A DUE COLONNE ============================================================ */ .spar-dsp__system, .spar-dsp__existing, .spar-dsp__noise, .spar-dsp__space, .spar-dsp__misconceptions, .spar-dsp__process { display: grid; grid-template-columns: minmax(0, 0.92fr) minmax(430px, 1.08fr); align-items: center; gap: clamp(35px, 5vw, 66px); margin-top: clamp(58px, 8vw, 92px); } .spar-dsp__system { grid-template-columns: minmax(500px, 1.12fr) minmax(0, 0.88fr); } .spar-dsp__space { grid-template-columns: minmax(430px, 1.08fr) minmax(0, 0.92fr); } .spar-dsp__system-content, .spar-dsp__existing-content, .spar-dsp__noise-content, .spar-dsp__space-content, .spar-dsp__misconceptions-content, .spar-dsp__process-content { min-width: 0; } .spar-dsp__system-content > p:not(.spar-dsp__section-label), .spar-dsp__existing-content > p:not(.spar-dsp__section-label), .spar-dsp__noise-content > p:not(.spar-dsp__section-label), .spar-dsp__space-content > p:not(.spar-dsp__section-label), .spar-dsp__misconceptions-content > p:not(.spar-dsp__section-label), .spar-dsp__process-content > p:not(.spar-dsp__section-label) { margin: 17px 0 0; color: var(--spar-dsp-muted); font-size: 0.97rem; line-height: 1.7; } .spar-dsp__system-content > p + p, .spar-dsp__existing-content > p + p, .spar-dsp__noise-content > p + p, .spar-dsp__space-content > p + p, .spar-dsp__misconceptions-content > p + p, .spar-dsp__process-content > p + p { margin-top: 11px; } .spar-dsp__system-highlight, .spar-dsp__existing-highlight, .spar-dsp__noise-highlight, .spar-dsp__space-highlight, .spar-dsp__misconceptions-highlight { padding: 15px 17px; border-left: 4px solid var(--spar-dsp-orange); border-radius: 0 12px 12px 0; background: #fff0e2; color: var(--spar-dsp-dark) !important; font-weight: 750; } /* ============================================================ DIAGRAMMA ============================================================ */ .spar-dsp__diagram { display: grid; grid-template-columns: minmax(82px, 1fr) minmax(68px, 0.75fr) minmax(86px, 0.9fr) minmax(92px, 1fr) minmax(102px, 1.08fr) minmax(88px, 0.95fr); gap: 7px; min-width: 0; padding: 20px; border: 1px solid rgba(36, 191, 193, 0.26); border-radius: 21px; background: var(--spar-dsp-white); box-shadow: var(--spar-dsp-shadow); } .spar-dsp__diagram-layer { display: flex; min-width: 0; min-height: 265px; align-items: center; justify-content: center; flex-direction: column; padding: 11px; border-radius: 11px; text-align: center; } .spar-dsp__diagram-layer--existing { border: 2px solid #919fa1; background: repeating-linear-gradient( 45deg, #d9e0e0, #d9e0e0 8px, #c9d2d2 8px, #c9d2d2 16px ); color: #40575b; } .spar-dsp__diagram-layer--distance { border: 1px dashed var(--spar-dsp-orange); background: #fff8ed; color: var(--spar-dsp-orange-dark); } .spar-dsp__diagram-layer--frame { border: 2px solid var(--spar-dsp-dark); background: linear-gradient( 90deg, transparent 0 25%, rgba(7, 52, 59, 0.17) 25% 35%, transparent 35% 65%, rgba(7, 52, 59, 0.17) 65% 75%, transparent 75% ), var(--spar-dsp-light); color: var(--spar-dsp-dark); } .spar-dsp__diagram-layer--cavity { background: repeating-linear-gradient( 45deg, #dff3f1, #dff3f1 8px, #caeae7 8px, #caeae7 16px ); color: var(--spar-dsp-dark); } .spar-dsp__diagram-layer--layers { border: 2px solid var(--spar-dsp-dark); background: repeating-linear-gradient( 135deg, #cbeae8, #cbeae8 8px, #b4dfdb 8px, #b4dfdb 16px ); color: var(--spar-dsp-dark); } .spar-dsp__diagram-layer--finish { background: var(--spar-dsp-dark); color: var(--spar-dsp-white); } .spar-dsp__diagram-layer > span { font-size: 0.64rem; font-weight: 900; line-height: 1.35; text-transform: uppercase; writing-mode: vertical-rl; transform: rotate(180deg); } .spar-dsp__diagram-layer small { margin-top: 10px; color: inherit; font-size: 0.7rem; font-weight: 750; line-height: 1.4; } .spar-dsp__diagram-measure { grid-column: 2 / 7; display: grid; grid-template-columns: minmax(20px, 1fr) auto minmax(20px, 1fr); align-items: center; gap: 10px; margin-top: 7px; } .spar-dsp__diagram-measure span { position: relative; height: 2px; background: var(--spar-dsp-orange); } .spar-dsp__diagram-measure strong { color: var(--spar-dsp-orange-dark); font-size: 0.67rem; font-weight: 900; line-height: 1.3; text-align: center; text-transform: uppercase; } .spar-dsp__diagram-note { grid-column: 1 / -1; margin: 7px 0 0; color: var(--spar-dsp-muted); font-size: 0.74rem; line-height: 1.5; text-align: center; } /* ============================================================ PARETE ESISTENTE ============================================================ */ .spar-dsp__existing-grid, .spar-dsp__noise-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; min-width: 0; } .spar-dsp__existing-card, .spar-dsp__noise-card { min-width: 0; padding: 19px; border: 1px solid var(--spar-dsp-border); border-radius: 16px; background: var(--spar-dsp-white); box-shadow: 0 11px 29px rgba(6, 52, 59, 0.07); } .spar-dsp__existing-card > span { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; background: var(--spar-dsp-light); color: var(--spar-dsp-dark); font-size: 0.78rem; font-weight: 900; } .spar-dsp__existing-card h5, .spar-dsp__noise-card h5 { margin: 14px 0 0; color: var(--spar-dsp-dark); font-size: 0.97rem; font-weight: 900; line-height: 1.35; } .spar-dsp__existing-card p, .spar-dsp__noise-card p { margin: 7px 0 0; color: var(--spar-dsp-muted); font-size: 0.82rem; line-height: 1.57; } /* ============================================================ TIPO DI RUMORE ============================================================ */ .spar-dsp__noise { padding: clamp(27px, 4vw, 46px); border-radius: 24px; background: radial-gradient( circle at 96% 4%, rgba(36, 191, 193, 0.2), transparent 30% ), linear-gradient( 135deg, var(--spar-dsp-deep), var(--spar-dsp-dark) ); box-shadow: 0 24px 60px rgba(3, 35, 40, 0.2); } .spar-dsp__noise .spar-dsp__section-label { color: var(--spar-dsp-orange); } .spar-dsp__noise-content h4 { color: var(--spar-dsp-white); } .spar-dsp__noise-content > p:not(.spar-dsp__section-label) { color: rgba(255, 255, 255, 0.74); } .spar-dsp__noise-highlight { border-left-color: var(--spar-dsp-orange); background: rgba(255, 255, 255, 0.08); color: var(--spar-dsp-white) !important; } .spar-dsp__noise-card { border-color: rgba(255, 255, 255, 0.14); background: rgba(255, 255, 255, 0.08); box-shadow: none; } .spar-dsp__noise-icon { display: grid; place-items: center; width: 43px; height: 43px; border-radius: 13px; background: rgba(36, 191, 193, 0.16); color: var(--spar-dsp-teal-light); font-size: 0.75rem; font-weight: 900; } .spar-dsp__noise-card h5 { color: var(--spar-dsp-white); } .spar-dsp__noise-card p { color: rgba(255, 255, 255, 0.68); } /* ============================================================ SPAZIO DISPONIBILE ============================================================ */ .spar-dsp__space-visual { min-width: 0; padding: 22px; border: 1px solid rgba(36, 191, 193, 0.27); border-radius: 21px; background: var(--spar-dsp-white); box-shadow: var(--spar-dsp-shadow); } .spar-dsp__space-room { position: relative; min-height: 335px; overflow: hidden; border: 14px solid #d2dddd; border-radius: 13px; background: var(--spar-dsp-light); } .spar-dsp__space-wall, .spar-dsp__space-counterwall, .spar-dsp__space-furniture, .spar-dsp__space-passage { position: absolute; display: grid; place-items: center; padding: 8px; font-size: 0.66rem; font-weight: 900; line-height: 1.3; text-align: center; text-transform: uppercase; } .spar-dsp__space-wall { top: 0; right: 0; bottom: 0; width: 18%; background: repeating-linear-gradient( 45deg, #d9e0e0, #d9e0e0 8px, #c9d2d2 8px, #c9d2d2 16px ); color: #40575b; writing-mode: vertical-rl; transform: rotate(180deg); } .spar-dsp__space-counterwall { top: 0; right: 18%; bottom: 0; width: 17%; background: repeating-linear-gradient( 135deg, #cbeae8, #cbeae8 8px, #b5dfdc 8px, #b5dfdc 16px ); color: var(--spar-dsp-dark); writing-mode: vertical-rl; transform: rotate(180deg); } .spar-dsp__space-furniture { right: 43%; bottom: 23px; width: 40%; height: 100px; border: 2px solid var(--spar-dsp-dark); border-radius: 11px; background: var(--spar-dsp-white); color: var(--spar-dsp-dark); } .spar-dsp__space-passage { top: 42px; right: 41%; left: 7%; min-height: 75px; border: 2px dashed var(--spar-dsp-orange); border-radius: 11px; color: var(--spar-dsp-orange-dark); } .spar-dsp__space-visual > p { margin: 15px 0 0; color: var(--spar-dsp-muted); font-size: 0.75rem; line-height: 1.5; text-align: center; } /* ============================================================ FALSE CONVINZIONI ============================================================ */ .spar-dsp__misconceptions { padding: clamp(27px, 4vw, 46px); border-radius: 24px; background: radial-gradient( circle at 96% 4%, rgba(36, 191, 193, 0.2), transparent 30% ), linear-gradient( 135deg, var(--spar-dsp-deep), var(--spar-dsp-dark) ); box-shadow: 0 24px 60px rgba(3, 35, 40, 0.2); } .spar-dsp__misconceptions .spar-dsp__section-label { color: var(--spar-dsp-orange); } .spar-dsp__misconceptions-content h4 { color: var(--spar-dsp-white); } .spar-dsp__misconceptions-content > p:not(.spar-dsp__section-label) { color: rgba(255, 255, 255, 0.74); } .spar-dsp__misconceptions-highlight { border-left-color: var(--spar-dsp-orange); background: rgba(255, 255, 255, 0.08); color: var(--spar-dsp-white) !important; } .spar-dsp__misconceptions-list { display: grid; gap: 11px; min-width: 0; margin: 0; padding: 0; list-style: none; } .spar-dsp__misconceptions-list li { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 11px; min-width: 0; padding: 14px; border: 1px solid rgba(255, 255, 255, 0.13); border-radius: 14px; background: rgba(255, 255, 255, 0.07); } .spar-dsp__misconceptions-list li > span { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: rgba(255, 138, 42, 0.16); color: var(--spar-dsp-orange); font-size: 1rem; font-weight: 900; } .spar-dsp__misconceptions-list li > div { min-width: 0; } .spar-dsp__misconceptions-list strong { display: block; color: var(--spar-dsp-white); font-size: 0.89rem; font-weight: 900; line-height: 1.4; } .spar-dsp__misconceptions-list p { margin: 5px 0 0; color: rgba(255, 255, 255, 0.67); font-size: 0.8rem; line-height: 1.52; } /* ============================================================ VERIFICHE ============================================================ */ .spar-dsp__checks-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; margin: 31px 0 0; padding: 0; list-style: none; } .spar-dsp__checks-list li { min-width: 0; padding: 20px; border: 1px solid var(--spar-dsp-border); border-radius: 17px; background: var(--spar-dsp-white); box-shadow: 0 11px 29px rgba(6, 52, 59, 0.07); } .spar-dsp__checks-list li > span { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; background: var(--spar-dsp-dark); color: var(--spar-dsp-teal-light); font-size: 0.78rem; font-weight: 900; } .spar-dsp__checks-list strong { display: block; margin-top: 16px; color: var(--spar-dsp-dark); font-size: 0.9rem; font-weight: 900; line-height: 1.4; } .spar-dsp__checks-list p { margin: 7px 0 0; color: var(--spar-dsp-muted); font-size: 0.82rem; line-height: 1.57; } /* ============================================================ PROCESSO ============================================================ */ .spar-dsp__process { grid-template-columns: minmax(0, 0.84fr) minmax(440px, 1.16fr); } .spar-dsp__process-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; min-width: 0; margin: 0; padding: 0; list-style: none; } .spar-dsp__process-list li { display: grid; grid-template-columns: 42px minmax(0, 1fr); gap: 12px; min-width: 0; padding: 15px; border: 1px solid var(--spar-dsp-border); border-radius: 15px; background: var(--spar-dsp-white); box-shadow: 0 10px 27px rgba(6, 52, 59, 0.07); } .spar-dsp__process-list li > span { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; background: var(--spar-dsp-dark); color: var(--spar-dsp-teal-light); font-size: 0.78rem; font-weight: 900; } .spar-dsp__process-list li > div { min-width: 0; } .spar-dsp__process-list strong { display: block; color: var(--spar-dsp-dark); font-size: 0.9rem; font-weight: 900; line-height: 1.4; } .spar-dsp__process-list p { margin: 5px 0 0; color: var(--spar-dsp-muted); font-size: 0.81rem; line-height: 1.55; } /* ============================================================ FIDUCIA ============================================================ */ .spar-dsp__trust { display: grid; grid-template-columns: 74px minmax(0, 1fr); align-items: center; gap: 23px; margin-top: clamp(44px, 6vw, 68px); padding: clamp(24px, 3vw, 35px); border: 1px solid rgba(255, 138, 42, 0.31); border-radius: 21px; background: #fff3e7; } .spar-dsp__trust-icon { display: grid; place-items: center; width: 70px; height: 70px; border-radius: 20px; background: var(--spar-dsp-orange); color: #321705; } .spar-dsp__trust-icon svg { width: 41px; height: 41px; } .spar-dsp__trust-content { min-width: 0; } .spar-dsp__trust h4 { font-size: clamp(1.3rem, 2.2vw, 1.85rem); } .spar-dsp__trust-content > p:last-child { margin: 10px 0 0; color: var(--spar-dsp-muted); font-size: 0.93rem; line-height: 1.66; } /* ============================================================ CTA ============================================================ */ .spar-dsp__conversion { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(330px, 0.92fr); align-items: center; gap: clamp(30px, 5vw, 64px); margin-top: clamp(52px, 7vw, 82px); padding: clamp(26px, 4vw, 45px); border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 23px; background: var(--spar-dsp-white); box-shadow: var(--spar-dsp-shadow); } .spar-dsp__conversion-content { min-width: 0; } .spar-dsp__conversion-content > p:not(.spar-dsp__conversion-label) { margin: 15px 0 0; color: var(--spar-dsp-muted); font-size: 0.95rem; line-height: 1.69; } .spar-dsp__conversion-content > p + p { margin-top: 10px; } .spar-dsp__actions { display: grid; gap: 11px; min-width: 0; } .spar-dsp__button { display: flex; min-width: 0; min-height: 57px; align-items: center; justify-content: center; gap: 10px; padding: 13px 17px; border: 2px solid transparent; border-radius: 12px; font-family: inherit; font-size: 0.9rem; font-weight: 850; line-height: 1.3; text-align: center; text-decoration: none; transition: transform 180ms ease, background-color 180ms ease, border-color 180ms ease, box-shadow 180ms ease; } .spar-dsp__button:hover { transform: translateY(-2px); } .spar-dsp__button:focus-visible { outline: 3px solid var(--spar-dsp-dark); outline-offset: 4px; } .spar-dsp__button svg { flex: 0 0 23px; width: 23px; height: 23px; } .spar-dsp__button--primary { background: var(--spar-dsp-orange); color: #2c1504; box-shadow: 0 12px 27px rgba(255, 138, 42, 0.22); } .spar-dsp__button--primary:hover { background: #ff9b43; } .spar-dsp__button--whatsapp { background: var(--spar-dsp-green); color: var(--spar-dsp-white); box-shadow: 0 12px 27px rgba(39, 173, 104, 0.2); } .spar-dsp__button--whatsapp:hover { background: var(--spar-dsp-green-dark); } .spar-dsp__button--phone { border-color: rgba(7, 52, 59, 0.3); background: var(--spar-dsp-white); color: var(--spar-dsp-dark); } .spar-dsp__button--phone:hover { border-color: var(--spar-dsp-teal); background: var(--spar-dsp-light); } .spar-dsp__phone-text { display: grid; min-width: 0; gap: 1px; text-align: left; } .spar-dsp__phone-text small { font-size: 0.64rem; font-weight: 750; line-height: 1.1; letter-spacing: 0.055em; text-transform: uppercase; } .spar-dsp__phone-text strong { color: inherit; font-size: 1rem; font-weight: 900; line-height: 1.15; } /* ============================================================ NOTEBOOK E TABLET ORIZZONTALE ============================================================ */ @media (max-width: 1100px) { .spar-dsp__system, .spar-dsp__existing, .spar-dsp__noise, .spar-dsp__space, .spar-dsp__misconceptions, .spar-dsp__process, .spar-dsp__conversion { grid-template-columns: minmax(0, 1fr); } .spar-dsp__factors-grid, .spar-dsp__checks-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-dsp__system-content, .spar-dsp__existing-content, .spar-dsp__noise-content, .spar-dsp__space-content, .spar-dsp__misconceptions-content, .spar-dsp__process-content, .spar-dsp__conversion-content { max-width: 850px; } .spar-dsp__diagram, .spar-dsp__existing-grid, .spar-dsp__noise-grid, .spar-dsp__space-visual, .spar-dsp__misconceptions-list, .spar-dsp__process-list { max-width: 850px; } .spar-dsp__actions { grid-template-columns: repeat(3, minmax(0, 1fr)); } } /* ============================================================ TABLET ============================================================ */ @media (max-width: 820px) { .spar-dsp__container { width: min(calc(100% - 32px), 780px); } .spar-dsp__answer { grid-template-columns: 60px minmax(0, 1fr); gap: 17px; } .spar-dsp__answer-icon { width: 58px; height: 58px; } .spar-dsp__diagram { grid-template-columns: repeat(3, minmax(0, 1fr)); } .spar-dsp__diagram-layer { min-height: 170px; } .spar-dsp__diagram-layer > span { writing-mode: horizontal-tb; transform: none; } .spar-dsp__diagram-measure, .spar-dsp__diagram-note { grid-column: 1 / -1; } .spar-dsp__actions { grid-template-columns: minmax(0, 1fr); } } /* ============================================================ MOBILE ============================================================ */ @media (max-width: 580px) { .spar-dsp { padding-block: 50px 62px; } .spar-dsp__container { width: calc(100% - 28px); } .spar-dsp__header, .spar-dsp__factors-header, .spar-dsp__checks-header { text-align: left; } .spar-dsp__eyebrow, .spar-dsp__section-label, .spar-dsp__answer-label, .spar-dsp__trust-label, .spar-dsp__conversion-label { font-size: 0.67rem; letter-spacing: 0.06em; } .spar-dsp__title { font-size: clamp(1.84rem, 9.4vw, 2.6rem); line-height: 1.1; } .spar-dsp__direct-answer { font-size: 0.98rem; line-height: 1.63; } .spar-dsp__intro { font-size: 0.91rem; line-height: 1.66; } .spar-dsp__answer { grid-template-columns: minmax(0, 1fr); padding: 20px 17px; border-radius: 18px; } .spar-dsp__answer-icon { width: 52px; height: 52px; border-radius: 15px; } .spar-dsp__answer-icon svg { width: 32px; height: 32px; } .spar-dsp__factors-header h4, .spar-dsp__system-content h4, .spar-dsp__existing-content h4, .spar-dsp__noise-content h4, .spar-dsp__space-content h4, .spar-dsp__misconceptions-content h4, .spar-dsp__checks-header h4, .spar-dsp__process-content h4, .spar-dsp__conversion h4 { font-size: clamp(1.42rem, 7.4vw, 1.92rem); } .spar-dsp__factors-grid, .spar-dsp__existing-grid, .spar-dsp__noise-grid, .spar-dsp__checks-list, .spar-dsp__process-list { grid-template-columns: minmax(0, 1fr); } .spar-dsp__factor, .spar-dsp__existing-card, .spar-dsp__noise-card, .spar-dsp__checks-list li, .spar-dsp__process-list li { padding: 18px 16px; border-radius: 16px; } .spar-dsp__diagram { grid-template-columns: minmax(0, 1fr); padding: 16px 13px; border-radius: 18px; } .spar-dsp__diagram-layer { min-height: auto; padding: 15px; } .spar-dsp__diagram-measure, .spar-dsp__diagram-note { grid-column: auto; } .spar-dsp__diagram-measure strong { font-size: 0.59rem; } .spar-dsp__noise, .spar-dsp__misconceptions { padding: 22px 17px; border-radius: 19px; } .spar-dsp__space-visual { padding: 16px; border-radius: 18px; } .spar-dsp__space-room { min-height: 285px; border-width: 11px; } .spar-dsp__space-wall, .spar-dsp__space-counterwall { font-size: 0.57rem; } .spar-dsp__space-furniture { right: 43%; width: 48%; height: 88px; font-size: 0.59rem; } .spar-dsp__space-passage { right: 39%; left: 5%; font-size: 0.58rem; } .spar-dsp__misconceptions-list li { grid-template-columns: 38px minmax(0, 1fr); padding: 12px; } .spar-dsp__misconceptions-list li > span { width: 38px; height: 38px; } .spar-dsp__trust { grid-template-columns: minmax(0, 1fr); align-items: start; gap: 15px; padding: 21px 17px; border-radius: 18px; } .spar-dsp__trust-icon { width: 54px; height: 54px; border-radius: 15px; } .spar-dsp__trust-icon svg { width: 31px; height: 31px; } .spar-dsp__trust h4 { font-size: 1.27rem; } .spar-dsp__conversion { padding: 22px 17px; border-radius: 19px; } .spar-dsp__button { width: 100%; min-height: 57px; padding-inline: 13px; font-size: 0.86rem; } } /* ============================================================ SMARTPHONE MOLTO STRETTI ============================================================ */ @media (max-width: 380px) { .spar-dsp__container { width: calc(100% - 22px); } .spar-dsp__title { font-size: 1.71rem; } .spar-dsp__factor, .spar-dsp__diagram, .spar-dsp__existing-card, .spar-dsp__noise, .spar-dsp__noise-card, .spar-dsp__space-visual, .spar-dsp__misconceptions, .spar-dsp__checks-list li, .spar-dsp__process-list li, .spar-dsp__trust, .spar-dsp__conversion { padding-inline: 14px; } .spar-dsp__button { gap: 8px; padding-inline: 10px; font-size: 0.82rem; } .spar-dsp__button svg { flex-basis: 21px; width: 21px; height: 21px; } } /* ============================================================ ACCESSIBILITÀ ============================================================ */ @media (prefers-reduced-motion: reduce) { .spar-dsp__button { transition: none; } .spar-dsp__button:hover { transform: none; } } /* ============================================================ STAMPA ============================================================ */ @media print { .spar-dsp { padding: 30px 0; background: #ffffff; } .spar-dsp__noise, .spar-dsp__misconceptions { border: 1px solid var(--spar-dsp-border); background: #ffffff; box-shadow: none; } .spar-dsp__noise-content h4, .spar-dsp__misconceptions-content h4, .spar-dsp__noise-card h5, .spar-dsp__misconceptions-list strong { color: var(--spar-dsp-dark); } .spar-dsp__noise-content > p:not(.spar-dsp__section-label), .spar-dsp__misconceptions-content > p:not(.spar-dsp__section-label), .spar-dsp__noise-card p, .spar-dsp__misconceptions-list p { color: var(--spar-dsp-muted); } .spar-dsp__actions { display: none; } }#imCell_25 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHTMLObject_1726_25 { position: relative; align-self: start; justify-self: center; max-width: 100%; box-sizing: border-box; z-index: 3; } #imCellStyleGraphics_25 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imCellStyleBorders_25 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } /* ============================================================ H3 — PERCHÉ UNO SPESSORE RIDOTTO NON GARANTISCE SEMPRE IL RISULTATO Pagina: /isolamento-acustico-pareti-roma.html ============================================================ */ .spar-srn, .spar-srn *, .spar-srn *::before, .spar-srn *::after { box-sizing: border-box; } .spar-srn { --spar-srn-dark: #07343b; --spar-srn-deep: #05282e; --spar-srn-medium: #0b5159; --spar-srn-teal: #24bfc1; --spar-srn-teal-light: #d9f4f2; --spar-srn-orange: #ff8a2a; --spar-srn-orange-dark: #c85c0a; --spar-srn-green: #27ad68; --spar-srn-green-dark: #19864f; --spar-srn-white: #ffffff; --spar-srn-cream: #fff8ed; --spar-srn-light: #edf8f7; --spar-srn-text: #173c41; --spar-srn-muted: #557277; --spar-srn-border: #d4e6e4; --spar-srn-danger: #d56652; --spar-srn-shadow: 0 20px 52px rgba(6, 52, 59, 0.1); width: 100%; max-width: 100%; overflow: hidden; padding-block: clamp(64px, 8vw, 105px); background: radial-gradient( circle at 5% 7%, rgba(36, 191, 193, 0.11), transparent 27% ), radial-gradient( circle at 96% 93%, rgba(255, 138, 42, 0.09), transparent 25% ), #ffffff; color: var(--spar-srn-text); } .spar-srn h3, .spar-srn h4, .spar-srn h5, .spar-srn p, .spar-srn li, .spar-srn span, .spar-srn strong, .spar-srn small, .spar-srn a { max-width: 100%; white-space: normal; overflow-wrap: break-word; word-break: normal; } .spar-srn__container { width: min(calc(100% - 40px), 1220px); max-width: 1220px; margin-inline: auto; } /* ============================================================ INTESTAZIONE ============================================================ */ .spar-srn__header { width: min(100%, 960px); margin-inline: auto; text-align: center; } .spar-srn__eyebrow, .spar-srn__section-label, .spar-srn__answer-label, .spar-srn__comparison-label, .spar-srn__trust-label, .spar-srn__conversion-label { margin: 0 0 12px; color: var(--spar-srn-orange-dark); font-size: 0.74rem; font-weight: 900; line-height: 1.4; letter-spacing: 0.075em; text-transform: uppercase; } .spar-srn__title { margin: 0; color: var(--spar-srn-dark); font-size: clamp(1.95rem, 4.1vw, 3.4rem); font-weight: 900; line-height: 1.08; letter-spacing: -0.04em; text-wrap: balance; } .spar-srn__direct-answer { margin: 24px auto 0; color: var(--spar-srn-dark); font-size: clamp(1.04rem, 1.5vw, 1.2rem); font-weight: 650; line-height: 1.7; } .spar-srn__direct-answer strong { color: inherit; font-weight: 900; } .spar-srn__intro { margin: 14px auto 0; color: var(--spar-srn-muted); font-size: 1rem; line-height: 1.72; } /* ============================================================ RISPOSTA DIRETTA ============================================================ */ .spar-srn__answer { display: grid; grid-template-columns: 76px minmax(0, 1fr); align-items: center; gap: 22px; width: min(100%, 1000px); margin: clamp(35px, 5vw, 56px) auto 0; padding: clamp(22px, 3vw, 33px); border: 1px solid rgba(36, 191, 193, 0.28); border-radius: 22px; background: var(--spar-srn-cream); box-shadow: var(--spar-srn-shadow); } .spar-srn__answer-icon { display: grid; place-items: center; width: 70px; height: 70px; border-radius: 19px; background: var(--spar-srn-dark); color: var(--spar-srn-teal-light); } .spar-srn__answer-icon svg { display: block; width: 42px; height: 42px; } .spar-srn__answer-content { min-width: 0; } .spar-srn__answer-content h4 { margin: 0; color: var(--spar-srn-dark); font-size: clamp(1.2rem, 2vw, 1.6rem); font-weight: 900; line-height: 1.3; } .spar-srn__answer-content > p:last-child { margin: 9px 0 0; color: var(--spar-srn-muted); font-size: 0.95rem; line-height: 1.66; } /* ============================================================ TITOLI INTERNI ============================================================ */ .spar-srn__principle-content h4, .spar-srn__elements-header h4, .spar-srn__systems-content h4, .spar-srn__noise-content h4, .spar-srn__optimization-content h4, .spar-srn__claims-content h4, .spar-srn__checks-header h4, .spar-srn__process-content h4, .spar-srn__trust h4, .spar-srn__conversion h4 { margin: 0; color: var(--spar-srn-dark); font-size: clamp(1.45rem, 2.8vw, 2.25rem); font-weight: 900; line-height: 1.2; letter-spacing: -0.03em; text-wrap: balance; } /* ============================================================ TESTI E BLOCCHI A DUE COLONNE ============================================================ */ .spar-srn__principle, .spar-srn__systems, .spar-srn__noise, .spar-srn__optimization, .spar-srn__claims, .spar-srn__process { display: grid; grid-template-columns: minmax(0, 0.92fr) minmax(430px, 1.08fr); align-items: center; gap: clamp(35px, 5vw, 66px); margin-top: clamp(58px, 8vw, 92px); } .spar-srn__systems, .spar-srn__optimization { grid-template-columns: minmax(430px, 1.08fr) minmax(0, 0.92fr); } .spar-srn__process { grid-template-columns: minmax(0, 0.84fr) minmax(440px, 1.16fr); } .spar-srn__principle-content, .spar-srn__systems-content, .spar-srn__noise-content, .spar-srn__optimization-content, .spar-srn__claims-content, .spar-srn__process-content { min-width: 0; } .spar-srn__principle-content > p:not(.spar-srn__section-label), .spar-srn__systems-content > p:not(.spar-srn__section-label), .spar-srn__noise-content > p:not(.spar-srn__section-label), .spar-srn__optimization-content > p:not(.spar-srn__section-label), .spar-srn__claims-content > p:not(.spar-srn__section-label), .spar-srn__process-content > p:not(.spar-srn__section-label) { margin: 17px 0 0; color: var(--spar-srn-muted); font-size: 0.97rem; line-height: 1.7; } .spar-srn__principle-content > p + p, .spar-srn__systems-content > p + p, .spar-srn__noise-content > p + p, .spar-srn__optimization-content > p + p, .spar-srn__claims-content > p + p, .spar-srn__process-content > p + p { margin-top: 11px; } .spar-srn__principle-highlight, .spar-srn__systems-highlight, .spar-srn__noise-highlight, .spar-srn__optimization-highlight, .spar-srn__claims-highlight { padding: 15px 17px; border-left: 4px solid var(--spar-srn-orange); border-radius: 0 12px 12px 0; background: #fff0e2; color: var(--spar-srn-dark) !important; font-weight: 750; } /* ============================================================ CONFRONTO INIZIALE ============================================================ */ .spar-srn__comparison { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; min-width: 0; } .spar-srn__comparison-card { min-width: 0; padding: 22px; border: 1px solid var(--spar-srn-border); border-top: 5px solid var(--spar-srn-danger); border-radius: 18px; background: var(--spar-srn-white); box-shadow: 0 12px 31px rgba(6, 52, 59, 0.08); } .spar-srn__comparison-card--designed { border-top-color: var(--spar-srn-teal); } .spar-srn__comparison-symbol { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 13px; background: #fff0ed; color: #a23b2a; font-size: 1rem; font-weight: 900; } .spar-srn__comparison-card--designed .spar-srn__comparison-symbol { background: var(--spar-srn-light); color: var(--spar-srn-medium); } .spar-srn__comparison-label { margin-top: 16px; margin-bottom: 0; font-size: 0.67rem; } .spar-srn__comparison-card h5 { margin: 7px 0 0; color: var(--spar-srn-dark); font-size: 1.04rem; font-weight: 900; line-height: 1.35; } .spar-srn__comparison-card ul { display: grid; gap: 8px; margin: 15px 0 0; padding: 0; list-style: none; } .spar-srn__comparison-card li { position: relative; padding-left: 18px; color: var(--spar-srn-muted); font-size: 0.83rem; line-height: 1.55; } .spar-srn__comparison-card li::before { content: ""; position: absolute; top: 0.62em; left: 0; width: 7px; height: 7px; border-radius: 50%; background: var(--spar-srn-danger); } .spar-srn__comparison-card--designed li::before { background: var(--spar-srn-teal); } /* ============================================================ ELEMENTI DEL SISTEMA ============================================================ */ .spar-srn__elements, .spar-srn__checks { margin-top: clamp(58px, 8vw, 92px); } .spar-srn__elements-header, .spar-srn__checks-header { width: min(100%, 880px); margin-inline: auto; text-align: center; } .spar-srn__elements-header > p:last-child, .spar-srn__checks-header > p:last-child { margin: 16px auto 0; color: var(--spar-srn-muted); font-size: 0.97rem; line-height: 1.7; } .spar-srn__elements-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 17px; margin-top: 32px; } .spar-srn__element { display: flex; min-width: 0; flex-direction: column; padding: 22px; border: 1px solid var(--spar-srn-border); border-top: 5px solid var(--spar-srn-dark); border-radius: 18px; background: var(--spar-srn-white); box-shadow: 0 12px 30px rgba(6, 52, 59, 0.07); } .spar-srn__element--teal { border-top-color: var(--spar-srn-teal); } .spar-srn__element--orange { border-top-color: var(--spar-srn-orange); } .spar-srn__element--green { border-top-color: var(--spar-srn-green); } .spar-srn__element-top { display: flex; align-items: center; justify-content: space-between; gap: 14px; } .spar-srn__element-number { color: rgba(7, 52, 59, 0.23); font-size: 1.55rem; font-weight: 950; line-height: 1; } .spar-srn__element-icon { display: grid; flex: 0 0 48px; place-items: center; width: 48px; height: 48px; border-radius: 14px; background: var(--spar-srn-light); color: var(--spar-srn-dark); } .spar-srn__element-icon svg { width: 27px; height: 27px; } .spar-srn__element h5 { margin: 18px 0 0; color: var(--spar-srn-dark); font-size: 1.03rem; font-weight: 900; line-height: 1.35; } .spar-srn__element > p { margin: 9px 0 0; color: var(--spar-srn-muted); font-size: 0.85rem; line-height: 1.62; } .spar-srn__element-note { margin-top: auto !important; padding-top: 14px; border-top: 1px solid var(--spar-srn-border); color: var(--spar-srn-dark) !important; font-weight: 750; } /* ============================================================ SCHEMA COMPARATIVO ============================================================ */ .spar-srn__systems-visual { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; min-width: 0; padding: 20px; border: 1px solid rgba(36, 191, 193, 0.26); border-radius: 21px; background: var(--spar-srn-white); box-shadow: var(--spar-srn-shadow); } .spar-srn__system-card { min-width: 0; padding: 17px; border: 1px solid var(--spar-srn-border); border-top: 5px solid var(--spar-srn-danger); border-radius: 16px; background: #ffffff; } .spar-srn__system-card--correct { border-top-color: var(--spar-srn-teal); } .spar-srn__system-card-header { display: grid; grid-template-columns: 40px minmax(0, 1fr); align-items: center; gap: 10px; } .spar-srn__system-card-header > span { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: #fff0ed; color: #a23b2a; font-weight: 900; } .spar-srn__system-card--correct .spar-srn__system-card-header > span { background: var(--spar-srn-light); color: var(--spar-srn-medium); } .spar-srn__system-card-header div { min-width: 0; } .spar-srn__system-card-header small { display: block; color: var(--spar-srn-muted); font-size: 0.64rem; font-weight: 750; line-height: 1.35; text-transform: uppercase; } .spar-srn__system-card-header strong { display: block; margin-top: 2px; color: var(--spar-srn-dark); font-size: 0.9rem; font-weight: 900; line-height: 1.35; } .spar-srn__wall { display: grid; gap: 4px; min-height: 225px; margin-top: 16px; } .spar-srn__wall--compressed { grid-template-columns: 1fr 0.35fr 0.6fr 0.75fr; } .spar-srn__wall--correct { grid-template-columns: 1fr 0.7fr 0.7fr 0.9fr 0.95fr; } .spar-srn__wall > span { display: flex; min-width: 0; align-items: center; justify-content: center; padding: 7px; border-radius: 8px; font-size: 0.59rem; font-weight: 900; line-height: 1.25; text-align: center; text-transform: uppercase; writing-mode: vertical-rl; transform: rotate(180deg); } .spar-srn__wall-existing { background: repeating-linear-gradient( 45deg, #d9e0e0, #d9e0e0 8px, #c9d2d2 8px, #c9d2d2 16px ); color: #40575b; } .spar-srn__wall-gap { border: 1px dashed var(--spar-srn-orange); background: var(--spar-srn-cream); color: var(--spar-srn-orange-dark); } .spar-srn__wall-frame { border: 2px solid var(--spar-srn-dark); background: var(--spar-srn-light); color: var(--spar-srn-dark); } .spar-srn__wall-material { background: repeating-linear-gradient( 45deg, #dff3f1, #dff3f1 8px, #caeae7 8px, #caeae7 16px ); color: var(--spar-srn-dark); } .spar-srn__wall-layers { background: var(--spar-srn-dark); color: var(--spar-srn-white); } .spar-srn__system-card > p { margin: 13px 0 0; color: var(--spar-srn-muted); font-size: 0.78rem; line-height: 1.53; } .spar-srn__systems-note { grid-column: 1 / -1; margin: 1px 0 0; color: var(--spar-srn-muted); font-size: 0.73rem; line-height: 1.5; text-align: center; } /* ============================================================ TIPO DI RUMORE ============================================================ */ .spar-srn__noise { padding: clamp(27px, 4vw, 46px); border-radius: 24px; background: radial-gradient( circle at 96% 4%, rgba(36, 191, 193, 0.2), transparent 30% ), linear-gradient( 135deg, var(--spar-srn-deep), var(--spar-srn-dark) ); box-shadow: 0 24px 60px rgba(3, 35, 40, 0.2); } .spar-srn__noise .spar-srn__section-label { color: var(--spar-srn-orange); } .spar-srn__noise-content h4 { color: var(--spar-srn-white); } .spar-srn__noise-content > p:not(.spar-srn__section-label) { color: rgba(255, 255, 255, 0.74); } .spar-srn__noise-highlight { border-left-color: var(--spar-srn-orange); background: rgba(255, 255, 255, 0.08); color: var(--spar-srn-white) !important; } .spar-srn__noise-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; min-width: 0; } .spar-srn__noise-card { min-width: 0; padding: 19px; border: 1px solid rgba(255, 255, 255, 0.14); border-radius: 16px; background: rgba(255, 255, 255, 0.08); } .spar-srn__noise-icon { display: grid; place-items: center; width: 43px; height: 43px; border-radius: 13px; background: rgba(36, 191, 193, 0.16); color: var(--spar-srn-teal-light); font-size: 0.75rem; font-weight: 900; } .spar-srn__noise-card h5 { margin: 14px 0 0; color: var(--spar-srn-white); font-size: 0.97rem; font-weight: 900; line-height: 1.35; } .spar-srn__noise-card p { margin: 7px 0 0; color: rgba(255, 255, 255, 0.68); font-size: 0.82rem; line-height: 1.57; } /* ============================================================ OTTIMIZZAZIONE DELLA STANZA ============================================================ */ .spar-srn__optimization-visual { min-width: 0; padding: 22px; border: 1px solid rgba(36, 191, 193, 0.27); border-radius: 21px; background: var(--spar-srn-white); box-shadow: var(--spar-srn-shadow); } .spar-srn__room { position: relative; min-height: 335px; overflow: hidden; border: 14px solid #d2dddd; border-radius: 13px; background: var(--spar-srn-light); } .spar-srn__room-existing, .spar-srn__room-counterwall, .spar-srn__room-furniture, .spar-srn__room-passage { position: absolute; display: grid; place-items: center; padding: 8px; font-size: 0.66rem; font-weight: 900; line-height: 1.3; text-align: center; text-transform: uppercase; } .spar-srn__room-existing { top: 0; right: 0; bottom: 0; width: 18%; background: repeating-linear-gradient( 45deg, #d9e0e0, #d9e0e0 8px, #c9d2d2 8px, #c9d2d2 16px ); color: #40575b; writing-mode: vertical-rl; transform: rotate(180deg); } .spar-srn__room-counterwall { top: 0; right: 18%; bottom: 0; width: 18%; background: repeating-linear-gradient( 135deg, #cbeae8, #cbeae8 8px, #b5dfdc 8px, #b5dfdc 16px ); color: var(--spar-srn-dark); writing-mode: vertical-rl; transform: rotate(180deg); } .spar-srn__room-furniture { right: 44%; bottom: 23px; width: 40%; height: 100px; border: 2px solid var(--spar-srn-dark); border-radius: 11px; background: var(--spar-srn-white); color: var(--spar-srn-dark); } .spar-srn__room-passage { top: 42px; right: 42%; left: 7%; min-height: 75px; border: 2px dashed var(--spar-srn-orange); border-radius: 11px; color: var(--spar-srn-orange-dark); } .spar-srn__optimization-visual > p { margin: 15px 0 0; color: var(--spar-srn-muted); font-size: 0.75rem; line-height: 1.5; text-align: center; } /* ============================================================ FALSE PROMESSE ============================================================ */ .spar-srn__claims { padding: clamp(27px, 4vw, 46px); border-radius: 24px; background: radial-gradient( circle at 96% 4%, rgba(36, 191, 193, 0.2), transparent 30% ), linear-gradient( 135deg, var(--spar-srn-deep), var(--spar-srn-dark) ); box-shadow: 0 24px 60px rgba(3, 35, 40, 0.2); } .spar-srn__claims .spar-srn__section-label { color: var(--spar-srn-orange); } .spar-srn__claims-content h4 { color: var(--spar-srn-white); } .spar-srn__claims-content > p:not(.spar-srn__section-label) { color: rgba(255, 255, 255, 0.74); } .spar-srn__claims-highlight { border-left-color: var(--spar-srn-orange); background: rgba(255, 255, 255, 0.08); color: var(--spar-srn-white) !important; } .spar-srn__claims-list { display: grid; gap: 11px; min-width: 0; margin: 0; padding: 0; list-style: none; } .spar-srn__claims-list li { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 11px; min-width: 0; padding: 14px; border: 1px solid rgba(255, 255, 255, 0.13); border-radius: 14px; background: rgba(255, 255, 255, 0.07); } .spar-srn__claims-list li > span { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: rgba(255, 138, 42, 0.16); color: var(--spar-srn-orange); font-size: 1rem; font-weight: 900; } .spar-srn__claims-list li > div { min-width: 0; } .spar-srn__claims-list strong { display: block; color: var(--spar-srn-white); font-size: 0.89rem; font-weight: 900; line-height: 1.4; } .spar-srn__claims-list p { margin: 5px 0 0; color: rgba(255, 255, 255, 0.67); font-size: 0.8rem; line-height: 1.52; } /* ============================================================ VERIFICHE ============================================================ */ .spar-srn__checks-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; margin: 31px 0 0; padding: 0; list-style: none; } .spar-srn__checks-list li { min-width: 0; padding: 20px; border: 1px solid var(--spar-srn-border); border-radius: 17px; background: var(--spar-srn-white); box-shadow: 0 11px 29px rgba(6, 52, 59, 0.07); } .spar-srn__checks-list li > span { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; background: var(--spar-srn-dark); color: var(--spar-srn-teal-light); font-size: 0.78rem; font-weight: 900; } .spar-srn__checks-list strong { display: block; margin-top: 16px; color: var(--spar-srn-dark); font-size: 0.9rem; font-weight: 900; line-height: 1.4; } .spar-srn__checks-list p { margin: 7px 0 0; color: var(--spar-srn-muted); font-size: 0.82rem; line-height: 1.57; } /* ============================================================ PROCESSO ============================================================ */ .spar-srn__process-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; min-width: 0; margin: 0; padding: 0; list-style: none; } .spar-srn__process-list li { display: grid; grid-template-columns: 42px minmax(0, 1fr); gap: 12px; min-width: 0; padding: 15px; border: 1px solid var(--spar-srn-border); border-radius: 15px; background: var(--spar-srn-white); box-shadow: 0 10px 27px rgba(6, 52, 59, 0.07); } .spar-srn__process-list li > span { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; background: var(--spar-srn-dark); color: var(--spar-srn-teal-light); font-size: 0.78rem; font-weight: 900; } .spar-srn__process-list li > div { min-width: 0; } .spar-srn__process-list strong { display: block; color: var(--spar-srn-dark); font-size: 0.9rem; font-weight: 900; line-height: 1.4; } .spar-srn__process-list p { margin: 5px 0 0; color: var(--spar-srn-muted); font-size: 0.81rem; line-height: 1.55; } /* ============================================================ FIDUCIA ============================================================ */ .spar-srn__trust { display: grid; grid-template-columns: 74px minmax(0, 1fr); align-items: center; gap: 23px; margin-top: clamp(44px, 6vw, 68px); padding: clamp(24px, 3vw, 35px); border: 1px solid rgba(255, 138, 42, 0.31); border-radius: 21px; background: #fff3e7; } .spar-srn__trust-icon { display: grid; place-items: center; width: 70px; height: 70px; border-radius: 20px; background: var(--spar-srn-orange); color: #321705; } .spar-srn__trust-icon svg { width: 41px; height: 41px; } .spar-srn__trust-content { min-width: 0; } .spar-srn__trust h4 { font-size: clamp(1.3rem, 2.2vw, 1.85rem); } .spar-srn__trust-content > p:last-child { margin: 10px 0 0; color: var(--spar-srn-muted); font-size: 0.93rem; line-height: 1.66; } /* ============================================================ CTA ============================================================ */ .spar-srn__conversion { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(330px, 0.92fr); align-items: center; gap: clamp(30px, 5vw, 64px); margin-top: clamp(52px, 7vw, 82px); padding: clamp(26px, 4vw, 45px); border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 23px; background: var(--spar-srn-cream); box-shadow: var(--spar-srn-shadow); } .spar-srn__conversion-content { min-width: 0; } .spar-srn__conversion-content > p:not(.spar-srn__conversion-label) { margin: 15px 0 0; color: var(--spar-srn-muted); font-size: 0.95rem; line-height: 1.69; } .spar-srn__conversion-content > p + p { margin-top: 10px; } .spar-srn__actions { display: grid; gap: 11px; min-width: 0; } .spar-srn__button { display: flex; min-width: 0; min-height: 57px; align-items: center; justify-content: center; gap: 10px; padding: 13px 17px; border: 2px solid transparent; border-radius: 12px; font-family: inherit; font-size: 0.9rem; font-weight: 850; line-height: 1.3; text-align: center; text-decoration: none; transition: transform 180ms ease, background-color 180ms ease, border-color 180ms ease, box-shadow 180ms ease; } .spar-srn__button:hover { transform: translateY(-2px); } .spar-srn__button:focus-visible { outline: 3px solid var(--spar-srn-dark); outline-offset: 4px; } .spar-srn__button svg { flex: 0 0 23px; width: 23px; height: 23px; } .spar-srn__button--primary { background: var(--spar-srn-orange); color: #2c1504; box-shadow: 0 12px 27px rgba(255, 138, 42, 0.22); } .spar-srn__button--primary:hover { background: #ff9b43; } .spar-srn__button--whatsapp { background: var(--spar-srn-green); color: var(--spar-srn-white); box-shadow: 0 12px 27px rgba(39, 173, 104, 0.2); } .spar-srn__button--whatsapp:hover { background: var(--spar-srn-green-dark); } .spar-srn__button--phone { border-color: rgba(7, 52, 59, 0.3); background: var(--spar-srn-white); color: var(--spar-srn-dark); } .spar-srn__button--phone:hover { border-color: var(--spar-srn-teal); background: var(--spar-srn-light); } .spar-srn__phone-text { display: grid; min-width: 0; gap: 1px; text-align: left; } .spar-srn__phone-text small { font-size: 0.64rem; font-weight: 750; line-height: 1.1; letter-spacing: 0.055em; text-transform: uppercase; } .spar-srn__phone-text strong { color: inherit; font-size: 1rem; font-weight: 900; line-height: 1.15; } /* ============================================================ NOTEBOOK E TABLET ORIZZONTALE ============================================================ */ @media (max-width: 1100px) { .spar-srn__principle, .spar-srn__systems, .spar-srn__noise, .spar-srn__optimization, .spar-srn__claims, .spar-srn__process, .spar-srn__conversion { grid-template-columns: minmax(0, 1fr); } .spar-srn__elements-grid, .spar-srn__checks-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-srn__principle-content, .spar-srn__systems-content, .spar-srn__noise-content, .spar-srn__optimization-content, .spar-srn__claims-content, .spar-srn__process-content, .spar-srn__conversion-content { max-width: 850px; } .spar-srn__comparison, .spar-srn__systems-visual, .spar-srn__noise-grid, .spar-srn__optimization-visual, .spar-srn__claims-list, .spar-srn__process-list { max-width: 850px; } .spar-srn__actions { grid-template-columns: repeat(3, minmax(0, 1fr)); } } /* ============================================================ TABLET ============================================================ */ @media (max-width: 820px) { .spar-srn__container { width: min(calc(100% - 32px), 780px); } .spar-srn__answer { grid-template-columns: 60px minmax(0, 1fr); gap: 17px; } .spar-srn__answer-icon { width: 58px; height: 58px; } .spar-srn__comparison, .spar-srn__systems-visual { grid-template-columns: minmax(0, 1fr); } .spar-srn__systems-note { grid-column: auto; } .spar-srn__actions { grid-template-columns: minmax(0, 1fr); } } /* ============================================================ MOBILE ============================================================ */ @media (max-width: 580px) { .spar-srn { padding-block: 50px 62px; } .spar-srn__container { width: calc(100% - 28px); } .spar-srn__header, .spar-srn__elements-header, .spar-srn__checks-header { text-align: left; } .spar-srn__eyebrow, .spar-srn__section-label, .spar-srn__answer-label, .spar-srn__comparison-label, .spar-srn__trust-label, .spar-srn__conversion-label { font-size: 0.67rem; letter-spacing: 0.06em; } .spar-srn__title { font-size: clamp(1.84rem, 9.4vw, 2.6rem); line-height: 1.1; } .spar-srn__direct-answer { font-size: 0.98rem; line-height: 1.63; } .spar-srn__intro { font-size: 0.91rem; line-height: 1.66; } .spar-srn__answer { grid-template-columns: minmax(0, 1fr); padding: 20px 17px; border-radius: 18px; } .spar-srn__answer-icon { width: 52px; height: 52px; border-radius: 15px; } .spar-srn__answer-icon svg { width: 32px; height: 32px; } .spar-srn__principle-content h4, .spar-srn__elements-header h4, .spar-srn__systems-content h4, .spar-srn__noise-content h4, .spar-srn__optimization-content h4, .spar-srn__claims-content h4, .spar-srn__checks-header h4, .spar-srn__process-content h4, .spar-srn__conversion h4 { font-size: clamp(1.42rem, 7.4vw, 1.92rem); } .spar-srn__elements-grid, .spar-srn__noise-grid, .spar-srn__checks-list, .spar-srn__process-list { grid-template-columns: minmax(0, 1fr); } .spar-srn__comparison-card, .spar-srn__element, .spar-srn__noise-card, .spar-srn__checks-list li, .spar-srn__process-list li { padding: 18px 16px; border-radius: 16px; } .spar-srn__systems-visual, .spar-srn__optimization-visual { padding: 16px; border-radius: 18px; } .spar-srn__wall { min-height: 190px; } .spar-srn__noise, .spar-srn__claims { padding: 22px 17px; border-radius: 19px; } .spar-srn__room { min-height: 285px; border-width: 11px; } .spar-srn__room-existing, .spar-srn__room-counterwall { font-size: 0.57rem; } .spar-srn__room-furniture { right: 44%; width: 47%; height: 88px; font-size: 0.59rem; } .spar-srn__room-passage { right: 41%; left: 5%; font-size: 0.58rem; } .spar-srn__claims-list li { grid-template-columns: 38px minmax(0, 1fr); padding: 12px; } .spar-srn__claims-list li > span { width: 38px; height: 38px; } .spar-srn__trust { grid-template-columns: minmax(0, 1fr); align-items: start; gap: 15px; padding: 21px 17px; border-radius: 18px; } .spar-srn__trust-icon { width: 54px; height: 54px; border-radius: 15px; } .spar-srn__trust-icon svg { width: 31px; height: 31px; } .spar-srn__trust h4 { font-size: 1.27rem; } .spar-srn__conversion { padding: 22px 17px; border-radius: 19px; } .spar-srn__button { width: 100%; min-height: 57px; padding-inline: 13px; font-size: 0.86rem; } } /* ============================================================ SMARTPHONE MOLTO STRETTI ============================================================ */ @media (max-width: 380px) { .spar-srn__container { width: calc(100% - 22px); } .spar-srn__title { font-size: 1.71rem; } .spar-srn__comparison-card, .spar-srn__element, .spar-srn__systems-visual, .spar-srn__system-card, .spar-srn__noise, .spar-srn__noise-card, .spar-srn__optimization-visual, .spar-srn__claims, .spar-srn__checks-list li, .spar-srn__process-list li, .spar-srn__trust, .spar-srn__conversion { padding-inline: 14px; } .spar-srn__button { gap: 8px; padding-inline: 10px; font-size: 0.82rem; } .spar-srn__button svg { flex-basis: 21px; width: 21px; height: 21px; } } /* ============================================================ ACCESSIBILITÀ ============================================================ */ @media (prefers-reduced-motion: reduce) { .spar-srn__button { transition: none; } .spar-srn__button:hover { transform: none; } } /* ============================================================ STAMPA ============================================================ */ @media print { .spar-srn { padding: 30px 0; background: #ffffff; } .spar-srn__noise, .spar-srn__claims { border: 1px solid var(--spar-srn-border); background: #ffffff; box-shadow: none; } .spar-srn__noise-content h4, .spar-srn__claims-content h4, .spar-srn__noise-card h5, .spar-srn__claims-list strong { color: var(--spar-srn-dark); } .spar-srn__noise-content > p:not(.spar-srn__section-label), .spar-srn__claims-content > p:not(.spar-srn__section-label), .spar-srn__noise-card p, .spar-srn__claims-list p { color: var(--spar-srn-muted); } .spar-srn__actions { display: none; } }#imCell_26 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHTMLObject_1726_26 { position: relative; align-self: start; justify-self: center; max-width: 100%; box-sizing: border-box; z-index: 3; } #imCellStyleGraphics_26 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imCellStyleBorders_26 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } /* ============================================================ H2 — PANNELLI FONOASSORBENTI, CARTONGESSO E MATERIALI: COSA BISOGNA SAPERE Pagina: /isolamento-acustico-pareti-roma.html ============================================================ */ .spar-pfm, .spar-pfm *, .spar-pfm *::before, .spar-pfm *::after { box-sizing: border-box; } .spar-pfm { --spar-pfm-dark: #07343b; --spar-pfm-deep: #05282e; --spar-pfm-medium: #0b5159; --spar-pfm-teal: #24bfc1; --spar-pfm-teal-light: #d9f4f2; --spar-pfm-orange: #ff8a2a; --spar-pfm-orange-dark: #c85c0a; --spar-pfm-green: #27ad68; --spar-pfm-green-dark: #19864f; --spar-pfm-white: #ffffff; --spar-pfm-cream: #fff8ed; --spar-pfm-light: #edf8f7; --spar-pfm-text: #173c41; --spar-pfm-muted: #557277; --spar-pfm-border: #d4e6e4; --spar-pfm-danger: #d56652; --spar-pfm-shadow: 0 20px 52px rgba(6, 52, 59, 0.1); width: 100%; max-width: 100%; overflow: hidden; padding-block: clamp(64px, 8vw, 105px); background: radial-gradient( circle at 5% 7%, rgba(36, 191, 193, 0.11), transparent 27% ), radial-gradient( circle at 96% 93%, rgba(255, 138, 42, 0.09), transparent 25% ), var(--spar-pfm-cream); color: var(--spar-pfm-text); } .spar-pfm h2, .spar-pfm h3, .spar-pfm h4, .spar-pfm h5, .spar-pfm p, .spar-pfm li, .spar-pfm span, .spar-pfm strong, .spar-pfm small, .spar-pfm a { max-width: 100%; white-space: normal; overflow-wrap: break-word; word-break: normal; } .spar-pfm__container { width: min(calc(100% - 40px), 1220px); max-width: 1220px; margin-inline: auto; } /* ============================================================ INTESTAZIONE ============================================================ */ .spar-pfm__header { width: min(100%, 980px); margin-inline: auto; text-align: center; } .spar-pfm__eyebrow, .spar-pfm__section-label, .spar-pfm__answer-label, .spar-pfm__material-label, .spar-pfm__function-label, .spar-pfm__trust-label, .spar-pfm__conversion-label { margin: 0 0 12px; color: var(--spar-pfm-orange-dark); font-size: 0.74rem; font-weight: 900; line-height: 1.4; letter-spacing: 0.075em; text-transform: uppercase; } .spar-pfm__title { margin: 0; color: var(--spar-pfm-dark); font-size: clamp(2rem, 4.2vw, 3.55rem); font-weight: 900; line-height: 1.08; letter-spacing: -0.04em; text-wrap: balance; } .spar-pfm__direct-answer { margin: 24px auto 0; color: var(--spar-pfm-dark); font-size: clamp(1.04rem, 1.5vw, 1.2rem); font-weight: 650; line-height: 1.7; } .spar-pfm__direct-answer strong { color: inherit; font-weight: 900; } .spar-pfm__intro { margin: 14px auto 0; color: var(--spar-pfm-muted); font-size: 1rem; line-height: 1.72; } /* ============================================================ RISPOSTA DIRETTA ============================================================ */ .spar-pfm__answer { display: grid; grid-template-columns: 76px minmax(0, 1fr); align-items: center; gap: 22px; width: min(100%, 1000px); margin: clamp(35px, 5vw, 56px) auto 0; padding: clamp(22px, 3vw, 33px); border: 1px solid rgba(36, 191, 193, 0.28); border-radius: 22px; background: var(--spar-pfm-white); box-shadow: var(--spar-pfm-shadow); } .spar-pfm__answer-icon { display: grid; place-items: center; width: 70px; height: 70px; border-radius: 19px; background: var(--spar-pfm-dark); color: var(--spar-pfm-teal-light); } .spar-pfm__answer-icon svg { display: block; width: 42px; height: 42px; } .spar-pfm__answer-content { min-width: 0; } .spar-pfm__answer-content h3 { margin: 0; color: var(--spar-pfm-dark); font-size: clamp(1.2rem, 2vw, 1.6rem); font-weight: 900; line-height: 1.3; } .spar-pfm__answer-content > p:last-child { margin: 9px 0 0; color: var(--spar-pfm-muted); font-size: 0.95rem; line-height: 1.66; } /* ============================================================ TITOLI INTERNI ============================================================ */ .spar-pfm__materials-header h3, .spar-pfm__functions-content h3, .spar-pfm__system-content h3, .spar-pfm__questions-header h3, .spar-pfm__mistakes-content h3, .spar-pfm__topics-content h3, .spar-pfm__process-header h3, .spar-pfm__trust h3, .spar-pfm__conversion h3 { margin: 0; color: var(--spar-pfm-dark); font-size: clamp(1.45rem, 2.8vw, 2.25rem); font-weight: 900; line-height: 1.2; letter-spacing: -0.03em; text-wrap: balance; } /* ============================================================ MATERIALI ============================================================ */ .spar-pfm__materials, .spar-pfm__questions, .spar-pfm__process { margin-top: clamp(58px, 8vw, 92px); } .spar-pfm__materials-header, .spar-pfm__questions-header, .spar-pfm__process-header { width: min(100%, 890px); margin-inline: auto; text-align: center; } .spar-pfm__materials-header > p:last-child, .spar-pfm__questions-header > p:last-child, .spar-pfm__process-header > p:last-child { margin: 16px auto 0; color: var(--spar-pfm-muted); font-size: 0.97rem; line-height: 1.7; } .spar-pfm__materials-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 17px; margin-top: 32px; } .spar-pfm__material-card { display: flex; min-width: 0; flex-direction: column; padding: 22px; border: 1px solid var(--spar-pfm-border); border-top: 5px solid var(--spar-pfm-dark); border-radius: 18px; background: var(--spar-pfm-white); box-shadow: 0 12px 30px rgba(6, 52, 59, 0.07); } .spar-pfm__material-card--teal { border-top-color: var(--spar-pfm-teal); } .spar-pfm__material-card--orange { border-top-color: var(--spar-pfm-orange); } .spar-pfm__material-card--green { border-top-color: var(--spar-pfm-green); } .spar-pfm__material-icon { display: grid; place-items: center; width: 50px; height: 50px; border-radius: 15px; background: var(--spar-pfm-light); color: var(--spar-pfm-dark); } .spar-pfm__material-icon svg { width: 28px; height: 28px; } .spar-pfm__material-label { margin-top: 17px; margin-bottom: 0; font-size: 0.66rem; } .spar-pfm__material-card h4 { margin: 7px 0 0; color: var(--spar-pfm-dark); font-size: 1.06rem; font-weight: 900; line-height: 1.35; } .spar-pfm__material-card > p:not(.spar-pfm__material-label) { margin: 10px 0 0; color: var(--spar-pfm-muted); font-size: 0.85rem; line-height: 1.62; } .spar-pfm__material-note { margin-top: auto !important; padding-top: 14px; border-top: 1px solid var(--spar-pfm-border); color: var(--spar-pfm-dark) !important; font-weight: 750; } /* ============================================================ BLOCCHI A DUE COLONNE ============================================================ */ .spar-pfm__functions, .spar-pfm__system, .spar-pfm__mistakes, .spar-pfm__topics { display: grid; grid-template-columns: minmax(0, 0.92fr) minmax(430px, 1.08fr); align-items: center; gap: clamp(35px, 5vw, 66px); margin-top: clamp(58px, 8vw, 92px); } .spar-pfm__system { grid-template-columns: minmax(500px, 1.12fr) minmax(0, 0.88fr); } .spar-pfm__functions-content, .spar-pfm__system-content, .spar-pfm__mistakes-content, .spar-pfm__topics-content { min-width: 0; } .spar-pfm__functions-content > p:not(.spar-pfm__section-label), .spar-pfm__system-content > p:not(.spar-pfm__section-label), .spar-pfm__mistakes-content > p:not(.spar-pfm__section-label), .spar-pfm__topics-content > p:not(.spar-pfm__section-label) { margin: 17px 0 0; color: var(--spar-pfm-muted); font-size: 0.97rem; line-height: 1.7; } .spar-pfm__functions-content > p + p, .spar-pfm__system-content > p + p, .spar-pfm__mistakes-content > p + p, .spar-pfm__topics-content > p + p { margin-top: 11px; } .spar-pfm__functions-highlight, .spar-pfm__system-highlight, .spar-pfm__mistakes-highlight { padding: 15px 17px; border-left: 4px solid var(--spar-pfm-orange); border-radius: 0 12px 12px 0; background: #fff0e2; color: var(--spar-pfm-dark) !important; font-weight: 750; } /* ============================================================ FUNZIONI ============================================================ */ .spar-pfm__functions-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; min-width: 0; } .spar-pfm__function-card { min-width: 0; padding: 22px; border: 1px solid var(--spar-pfm-border); border-top: 5px solid var(--spar-pfm-orange); border-radius: 18px; background: var(--spar-pfm-white); box-shadow: 0 12px 31px rgba(6, 52, 59, 0.08); } .spar-pfm__function-card--isolation { border-top-color: var(--spar-pfm-teal); } .spar-pfm__function-symbol { display: grid; place-items: center; width: 45px; height: 45px; border-radius: 14px; background: #fff0e2; color: var(--spar-pfm-orange-dark); font-size: 1.1rem; font-weight: 900; } .spar-pfm__function-card--isolation .spar-pfm__function-symbol { background: var(--spar-pfm-light); color: var(--spar-pfm-medium); } .spar-pfm__function-label { margin-top: 16px; margin-bottom: 0; font-size: 0.66rem; } .spar-pfm__function-card h4 { margin: 7px 0 0; color: var(--spar-pfm-dark); font-size: 1.07rem; font-weight: 900; line-height: 1.35; } .spar-pfm__function-card ul { display: grid; gap: 8px; margin: 15px 0 0; padding: 0; list-style: none; } .spar-pfm__function-card li { position: relative; padding-left: 18px; color: var(--spar-pfm-muted); font-size: 0.83rem; line-height: 1.55; } .spar-pfm__function-card li::before { content: ""; position: absolute; top: 0.62em; left: 0; width: 7px; height: 7px; border-radius: 50%; background: var(--spar-pfm-orange); } .spar-pfm__function-card--isolation li::before { background: var(--spar-pfm-teal); } /* ============================================================ DIAGRAMMA ============================================================ */ .spar-pfm__diagram { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; min-width: 0; padding: 20px; border: 1px solid rgba(36, 191, 193, 0.26); border-radius: 21px; background: var(--spar-pfm-white); box-shadow: var(--spar-pfm-shadow); } .spar-pfm__diagram-example { min-width: 0; padding: 17px; border: 1px solid var(--spar-pfm-border); border-top: 5px solid var(--spar-pfm-danger); border-radius: 16px; background: var(--spar-pfm-white); } .spar-pfm__diagram-example--system { border-top-color: var(--spar-pfm-teal); } .spar-pfm__diagram-example header { display: grid; grid-template-columns: 40px minmax(0, 1fr); align-items: center; gap: 10px; } .spar-pfm__diagram-example header > span { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: #fff0ed; color: #a23b2a; font-weight: 900; } .spar-pfm__diagram-example--system header > span { background: var(--spar-pfm-light); color: var(--spar-pfm-medium); } .spar-pfm__diagram-example header div { min-width: 0; } .spar-pfm__diagram-example header small { display: block; color: var(--spar-pfm-muted); font-size: 0.63rem; font-weight: 750; line-height: 1.35; text-transform: uppercase; } .spar-pfm__diagram-example header strong { display: block; margin-top: 2px; color: var(--spar-pfm-dark); font-size: 0.88rem; font-weight: 900; line-height: 1.35; } .spar-pfm__wall { display: grid; gap: 4px; min-height: 225px; margin-top: 16px; } .spar-pfm__wall--single { grid-template-columns: 1fr 0.38fr; } .spar-pfm__wall--system { grid-template-columns: 1fr 0.7fr 0.72fr 0.88fr 0.95fr; } .spar-pfm__wall > span { display: flex; min-width: 0; align-items: center; justify-content: center; padding: 7px; border-radius: 8px; font-size: 0.57rem; font-weight: 900; line-height: 1.25; text-align: center; text-transform: uppercase; writing-mode: vertical-rl; transform: rotate(180deg); } .spar-pfm__wall-existing { background: repeating-linear-gradient( 45deg, #d9e0e0, #d9e0e0 8px, #c9d2d2 8px, #c9d2d2 16px ); color: #40575b; } .spar-pfm__wall-panel { border: 2px solid var(--spar-pfm-danger); background: #fff0ed; color: #8b3425; } .spar-pfm__wall-gap { border: 1px dashed var(--spar-pfm-orange); background: var(--spar-pfm-cream); color: var(--spar-pfm-orange-dark); } .spar-pfm__wall-frame { border: 2px solid var(--spar-pfm-dark); background: var(--spar-pfm-light); color: var(--spar-pfm-dark); } .spar-pfm__wall-material { background: repeating-linear-gradient( 45deg, #dff3f1, #dff3f1 8px, #caeae7 8px, #caeae7 16px ); color: var(--spar-pfm-dark); } .spar-pfm__wall-mass { background: var(--spar-pfm-dark); color: var(--spar-pfm-white); } .spar-pfm__diagram-example > p { margin: 13px 0 0; color: var(--spar-pfm-muted); font-size: 0.78rem; line-height: 1.53; } .spar-pfm__diagram-note { grid-column: 1 / -1; margin: 1px 0 0; color: var(--spar-pfm-muted); font-size: 0.73rem; line-height: 1.5; text-align: center; } /* ============================================================ DOMANDE DA VERIFICARE ============================================================ */ .spar-pfm__questions-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; margin: 31px 0 0; padding: 0; list-style: none; } .spar-pfm__questions-list li { min-width: 0; padding: 20px; border: 1px solid var(--spar-pfm-border); border-radius: 17px; background: var(--spar-pfm-white); box-shadow: 0 11px 29px rgba(6, 52, 59, 0.07); } .spar-pfm__questions-list li > span { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; background: var(--spar-pfm-dark); color: var(--spar-pfm-teal-light); font-size: 0.78rem; font-weight: 900; } .spar-pfm__questions-list strong { display: block; margin-top: 16px; color: var(--spar-pfm-dark); font-size: 0.9rem; font-weight: 900; line-height: 1.4; } .spar-pfm__questions-list p { margin: 7px 0 0; color: var(--spar-pfm-muted); font-size: 0.82rem; line-height: 1.57; } /* ============================================================ ERRORI ============================================================ */ .spar-pfm__mistakes { padding: clamp(27px, 4vw, 46px); border-radius: 24px; background: radial-gradient( circle at 96% 4%, rgba(36, 191, 193, 0.2), transparent 30% ), linear-gradient( 135deg, var(--spar-pfm-deep), var(--spar-pfm-dark) ); box-shadow: 0 24px 60px rgba(3, 35, 40, 0.2); } .spar-pfm__mistakes .spar-pfm__section-label { color: var(--spar-pfm-orange); } .spar-pfm__mistakes-content h3 { color: var(--spar-pfm-white); } .spar-pfm__mistakes-content > p:not(.spar-pfm__section-label) { color: rgba(255, 255, 255, 0.74); } .spar-pfm__mistakes-highlight { border-left-color: var(--spar-pfm-orange); background: rgba(255, 255, 255, 0.08); color: var(--spar-pfm-white) !important; } .spar-pfm__mistakes-list { display: grid; gap: 11px; min-width: 0; margin: 0; padding: 0; list-style: none; } .spar-pfm__mistakes-list li { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 11px; min-width: 0; padding: 14px; border: 1px solid rgba(255, 255, 255, 0.13); border-radius: 14px; background: rgba(255, 255, 255, 0.07); } .spar-pfm__mistakes-list li > span { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: rgba(255, 138, 42, 0.16); color: var(--spar-pfm-orange); font-size: 1rem; font-weight: 900; } .spar-pfm__mistakes-list li > div { min-width: 0; } .spar-pfm__mistakes-list strong { display: block; color: var(--spar-pfm-white); font-size: 0.89rem; font-weight: 900; line-height: 1.4; } .spar-pfm__mistakes-list p { margin: 5px 0 0; color: rgba(255, 255, 255, 0.67); font-size: 0.8rem; line-height: 1.52; } /* ============================================================ APPROFONDIMENTI ============================================================ */ .spar-pfm__topic-links { display: grid; gap: 13px; min-width: 0; } .spar-pfm__topic-link { display: grid; grid-template-columns: 52px minmax(0, 1fr) 32px; align-items: center; gap: 14px; min-width: 0; padding: 18px; border: 1px solid var(--spar-pfm-border); border-radius: 17px; background: var(--spar-pfm-white); color: var(--spar-pfm-dark); text-decoration: none; box-shadow: 0 11px 29px rgba(6, 52, 59, 0.07); transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease; } .spar-pfm__topic-link:hover { transform: translateY(-2px); border-color: var(--spar-pfm-teal); box-shadow: 0 16px 36px rgba(6, 52, 59, 0.11); } .spar-pfm__topic-link:focus-visible { outline: 3px solid var(--spar-pfm-orange); outline-offset: 4px; } .spar-pfm__topic-icon { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 15px; background: var(--spar-pfm-light); color: var(--spar-pfm-dark); } .spar-pfm__topic-icon svg { width: 29px; height: 29px; } .spar-pfm__topic-text { display: grid; min-width: 0; gap: 5px; } .spar-pfm__topic-text strong { color: var(--spar-pfm-dark); font-size: 0.95rem; font-weight: 900; line-height: 1.4; } .spar-pfm__topic-text small { color: var(--spar-pfm-muted); font-size: 0.8rem; line-height: 1.5; } .spar-pfm__topic-arrow { color: var(--spar-pfm-orange-dark); font-size: 1.35rem; font-weight: 900; } /* ============================================================ PROCESSO ============================================================ */ .spar-pfm__process-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 15px; margin: 31px 0 0; padding: 0; list-style: none; } .spar-pfm__process-list li { min-width: 0; padding: 20px; border: 1px solid var(--spar-pfm-border); border-radius: 17px; background: var(--spar-pfm-white); box-shadow: 0 11px 29px rgba(6, 52, 59, 0.07); } .spar-pfm__process-list li > span { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; background: var(--spar-pfm-dark); color: var(--spar-pfm-teal-light); font-size: 0.78rem; font-weight: 900; } .spar-pfm__process-list strong { display: block; margin-top: 16px; color: var(--spar-pfm-dark); font-size: 0.9rem; font-weight: 900; line-height: 1.4; } .spar-pfm__process-list p { margin: 7px 0 0; color: var(--spar-pfm-muted); font-size: 0.82rem; line-height: 1.57; } /* ============================================================ FIDUCIA ============================================================ */ .spar-pfm__trust { display: grid; grid-template-columns: 74px minmax(0, 1fr); align-items: center; gap: 23px; margin-top: clamp(44px, 6vw, 68px); padding: clamp(24px, 3vw, 35px); border: 1px solid rgba(255, 138, 42, 0.31); border-radius: 21px; background: #fff3e7; } .spar-pfm__trust-icon { display: grid; place-items: center; width: 70px; height: 70px; border-radius: 20px; background: var(--spar-pfm-orange); color: #321705; } .spar-pfm__trust-icon svg { width: 41px; height: 41px; } .spar-pfm__trust-content { min-width: 0; } .spar-pfm__trust h3 { font-size: clamp(1.3rem, 2.2vw, 1.85rem); } .spar-pfm__trust-content > p:last-child { margin: 10px 0 0; color: var(--spar-pfm-muted); font-size: 0.93rem; line-height: 1.66; } /* ============================================================ CTA ============================================================ */ .spar-pfm__conversion { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(330px, 0.92fr); align-items: center; gap: clamp(30px, 5vw, 64px); margin-top: clamp(52px, 7vw, 82px); padding: clamp(26px, 4vw, 45px); border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 23px; background: var(--spar-pfm-white); box-shadow: var(--spar-pfm-shadow); } .spar-pfm__conversion-content { min-width: 0; } .spar-pfm__conversion-content > p:not(.spar-pfm__conversion-label) { margin: 15px 0 0; color: var(--spar-pfm-muted); font-size: 0.95rem; line-height: 1.69; } .spar-pfm__conversion-content > p + p { margin-top: 10px; } .spar-pfm__actions { display: grid; gap: 11px; min-width: 0; } .spar-pfm__button { display: flex; min-width: 0; min-height: 57px; align-items: center; justify-content: center; gap: 10px; padding: 13px 17px; border: 2px solid transparent; border-radius: 12px; font-family: inherit; font-size: 0.9rem; font-weight: 850; line-height: 1.3; text-align: center; text-decoration: none; transition: transform 180ms ease, background-color 180ms ease, border-color 180ms ease, box-shadow 180ms ease; } .spar-pfm__button:hover { transform: translateY(-2px); } .spar-pfm__button:focus-visible { outline: 3px solid var(--spar-pfm-dark); outline-offset: 4px; } .spar-pfm__button svg { flex: 0 0 23px; width: 23px; height: 23px; } .spar-pfm__button--primary { background: var(--spar-pfm-orange); color: #2c1504; box-shadow: 0 12px 27px rgba(255, 138, 42, 0.22); } .spar-pfm__button--primary:hover { background: #ff9b43; } .spar-pfm__button--whatsapp { background: var(--spar-pfm-green); color: var(--spar-pfm-white); box-shadow: 0 12px 27px rgba(39, 173, 104, 0.2); } .spar-pfm__button--whatsapp:hover { background: var(--spar-pfm-green-dark); } .spar-pfm__button--phone { border-color: rgba(7, 52, 59, 0.3); background: var(--spar-pfm-white); color: var(--spar-pfm-dark); } .spar-pfm__button--phone:hover { border-color: var(--spar-pfm-teal); background: var(--spar-pfm-light); } .spar-pfm__phone-text { display: grid; min-width: 0; gap: 1px; text-align: left; } .spar-pfm__phone-text small { font-size: 0.64rem; font-weight: 750; line-height: 1.1; letter-spacing: 0.055em; text-transform: uppercase; } .spar-pfm__phone-text strong { color: inherit; font-size: 1rem; font-weight: 900; line-height: 1.15; } /* ============================================================ NOTEBOOK E TABLET ORIZZONTALE ============================================================ */ @media (max-width: 1100px) { .spar-pfm__functions, .spar-pfm__system, .spar-pfm__mistakes, .spar-pfm__topics, .spar-pfm__conversion { grid-template-columns: minmax(0, 1fr); } .spar-pfm__materials-grid, .spar-pfm__questions-list, .spar-pfm__process-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-pfm__functions-content, .spar-pfm__system-content, .spar-pfm__mistakes-content, .spar-pfm__topics-content, .spar-pfm__conversion-content { max-width: 850px; } .spar-pfm__functions-grid, .spar-pfm__diagram, .spar-pfm__mistakes-list, .spar-pfm__topic-links { max-width: 850px; } .spar-pfm__actions { grid-template-columns: repeat(3, minmax(0, 1fr)); } } /* ============================================================ TABLET ============================================================ */ @media (max-width: 820px) { .spar-pfm__container { width: min(calc(100% - 32px), 780px); } .spar-pfm__answer { grid-template-columns: 60px minmax(0, 1fr); gap: 17px; } .spar-pfm__answer-icon { width: 58px; height: 58px; } .spar-pfm__functions-grid, .spar-pfm__diagram { grid-template-columns: minmax(0, 1fr); } .spar-pfm__diagram-note { grid-column: auto; } .spar-pfm__actions { grid-template-columns: minmax(0, 1fr); } } /* ============================================================ MOBILE ============================================================ */ @media (max-width: 580px) { .spar-pfm { padding-block: 50px 62px; } .spar-pfm__container { width: calc(100% - 28px); } .spar-pfm__header, .spar-pfm__materials-header, .spar-pfm__questions-header, .spar-pfm__process-header { text-align: left; } .spar-pfm__eyebrow, .spar-pfm__section-label, .spar-pfm__answer-label, .spar-pfm__material-label, .spar-pfm__function-label, .spar-pfm__trust-label, .spar-pfm__conversion-label { font-size: 0.67rem; letter-spacing: 0.06em; } .spar-pfm__title { font-size: clamp(1.84rem, 9.4vw, 2.62rem); line-height: 1.1; } .spar-pfm__direct-answer { font-size: 0.98rem; line-height: 1.63; } .spar-pfm__intro { font-size: 0.91rem; line-height: 1.66; } .spar-pfm__answer { grid-template-columns: minmax(0, 1fr); padding: 20px 17px; border-radius: 18px; } .spar-pfm__answer-icon { width: 52px; height: 52px; border-radius: 15px; } .spar-pfm__answer-icon svg { width: 32px; height: 32px; } .spar-pfm__materials-header h3, .spar-pfm__functions-content h3, .spar-pfm__system-content h3, .spar-pfm__questions-header h3, .spar-pfm__mistakes-content h3, .spar-pfm__topics-content h3, .spar-pfm__process-header h3, .spar-pfm__conversion h3 { font-size: clamp(1.42rem, 7.4vw, 1.92rem); } .spar-pfm__materials-grid, .spar-pfm__questions-list, .spar-pfm__process-list { grid-template-columns: minmax(0, 1fr); } .spar-pfm__material-card, .spar-pfm__function-card, .spar-pfm__questions-list li, .spar-pfm__process-list li { padding: 18px 16px; border-radius: 16px; } .spar-pfm__diagram { padding: 16px; border-radius: 18px; } .spar-pfm__diagram-example { padding: 16px 14px; border-radius: 15px; } .spar-pfm__wall { min-height: 190px; } .spar-pfm__mistakes { padding: 22px 17px; border-radius: 19px; } .spar-pfm__mistakes-list li { grid-template-columns: 38px minmax(0, 1fr); padding: 12px; } .spar-pfm__mistakes-list li > span { width: 38px; height: 38px; } .spar-pfm__topic-link { grid-template-columns: 47px minmax(0, 1fr); padding: 15px; } .spar-pfm__topic-icon { width: 47px; height: 47px; } .spar-pfm__topic-arrow { display: none; } .spar-pfm__trust { grid-template-columns: minmax(0, 1fr); align-items: start; gap: 15px; padding: 21px 17px; border-radius: 18px; } .spar-pfm__trust-icon { width: 54px; height: 54px; border-radius: 15px; } .spar-pfm__trust-icon svg { width: 31px; height: 31px; } .spar-pfm__trust h3 { font-size: 1.27rem; } .spar-pfm__conversion { padding: 22px 17px; border-radius: 19px; } .spar-pfm__button { width: 100%; min-height: 57px; padding-inline: 13px; font-size: 0.86rem; } } /* ============================================================ SMARTPHONE MOLTO STRETTI ============================================================ */ @media (max-width: 380px) { .spar-pfm__container { width: calc(100% - 22px); } .spar-pfm__title { font-size: 1.7rem; } .spar-pfm__material-card, .spar-pfm__function-card, .spar-pfm__diagram, .spar-pfm__diagram-example, .spar-pfm__questions-list li, .spar-pfm__mistakes, .spar-pfm__topic-link, .spar-pfm__process-list li, .spar-pfm__trust, .spar-pfm__conversion { padding-inline: 14px; } .spar-pfm__button { gap: 8px; padding-inline: 10px; font-size: 0.82rem; } .spar-pfm__button svg { flex-basis: 21px; width: 21px; height: 21px; } } /* ============================================================ ACCESSIBILITÀ ============================================================ */ @media (prefers-reduced-motion: reduce) { .spar-pfm__button, .spar-pfm__topic-link { transition: none; } .spar-pfm__button:hover, .spar-pfm__topic-link:hover { transform: none; } } /* ============================================================ STAMPA ============================================================ */ @media print { .spar-pfm { padding: 30px 0; background: #ffffff; } .spar-pfm__mistakes { border: 1px solid var(--spar-pfm-border); background: #ffffff; box-shadow: none; } .spar-pfm__mistakes-content h3, .spar-pfm__mistakes-list strong { color: var(--spar-pfm-dark); } .spar-pfm__mistakes-content > p:not(.spar-pfm__section-label), .spar-pfm__mistakes-list p { color: var(--spar-pfm-muted); } .spar-pfm__actions { display: none; } }#imCell_27 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHTMLObject_1726_27 { position: relative; align-self: start; justify-self: center; max-width: 100%; box-sizing: border-box; z-index: 3; } #imCellStyleGraphics_27 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imCellStyleBorders_27 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } /* ============================================================ TRE APPROFONDIMENTI: 1. FONOASSORBIMENTO VS ISOLAMENTO 2. SINGOLO PANNELLO 3. CARTONGESSO ============================================================ */ /* ============================================================ IMPOSTAZIONI CONDIVISE ============================================================ */ .spar-fia, .spar-psp, .spar-cdi, .spar-fia *, .spar-psp *, .spar-cdi *, .spar-fia *::before, .spar-psp *::before, .spar-cdi *::before, .spar-fia *::after, .spar-psp *::after, .spar-cdi *::after { box-sizing: border-box; } .spar-fia, .spar-psp, .spar-cdi { --spar-materials-dark: #07343b; --spar-materials-deep: #05282e; --spar-materials-medium: #0b5159; --spar-materials-teal: #24bfc1; --spar-materials-teal-light: #d9f4f2; --spar-materials-orange: #ff8a2a; --spar-materials-orange-dark: #c85c0a; --spar-materials-green: #27ad68; --spar-materials-green-dark: #19864f; --spar-materials-white: #ffffff; --spar-materials-cream: #fff8ed; --spar-materials-light: #edf8f7; --spar-materials-text: #173c41; --spar-materials-muted: #557277; --spar-materials-border: #d4e6e4; --spar-materials-danger: #d56652; --spar-materials-shadow: 0 20px 52px rgba(6, 52, 59, 0.1); width: 100%; max-width: 100%; overflow: hidden; padding-block: clamp(64px, 8vw, 105px); color: var(--spar-materials-text); } .spar-fia { background: radial-gradient( circle at 96% 6%, rgba(36, 191, 193, 0.11), transparent 27% ), #ffffff; } .spar-psp { background: radial-gradient( circle at 5% 7%, rgba(255, 138, 42, 0.09), transparent 25% ), var(--spar-materials-cream); } .spar-cdi { background: radial-gradient( circle at 96% 7%, rgba(36, 191, 193, 0.11), transparent 27% ), #ffffff; } .spar-fia h3, .spar-fia h4, .spar-fia h5, .spar-fia p, .spar-fia li, .spar-fia span, .spar-fia strong, .spar-fia small, .spar-fia a, .spar-psp h3, .spar-psp h4, .spar-psp h5, .spar-psp p, .spar-psp li, .spar-psp span, .spar-psp strong, .spar-psp small, .spar-psp a, .spar-cdi h3, .spar-cdi h4, .spar-cdi h5, .spar-cdi p, .spar-cdi li, .spar-cdi span, .spar-cdi strong, .spar-cdi small, .spar-cdi a { max-width: 100%; white-space: normal; overflow-wrap: break-word; word-break: normal; } .spar-fia__container, .spar-psp__container, .spar-cdi__container { width: min(calc(100% - 40px), 1220px); max-width: 1220px; margin-inline: auto; } /* ============================================================ HEADER CONDIVISI ============================================================ */ .spar-fia__header, .spar-psp__header, .spar-cdi__header { width: min(100%, 960px); margin-inline: auto; text-align: center; } .spar-fia__eyebrow, .spar-fia__section-label, .spar-fia__answer-label, .spar-fia__comparison-label, .spar-fia__visual-label, .spar-fia__conversion-label, .spar-psp__eyebrow, .spar-psp__section-label, .spar-psp__answer-label, .spar-psp__conversion-label, .spar-cdi__eyebrow, .spar-cdi__section-label, .spar-cdi__answer-label, .spar-cdi__conversion-label { margin: 0 0 12px; color: var(--spar-materials-orange-dark); font-size: 0.74rem; font-weight: 900; line-height: 1.4; letter-spacing: 0.075em; text-transform: uppercase; } .spar-fia__title, .spar-psp__title, .spar-cdi__title { margin: 0; color: var(--spar-materials-dark); font-size: clamp(1.95rem, 4.1vw, 3.4rem); font-weight: 900; line-height: 1.08; letter-spacing: -0.04em; text-wrap: balance; } .spar-fia__direct-answer, .spar-psp__direct-answer, .spar-cdi__direct-answer { margin: 24px auto 0; color: var(--spar-materials-dark); font-size: clamp(1.04rem, 1.5vw, 1.2rem); font-weight: 650; line-height: 1.7; } .spar-fia__direct-answer strong, .spar-psp__direct-answer strong, .spar-cdi__direct-answer strong { color: inherit; font-weight: 900; } .spar-fia__intro, .spar-psp__intro, .spar-cdi__intro { margin: 14px auto 0; color: var(--spar-materials-muted); font-size: 1rem; line-height: 1.72; } /* ============================================================ RISPOSTE IMMEDIATE ============================================================ */ .spar-fia__answer, .spar-psp__answer, .spar-cdi__answer { display: grid; grid-template-columns: 76px minmax(0, 1fr); align-items: center; gap: 22px; width: min(100%, 1000px); margin: clamp(35px, 5vw, 56px) auto 0; padding: clamp(22px, 3vw, 33px); border: 1px solid rgba(36, 191, 193, 0.28); border-radius: 22px; background: var(--spar-materials-white); box-shadow: var(--spar-materials-shadow); } .spar-fia__answer { background: var(--spar-materials-cream); } .spar-cdi__answer { background: var(--spar-materials-cream); } .spar-fia__answer-icon, .spar-psp__answer-icon, .spar-cdi__answer-icon { display: grid; place-items: center; width: 70px; height: 70px; border-radius: 19px; background: var(--spar-materials-dark); color: var(--spar-materials-teal-light); } .spar-fia__answer-icon svg, .spar-psp__answer-icon svg, .spar-cdi__answer-icon svg { display: block; width: 42px; height: 42px; } .spar-fia__answer-content, .spar-psp__answer-content, .spar-cdi__answer-content { min-width: 0; } .spar-fia__answer-content h4, .spar-psp__answer-content h4, .spar-cdi__answer-content h4 { margin: 0; color: var(--spar-materials-dark); font-size: clamp(1.2rem, 2vw, 1.6rem); font-weight: 900; line-height: 1.3; } .spar-fia__answer-content > p:last-child, .spar-psp__answer-content > p:last-child, .spar-cdi__answer-content > p:last-child { margin: 9px 0 0; color: var(--spar-materials-muted); font-size: 0.95rem; line-height: 1.66; } /* ============================================================ TITOLI INTERNI ============================================================ */ .spar-fia__visual-content h4, .spar-fia__conversion h4, .spar-psp__comparison-content h4, .spar-psp__elements-header h4, .spar-psp__mistakes-content h4, .spar-psp__conversion h4, .spar-cdi__role-content h4, .spar-cdi__comparison-content h4, .spar-cdi__system-header h4, .spar-cdi__mistakes-content h4, .spar-cdi__conversion h4 { margin: 0; color: var(--spar-materials-dark); font-size: clamp(1.45rem, 2.8vw, 2.25rem); font-weight: 900; line-height: 1.2; letter-spacing: -0.03em; text-wrap: balance; } .spar-fia__highlight, .spar-psp__highlight, .spar-psp__mistakes-highlight, .spar-cdi__highlight, .spar-cdi__mistakes-highlight { padding: 15px 17px; border-left: 4px solid var(--spar-materials-orange); border-radius: 0 12px 12px 0; background: #fff0e2; color: var(--spar-materials-dark) !important; font-weight: 750; } /* ============================================================ PRIMO H3 — CONFRONTO FONOASSORBIMENTO / ISOLAMENTO ============================================================ */ .spar-fia__comparison { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 17px; margin-top: clamp(58px, 8vw, 92px); } .spar-fia__comparison-card { display: flex; min-width: 0; flex-direction: column; padding: 25px; border: 1px solid var(--spar-materials-border); border-top: 5px solid var(--spar-materials-orange); border-radius: 20px; background: var(--spar-materials-white); box-shadow: 0 13px 34px rgba(6, 52, 59, 0.08); } .spar-fia__comparison-card--isolation { border-top-color: var(--spar-materials-teal); } .spar-fia__comparison-icon { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 15px; background: #fff0e2; color: var(--spar-materials-orange-dark); } .spar-fia__comparison-card--isolation .spar-fia__comparison-icon { background: var(--spar-materials-light); color: var(--spar-materials-medium); } .spar-fia__comparison-icon svg { width: 29px; height: 29px; } .spar-fia__comparison-label { margin-top: 18px; margin-bottom: 0; font-size: 0.67rem; } .spar-fia__comparison-card h4 { margin: 7px 0 0; color: var(--spar-materials-dark); font-size: 1.2rem; font-weight: 900; line-height: 1.35; } .spar-fia__comparison-card > p:not(.spar-fia__comparison-label) { margin: 10px 0 0; color: var(--spar-materials-muted); font-size: 0.88rem; line-height: 1.62; } .spar-fia__comparison-card ul { display: grid; gap: 9px; margin: 18px 0 0; padding: 0; list-style: none; } .spar-fia__comparison-card li { position: relative; padding-left: 19px; color: var(--spar-materials-muted); font-size: 0.85rem; line-height: 1.55; } .spar-fia__comparison-card li::before { content: ""; position: absolute; top: 0.62em; left: 0; width: 7px; height: 7px; border-radius: 50%; background: var(--spar-materials-orange); } .spar-fia__comparison-card--isolation li::before { background: var(--spar-materials-teal); } .spar-fia__comparison-note { margin-top: auto !important; padding-top: 16px; border-top: 1px solid var(--spar-materials-border); color: var(--spar-materials-dark) !important; font-weight: 750; } /* ============================================================ PRIMO H3 — SCHEMA VISIVO ============================================================ */ .spar-fia__visual { display: grid; grid-template-columns: minmax(500px, 1.1fr) minmax(0, 0.9fr); align-items: center; gap: clamp(35px, 5vw, 66px); margin-top: clamp(58px, 8vw, 92px); } .spar-fia__visual-diagram { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; min-width: 0; padding: 20px; border: 1px solid rgba(36, 191, 193, 0.26); border-radius: 21px; background: var(--spar-materials-white); box-shadow: var(--spar-materials-shadow); } .spar-fia__visual-card { min-width: 0; padding: 17px; border: 1px solid var(--spar-materials-border); border-top: 5px solid var(--spar-materials-orange); border-radius: 16px; } .spar-fia__visual-card--isolation { border-top-color: var(--spar-materials-teal); } .spar-fia__visual-label { margin-bottom: 14px; font-size: 0.66rem; } .spar-fia__visual-room { position: relative; min-height: 230px; overflow: hidden; border: 10px solid #d3dfde; border-radius: 12px; background: var(--spar-materials-light); } .spar-fia__visual-source, .spar-fia__visual-panel, .spar-fia__visual-neighbor, .spar-fia__visual-wall, .spar-fia__visual-counterwall, .spar-fia__visual-protected { position: absolute; display: grid; place-items: center; padding: 8px; font-size: 0.61rem; font-weight: 900; line-height: 1.3; text-align: center; text-transform: uppercase; } .spar-fia__visual-source { left: 13%; bottom: 29px; width: 37%; height: 66px; border: 2px solid var(--spar-materials-dark); border-radius: 12px; background: #ffffff; color: var(--spar-materials-dark); } .spar-fia__visual-panel { top: 12%; right: 7%; bottom: 12%; width: 24%; border-radius: 10px; background: repeating-linear-gradient( 45deg, #ffe7d1, #ffe7d1 8px, #ffd5b1 8px, #ffd5b1 16px ); color: #703507; writing-mode: vertical-rl; transform: rotate(180deg); } .spar-fia__visual-wave { position: absolute; color: var(--spar-materials-orange-dark); font-weight: 900; } .spar-fia__visual-wave--one { left: 47%; bottom: 68px; } .spar-fia__visual-wave--two { left: 55%; bottom: 83px; } .spar-fia__visual-neighbor { top: 0; bottom: 0; left: 0; width: 28%; background: #fff0e2; color: #703507; writing-mode: vertical-rl; transform: rotate(180deg); } .spar-fia__visual-wall { top: 0; bottom: 0; left: 28%; width: 18%; background: repeating-linear-gradient( 45deg, #d9e0e0, #d9e0e0 8px, #c9d2d2 8px, #c9d2d2 16px ); color: #40575b; writing-mode: vertical-rl; transform: rotate(180deg); } .spar-fia__visual-counterwall { top: 0; bottom: 0; left: 46%; width: 20%; background: repeating-linear-gradient( 135deg, #cbeae8, #cbeae8 8px, #b5dfdc 8px, #b5dfdc 16px ); color: var(--spar-materials-dark); writing-mode: vertical-rl; transform: rotate(180deg); } .spar-fia__visual-protected { top: 0; right: 0; bottom: 0; width: 34%; background: var(--spar-materials-dark); color: #ffffff; writing-mode: vertical-rl; transform: rotate(180deg); } .spar-fia__visual-card > p:last-child { margin: 13px 0 0; color: var(--spar-materials-muted); font-size: 0.78rem; line-height: 1.53; } .spar-fia__visual-content { min-width: 0; } .spar-fia__visual-content > p:not(.spar-fia__section-label) { margin: 17px 0 0; color: var(--spar-materials-muted); font-size: 0.97rem; line-height: 1.7; } .spar-fia__visual-content > p + p { margin-top: 11px; } /* ============================================================ SECONDO E TERZO H3 — BLOCCHI A DUE COLONNE ============================================================ */ .spar-psp__comparison, .spar-cdi__role, .spar-cdi__comparison { display: grid; grid-template-columns: minmax(500px, 1.1fr) minmax(0, 0.9fr); align-items: center; gap: clamp(35px, 5vw, 66px); margin-top: clamp(58px, 8vw, 92px); } .spar-cdi__role { grid-template-columns: minmax(0, 0.9fr) minmax(430px, 1.1fr); } .spar-psp__comparison-content, .spar-cdi__role-content, .spar-cdi__comparison-content { min-width: 0; } .spar-psp__comparison-content > p:not(.spar-psp__section-label), .spar-cdi__role-content > p:not(.spar-cdi__section-label), .spar-cdi__comparison-content > p:not(.spar-cdi__section-label) { margin: 17px 0 0; color: var(--spar-materials-muted); font-size: 0.97rem; line-height: 1.7; } .spar-psp__comparison-content > p + p, .spar-cdi__role-content > p + p, .spar-cdi__comparison-content > p + p { margin-top: 11px; } /* ============================================================ DIAGRAMMI PANNELLO E CARTONGESSO ============================================================ */ .spar-psp__diagram, .spar-cdi__diagram { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; min-width: 0; padding: 20px; border: 1px solid rgba(36, 191, 193, 0.26); border-radius: 21px; background: var(--spar-materials-white); box-shadow: var(--spar-materials-shadow); } .spar-psp__diagram-card, .spar-cdi__diagram-card { min-width: 0; padding: 17px; border: 1px solid var(--spar-materials-border); border-top: 5px solid var(--spar-materials-danger); border-radius: 16px; background: #ffffff; } .spar-psp__diagram-card--complete, .spar-cdi__diagram-card--system { border-top-color: var(--spar-materials-teal); } .spar-psp__diagram-card header, .spar-cdi__diagram-card header { display: grid; grid-template-columns: 40px minmax(0, 1fr); align-items: center; gap: 10px; } .spar-psp__diagram-card header > span, .spar-cdi__diagram-card header > span { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: #fff0ed; color: #a23b2a; font-weight: 900; } .spar-psp__diagram-card--complete header > span, .spar-cdi__diagram-card--system header > span { background: var(--spar-materials-light); color: var(--spar-materials-medium); } .spar-psp__diagram-card header small, .spar-cdi__diagram-card header small { display: block; color: var(--spar-materials-muted); font-size: 0.63rem; font-weight: 750; line-height: 1.35; text-transform: uppercase; } .spar-psp__diagram-card header strong, .spar-cdi__diagram-card header strong { display: block; margin-top: 2px; color: var(--spar-materials-dark); font-size: 0.88rem; font-weight: 900; line-height: 1.35; } .spar-psp__wall, .spar-cdi__wall { display: grid; gap: 4px; min-height: 225px; margin-top: 16px; } .spar-psp__wall--single, .spar-cdi__wall--direct { grid-template-columns: 1fr 0.38fr; } .spar-psp__wall--complete, .spar-cdi__wall--system { grid-template-columns: 1fr 0.7fr 0.72fr 0.88fr 0.95fr; } .spar-psp__wall > span, .spar-cdi__wall > span { display: flex; min-width: 0; align-items: center; justify-content: center; padding: 7px; border-radius: 8px; font-size: 0.57rem; font-weight: 900; line-height: 1.25; text-align: center; text-transform: uppercase; writing-mode: vertical-rl; transform: rotate(180deg); } .spar-psp__wall-existing, .spar-cdi__wall-existing { background: repeating-linear-gradient( 45deg, #d9e0e0, #d9e0e0 8px, #c9d2d2 8px, #c9d2d2 16px ); color: #40575b; } .spar-psp__wall-panel, .spar-cdi__wall-board { border: 2px solid var(--spar-materials-danger); background: #fff0ed; color: #8b3425; } .spar-psp__diagram-card--complete .spar-psp__wall-mass, .spar-cdi__diagram-card--system .spar-cdi__wall-board { border: 0; background: var(--spar-materials-dark); color: #ffffff; } .spar-psp__wall-gap, .spar-cdi__wall-gap { border: 1px dashed var(--spar-materials-orange); background: var(--spar-materials-cream); color: var(--spar-materials-orange-dark); } .spar-psp__wall-frame, .spar-cdi__wall-frame { border: 2px solid var(--spar-materials-dark); background: var(--spar-materials-light); color: var(--spar-materials-dark); } .spar-psp__wall-material, .spar-cdi__wall-material { background: repeating-linear-gradient( 45deg, #dff3f1, #dff3f1 8px, #caeae7 8px, #caeae7 16px ); color: var(--spar-materials-dark); } .spar-psp__diagram-card > p, .spar-cdi__diagram-card > p { margin: 13px 0 0; color: var(--spar-materials-muted); font-size: 0.78rem; line-height: 1.53; } /* ============================================================ GRIGLIE ELEMENTI ============================================================ */ .spar-psp__elements, .spar-cdi__system { margin-top: clamp(58px, 8vw, 92px); } .spar-psp__elements-header, .spar-cdi__system-header { width: min(100%, 880px); margin-inline: auto; text-align: center; } .spar-psp__elements-header > p:last-child, .spar-cdi__system-header > p:last-child { margin: 16px auto 0; color: var(--spar-materials-muted); font-size: 0.97rem; line-height: 1.7; } .spar-psp__elements-grid, .spar-cdi__system-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 31px; } .spar-psp__element-card, .spar-cdi__system-card { min-width: 0; padding: 21px; border: 1px solid var(--spar-materials-border); border-top: 5px solid var(--spar-materials-dark); border-radius: 17px; background: var(--spar-materials-white); box-shadow: 0 11px 29px rgba(6, 52, 59, 0.07); } .spar-psp__element-card--teal, .spar-cdi__system-card--teal { border-top-color: var(--spar-materials-teal); } .spar-psp__element-card--orange, .spar-cdi__system-card--orange { border-top-color: var(--spar-materials-orange); } .spar-psp__element-card--green, .spar-cdi__system-card--green { border-top-color: var(--spar-materials-green); } .spar-psp__element-card--blue, .spar-cdi__system-card--blue { border-top-color: var(--spar-materials-medium); } .spar-psp__element-card--cream, .spar-cdi__system-card--cream { border-top-color: #d6a33a; } .spar-psp__element-card > span, .spar-cdi__system-card > span { color: rgba(7, 52, 59, 0.26); font-size: 1.45rem; font-weight: 950; line-height: 1; } .spar-psp__element-card h5, .spar-cdi__system-card h5 { margin: 15px 0 0; color: var(--spar-materials-dark); font-size: 1rem; font-weight: 900; line-height: 1.35; } .spar-psp__element-card p, .spar-cdi__system-card p { margin: 8px 0 0; color: var(--spar-materials-muted); font-size: 0.84rem; line-height: 1.6; } /* ============================================================ TERZO H3 — RUOLO CARTONGESSO ============================================================ */ .spar-cdi__role-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; min-width: 0; } .spar-cdi__role-card { min-width: 0; padding: 19px; border: 1px solid var(--spar-materials-border); border-radius: 16px; background: var(--spar-materials-white); box-shadow: 0 11px 29px rgba(6, 52, 59, 0.07); } .spar-cdi__role-card > span { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; background: var(--spar-materials-light); color: var(--spar-materials-medium); font-weight: 900; } .spar-cdi__role-card h5 { margin: 14px 0 0; color: var(--spar-materials-dark); font-size: 0.97rem; font-weight: 900; line-height: 1.35; } .spar-cdi__role-card p { margin: 7px 0 0; color: var(--spar-materials-muted); font-size: 0.82rem; line-height: 1.57; } /* ============================================================ BLOCCHI ERRORI ============================================================ */ .spar-psp__mistakes, .spar-cdi__mistakes { display: grid; grid-template-columns: minmax(0, 0.92fr) minmax(430px, 1.08fr); align-items: center; gap: clamp(35px, 5vw, 66px); margin-top: clamp(58px, 8vw, 92px); padding: clamp(27px, 4vw, 46px); border-radius: 24px; background: radial-gradient( circle at 96% 4%, rgba(36, 191, 193, 0.2), transparent 30% ), linear-gradient( 135deg, var(--spar-materials-deep), var(--spar-materials-dark) ); box-shadow: 0 24px 60px rgba(3, 35, 40, 0.2); } .spar-psp__mistakes .spar-psp__section-label, .spar-cdi__mistakes .spar-cdi__section-label { color: var(--spar-materials-orange); } .spar-psp__mistakes-content h4, .spar-cdi__mistakes-content h4 { color: #ffffff; } .spar-psp__mistakes-content > p:not(.spar-psp__section-label), .spar-cdi__mistakes-content > p:not(.spar-cdi__section-label) { margin: 17px 0 0; color: rgba(255, 255, 255, 0.74); font-size: 0.97rem; line-height: 1.7; } .spar-psp__mistakes-highlight, .spar-cdi__mistakes-highlight { border-left-color: var(--spar-materials-orange); background: rgba(255, 255, 255, 0.08); color: #ffffff !important; } .spar-psp__mistakes-list, .spar-cdi__mistakes-list { display: grid; gap: 11px; min-width: 0; margin: 0; padding: 0; list-style: none; } .spar-psp__mistakes-list li, .spar-cdi__mistakes-list li { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 11px; min-width: 0; padding: 14px; border: 1px solid rgba(255, 255, 255, 0.13); border-radius: 14px; background: rgba(255, 255, 255, 0.07); } .spar-psp__mistakes-list li > span, .spar-cdi__mistakes-list li > span { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: rgba(255, 138, 42, 0.16); color: var(--spar-materials-orange); font-size: 1rem; font-weight: 900; } .spar-psp__mistakes-list strong, .spar-cdi__mistakes-list strong { display: block; color: #ffffff; font-size: 0.89rem; font-weight: 900; line-height: 1.4; } .spar-psp__mistakes-list p, .spar-cdi__mistakes-list p { margin: 5px 0 0; color: rgba(255, 255, 255, 0.67); font-size: 0.8rem; line-height: 1.52; } /* ============================================================ CTA CONDIVISE ============================================================ */ .spar-fia__conversion, .spar-psp__conversion, .spar-cdi__conversion { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(330px, 0.92fr); align-items: center; gap: clamp(30px, 5vw, 64px); margin-top: clamp(52px, 7vw, 82px); padding: clamp(26px, 4vw, 45px); border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 23px; background: var(--spar-materials-white); box-shadow: var(--spar-materials-shadow); } .spar-fia__conversion { background: var(--spar-materials-cream); } .spar-cdi__conversion { background: var(--spar-materials-cream); } .spar-fia__conversion-content, .spar-psp__conversion-content, .spar-cdi__conversion-content { min-width: 0; } .spar-fia__conversion-content > p:not(.spar-fia__conversion-label), .spar-psp__conversion-content > p:not(.spar-psp__conversion-label), .spar-cdi__conversion-content > p:not(.spar-cdi__conversion-label) { margin: 15px 0 0; color: var(--spar-materials-muted); font-size: 0.95rem; line-height: 1.69; } .spar-fia__conversion-content > p + p, .spar-psp__conversion-content > p + p, .spar-cdi__conversion-content > p + p { margin-top: 10px; } .spar-fia__actions, .spar-psp__actions, .spar-cdi__actions { display: grid; gap: 11px; min-width: 0; } .spar-fia__button, .spar-psp__button, .spar-cdi__button { display: flex; min-width: 0; min-height: 57px; align-items: center; justify-content: center; padding: 13px 17px; border: 2px solid transparent; border-radius: 12px; font-family: inherit; font-size: 0.9rem; font-weight: 850; line-height: 1.3; text-align: center; text-decoration: none; transition: transform 180ms ease, background-color 180ms ease, border-color 180ms ease; } .spar-fia__button:hover, .spar-psp__button:hover, .spar-cdi__button:hover { transform: translateY(-2px); } .spar-fia__button:focus-visible, .spar-psp__button:focus-visible, .spar-cdi__button:focus-visible { outline: 3px solid var(--spar-materials-dark); outline-offset: 4px; } .spar-fia__button--primary, .spar-psp__button--primary, .spar-cdi__button--primary { background: var(--spar-materials-orange); color: #2c1504; } .spar-fia__button--primary:hover, .spar-psp__button--primary:hover, .spar-cdi__button--primary:hover { background: #ff9b43; } .spar-fia__button--whatsapp, .spar-psp__button--whatsapp, .spar-cdi__button--whatsapp { background: var(--spar-materials-green); color: #ffffff; } .spar-fia__button--whatsapp:hover, .spar-psp__button--whatsapp:hover, .spar-cdi__button--whatsapp:hover { background: var(--spar-materials-green-dark); } .spar-fia__button--phone, .spar-psp__button--phone, .spar-cdi__button--phone { border-color: rgba(7, 52, 59, 0.3); background: #ffffff; color: var(--spar-materials-dark); } .spar-fia__button--phone span, .spar-psp__button--phone span, .spar-cdi__button--phone span { display: grid; gap: 1px; font-size: 0.68rem; line-height: 1.15; text-transform: uppercase; } .spar-fia__button--phone strong, .spar-psp__button--phone strong, .spar-cdi__button--phone strong { color: inherit; font-size: 1rem; font-weight: 900; } /* ============================================================ NOTEBOOK E TABLET ORIZZONTALE ============================================================ */ @media (max-width: 1100px) { .spar-fia__visual, .spar-psp__comparison, .spar-psp__mistakes, .spar-cdi__role, .spar-cdi__comparison, .spar-cdi__mistakes, .spar-fia__conversion, .spar-psp__conversion, .spar-cdi__conversion { grid-template-columns: minmax(0, 1fr); } .spar-psp__elements-grid, .spar-cdi__system-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-fia__actions, .spar-psp__actions, .spar-cdi__actions { grid-template-columns: repeat(3, minmax(0, 1fr)); } .spar-fia__visual-content, .spar-psp__comparison-content, .spar-psp__mistakes-content, .spar-cdi__role-content, .spar-cdi__comparison-content, .spar-cdi__mistakes-content { max-width: 850px; } .spar-fia__visual-diagram, .spar-psp__diagram, .spar-psp__mistakes-list, .spar-cdi__role-grid, .spar-cdi__diagram, .spar-cdi__mistakes-list { max-width: 850px; } } /* ============================================================ TABLET ============================================================ */ @media (max-width: 820px) { .spar-fia__container, .spar-psp__container, .spar-cdi__container { width: min(calc(100% - 32px), 780px); } .spar-fia__answer, .spar-psp__answer, .spar-cdi__answer { grid-template-columns: 60px minmax(0, 1fr); gap: 17px; } .spar-fia__answer-icon, .spar-psp__answer-icon, .spar-cdi__answer-icon { width: 58px; height: 58px; } .spar-fia__comparison, .spar-fia__visual-diagram, .spar-psp__diagram, .spar-cdi__diagram { grid-template-columns: minmax(0, 1fr); } .spar-fia__actions, .spar-psp__actions, .spar-cdi__actions { grid-template-columns: minmax(0, 1fr); } } /* ============================================================ MOBILE ============================================================ */ @media (max-width: 580px) { .spar-fia, .spar-psp, .spar-cdi { padding-block: 50px 62px; } .spar-fia__container, .spar-psp__container, .spar-cdi__container { width: calc(100% - 28px); } .spar-fia__header, .spar-psp__header, .spar-cdi__header, .spar-psp__elements-header, .spar-cdi__system-header { text-align: left; } .spar-fia__eyebrow, .spar-fia__section-label, .spar-fia__answer-label, .spar-fia__comparison-label, .spar-fia__visual-label, .spar-fia__conversion-label, .spar-psp__eyebrow, .spar-psp__section-label, .spar-psp__answer-label, .spar-psp__conversion-label, .spar-cdi__eyebrow, .spar-cdi__section-label, .spar-cdi__answer-label, .spar-cdi__conversion-label { font-size: 0.67rem; letter-spacing: 0.06em; } .spar-fia__title, .spar-psp__title, .spar-cdi__title { font-size: clamp(1.82rem, 9.3vw, 2.58rem); line-height: 1.1; } .spar-fia__direct-answer, .spar-psp__direct-answer, .spar-cdi__direct-answer { font-size: 0.98rem; line-height: 1.63; } .spar-fia__intro, .spar-psp__intro, .spar-cdi__intro { font-size: 0.91rem; line-height: 1.66; } .spar-fia__answer, .spar-psp__answer, .spar-cdi__answer { grid-template-columns: minmax(0, 1fr); padding: 20px 17px; border-radius: 18px; } .spar-fia__answer-icon, .spar-psp__answer-icon, .spar-cdi__answer-icon { width: 52px; height: 52px; border-radius: 15px; } .spar-fia__answer-icon svg, .spar-psp__answer-icon svg, .spar-cdi__answer-icon svg { width: 32px; height: 32px; } .spar-fia__visual-content h4, .spar-fia__conversion h4, .spar-psp__comparison-content h4, .spar-psp__elements-header h4, .spar-psp__mistakes-content h4, .spar-psp__conversion h4, .spar-cdi__role-content h4, .spar-cdi__comparison-content h4, .spar-cdi__system-header h4, .spar-cdi__mistakes-content h4, .spar-cdi__conversion h4 { font-size: clamp(1.42rem, 7.4vw, 1.92rem); } .spar-fia__comparison-card, .spar-fia__visual-diagram, .spar-fia__visual-card, .spar-psp__diagram, .spar-psp__diagram-card, .spar-cdi__diagram, .spar-cdi__diagram-card { padding: 17px 15px; border-radius: 16px; } .spar-fia__visual-room { min-height: 205px; } .spar-psp__elements-grid, .spar-cdi__role-grid, .spar-cdi__system-grid { grid-template-columns: minmax(0, 1fr); } .spar-psp__element-card, .spar-cdi__role-card, .spar-cdi__system-card { padding: 18px 16px; border-radius: 16px; } .spar-psp__wall, .spar-cdi__wall { min-height: 190px; } .spar-psp__mistakes, .spar-cdi__mistakes { padding: 22px 17px; border-radius: 19px; } .spar-psp__mistakes-list li, .spar-cdi__mistakes-list li { grid-template-columns: 38px minmax(0, 1fr); padding: 12px; } .spar-psp__mistakes-list li > span, .spar-cdi__mistakes-list li > span { width: 38px; height: 38px; } .spar-fia__conversion, .spar-psp__conversion, .spar-cdi__conversion { padding: 22px 17px; border-radius: 19px; } .spar-fia__button, .spar-psp__button, .spar-cdi__button { width: 100%; min-height: 57px; padding-inline: 13px; font-size: 0.86rem; } } /* ============================================================ SMARTPHONE MOLTO STRETTI ============================================================ */ @media (max-width: 380px) { .spar-fia__container, .spar-psp__container, .spar-cdi__container { width: calc(100% - 22px); } .spar-fia__title, .spar-psp__title, .spar-cdi__title { font-size: 1.68rem; } .spar-fia__comparison-card, .spar-fia__visual-diagram, .spar-fia__visual-card, .spar-psp__diagram, .spar-psp__diagram-card, .spar-psp__element-card, .spar-psp__mistakes, .spar-cdi__role-card, .spar-cdi__diagram, .spar-cdi__diagram-card, .spar-cdi__system-card, .spar-cdi__mistakes, .spar-fia__conversion, .spar-psp__conversion, .spar-cdi__conversion { padding-inline: 14px; } .spar-fia__button, .spar-psp__button, .spar-cdi__button { padding-inline: 10px; font-size: 0.82rem; } } /* ============================================================ ACCESSIBILITÀ ============================================================ */ @media (prefers-reduced-motion: reduce) { .spar-fia__button, .spar-psp__button, .spar-cdi__button { transition: none; } .spar-fia__button:hover, .spar-psp__button:hover, .spar-cdi__button:hover { transform: none; } } /* ============================================================ STAMPA ============================================================ */ @media print { .spar-fia, .spar-psp, .spar-cdi { padding: 30px 0; background: #ffffff; } .spar-psp__mistakes, .spar-cdi__mistakes { border: 1px solid var(--spar-materials-border); background: #ffffff; box-shadow: none; } .spar-psp__mistakes-content h4, .spar-cdi__mistakes-content h4, .spar-psp__mistakes-list strong, .spar-cdi__mistakes-list strong { color: var(--spar-materials-dark); } .spar-psp__mistakes-content > p:not(.spar-psp__section-label), .spar-cdi__mistakes-content > p:not(.spar-cdi__section-label), .spar-psp__mistakes-list p, .spar-cdi__mistakes-list p { color: var(--spar-materials-muted); } .spar-fia__actions, .spar-psp__actions, .spar-cdi__actions { display: none; } }#imCell_28 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHTMLObject_1726_28 { position: relative; align-self: start; justify-self: center; max-width: 100%; box-sizing: border-box; z-index: 3; } #imCellStyleGraphics_28 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imCellStyleBorders_28 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } /* ============================================================ H2 — ERRORI DA EVITARE NELL’INSONORIZZAZIONE DI UNA PARETE Pagina: /isolamento-acustico-pareti-roma.html ============================================================ */ .spar-err, .spar-err *, .spar-err *::before, .spar-err *::after { box-sizing: border-box; } .spar-err { --spar-err-dark: #07343b; --spar-err-deep: #05282e; --spar-err-medium: #0b5159; --spar-err-teal: #24bfc1; --spar-err-teal-light: #d9f4f2; --spar-err-orange: #ff8a2a; --spar-err-orange-dark: #c85c0a; --spar-err-green: #27ad68; --spar-err-green-dark: #19864f; --spar-err-danger: #d56652; --spar-err-danger-light: #fff0ed; --spar-err-white: #ffffff; --spar-err-cream: #fff8ed; --spar-err-light: #edf8f7; --spar-err-text: #173c41; --spar-err-muted: #557277; --spar-err-border: #d4e6e4; --spar-err-shadow: 0 20px 52px rgba(6, 52, 59, 0.1); width: 100%; max-width: 100%; overflow: hidden; padding-block: clamp(64px, 8vw, 105px); background: radial-gradient( circle at 5% 7%, rgba(36, 191, 193, 0.1), transparent 27% ), radial-gradient( circle at 96% 94%, rgba(255, 138, 42, 0.08), transparent 25% ), var(--spar-err-cream); color: var(--spar-err-text); } .spar-err h2, .spar-err h3, .spar-err h4, .spar-err h5, .spar-err p, .spar-err li, .spar-err span, .spar-err strong, .spar-err small, .spar-err a { max-width: 100%; white-space: normal; overflow-wrap: break-word; word-break: normal; } .spar-err__container { width: min(calc(100% - 40px), 1220px); margin-inline: auto; } /* ============================================================ INTESTAZIONE ============================================================ */ .spar-err__header { width: min(100%, 980px); margin-inline: auto; text-align: center; } .spar-err__eyebrow, .spar-err__answer-label, .spar-err__section-label, .spar-err__trust-label, .spar-err__conversion-label { margin: 0 0 12px; color: var(--spar-err-orange-dark); font-size: 0.74rem; font-weight: 900; line-height: 1.4; letter-spacing: 0.075em; text-transform: uppercase; } .spar-err__title { margin: 0; color: var(--spar-err-dark); font-size: clamp(2rem, 4.2vw, 3.55rem); font-weight: 900; line-height: 1.08; letter-spacing: -0.04em; text-wrap: balance; } .spar-err__direct-answer { margin: 24px auto 0; color: var(--spar-err-dark); font-size: clamp(1.04rem, 1.5vw, 1.2rem); font-weight: 650; line-height: 1.7; } .spar-err__direct-answer strong { color: inherit; font-weight: 900; } .spar-err__intro { margin: 14px auto 0; color: var(--spar-err-muted); font-size: 1rem; line-height: 1.72; } /* ============================================================ RISPOSTA IMMEDIATA ============================================================ */ .spar-err__answer { display: grid; grid-template-columns: 76px minmax(0, 1fr); align-items: center; gap: 22px; width: min(100%, 1000px); margin: clamp(35px, 5vw, 56px) auto 0; padding: clamp(22px, 3vw, 33px); border: 1px solid rgba(213, 102, 82, 0.25); border-radius: 22px; background: var(--spar-err-white); box-shadow: var(--spar-err-shadow); } .spar-err__answer-icon { display: grid; place-items: center; width: 70px; height: 70px; border-radius: 19px; background: var(--spar-err-danger); color: var(--spar-err-white); } .spar-err__answer-icon svg { display: block; width: 42px; height: 42px; } .spar-err__answer-content { min-width: 0; } .spar-err__answer-content h3 { margin: 0; color: var(--spar-err-dark); font-size: clamp(1.2rem, 2vw, 1.6rem); font-weight: 900; line-height: 1.3; } .spar-err__answer-content > p:last-child { margin: 9px 0 0; color: var(--spar-err-muted); font-size: 0.95rem; line-height: 1.66; } /* ============================================================ IMMAGINE FACOLTATIVA ============================================================ */ .spar-err__media { width: min(100%, 1040px); margin: clamp(38px, 5vw, 58px) auto 0; } .spar-err__media picture, .spar-err__media img { display: block; width: 100%; } .spar-err__media img { height: auto; border-radius: 22px; box-shadow: var(--spar-err-shadow); } .spar-err__media figcaption { margin-top: 12px; color: var(--spar-err-muted); font-size: 0.78rem; line-height: 1.55; text-align: center; } /* ============================================================ PANORAMICA ============================================================ */ .spar-err__overview { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 15px; margin-top: clamp(48px, 7vw, 78px); } .spar-err__overview-card { display: grid; grid-template-columns: minmax(0, 1fr) 28px; align-content: start; gap: 15px 10px; min-width: 0; padding: 21px; border: 1px solid var(--spar-err-border); border-top: 5px solid var(--spar-err-danger); border-radius: 18px; background: var(--spar-err-white); color: var(--spar-err-dark); text-decoration: none; box-shadow: 0 12px 30px rgba(6, 52, 59, 0.07); transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease; } .spar-err__overview-card--teal { border-top-color: var(--spar-err-teal); } .spar-err__overview-card--orange { border-top-color: var(--spar-err-orange); } .spar-err__overview-card--green { border-top-color: var(--spar-err-green); } .spar-err__overview-card:hover { transform: translateY(-3px); border-color: var(--spar-err-teal); box-shadow: 0 17px 38px rgba(6, 52, 59, 0.11); } .spar-err__overview-card:focus-visible { outline: 3px solid var(--spar-err-orange); outline-offset: 4px; } .spar-err__overview-number { grid-column: 1 / -1; color: rgba(7, 52, 59, 0.23); font-size: 1.5rem; font-weight: 950; line-height: 1; } .spar-err__overview-content { display: grid; min-width: 0; gap: 7px; } .spar-err__overview-content strong { color: var(--spar-err-dark); font-size: 0.98rem; font-weight: 900; line-height: 1.4; } .spar-err__overview-content small { color: var(--spar-err-muted); font-size: 0.79rem; line-height: 1.52; } .spar-err__overview-arrow { align-self: center; color: var(--spar-err-orange-dark); font-size: 1.25rem; font-weight: 900; text-align: right; } /* ============================================================ APPROFONDIMENTI ============================================================ */ .spar-err__detail { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(470px, 1.1fr); align-items: center; gap: clamp(35px, 5vw, 68px); margin-top: clamp(64px, 9vw, 105px); scroll-margin-top: 110px; } .spar-err__detail--dark { padding: clamp(28px, 4vw, 48px); border-radius: 25px; background: radial-gradient( circle at 96% 4%, rgba(36, 191, 193, 0.2), transparent 30% ), linear-gradient( 135deg, var(--spar-err-deep), var(--spar-err-dark) ); box-shadow: 0 24px 60px rgba(3, 35, 40, 0.2); } .spar-err__detail-content { min-width: 0; } .spar-err__detail-content h3, .spar-err__correct-header h3, .spar-err__process-content h3, .spar-err__trust h3, .spar-err__conversion h3 { margin: 0; color: var(--spar-err-dark); font-size: clamp(1.5rem, 2.9vw, 2.35rem); font-weight: 900; line-height: 1.18; letter-spacing: -0.03em; text-wrap: balance; } .spar-err__detail--dark .spar-err__section-label { color: var(--spar-err-orange); } .spar-err__detail--dark .spar-err__detail-content h3 { color: var(--spar-err-white); } .spar-err__detail-answer { margin: 19px 0 0; color: var(--spar-err-dark); font-size: 1.02rem; font-weight: 750; line-height: 1.68; } .spar-err__detail-content > p:not( .spar-err__section-label, .spar-err__detail-answer, .spar-err__highlight ) { margin: 13px 0 0; color: var(--spar-err-muted); font-size: 0.96rem; line-height: 1.7; } .spar-err__detail--dark .spar-err__detail-answer { color: var(--spar-err-white); } .spar-err__detail--dark .spar-err__detail-content > p:not( .spar-err__section-label, .spar-err__detail-answer, .spar-err__highlight ) { color: rgba(255, 255, 255, 0.72); } .spar-err__highlight { margin: 18px 0 0; padding: 15px 17px; border-left: 4px solid var(--spar-err-orange); border-radius: 0 12px 12px 0; background: #fff0e2; color: var(--spar-err-dark); font-size: 0.94rem; font-weight: 750; line-height: 1.65; } .spar-err__detail--dark .spar-err__highlight { background: rgba(255, 255, 255, 0.08); color: var(--spar-err-white); } /* ============================================================ DIAGRAMMA APPLICAZIONE DIRETTA ============================================================ */ .spar-err__direct-diagram { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; min-width: 0; padding: 20px; border: 1px solid rgba(36, 191, 193, 0.26); border-radius: 21px; background: var(--spar-err-white); box-shadow: var(--spar-err-shadow); } .spar-err__diagram-card { min-width: 0; padding: 17px; border: 1px solid var(--spar-err-border); border-top: 5px solid var(--spar-err-danger); border-radius: 16px; background: var(--spar-err-white); } .spar-err__diagram-card--right { border-top-color: var(--spar-err-teal); } .spar-err__diagram-card header { display: grid; grid-template-columns: 40px minmax(0, 1fr); align-items: center; gap: 10px; } .spar-err__diagram-card header > span { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: var(--spar-err-danger-light); color: #a23b2a; font-weight: 900; } .spar-err__diagram-card--right header > span { background: var(--spar-err-light); color: var(--spar-err-medium); } .spar-err__diagram-card header small { display: block; color: var(--spar-err-muted); font-size: 0.63rem; font-weight: 750; line-height: 1.35; text-transform: uppercase; } .spar-err__diagram-card header strong { display: block; margin-top: 2px; color: var(--spar-err-dark); font-size: 0.88rem; font-weight: 900; line-height: 1.35; } .spar-err__wall { display: grid; gap: 4px; min-height: 225px; margin-top: 16px; } .spar-err__wall--direct { grid-template-columns: 1fr 0.4fr; } .spar-err__wall--system { grid-template-columns: 1fr 0.7fr 0.72fr 0.88fr 0.95fr; } .spar-err__wall > span { display: flex; min-width: 0; align-items: center; justify-content: center; padding: 7px; border-radius: 8px; font-size: 0.56rem; font-weight: 900; line-height: 1.25; text-align: center; text-transform: uppercase; writing-mode: vertical-rl; transform: rotate(180deg); } .spar-err__wall-existing { background: repeating-linear-gradient( 45deg, #d9e0e0, #d9e0e0 8px, #c9d2d2 8px, #c9d2d2 16px ); color: #40575b; } .spar-err__wall-product { border: 2px solid var(--spar-err-danger); background: var(--spar-err-danger-light); color: #8b3425; } .spar-err__wall-gap { border: 1px dashed var(--spar-err-orange); background: var(--spar-err-cream); color: var(--spar-err-orange-dark); } .spar-err__wall-frame { border: 2px solid var(--spar-err-dark); background: var(--spar-err-light); color: var(--spar-err-dark); } .spar-err__wall-material { background: repeating-linear-gradient( 45deg, #dff3f1, #dff3f1 8px, #caeae7 8px, #caeae7 16px ); color: var(--spar-err-dark); } .spar-err__wall-mass { background: var(--spar-err-dark); color: var(--spar-err-white); } .spar-err__diagram-card > p { margin: 13px 0 0; color: var(--spar-err-muted); font-size: 0.78rem; line-height: 1.53; } /* ============================================================ MAPPA DEI PERCORSI LATERALI ============================================================ */ .spar-err__lateral-map { min-width: 0; padding: 20px; border: 1px solid rgba(255, 255, 255, 0.14); border-radius: 21px; background: rgba(255, 255, 255, 0.08); } .spar-err__lateral-room { position: relative; min-height: 360px; overflow: hidden; border-radius: 15px; background: var(--spar-err-white); } .spar-err__lateral-ceiling, .spar-err__lateral-floor, .spar-err__lateral-wall, .spar-err__lateral-side, .spar-err__lateral-center { position: absolute; display: grid; place-items: center; padding: 8px; color: var(--spar-err-dark); font-size: 0.66rem; font-weight: 900; line-height: 1.3; text-align: center; text-transform: uppercase; } .spar-err__lateral-ceiling { top: 0; right: 0; left: 0; height: 18%; background: repeating-linear-gradient( 45deg, #d9e0e0, #d9e0e0 8px, #c9d2d2 8px, #c9d2d2 16px ); } .spar-err__lateral-floor { right: 0; bottom: 0; left: 0; height: 18%; background: repeating-linear-gradient( 135deg, #d9e0e0, #d9e0e0 8px, #c9d2d2 8px, #c9d2d2 16px ); } .spar-err__lateral-wall { top: 18%; bottom: 18%; left: 0; width: 20%; background: #ffe6cf; color: #703507; writing-mode: vertical-rl; transform: rotate(180deg); } .spar-err__lateral-side { top: 18%; right: 0; bottom: 18%; width: 20%; background: #d9f4f2; writing-mode: vertical-rl; transform: rotate(180deg); } .spar-err__lateral-center { top: 30%; right: 30%; bottom: 30%; left: 30%; border: 2px solid var(--spar-err-dark); border-radius: 14px; background: var(--spar-err-light); } .spar-err__lateral-arrow { position: absolute; z-index: 2; color: var(--spar-err-danger); font-size: 2rem; font-weight: 900; } .spar-err__lateral-arrow--top { top: 21%; left: 50%; transform: translateX(-50%); } .spar-err__lateral-arrow--bottom { bottom: 21%; left: 50%; transform: translateX(-50%); } .spar-err__lateral-arrow--left { top: 50%; left: 22%; transform: translateY(-50%); } .spar-err__lateral-arrow--right { top: 50%; right: 22%; transform: translateY(-50%); } .spar-err__lateral-legend { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 14px; } .spar-err__lateral-legend p { margin: 0; padding: 13px; border: 1px solid rgba(255, 255, 255, 0.12); border-radius: 12px; background: rgba(255, 255, 255, 0.07); color: rgba(255, 255, 255, 0.72); font-size: 0.78rem; line-height: 1.53; } .spar-err__lateral-legend strong { color: var(--spar-err-white); } /* ============================================================ PANNELLO DECIBEL ============================================================ */ .spar-err__db-panel { min-width: 0; padding: 23px; border: 1px solid rgba(36, 191, 193, 0.28); border-radius: 21px; background: var(--spar-err-white); box-shadow: var(--spar-err-shadow); } .spar-err__db-header { display: grid; grid-template-columns: 62px minmax(0, 1fr); align-items: center; gap: 15px; } .spar-err__db-header > span { display: grid; place-items: center; width: 62px; height: 62px; border-radius: 17px; background: var(--spar-err-dark); color: var(--spar-err-teal-light); font-size: 1rem; font-weight: 950; } .spar-err__db-header small { display: block; color: var(--spar-err-orange-dark); font-size: 0.66rem; font-weight: 850; line-height: 1.35; text-transform: uppercase; } .spar-err__db-header strong { display: block; margin-top: 4px; color: var(--spar-err-dark); font-size: 1.05rem; font-weight: 900; line-height: 1.4; } .spar-err__db-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 20px; } .spar-err__db-grid article { min-width: 0; padding: 17px; border: 1px solid var(--spar-err-border); border-radius: 15px; background: var(--spar-err-light); } .spar-err__db-grid article > span { color: rgba(7, 52, 59, 0.25); font-size: 1.25rem; font-weight: 950; line-height: 1; } .spar-err__db-grid h4 { margin: 12px 0 0; color: var(--spar-err-dark); font-size: 0.92rem; font-weight: 900; line-height: 1.4; } .spar-err__db-grid p { margin: 6px 0 0; color: var(--spar-err-muted); font-size: 0.78rem; line-height: 1.53; } .spar-err__db-note { margin: 16px 0 0; padding: 13px 15px; border-left: 4px solid var(--spar-err-orange); border-radius: 0 11px 11px 0; background: #fff0e2; color: var(--spar-err-dark); font-size: 0.82rem; font-weight: 750; line-height: 1.58; } /* ============================================================ FAI DA TE ============================================================ */ .spar-err__diy-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; min-width: 0; } .spar-err__diy-card { min-width: 0; padding: 17px; border: 1px solid rgba(255, 255, 255, 0.13); border-top: 4px solid var(--spar-err-danger); border-radius: 15px; background: rgba(255, 255, 255, 0.07); } .spar-err__diy-card--right { border-top-color: var(--spar-err-teal); } .spar-err__diy-card > span { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 11px; background: rgba(213, 102, 82, 0.16); color: #ffb8ac; font-weight: 900; } .spar-err__diy-card--right > span { background: rgba(36, 191, 193, 0.16); color: var(--spar-err-teal-light); } .spar-err__diy-card h4 { margin: 13px 0 0; color: var(--spar-err-white); font-size: 0.93rem; font-weight: 900; line-height: 1.4; } .spar-err__diy-card p { margin: 7px 0 0; color: rgba(255, 255, 255, 0.68); font-size: 0.79rem; line-height: 1.55; } /* ============================================================ APPROCCIO CORRETTO ============================================================ */ .spar-err__correct { margin-top: clamp(64px, 9vw, 105px); } .spar-err__correct-header { width: min(100%, 900px); margin-inline: auto; text-align: center; } .spar-err__correct-header > p:last-child { margin: 16px auto 0; color: var(--spar-err-muted); font-size: 0.97rem; line-height: 1.7; } .spar-err__correct-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; margin: 31px 0 0; padding: 0; list-style: none; } .spar-err__correct-list li { min-width: 0; padding: 20px; border: 1px solid var(--spar-err-border); border-radius: 17px; background: var(--spar-err-white); box-shadow: 0 11px 29px rgba(6, 52, 59, 0.07); } .spar-err__correct-list li > span { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; background: var(--spar-err-dark); color: var(--spar-err-teal-light); font-size: 0.78rem; font-weight: 900; } .spar-err__correct-list strong { display: block; margin-top: 16px; color: var(--spar-err-dark); font-size: 0.9rem; font-weight: 900; line-height: 1.4; } .spar-err__correct-list p { margin: 7px 0 0; color: var(--spar-err-muted); font-size: 0.82rem; line-height: 1.57; } /* ============================================================ PROCESSO ============================================================ */ .spar-err__process { display: grid; grid-template-columns: minmax(0, 0.84fr) minmax(440px, 1.16fr); align-items: center; gap: clamp(35px, 5vw, 66px); margin-top: clamp(64px, 9vw, 100px); } .spar-err__process-content { min-width: 0; } .spar-err__process-content > p:not(.spar-err__section-label) { margin: 17px 0 0; color: var(--spar-err-muted); font-size: 0.97rem; line-height: 1.7; } .spar-err__process-content > p + p { margin-top: 11px; } .spar-err__process-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; min-width: 0; margin: 0; padding: 0; list-style: none; } .spar-err__process-list li { display: grid; grid-template-columns: 42px minmax(0, 1fr); gap: 12px; min-width: 0; padding: 15px; border: 1px solid var(--spar-err-border); border-radius: 15px; background: var(--spar-err-white); box-shadow: 0 10px 27px rgba(6, 52, 59, 0.07); } .spar-err__process-list li > span { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; background: var(--spar-err-dark); color: var(--spar-err-teal-light); font-size: 0.78rem; font-weight: 900; } .spar-err__process-list li > div { min-width: 0; } .spar-err__process-list strong { display: block; color: var(--spar-err-dark); font-size: 0.9rem; font-weight: 900; line-height: 1.4; } .spar-err__process-list p { margin: 5px 0 0; color: var(--spar-err-muted); font-size: 0.81rem; line-height: 1.55; } /* ============================================================ FIDUCIA ============================================================ */ .spar-err__trust { display: grid; grid-template-columns: 74px minmax(0, 1fr); align-items: center; gap: 23px; margin-top: clamp(46px, 6vw, 70px); padding: clamp(24px, 3vw, 35px); border: 1px solid rgba(255, 138, 42, 0.31); border-radius: 21px; background: #fff3e7; } .spar-err__trust-icon { display: grid; place-items: center; width: 70px; height: 70px; border-radius: 20px; background: var(--spar-err-orange); color: #321705; } .spar-err__trust-icon svg { width: 41px; height: 41px; } .spar-err__trust-content { min-width: 0; } .spar-err__trust h3 { font-size: clamp(1.3rem, 2.2vw, 1.85rem); } .spar-err__trust-content > p:last-child { margin: 10px 0 0; color: var(--spar-err-muted); font-size: 0.93rem; line-height: 1.66; } /* ============================================================ CTA ============================================================ */ .spar-err__conversion { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(330px, 0.92fr); align-items: center; gap: clamp(30px, 5vw, 64px); margin-top: clamp(52px, 7vw, 82px); padding: clamp(26px, 4vw, 45px); border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 23px; background: var(--spar-err-white); box-shadow: var(--spar-err-shadow); } .spar-err__conversion-content { min-width: 0; } .spar-err__conversion-content > p:not(.spar-err__conversion-label) { margin: 15px 0 0; color: var(--spar-err-muted); font-size: 0.95rem; line-height: 1.69; } .spar-err__conversion-content > p + p { margin-top: 10px; } .spar-err__actions { display: grid; gap: 11px; min-width: 0; } .spar-err__button { display: flex; min-width: 0; min-height: 57px; align-items: center; justify-content: center; gap: 10px; padding: 13px 17px; border: 2px solid transparent; border-radius: 12px; font-family: inherit; font-size: 0.9rem; font-weight: 850; line-height: 1.3; text-align: center; text-decoration: none; transition: transform 180ms ease, background-color 180ms ease, border-color 180ms ease, box-shadow 180ms ease; } .spar-err__button:hover { transform: translateY(-2px); } .spar-err__button:focus-visible { outline: 3px solid var(--spar-err-dark); outline-offset: 4px; } .spar-err__button svg { flex: 0 0 23px; width: 23px; height: 23px; } .spar-err__button--primary { background: var(--spar-err-orange); color: #2c1504; box-shadow: 0 12px 27px rgba(255, 138, 42, 0.22); } .spar-err__button--primary:hover { background: #ff9b43; } .spar-err__button--whatsapp { background: var(--spar-err-green); color: var(--spar-err-white); box-shadow: 0 12px 27px rgba(39, 173, 104, 0.2); } .spar-err__button--whatsapp:hover { background: var(--spar-err-green-dark); } .spar-err__button--phone { border-color: rgba(7, 52, 59, 0.3); background: var(--spar-err-white); color: var(--spar-err-dark); } .spar-err__button--phone:hover { border-color: var(--spar-err-teal); background: var(--spar-err-light); } .spar-err__phone-text { display: grid; min-width: 0; gap: 1px; text-align: left; } .spar-err__phone-text small { font-size: 0.64rem; font-weight: 750; line-height: 1.1; letter-spacing: 0.055em; text-transform: uppercase; } .spar-err__phone-text strong { color: inherit; font-size: 1rem; font-weight: 900; line-height: 1.15; } /* ============================================================ NOTEBOOK E TABLET ORIZZONTALE ============================================================ */ @media (max-width: 1100px) { .spar-err__overview { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-err__detail, .spar-err__process, .spar-err__conversion { grid-template-columns: minmax(0, 1fr); } .spar-err__detail-content, .spar-err__process-content, .spar-err__conversion-content { max-width: 860px; } .spar-err__direct-diagram, .spar-err__lateral-map, .spar-err__db-panel, .spar-err__diy-grid, .spar-err__process-list { max-width: 860px; } .spar-err__correct-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-err__actions { grid-template-columns: repeat(3, minmax(0, 1fr)); } } /* ============================================================ TABLET ============================================================ */ @media (max-width: 820px) { .spar-err__container { width: min(calc(100% - 32px), 780px); } .spar-err__answer { grid-template-columns: 60px minmax(0, 1fr); gap: 17px; } .spar-err__answer-icon { width: 58px; height: 58px; } .spar-err__direct-diagram { grid-template-columns: minmax(0, 1fr); } .spar-err__lateral-legend { grid-template-columns: minmax(0, 1fr); } .spar-err__actions { grid-template-columns: minmax(0, 1fr); } } /* ============================================================ MOBILE ============================================================ */ @media (max-width: 580px) { .spar-err { padding-block: 50px 62px; } .spar-err__container { width: calc(100% - 28px); } .spar-err__header, .spar-err__correct-header { text-align: left; } .spar-err__eyebrow, .spar-err__answer-label, .spar-err__section-label, .spar-err__trust-label, .spar-err__conversion-label { font-size: 0.67rem; letter-spacing: 0.06em; } .spar-err__title { font-size: clamp(1.84rem, 9.4vw, 2.62rem); line-height: 1.1; } .spar-err__direct-answer { font-size: 0.98rem; line-height: 1.63; } .spar-err__intro { font-size: 0.91rem; line-height: 1.66; } .spar-err__answer { grid-template-columns: minmax(0, 1fr); padding: 20px 17px; border-radius: 18px; } .spar-err__answer-icon { width: 52px; height: 52px; border-radius: 15px; } .spar-err__answer-icon svg { width: 32px; height: 32px; } .spar-err__overview { grid-template-columns: minmax(0, 1fr); } .spar-err__overview-card { padding: 18px 16px; border-radius: 16px; } .spar-err__detail-content h3, .spar-err__correct-header h3, .spar-err__process-content h3, .spar-err__conversion h3 { font-size: clamp(1.42rem, 7.4vw, 1.92rem); } .spar-err__detail--dark { padding: 22px 17px; border-radius: 19px; } .spar-err__direct-diagram, .spar-err__lateral-map, .spar-err__db-panel { padding: 16px; border-radius: 18px; } .spar-err__diagram-card { padding: 16px 14px; border-radius: 15px; } .spar-err__wall { min-height: 190px; } .spar-err__lateral-room { min-height: 300px; } .spar-err__lateral-center { top: 31%; right: 27%; bottom: 31%; left: 27%; font-size: 0.58rem; } .spar-err__db-header { grid-template-columns: 52px minmax(0, 1fr); } .spar-err__db-header > span { width: 52px; height: 52px; border-radius: 15px; } .spar-err__db-grid, .spar-err__diy-grid, .spar-err__correct-list, .spar-err__process-list { grid-template-columns: minmax(0, 1fr); } .spar-err__diy-card, .spar-err__correct-list li, .spar-err__process-list li { padding: 17px 15px; border-radius: 15px; } .spar-err__trust { grid-template-columns: minmax(0, 1fr); align-items: start; gap: 15px; padding: 21px 17px; border-radius: 18px; } .spar-err__trust-icon { width: 54px; height: 54px; border-radius: 15px; } .spar-err__trust-icon svg { width: 31px; height: 31px; } .spar-err__trust h3 { font-size: 1.27rem; } .spar-err__conversion { padding: 22px 17px; border-radius: 19px; } .spar-err__button { width: 100%; min-height: 57px; padding-inline: 13px; font-size: 0.86rem; } } /* ============================================================ SMARTPHONE MOLTO STRETTI ============================================================ */ @media (max-width: 380px) { .spar-err__container { width: calc(100% - 22px); } .spar-err__title { font-size: 1.7rem; } .spar-err__overview-card, .spar-err__direct-diagram, .spar-err__diagram-card, .spar-err__detail--dark, .spar-err__lateral-map, .spar-err__db-panel, .spar-err__diy-card, .spar-err__correct-list li, .spar-err__process-list li, .spar-err__trust, .spar-err__conversion { padding-inline: 14px; } .spar-err__button { gap: 8px; padding-inline: 10px; font-size: 0.82rem; } .spar-err__button svg { flex-basis: 21px; width: 21px; height: 21px; } } /* ============================================================ ACCESSIBILITÀ ============================================================ */ @media (prefers-reduced-motion: reduce) { .spar-err__overview-card, .spar-err__button { transition: none; } .spar-err__overview-card:hover, .spar-err__button:hover { transform: none; } } /* ============================================================ STAMPA ============================================================ */ @media print { .spar-err { padding: 30px 0; background: #ffffff; } .spar-err__detail--dark { border: 1px solid var(--spar-err-border); background: #ffffff; box-shadow: none; } .spar-err__detail--dark .spar-err__detail-content h3, .spar-err__detail--dark .spar-err__detail-answer, .spar-err__diy-card h4, .spar-err__lateral-legend strong { color: var(--spar-err-dark); } .spar-err__detail--dark .spar-err__detail-content > p:not( .spar-err__section-label, .spar-err__detail-answer, .spar-err__highlight ), .spar-err__diy-card p, .spar-err__lateral-legend p { color: var(--spar-err-muted); } .spar-err__actions { display: none; } }#imCell_29 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHTMLObject_1726_29 { position: relative; align-self: start; justify-self: center; max-width: 100%; box-sizing: border-box; z-index: 3; } #imCellStyleGraphics_29 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imCellStyleBorders_29 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } /* ============================================================ H2 — IL SOPRALLUOGO ANALITICO PER LE PARETI A ROMA Pagina: /isolamento-acustico-pareti-roma.html ============================================================ */ .spar-sap, .spar-sap *, .spar-sap *::before, .spar-sap *::after { box-sizing: border-box; } .spar-sap { --spar-sap-dark: #07343b; --spar-sap-deep: #05282e; --spar-sap-medium: #0b5159; --spar-sap-teal: #24bfc1; --spar-sap-teal-light: #d9f4f2; --spar-sap-orange: #ff8a2a; --spar-sap-orange-dark: #c85c0a; --spar-sap-green: #27ad68; --spar-sap-green-dark: #19864f; --spar-sap-white: #ffffff; --spar-sap-cream: #fff8ed; --spar-sap-light: #edf8f7; --spar-sap-text: #173c41; --spar-sap-muted: #557277; --spar-sap-border: #d4e6e4; --spar-sap-danger: #d56652; --spar-sap-shadow: 0 20px 52px rgba(6, 52, 59, 0.1); width: 100%; max-width: 100%; overflow: hidden; padding-block: clamp(64px, 8vw, 105px); background: radial-gradient( circle at 5% 6%, rgba(36, 191, 193, 0.11), transparent 27% ), radial-gradient( circle at 96% 94%, rgba(255, 138, 42, 0.08), transparent 25% ), #ffffff; color: var(--spar-sap-text); } .spar-sap h2, .spar-sap h3, .spar-sap h4, .spar-sap h5, .spar-sap p, .spar-sap li, .spar-sap span, .spar-sap strong, .spar-sap small, .spar-sap a { max-width: 100%; white-space: normal; overflow-wrap: break-word; word-break: normal; } .spar-sap__container { width: min(calc(100% - 40px), 1220px); margin-inline: auto; } /* ============================================================ INTESTAZIONE PRINCIPALE ============================================================ */ .spar-sap__header { width: min(100%, 980px); margin-inline: auto; text-align: center; } .spar-sap__eyebrow, .spar-sap__answer-label, .spar-sap__section-label, .spar-sap__official-label, .spar-sap__background-warning-label, .spar-sap__trust-label, .spar-sap__conversion-label { margin: 0 0 12px; color: var(--spar-sap-orange-dark); font-size: 0.74rem; font-weight: 900; line-height: 1.4; letter-spacing: 0.075em; text-transform: uppercase; } .spar-sap__title { margin: 0; color: var(--spar-sap-dark); font-size: clamp(2rem, 4.2vw, 3.55rem); font-weight: 900; line-height: 1.08; letter-spacing: -0.04em; text-wrap: balance; } .spar-sap__direct-answer { margin: 24px auto 0; color: var(--spar-sap-dark); font-size: clamp(1.04rem, 1.5vw, 1.2rem); font-weight: 650; line-height: 1.7; } .spar-sap__direct-answer strong { color: inherit; font-weight: 900; } .spar-sap__intro { margin: 14px auto 0; color: var(--spar-sap-muted); font-size: 1rem; line-height: 1.72; } /* ============================================================ RISPOSTA IMMEDIATA ============================================================ */ .spar-sap__answer { display: grid; grid-template-columns: 76px minmax(0, 1fr); align-items: center; gap: 22px; width: min(100%, 1000px); margin: clamp(35px, 5vw, 56px) auto 0; padding: clamp(22px, 3vw, 33px); border: 1px solid rgba(36, 191, 193, 0.28); border-radius: 22px; background: var(--spar-sap-cream); box-shadow: var(--spar-sap-shadow); } .spar-sap__answer-icon { display: grid; place-items: center; width: 70px; height: 70px; border-radius: 19px; background: var(--spar-sap-dark); color: var(--spar-sap-teal-light); } .spar-sap__answer-icon svg { display: block; width: 42px; height: 42px; } .spar-sap__answer-content { min-width: 0; } .spar-sap__answer-content h3 { margin: 0; color: var(--spar-sap-dark); font-size: clamp(1.2rem, 2vw, 1.6rem); font-weight: 900; line-height: 1.3; } .spar-sap__answer-content > p:last-child { margin: 9px 0 0; color: var(--spar-sap-muted); font-size: 0.95rem; line-height: 1.66; } /* ============================================================ COLLEGAMENTO UFFICIALE ============================================================ */ .spar-sap__official { display: grid; grid-template-columns: 72px minmax(0, 1fr) minmax(240px, auto); align-items: center; gap: 22px; margin-top: clamp(32px, 5vw, 50px); padding: clamp(22px, 3vw, 32px); border: 1px solid rgba(36, 191, 193, 0.3); border-radius: 22px; background: radial-gradient( circle at 95% 5%, rgba(36, 191, 193, 0.13), transparent 34% ), var(--spar-sap-white); box-shadow: var(--spar-sap-shadow); } .spar-sap__official-icon { display: grid; place-items: center; width: 68px; height: 68px; border-radius: 19px; background: var(--spar-sap-light); color: var(--spar-sap-dark); } .spar-sap__official-icon svg { width: 39px; height: 39px; } .spar-sap__official-content { min-width: 0; } .spar-sap__official-content h3 { margin: 0; color: var(--spar-sap-dark); font-size: clamp(1.22rem, 2vw, 1.62rem); font-weight: 900; line-height: 1.3; } .spar-sap__official-content > p:last-child { margin: 9px 0 0; color: var(--spar-sap-muted); font-size: 0.89rem; line-height: 1.63; } .spar-sap__official-link { display: flex; min-width: 0; min-height: 56px; align-items: center; justify-content: center; gap: 10px; padding: 13px 17px; border: 2px solid var(--spar-sap-dark); border-radius: 12px; background: var(--spar-sap-dark); color: var(--spar-sap-white); font-size: 0.83rem; font-weight: 850; line-height: 1.35; text-align: center; text-decoration: none; transition: transform 180ms ease, background-color 180ms ease, border-color 180ms ease; } .spar-sap__official-link:hover { transform: translateY(-2px); border-color: var(--spar-sap-medium); background: var(--spar-sap-medium); } .spar-sap__official-link:focus-visible { outline: 3px solid var(--spar-sap-orange); outline-offset: 4px; } .spar-sap__official-link svg { flex: 0 0 22px; width: 22px; height: 22px; } /* ============================================================ FOTO DEL SOPRALLUOGO ANALITICO Dimensione controllata e proporzione 3:2 ============================================================ */ .spar-sap__media { width: min(720px, 100%); max-width: 100%; margin: clamp(34px, 4.5vw, 48px) auto 0; } .spar-sap__media-frame { position: relative; display: block; width: 100%; max-width: 100%; aspect-ratio: 3 / 2; overflow: hidden; border: 1px solid rgba(36, 191, 193, 0.26); border-radius: 20px; background: var(--spar-sap-light); box-shadow: 0 18px 44px rgba(6, 52, 59, 0.12); } .spar-sap__media-image { display: block; width: 100% !important; max-width: none !important; height: 100% !important; object-fit: cover !important; object-position: center center !important; } .spar-sap__media figcaption { width: min(100%, 650px); margin: 12px auto 0; color: var(--spar-sap-muted); font-size: 0.78rem; line-height: 1.55; text-align: center; } /* ============================================================ PANORAMICA ============================================================ */ .spar-sap__overview { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: clamp(52px, 7vw, 80px); } .spar-sap__overview-card { display: grid; grid-template-columns: minmax(0, 1fr) 28px; align-content: start; gap: 15px 10px; min-width: 0; padding: 22px; border: 1px solid var(--spar-sap-border); border-top: 5px solid var(--spar-sap-dark); border-radius: 18px; background: var(--spar-sap-white); color: var(--spar-sap-dark); text-decoration: none; box-shadow: 0 12px 30px rgba(6, 52, 59, 0.07); transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease; } .spar-sap__overview-card--teal { border-top-color: var(--spar-sap-teal); } .spar-sap__overview-card--orange { border-top-color: var(--spar-sap-orange); } .spar-sap__overview-card:hover { transform: translateY(-3px); border-color: var(--spar-sap-teal); box-shadow: 0 17px 38px rgba(6, 52, 59, 0.11); } .spar-sap__overview-card:focus-visible { outline: 3px solid var(--spar-sap-orange); outline-offset: 4px; } .spar-sap__overview-number { grid-column: 1 / -1; color: rgba(7, 52, 59, 0.23); font-size: 1.5rem; font-weight: 950; line-height: 1; } .spar-sap__overview-content { display: grid; min-width: 0; gap: 7px; } .spar-sap__overview-content strong { color: var(--spar-sap-dark); font-size: 1rem; font-weight: 900; line-height: 1.4; } .spar-sap__overview-content small { color: var(--spar-sap-muted); font-size: 0.8rem; line-height: 1.52; } .spar-sap__overview-arrow { align-self: center; color: var(--spar-sap-orange-dark); font-size: 1.25rem; font-weight: 900; text-align: right; } /* ============================================================ TITOLI INTERNI ============================================================ */ .spar-sap__detail-content h3, .spar-sap__subheader h4, .spar-sap__measurements-content h4, .spar-sap__avoid-content h4, .spar-sap__trust h4, .spar-sap__conversion h3 { margin: 0; color: var(--spar-sap-dark); font-size: clamp(1.5rem, 2.9vw, 2.35rem); font-weight: 900; line-height: 1.18; letter-spacing: -0.03em; text-wrap: balance; } /* ============================================================ APPROFONDIMENTI PRINCIPALI ============================================================ */ .spar-sap__detail { display: grid; grid-template-columns: minmax(0, 0.92fr) minmax(460px, 1.08fr); align-items: center; gap: clamp(36px, 5vw, 68px); margin-top: clamp(66px, 9vw, 106px); scroll-margin-top: 110px; } .spar-sap__detail--dark { padding: clamp(29px, 4vw, 49px); border-radius: 25px; background: radial-gradient( circle at 96% 4%, rgba(36, 191, 193, 0.2), transparent 30% ), linear-gradient( 135deg, var(--spar-sap-deep), var(--spar-sap-dark) ); box-shadow: 0 24px 60px rgba(3, 35, 40, 0.2); } .spar-sap__detail-content { min-width: 0; } .spar-sap__detail-answer { margin: 19px 0 0; color: var(--spar-sap-dark); font-size: 1.02rem; font-weight: 750; line-height: 1.68; } .spar-sap__detail-content > p:not( .spar-sap__section-label, .spar-sap__detail-answer, .spar-sap__highlight ) { margin: 13px 0 0; color: var(--spar-sap-muted); font-size: 0.96rem; line-height: 1.7; } .spar-sap__detail--dark .spar-sap__section-label { color: var(--spar-sap-orange); } .spar-sap__detail--dark .spar-sap__detail-content h3, .spar-sap__detail--dark .spar-sap__detail-answer { color: var(--spar-sap-white); } .spar-sap__detail--dark .spar-sap__detail-content > p:not( .spar-sap__section-label, .spar-sap__detail-answer, .spar-sap__highlight ) { color: rgba(255, 255, 255, 0.73); } .spar-sap__highlight { margin: 18px 0 0; padding: 15px 17px; border-left: 4px solid var(--spar-sap-orange); border-radius: 0 12px 12px 0; background: #fff0e2; color: var(--spar-sap-dark); font-size: 0.94rem; font-weight: 750; line-height: 1.65; } .spar-sap__detail--dark .spar-sap__highlight { background: rgba(255, 255, 255, 0.08); color: var(--spar-sap-white); } /* ============================================================ GRAFICO RUMORE DI FONDO ============================================================ */ .spar-sap__background-panel { min-width: 0; padding: 22px; border: 1px solid rgba(36, 191, 193, 0.28); border-radius: 21px; background: var(--spar-sap-white); box-shadow: var(--spar-sap-shadow); } .spar-sap__background-header { display: grid; grid-template-columns: 62px minmax(0, 1fr); align-items: center; gap: 15px; } .spar-sap__background-header > span { display: grid; place-items: center; width: 62px; height: 62px; border-radius: 17px; background: var(--spar-sap-dark); color: var(--spar-sap-teal-light); font-size: 1rem; font-weight: 950; } .spar-sap__background-header small { display: block; color: var(--spar-sap-orange-dark); font-size: 0.66rem; font-weight: 850; line-height: 1.35; text-transform: uppercase; } .spar-sap__background-header strong { display: block; margin-top: 4px; color: var(--spar-sap-dark); font-size: 1.05rem; font-weight: 900; line-height: 1.4; } .spar-sap__background-chart { position: relative; min-height: 270px; margin-top: 22px; overflow: hidden; border: 1px solid var(--spar-sap-border); border-radius: 15px; background: linear-gradient( to right, rgba(7, 52, 59, 0.06) 1px, transparent 1px ), linear-gradient( to bottom, rgba(7, 52, 59, 0.06) 1px, transparent 1px ), var(--spar-sap-light); background-size: 42px 42px; } .spar-sap__chart-line { position: absolute; right: 7%; left: 7%; height: 4px; border-radius: 4px; } .spar-sap__chart-line--background { bottom: 32%; background: var(--spar-sap-teal); } .spar-sap__chart-event { position: absolute; bottom: 32%; width: 7%; border-radius: 7px 7px 0 0; background: linear-gradient( to top, var(--spar-sap-orange), #ffb06d ); } .spar-sap__chart-event--one { left: 17%; height: 27%; } .spar-sap__chart-event--two { left: 35%; height: 48%; } .spar-sap__chart-event--three { left: 57%; height: 34%; } .spar-sap__chart-event--four { left: 76%; height: 58%; } .spar-sap__chart-label { position: absolute; z-index: 2; padding: 7px 9px; border-radius: 9px; font-size: 0.65rem; font-weight: 900; line-height: 1.3; text-transform: uppercase; } .spar-sap__chart-label--disturbance { top: 7%; left: 6%; background: #fff0e2; color: var(--spar-sap-orange-dark); } .spar-sap__chart-label--background { right: 6%; bottom: 35%; background: var(--spar-sap-teal-light); color: var(--spar-sap-medium); } .spar-sap__chart-time { position: absolute; right: 6%; bottom: 6%; color: var(--spar-sap-muted); font-size: 0.64rem; font-weight: 800; text-transform: uppercase; } .spar-sap__background-note { margin: 15px 0 0; color: var(--spar-sap-muted); font-size: 0.77rem; line-height: 1.55; } /* ============================================================ IMPORTANZA DEL RUMORE DI FONDO ============================================================ */ .spar-sap__background-importance, .spar-sap__checks, .spar-sap__process { margin-top: clamp(62px, 8vw, 94px); } .spar-sap__subheader { width: min(100%, 900px); margin-inline: auto; text-align: center; } .spar-sap__subheader > p:last-child { margin: 16px auto 0; color: var(--spar-sap-muted); font-size: 0.97rem; line-height: 1.7; } .spar-sap__importance-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 32px; } .spar-sap__importance-card { min-width: 0; padding: 22px; border: 1px solid var(--spar-sap-border); border-top: 5px solid var(--spar-sap-dark); border-radius: 18px; background: var(--spar-sap-white); box-shadow: 0 12px 30px rgba(6, 52, 59, 0.07); } .spar-sap__importance-card--teal { border-top-color: var(--spar-sap-teal); } .spar-sap__importance-card--orange { border-top-color: var(--spar-sap-orange); } .spar-sap__importance-card--green { border-top-color: var(--spar-sap-green); } .spar-sap__importance-card--blue { border-top-color: var(--spar-sap-medium); } .spar-sap__importance-card--cream { border-top-color: #d6a33a; } .spar-sap__importance-card > span { color: rgba(7, 52, 59, 0.24); font-size: 1.45rem; font-weight: 950; line-height: 1; } .spar-sap__importance-card h5 { margin: 15px 0 0; color: var(--spar-sap-dark); font-size: 1rem; font-weight: 900; line-height: 1.4; } .spar-sap__importance-card p { margin: 8px 0 0; color: var(--spar-sap-muted); font-size: 0.84rem; line-height: 1.61; } /* ============================================================ STRUMENTI E PARAMETRI ============================================================ */ .spar-sap__measurements { display: grid; grid-template-columns: minmax(0, 0.88fr) minmax(460px, 1.12fr); align-items: center; gap: clamp(36px, 5vw, 68px); margin-top: clamp(62px, 8vw, 94px); } .spar-sap__measurements-content { min-width: 0; } .spar-sap__measurements-content > p:not( .spar-sap__section-label, .spar-sap__highlight ) { margin: 17px 0 0; color: var(--spar-sap-muted); font-size: 0.97rem; line-height: 1.7; } .spar-sap__measurements-content > p + p { margin-top: 11px; } .spar-sap__measurements-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; min-width: 0; } .spar-sap__measurement-card { min-width: 0; padding: 19px; border: 1px solid var(--spar-sap-border); border-radius: 16px; background: var(--spar-sap-white); box-shadow: 0 11px 29px rgba(6, 52, 59, 0.07); } .spar-sap__measurement-symbol { display: grid; place-items: center; width: 49px; height: 49px; border-radius: 14px; background: var(--spar-sap-light); color: var(--spar-sap-dark); font-size: 0.72rem; font-weight: 950; } .spar-sap__measurement-card h5 { margin: 14px 0 0; color: var(--spar-sap-dark); font-size: 0.95rem; font-weight: 900; line-height: 1.4; } .spar-sap__measurement-card p { margin: 7px 0 0; color: var(--spar-sap-muted); font-size: 0.81rem; line-height: 1.56; } /* ============================================================ AVVERTENZA RUMORE DI FONDO ============================================================ */ .spar-sap__background-warning { display: grid; grid-template-columns: 68px minmax(0, 1fr); align-items: center; gap: 20px; margin-top: clamp(44px, 6vw, 68px); padding: clamp(23px, 3vw, 34px); border: 1px solid rgba(255, 138, 42, 0.3); border-radius: 21px; background: #fff3e7; } .spar-sap__background-warning-icon { display: grid; place-items: center; width: 64px; height: 64px; border-radius: 18px; background: var(--spar-sap-orange); color: #321705; } .spar-sap__background-warning-icon svg { width: 38px; height: 38px; } .spar-sap__background-warning h4 { margin: 0; color: var(--spar-sap-dark); font-size: clamp(1.2rem, 2vw, 1.65rem); font-weight: 900; line-height: 1.3; } .spar-sap__background-warning > div > p:last-child { margin: 9px 0 0; color: var(--spar-sap-muted); font-size: 0.91rem; line-height: 1.66; } /* ============================================================ MAPPA DELLA PARETE ============================================================ */ .spar-sap__wall-map { min-width: 0; padding: 20px; border: 1px solid rgba(255, 255, 255, 0.14); border-radius: 21px; background: rgba(255, 255, 255, 0.08); } .spar-sap__wall-map-room { position: relative; min-height: 390px; overflow: hidden; border-radius: 15px; background: var(--spar-sap-white); } .spar-sap__wall-map-ceiling, .spar-sap__wall-map-floor, .spar-sap__wall-map-left, .spar-sap__wall-map-right, .spar-sap__wall-map-center, .spar-sap__wall-map-socket, .spar-sap__wall-map-pipe, .spar-sap__wall-map-pillar { position: absolute; display: grid; place-items: center; padding: 8px; color: var(--spar-sap-dark); font-size: 0.64rem; font-weight: 900; line-height: 1.3; text-align: center; text-transform: uppercase; } .spar-sap__wall-map-ceiling { top: 0; right: 0; left: 0; height: 16%; background: repeating-linear-gradient( 45deg, #d9e0e0, #d9e0e0 8px, #c9d2d2 8px, #c9d2d2 16px ); } .spar-sap__wall-map-floor { right: 0; bottom: 0; left: 0; height: 16%; background: repeating-linear-gradient( 135deg, #d9e0e0, #d9e0e0 8px, #c9d2d2 8px, #c9d2d2 16px ); } .spar-sap__wall-map-left { top: 16%; bottom: 16%; left: 0; width: 15%; background: var(--spar-sap-teal-light); writing-mode: vertical-rl; transform: rotate(180deg); } .spar-sap__wall-map-right { top: 16%; right: 0; bottom: 16%; width: 15%; background: #ffe5ce; color: #703507; writing-mode: vertical-rl; transform: rotate(180deg); } .spar-sap__wall-map-center { top: 16%; right: 15%; bottom: 16%; left: 15%; background: repeating-linear-gradient( 45deg, #edf8f7, #edf8f7 12px, #dcefed 12px, #dcefed 24px ); color: var(--spar-sap-dark); font-size: 0.75rem; } .spar-sap__wall-map-socket { right: 25%; bottom: 25%; width: 18%; height: 13%; border: 2px solid var(--spar-sap-danger); border-radius: 10px; background: var(--spar-sap-white); color: #9d3928; } .spar-sap__wall-map-pipe { top: 30%; left: 24%; width: 17%; height: 14%; border: 2px solid var(--spar-sap-orange); border-radius: 10px; background: #fff5ea; color: var(--spar-sap-orange-dark); } .spar-sap__wall-map-pillar { top: 16%; bottom: 16%; left: 48%; width: 11%; background: rgba(7, 52, 59, 0.18); writing-mode: vertical-rl; transform: rotate(180deg); } .spar-sap__wall-map-legend { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 14px; } .spar-sap__wall-map-legend span { padding: 11px; border: 1px solid rgba(255, 255, 255, 0.12); border-radius: 11px; background: rgba(255, 255, 255, 0.07); color: rgba(255, 255, 255, 0.75); font-size: 0.72rem; font-weight: 750; line-height: 1.45; text-align: center; } /* ============================================================ ELEMENTI CONTROLLATI ============================================================ */ .spar-sap__checks-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 15px; margin-top: 32px; } .spar-sap__check-card { min-width: 0; padding: 20px; border: 1px solid var(--spar-sap-border); border-top: 5px solid var(--spar-sap-dark); border-radius: 17px; background: var(--spar-sap-white); box-shadow: 0 11px 29px rgba(6, 52, 59, 0.07); } .spar-sap__check-card--teal { border-top-color: var(--spar-sap-teal); } .spar-sap__check-card--orange { border-top-color: var(--spar-sap-orange); } .spar-sap__check-card--green { border-top-color: var(--spar-sap-green); } .spar-sap__check-card--blue { border-top-color: var(--spar-sap-medium); } .spar-sap__check-card--cream { border-top-color: #d6a33a; } .spar-sap__check-card > span { color: rgba(7, 52, 59, 0.24); font-size: 1.35rem; font-weight: 950; line-height: 1; } .spar-sap__check-card h5 { margin: 14px 0 0; color: var(--spar-sap-dark); font-size: 0.95rem; font-weight: 900; line-height: 1.4; } .spar-sap__check-card p { margin: 7px 0 0; color: var(--spar-sap-muted); font-size: 0.81rem; line-height: 1.56; } /* ============================================================ PANNELLO PROGETTO ============================================================ */ .spar-sap__project-panel { min-width: 0; padding: 22px; border: 1px solid rgba(36, 191, 193, 0.28); border-radius: 21px; background: var(--spar-sap-white); box-shadow: var(--spar-sap-shadow); } .spar-sap__project-header { display: grid; grid-template-columns: 56px minmax(0, 1fr); align-items: center; gap: 14px; } .spar-sap__project-header > span { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 16px; background: var(--spar-sap-teal); color: var(--spar-sap-dark); font-size: 1rem; font-weight: 950; } .spar-sap__project-header small { display: block; color: var(--spar-sap-orange-dark); font-size: 0.65rem; font-weight: 850; line-height: 1.35; text-transform: uppercase; } .spar-sap__project-header strong { display: block; margin-top: 4px; color: var(--spar-sap-dark); font-size: 1.05rem; font-weight: 900; line-height: 1.4; } .spar-sap__project-steps { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 20px 0 0; padding: 0; list-style: none; } .spar-sap__project-steps li { display: grid; grid-template-columns: 38px minmax(0, 1fr); gap: 10px; min-width: 0; padding: 14px; border: 1px solid var(--spar-sap-border); border-radius: 14px; background: var(--spar-sap-light); } .spar-sap__project-steps li > span { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 11px; background: var(--spar-sap-dark); color: var(--spar-sap-teal-light); font-size: 0.74rem; font-weight: 900; } .spar-sap__project-steps li > div { min-width: 0; } .spar-sap__project-steps strong { display: block; color: var(--spar-sap-dark); font-size: 0.86rem; font-weight: 900; line-height: 1.4; } .spar-sap__project-steps p { margin: 5px 0 0; color: var(--spar-sap-muted); font-size: 0.77rem; line-height: 1.52; } /* ============================================================ ERRORI EVITATI ============================================================ */ .spar-sap__avoid { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(430px, 1.1fr); align-items: center; gap: clamp(36px, 5vw, 68px); margin-top: clamp(62px, 8vw, 94px); padding: clamp(28px, 4vw, 47px); border-radius: 24px; background: radial-gradient( circle at 96% 4%, rgba(36, 191, 193, 0.2), transparent 30% ), linear-gradient( 135deg, var(--spar-sap-deep), var(--spar-sap-dark) ); box-shadow: 0 24px 60px rgba(3, 35, 40, 0.2); } .spar-sap__avoid-content { min-width: 0; } .spar-sap__avoid .spar-sap__section-label { color: var(--spar-sap-orange); } .spar-sap__avoid-content h4 { color: var(--spar-sap-white); } .spar-sap__avoid-content > p:not( .spar-sap__section-label, .spar-sap__avoid-highlight ) { margin: 17px 0 0; color: rgba(255, 255, 255, 0.73); font-size: 0.97rem; line-height: 1.7; } .spar-sap__avoid-content > p + p { margin-top: 11px; } .spar-sap__avoid-highlight { margin: 18px 0 0; padding: 15px 17px; border-left: 4px solid var(--spar-sap-orange); border-radius: 0 12px 12px 0; background: rgba(255, 255, 255, 0.08); color: var(--spar-sap-white); font-size: 0.94rem; font-weight: 750; line-height: 1.65; } .spar-sap__avoid-list { display: grid; gap: 11px; min-width: 0; margin: 0; padding: 0; list-style: none; } .spar-sap__avoid-list li { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 11px; min-width: 0; padding: 14px; border: 1px solid rgba(255, 255, 255, 0.13); border-radius: 14px; background: rgba(255, 255, 255, 0.07); } .spar-sap__avoid-list li > span { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: rgba(255, 138, 42, 0.16); color: var(--spar-sap-orange); font-weight: 900; } .spar-sap__avoid-list strong { display: block; color: var(--spar-sap-white); font-size: 0.89rem; font-weight: 900; line-height: 1.4; } .spar-sap__avoid-list p { margin: 5px 0 0; color: rgba(255, 255, 255, 0.67); font-size: 0.8rem; line-height: 1.52; } /* ============================================================ PROCESSO ============================================================ */ .spar-sap__process-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 15px; margin: 31px 0 0; padding: 0; list-style: none; } .spar-sap__process-list li { min-width: 0; padding: 20px; border: 1px solid var(--spar-sap-border); border-radius: 17px; background: var(--spar-sap-white); box-shadow: 0 11px 29px rgba(6, 52, 59, 0.07); } .spar-sap__process-list li > span { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; background: var(--spar-sap-dark); color: var(--spar-sap-teal-light); font-size: 0.78rem; font-weight: 900; } .spar-sap__process-list strong { display: block; margin-top: 16px; color: var(--spar-sap-dark); font-size: 0.9rem; font-weight: 900; line-height: 1.4; } .spar-sap__process-list p { margin: 7px 0 0; color: var(--spar-sap-muted); font-size: 0.82rem; line-height: 1.57; } /* ============================================================ FIDUCIA ============================================================ */ .spar-sap__trust { display: grid; grid-template-columns: 74px minmax(0, 1fr); align-items: center; gap: 23px; margin-top: clamp(46px, 6vw, 70px); padding: clamp(24px, 3vw, 35px); border: 1px solid rgba(255, 138, 42, 0.31); border-radius: 21px; background: #fff3e7; } .spar-sap__trust-icon { display: grid; place-items: center; width: 70px; height: 70px; border-radius: 20px; background: var(--spar-sap-orange); color: #321705; } .spar-sap__trust-icon svg { width: 41px; height: 41px; } .spar-sap__trust-content { min-width: 0; } .spar-sap__trust h4 { font-size: clamp(1.3rem, 2.2vw, 1.85rem); } .spar-sap__trust-content > p:last-child { margin: 10px 0 0; color: var(--spar-sap-muted); font-size: 0.93rem; line-height: 1.66; } /* ============================================================ CTA ============================================================ */ .spar-sap__conversion { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(330px, 0.92fr); align-items: center; gap: clamp(30px, 5vw, 64px); margin-top: clamp(52px, 7vw, 82px); padding: clamp(26px, 4vw, 45px); border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 23px; background: var(--spar-sap-cream); box-shadow: var(--spar-sap-shadow); } .spar-sap__conversion-content { min-width: 0; } .spar-sap__conversion-content > p:not(.spar-sap__conversion-label) { margin: 15px 0 0; color: var(--spar-sap-muted); font-size: 0.95rem; line-height: 1.69; } .spar-sap__conversion-content > p + p { margin-top: 10px; } .spar-sap__actions { display: grid; gap: 11px; min-width: 0; } .spar-sap__button { display: flex; min-width: 0; min-height: 57px; align-items: center; justify-content: center; gap: 10px; padding: 13px 17px; border: 2px solid transparent; border-radius: 12px; font-family: inherit; font-size: 0.9rem; font-weight: 850; line-height: 1.3; text-align: center; text-decoration: none; transition: transform 180ms ease, background-color 180ms ease, border-color 180ms ease, box-shadow 180ms ease; } .spar-sap__button:hover { transform: translateY(-2px); } .spar-sap__button:focus-visible { outline: 3px solid var(--spar-sap-dark); outline-offset: 4px; } .spar-sap__button svg { flex: 0 0 23px; width: 23px; height: 23px; } .spar-sap__button--primary { background: var(--spar-sap-orange); color: #2c1504; box-shadow: 0 12px 27px rgba(255, 138, 42, 0.22); } .spar-sap__button--primary:hover { background: #ff9b43; } .spar-sap__button--whatsapp { background: var(--spar-sap-green); color: var(--spar-sap-white); box-shadow: 0 12px 27px rgba(39, 173, 104, 0.2); } .spar-sap__button--whatsapp:hover { background: var(--spar-sap-green-dark); } .spar-sap__button--phone { border-color: rgba(7, 52, 59, 0.3); background: var(--spar-sap-white); color: var(--spar-sap-dark); } .spar-sap__button--phone:hover { border-color: var(--spar-sap-teal); background: var(--spar-sap-light); } .spar-sap__phone-text { display: grid; min-width: 0; gap: 1px; text-align: left; } .spar-sap__phone-text small { font-size: 0.64rem; font-weight: 750; line-height: 1.1; letter-spacing: 0.055em; text-transform: uppercase; } .spar-sap__phone-text strong { color: inherit; font-size: 1rem; font-weight: 900; line-height: 1.15; } /* ============================================================ NOTEBOOK E TABLET ORIZZONTALE ============================================================ */ @media (max-width: 1100px) { .spar-sap__official { grid-template-columns: 68px minmax(0, 1fr); } .spar-sap__official-link { grid-column: 1 / -1; justify-self: start; } .spar-sap__detail, .spar-sap__measurements, .spar-sap__avoid, .spar-sap__conversion { grid-template-columns: minmax(0, 1fr); } .spar-sap__importance-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-sap__checks-grid, .spar-sap__process-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-sap__detail-content, .spar-sap__measurements-content, .spar-sap__avoid-content, .spar-sap__conversion-content { max-width: 860px; } .spar-sap__background-panel, .spar-sap__measurements-grid, .spar-sap__wall-map, .spar-sap__project-panel, .spar-sap__avoid-list { max-width: 860px; } .spar-sap__actions { grid-template-columns: repeat(3, minmax(0, 1fr)); } } /* ============================================================ TABLET ============================================================ */ @media (max-width: 820px) { .spar-sap__container { width: min(calc(100% - 32px), 780px); } .spar-sap__answer { grid-template-columns: 60px minmax(0, 1fr); gap: 17px; } .spar-sap__answer-icon { width: 58px; height: 58px; } .spar-sap__media { width: min(680px, 100%); } .spar-sap__overview { grid-template-columns: minmax(0, 1fr); } .spar-sap__wall-map-legend { grid-template-columns: minmax(0, 1fr); } .spar-sap__actions { grid-template-columns: minmax(0, 1fr); } } /* ============================================================ MOBILE ============================================================ */ @media (max-width: 580px) { .spar-sap { padding-block: 50px 62px; } .spar-sap__container { width: calc(100% - 28px); } .spar-sap__header, .spar-sap__subheader { text-align: left; } .spar-sap__eyebrow, .spar-sap__answer-label, .spar-sap__section-label, .spar-sap__official-label, .spar-sap__background-warning-label, .spar-sap__trust-label, .spar-sap__conversion-label { font-size: 0.67rem; letter-spacing: 0.06em; } .spar-sap__title { font-size: clamp(1.84rem, 9.4vw, 2.62rem); line-height: 1.1; } .spar-sap__direct-answer { font-size: 0.98rem; line-height: 1.63; } .spar-sap__intro { font-size: 0.91rem; line-height: 1.66; } .spar-sap__answer { grid-template-columns: minmax(0, 1fr); padding: 20px 17px; border-radius: 18px; } .spar-sap__answer-icon { width: 52px; height: 52px; border-radius: 15px; } .spar-sap__answer-icon svg { width: 32px; height: 32px; } .spar-sap__official { grid-template-columns: minmax(0, 1fr); padding: 20px 17px; border-radius: 18px; } .spar-sap__official-icon { width: 54px; height: 54px; border-radius: 15px; } .spar-sap__official-icon svg { width: 31px; height: 31px; } .spar-sap__official-link { width: 100%; justify-self: stretch; } .spar-sap__media { width: 100%; margin-top: 30px; } .spar-sap__media-frame { border-radius: 16px; } .spar-sap__media figcaption { margin-top: 10px; font-size: 0.73rem; line-height: 1.5; } .spar-sap__overview-card { padding: 18px 16px; border-radius: 16px; } .spar-sap__detail-content h3, .spar-sap__subheader h4, .spar-sap__measurements-content h4, .spar-sap__avoid-content h4, .spar-sap__conversion h3 { font-size: clamp(1.42rem, 7.4vw, 1.92rem); } .spar-sap__background-panel, .spar-sap__project-panel { padding: 17px 15px; border-radius: 18px; } .spar-sap__background-header { grid-template-columns: 52px minmax(0, 1fr); } .spar-sap__background-header > span { width: 52px; height: 52px; border-radius: 15px; } .spar-sap__background-chart { min-height: 235px; } .spar-sap__importance-grid, .spar-sap__measurements-grid, .spar-sap__checks-grid, .spar-sap__project-steps, .spar-sap__process-list { grid-template-columns: minmax(0, 1fr); } .spar-sap__importance-card, .spar-sap__measurement-card, .spar-sap__check-card, .spar-sap__process-list li { padding: 18px 16px; border-radius: 16px; } .spar-sap__background-warning { grid-template-columns: minmax(0, 1fr); align-items: start; padding: 20px 17px; border-radius: 18px; } .spar-sap__background-warning-icon { width: 53px; height: 53px; border-radius: 15px; } .spar-sap__background-warning-icon svg { width: 31px; height: 31px; } .spar-sap__detail--dark, .spar-sap__avoid { padding: 22px 17px; border-radius: 19px; } .spar-sap__wall-map { padding: 15px; border-radius: 18px; } .spar-sap__wall-map-room { min-height: 325px; } .spar-sap__wall-map-center { font-size: 0.63rem; } .spar-sap__wall-map-socket, .spar-sap__wall-map-pipe { font-size: 0.54rem; } .spar-sap__project-header { grid-template-columns: 50px minmax(0, 1fr); } .spar-sap__project-header > span { width: 50px; height: 50px; } .spar-sap__avoid-list li { grid-template-columns: 38px minmax(0, 1fr); padding: 12px; } .spar-sap__avoid-list li > span { width: 38px; height: 38px; } .spar-sap__trust { grid-template-columns: minmax(0, 1fr); align-items: start; gap: 15px; padding: 21px 17px; border-radius: 18px; } .spar-sap__trust-icon { width: 54px; height: 54px; border-radius: 15px; } .spar-sap__trust-icon svg { width: 31px; height: 31px; } .spar-sap__trust h4 { font-size: 1.27rem; } .spar-sap__conversion { padding: 22px 17px; border-radius: 19px; } .spar-sap__button { width: 100%; min-height: 57px; padding-inline: 13px; font-size: 0.86rem; } } /* ============================================================ SMARTPHONE MOLTO STRETTI ============================================================ */ @media (max-width: 380px) { .spar-sap__container { width: calc(100% - 22px); } .spar-sap__title { font-size: 1.7rem; } .spar-sap__media-frame { border-radius: 14px; } .spar-sap__official, .spar-sap__overview-card, .spar-sap__background-panel, .spar-sap__importance-card, .spar-sap__measurement-card, .spar-sap__background-warning, .spar-sap__detail--dark, .spar-sap__wall-map, .spar-sap__check-card, .spar-sap__project-panel, .spar-sap__avoid, .spar-sap__process-list li, .spar-sap__trust, .spar-sap__conversion { padding-inline: 14px; } .spar-sap__button { gap: 8px; padding-inline: 10px; font-size: 0.82rem; } .spar-sap__button svg { flex-basis: 21px; width: 21px; height: 21px; } } /* ============================================================ ACCESSIBILITÀ ============================================================ */ @media (prefers-reduced-motion: reduce) { .spar-sap__overview-card, .spar-sap__official-link, .spar-sap__button { transition: none; } .spar-sap__overview-card:hover, .spar-sap__official-link:hover, .spar-sap__button:hover { transform: none; } } /* ============================================================ STAMPA ============================================================ */ @media print { .spar-sap { padding: 30px 0; background: #ffffff; } .spar-sap__detail--dark, .spar-sap__avoid { border: 1px solid var(--spar-sap-border); background: #ffffff; box-shadow: none; } .spar-sap__detail--dark .spar-sap__detail-content h3, .spar-sap__detail--dark .spar-sap__detail-answer, .spar-sap__avoid-content h4, .spar-sap__avoid-list strong { color: var(--spar-sap-dark); } .spar-sap__detail--dark .spar-sap__detail-content > p:not( .spar-sap__section-label, .spar-sap__detail-answer, .spar-sap__highlight ), .spar-sap__avoid-content > p:not( .spar-sap__section-label, .spar-sap__avoid-highlight ), .spar-sap__avoid-list p { color: var(--spar-sap-muted); } .spar-sap__actions { display: none; } }#imCell_30 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHTMLObject_1726_30 { position: relative; align-self: start; justify-self: center; max-width: 100%; box-sizing: border-box; z-index: 3; } #imCellStyleGraphics_30 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imCellStyleBorders_30 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } /* ============================================================ H2 — QUANTO COSTA INSONORIZZARE UNA PARETE A ROMA Pagina: /isolamento-acustico-pareti-roma.html ============================================================ */ .spar-cos, .spar-cos *, .spar-cos *::before, .spar-cos *::after { box-sizing: border-box; } .spar-cos { --spar-cos-dark: #07343b; --spar-cos-deep: #05282e; --spar-cos-medium: #0b5159; --spar-cos-teal: #24bfc1; --spar-cos-teal-light: #d9f4f2; --spar-cos-orange: #ff8a2a; --spar-cos-orange-dark: #c85c0a; --spar-cos-green: #27ad68; --spar-cos-green-dark: #19864f; --spar-cos-white: #ffffff; --spar-cos-cream: #fff8ed; --spar-cos-light: #edf8f7; --spar-cos-text: #173c41; --spar-cos-muted: #557277; --spar-cos-border: #d4e6e4; --spar-cos-shadow: 0 20px 52px rgba(6, 52, 59, 0.1); width: 100%; max-width: 100%; overflow: hidden; padding-block: clamp(64px, 8vw, 105px); background: radial-gradient( circle at 5% 6%, rgba(36, 191, 193, 0.11), transparent 27% ), radial-gradient( circle at 96% 94%, rgba(255, 138, 42, 0.08), transparent 25% ), var(--spar-cos-cream); color: var(--spar-cos-text); } .spar-cos h2, .spar-cos h3, .spar-cos h4, .spar-cos h5, .spar-cos p, .spar-cos li, .spar-cos span, .spar-cos strong, .spar-cos small, .spar-cos a { max-width: 100%; white-space: normal; overflow-wrap: break-word; word-break: normal; } .spar-cos__container { width: min(calc(100% - 40px), 1220px); margin-inline: auto; } /* ============================================================ INTESTAZIONE ============================================================ */ .spar-cos__header { width: min(100%, 980px); margin-inline: auto; text-align: center; } .spar-cos__eyebrow, .spar-cos__answer-label, .spar-cos__section-label, .spar-cos__principle-label, .spar-cos__clarity-label, .spar-cos__conversion-label { margin: 0 0 12px; color: var(--spar-cos-orange-dark); font-size: 0.74rem; font-weight: 900; line-height: 1.4; letter-spacing: 0.075em; text-transform: uppercase; } .spar-cos__title { margin: 0; color: var(--spar-cos-dark); font-size: clamp(2rem, 4.2vw, 3.55rem); font-weight: 900; line-height: 1.08; letter-spacing: -0.04em; text-wrap: balance; } .spar-cos__direct-answer { margin: 24px auto 0; color: var(--spar-cos-dark); font-size: clamp(1.04rem, 1.5vw, 1.2rem); font-weight: 650; line-height: 1.7; } .spar-cos__direct-answer strong { color: inherit; font-weight: 900; } .spar-cos__intro { margin: 14px auto 0; color: var(--spar-cos-muted); font-size: 1rem; line-height: 1.72; } /* ============================================================ RISPOSTA IMMEDIATA ============================================================ */ .spar-cos__answer { display: grid; grid-template-columns: 76px minmax(0, 1fr); align-items: center; gap: 22px; width: min(100%, 1000px); margin: clamp(35px, 5vw, 56px) auto 0; padding: clamp(22px, 3vw, 33px); border: 1px solid rgba(36, 191, 193, 0.28); border-radius: 22px; background: var(--spar-cos-white); box-shadow: var(--spar-cos-shadow); } .spar-cos__answer-icon { display: grid; place-items: center; width: 70px; height: 70px; border-radius: 19px; background: var(--spar-cos-dark); color: var(--spar-cos-teal-light); } .spar-cos__answer-icon svg { display: block; width: 42px; height: 42px; } .spar-cos__answer-content { min-width: 0; } .spar-cos__answer-content h3 { margin: 0; color: var(--spar-cos-dark); font-size: clamp(1.2rem, 2vw, 1.6rem); font-weight: 900; line-height: 1.3; } .spar-cos__answer-content > p:last-child { margin: 9px 0 0; color: var(--spar-cos-muted); font-size: 0.95rem; line-height: 1.66; } /* ============================================================ PRINCIPIO ============================================================ */ .spar-cos__principle, .spar-cos__clarity { display: grid; grid-template-columns: 72px minmax(0, 1fr); align-items: center; gap: 22px; margin-top: clamp(34px, 5vw, 52px); padding: clamp(23px, 3vw, 34px); border: 1px solid rgba(255, 138, 42, 0.3); border-radius: 21px; background: #fff3e7; } .spar-cos__principle-icon, .spar-cos__clarity-icon { display: grid; place-items: center; width: 68px; height: 68px; border-radius: 19px; background: var(--spar-cos-orange); color: #321705; } .spar-cos__principle-icon svg, .spar-cos__clarity-icon svg { width: 39px; height: 39px; } .spar-cos__principle-content, .spar-cos__clarity-content { min-width: 0; } .spar-cos__principle-content h3, .spar-cos__clarity-content h3 { margin: 0; color: var(--spar-cos-dark); font-size: clamp(1.25rem, 2.1vw, 1.75rem); font-weight: 900; line-height: 1.3; } .spar-cos__principle-content > p:not(.spar-cos__principle-label), .spar-cos__clarity-content > p:not(.spar-cos__clarity-label) { margin: 10px 0 0; color: var(--spar-cos-muted); font-size: 0.92rem; line-height: 1.66; } /* ============================================================ PANORAMICA ============================================================ */ .spar-cos__overview { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; margin-top: clamp(52px, 7vw, 82px); } .spar-cos__overview-card { display: grid; grid-template-columns: minmax(0, 1fr) 25px; align-content: start; gap: 14px 8px; min-width: 0; padding: 20px; border: 1px solid var(--spar-cos-border); border-top: 5px solid var(--spar-cos-dark); border-radius: 18px; background: var(--spar-cos-white); color: var(--spar-cos-dark); text-decoration: none; box-shadow: 0 12px 30px rgba(6, 52, 59, 0.07); transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease; } .spar-cos__overview-card--teal { border-top-color: var(--spar-cos-teal); } .spar-cos__overview-card--orange { border-top-color: var(--spar-cos-orange); } .spar-cos__overview-card--green { border-top-color: var(--spar-cos-green); } .spar-cos__overview-card--blue { border-top-color: var(--spar-cos-medium); } .spar-cos__overview-card:hover { transform: translateY(-3px); border-color: var(--spar-cos-teal); box-shadow: 0 17px 38px rgba(6, 52, 59, 0.11); } .spar-cos__overview-card:focus-visible { outline: 3px solid var(--spar-cos-orange); outline-offset: 4px; } .spar-cos__overview-number { grid-column: 1 / -1; color: rgba(7, 52, 59, 0.23); font-size: 1.45rem; font-weight: 950; line-height: 1; } .spar-cos__overview-content { display: grid; min-width: 0; gap: 7px; } .spar-cos__overview-content strong { color: var(--spar-cos-dark); font-size: 0.91rem; font-weight: 900; line-height: 1.4; } .spar-cos__overview-content small { color: var(--spar-cos-muted); font-size: 0.75rem; line-height: 1.5; } .spar-cos__overview-arrow { align-self: center; color: var(--spar-cos-orange-dark); font-size: 1.15rem; font-weight: 900; text-align: right; } /* ============================================================ APPROFONDIMENTI ============================================================ */ .spar-cos__detail { display: grid; grid-template-columns: minmax(0, 0.91fr) minmax(460px, 1.09fr); align-items: center; gap: clamp(36px, 5vw, 68px); margin-top: clamp(66px, 9vw, 106px); scroll-margin-top: 110px; } .spar-cos__detail--dark { padding: clamp(29px, 4vw, 49px); border-radius: 25px; background: radial-gradient( circle at 96% 4%, rgba(36, 191, 193, 0.2), transparent 30% ), linear-gradient( 135deg, var(--spar-cos-deep), var(--spar-cos-dark) ); box-shadow: 0 24px 60px rgba(3, 35, 40, 0.2); } .spar-cos__detail-content { min-width: 0; } .spar-cos__detail-content h3, .spar-cos__process-header h3, .spar-cos__conversion h3 { margin: 0; color: var(--spar-cos-dark); font-size: clamp(1.5rem, 2.9vw, 2.35rem); font-weight: 900; line-height: 1.18; letter-spacing: -0.03em; text-wrap: balance; } .spar-cos__detail-answer { margin: 19px 0 0; color: var(--spar-cos-dark); font-size: 1.02rem; font-weight: 750; line-height: 1.68; } .spar-cos__detail-content > p:not( .spar-cos__section-label, .spar-cos__detail-answer, .spar-cos__highlight ) { margin: 13px 0 0; color: var(--spar-cos-muted); font-size: 0.96rem; line-height: 1.7; } .spar-cos__detail--dark .spar-cos__section-label { color: var(--spar-cos-orange); } .spar-cos__detail--dark .spar-cos__detail-content h3, .spar-cos__detail--dark .spar-cos__detail-answer { color: var(--spar-cos-white); } .spar-cos__detail--dark .spar-cos__detail-content > p:not( .spar-cos__section-label, .spar-cos__detail-answer, .spar-cos__highlight ) { color: rgba(255, 255, 255, 0.73); } .spar-cos__highlight { margin: 18px 0 0; padding: 15px 17px; border-left: 4px solid var(--spar-cos-orange); border-radius: 0 12px 12px 0; background: #fff0e2; color: var(--spar-cos-dark); font-size: 0.94rem; font-weight: 750; line-height: 1.65; } .spar-cos__detail--dark .spar-cos__highlight { background: rgba(255, 255, 255, 0.08); color: var(--spar-cos-white); } /* ============================================================ PANNELLO DIMENSIONI ============================================================ */ .spar-cos__factor-panel, .spar-cos__quote-panel, .spar-cos__system-diagram { min-width: 0; padding: 22px; border: 1px solid rgba(36, 191, 193, 0.28); border-radius: 21px; background: var(--spar-cos-white); box-shadow: var(--spar-cos-shadow); } .spar-cos__factor-header, .spar-cos__system-header, .spar-cos__quote-header, .spar-cos__systems-header { display: grid; grid-template-columns: 58px minmax(0, 1fr); align-items: center; gap: 14px; } .spar-cos__factor-header > span, .spar-cos__system-header > span, .spar-cos__quote-header > span, .spar-cos__systems-header > span { display: grid; place-items: center; width: 58px; height: 58px; border-radius: 16px; background: var(--spar-cos-dark); color: var(--spar-cos-teal-light); font-size: 0.82rem; font-weight: 950; } .spar-cos__factor-header small, .spar-cos__system-header small, .spar-cos__quote-header small, .spar-cos__systems-header small { display: block; color: var(--spar-cos-orange-dark); font-size: 0.65rem; font-weight: 850; line-height: 1.35; text-transform: uppercase; } .spar-cos__factor-header strong, .spar-cos__system-header strong, .spar-cos__quote-header strong, .spar-cos__systems-header strong { display: block; margin-top: 4px; color: var(--spar-cos-dark); font-size: 1.04rem; font-weight: 900; line-height: 1.4; } .spar-cos__factor-grid, .spar-cos__systems-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 20px; } .spar-cos__factor-grid article, .spar-cos__systems-grid article { min-width: 0; padding: 16px; border: 1px solid var(--spar-cos-border); border-radius: 14px; background: var(--spar-cos-light); } .spar-cos__factor-grid article > span, .spar-cos__systems-grid article > span { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 11px; background: var(--spar-cos-white); color: var(--spar-cos-medium); font-size: 0.9rem; font-weight: 950; } .spar-cos__factor-grid h4, .spar-cos__systems-grid h4 { margin: 12px 0 0; color: var(--spar-cos-dark); font-size: 0.9rem; font-weight: 900; line-height: 1.4; } .spar-cos__factor-grid p, .spar-cos__systems-grid p { margin: 6px 0 0; color: var(--spar-cos-muted); font-size: 0.78rem; line-height: 1.54; } /* ============================================================ TIPOLOGIE DI RUMORE ============================================================ */ .spar-cos__noise-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; min-width: 0; } .spar-cos__noise-card { min-width: 0; padding: 18px; border: 1px solid rgba(255, 255, 255, 0.13); border-top: 4px solid var(--spar-cos-teal); border-radius: 15px; background: rgba(255, 255, 255, 0.07); } .spar-cos__noise-card--emphasis { border-top-color: var(--spar-cos-orange); } .spar-cos__noise-symbol { display: grid; place-items: center; width: 43px; height: 43px; border-radius: 12px; background: rgba(36, 191, 193, 0.15); color: var(--spar-cos-teal-light); font-size: 0.72rem; font-weight: 950; } .spar-cos__noise-card--emphasis .spar-cos__noise-symbol { background: rgba(255, 138, 42, 0.16); color: #ffd4ae; } .spar-cos__noise-card h4 { margin: 13px 0 0; color: var(--spar-cos-white); font-size: 0.93rem; font-weight: 900; line-height: 1.4; } .spar-cos__noise-card p { margin: 7px 0 0; color: rgba(255, 255, 255, 0.68); font-size: 0.79rem; line-height: 1.55; } /* ============================================================ SCHEMA STRATIGRAFIA ============================================================ */ .spar-cos__wall { display: grid; grid-template-columns: 1fr 0.72fr 0.72fr 0.92fr 1fr; gap: 5px; min-height: 270px; margin-top: 21px; } .spar-cos__wall > span { display: flex; min-width: 0; align-items: center; justify-content: center; padding: 8px; border-radius: 9px; font-size: 0.6rem; font-weight: 900; line-height: 1.3; text-align: center; text-transform: uppercase; writing-mode: vertical-rl; transform: rotate(180deg); } .spar-cos__wall-existing { background: repeating-linear-gradient( 45deg, #d9e0e0, #d9e0e0 8px, #c9d2d2 8px, #c9d2d2 16px ); color: #40575b; } .spar-cos__wall-gap { border: 1px dashed var(--spar-cos-orange); background: var(--spar-cos-cream); color: var(--spar-cos-orange-dark); } .spar-cos__wall-frame { border: 2px solid var(--spar-cos-dark); background: var(--spar-cos-light); color: var(--spar-cos-dark); } .spar-cos__wall-material { background: repeating-linear-gradient( 45deg, #dff3f1, #dff3f1 8px, #caeae7 8px, #caeae7 16px ); color: var(--spar-cos-dark); } .spar-cos__wall-mass { background: var(--spar-cos-dark); color: var(--spar-cos-white); } .spar-cos__system-notes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 15px; } .spar-cos__system-notes p { margin: 0; padding: 12px; border: 1px solid var(--spar-cos-border); border-radius: 12px; background: var(--spar-cos-light); color: var(--spar-cos-muted); font-size: 0.74rem; line-height: 1.52; } .spar-cos__system-notes strong { color: var(--spar-cos-dark); } /* ============================================================ IMPIANTI E TRASMISSIONI ============================================================ */ .spar-cos__systems-map { min-width: 0; padding: 22px; border: 1px solid rgba(255, 255, 255, 0.14); border-radius: 21px; background: rgba(255, 255, 255, 0.08); } .spar-cos__systems-header > span { background: var(--spar-cos-teal); color: var(--spar-cos-dark); } .spar-cos__systems-header small { color: var(--spar-cos-orange); } .spar-cos__systems-header strong { color: var(--spar-cos-white); } .spar-cos__systems-grid article { border-color: rgba(255, 255, 255, 0.12); background: rgba(255, 255, 255, 0.07); } .spar-cos__systems-grid article > span { background: rgba(36, 191, 193, 0.15); color: var(--spar-cos-teal-light); } .spar-cos__systems-grid h4 { color: var(--spar-cos-white); } .spar-cos__systems-grid p { color: rgba(255, 255, 255, 0.68); } /* ============================================================ PREVENTIVO ============================================================ */ .spar-cos__quote-steps { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 20px 0 0; padding: 0; list-style: none; } .spar-cos__quote-steps li { display: grid; grid-template-columns: 38px minmax(0, 1fr); gap: 10px; min-width: 0; padding: 14px; border: 1px solid var(--spar-cos-border); border-radius: 14px; background: var(--spar-cos-light); } .spar-cos__quote-steps li > span { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 11px; background: var(--spar-cos-dark); color: var(--spar-cos-teal-light); font-size: 0.74rem; font-weight: 900; } .spar-cos__quote-steps li > div { min-width: 0; } .spar-cos__quote-steps strong { display: block; color: var(--spar-cos-dark); font-size: 0.86rem; font-weight: 900; line-height: 1.4; } .spar-cos__quote-steps p { margin: 5px 0 0; color: var(--spar-cos-muted); font-size: 0.77rem; line-height: 1.52; } .spar-cos__survey-link { display: flex; min-width: 0; min-height: 54px; align-items: center; justify-content: center; gap: 10px; margin-top: 18px; padding: 13px 16px; border: 2px solid var(--spar-cos-dark); border-radius: 12px; background: var(--spar-cos-dark); color: var(--spar-cos-white); font-size: 0.83rem; font-weight: 850; line-height: 1.35; text-align: center; text-decoration: none; transition: transform 180ms ease, background-color 180ms ease, border-color 180ms ease; } .spar-cos__survey-link:hover { transform: translateY(-2px); border-color: var(--spar-cos-medium); background: var(--spar-cos-medium); } .spar-cos__survey-link:focus-visible { outline: 3px solid var(--spar-cos-orange); outline-offset: 4px; } .spar-cos__survey-link svg { flex: 0 0 22px; width: 22px; height: 22px; } /* ============================================================ CHIAREZZA E PROCESSO ============================================================ */ .spar-cos__clarity { margin-top: clamp(52px, 7vw, 80px); } .spar-cos__process { margin-top: clamp(62px, 8vw, 94px); } .spar-cos__process-header { width: min(100%, 900px); margin-inline: auto; text-align: center; } .spar-cos__process-header > p:last-child { margin: 16px auto 0; color: var(--spar-cos-muted); font-size: 0.97rem; line-height: 1.7; } .spar-cos__process-list { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; margin: 31px 0 0; padding: 0; list-style: none; } .spar-cos__process-list li { min-width: 0; padding: 19px; border: 1px solid var(--spar-cos-border); border-radius: 17px; background: var(--spar-cos-white); box-shadow: 0 11px 29px rgba(6, 52, 59, 0.07); } .spar-cos__process-list li > span { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; background: var(--spar-cos-dark); color: var(--spar-cos-teal-light); font-size: 0.78rem; font-weight: 900; } .spar-cos__process-list strong { display: block; margin-top: 16px; color: var(--spar-cos-dark); font-size: 0.88rem; font-weight: 900; line-height: 1.4; } .spar-cos__process-list p { margin: 7px 0 0; color: var(--spar-cos-muted); font-size: 0.79rem; line-height: 1.56; } /* ============================================================ CTA ============================================================ */ .spar-cos__conversion { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(330px, 0.92fr); align-items: center; gap: clamp(30px, 5vw, 64px); margin-top: clamp(52px, 7vw, 82px); padding: clamp(26px, 4vw, 45px); border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 23px; background: var(--spar-cos-white); box-shadow: var(--spar-cos-shadow); } .spar-cos__conversion-content { min-width: 0; } .spar-cos__conversion-content > p:not(.spar-cos__conversion-label) { margin: 15px 0 0; color: var(--spar-cos-muted); font-size: 0.95rem; line-height: 1.69; } .spar-cos__conversion-content > p + p { margin-top: 10px; } .spar-cos__actions { display: grid; gap: 11px; min-width: 0; } .spar-cos__button { display: flex; min-width: 0; min-height: 57px; align-items: center; justify-content: center; gap: 10px; padding: 13px 17px; border: 2px solid transparent; border-radius: 12px; font-family: inherit; font-size: 0.9rem; font-weight: 850; line-height: 1.3; text-align: center; text-decoration: none; transition: transform 180ms ease, background-color 180ms ease, border-color 180ms ease, box-shadow 180ms ease; } .spar-cos__button:hover { transform: translateY(-2px); } .spar-cos__button:focus-visible { outline: 3px solid var(--spar-cos-dark); outline-offset: 4px; } .spar-cos__button svg { flex: 0 0 23px; width: 23px; height: 23px; } .spar-cos__button--primary { background: var(--spar-cos-orange); color: #2c1504; box-shadow: 0 12px 27px rgba(255, 138, 42, 0.22); } .spar-cos__button--primary:hover { background: #ff9b43; } .spar-cos__button--whatsapp { background: var(--spar-cos-green); color: var(--spar-cos-white); box-shadow: 0 12px 27px rgba(39, 173, 104, 0.2); } .spar-cos__button--whatsapp:hover { background: var(--spar-cos-green-dark); } .spar-cos__button--phone { border-color: rgba(7, 52, 59, 0.3); background: var(--spar-cos-white); color: var(--spar-cos-dark); } .spar-cos__button--phone:hover { border-color: var(--spar-cos-teal); background: var(--spar-cos-light); } .spar-cos__phone-text { display: grid; min-width: 0; gap: 1px; text-align: left; } .spar-cos__phone-text small { font-size: 0.64rem; font-weight: 750; line-height: 1.1; letter-spacing: 0.055em; text-transform: uppercase; } .spar-cos__phone-text strong { color: inherit; font-size: 1rem; font-weight: 900; line-height: 1.15; } /* ============================================================ NOTEBOOK ============================================================ */ @media (max-width: 1180px) { .spar-cos__overview { grid-template-columns: repeat(3, minmax(0, 1fr)); } .spar-cos__process-list { grid-template-columns: repeat(3, minmax(0, 1fr)); } } /* ============================================================ TABLET ORIZZONTALE ============================================================ */ @media (max-width: 1100px) { .spar-cos__detail, .spar-cos__conversion { grid-template-columns: minmax(0, 1fr); } .spar-cos__detail-content, .spar-cos__conversion-content { max-width: 860px; } .spar-cos__factor-panel, .spar-cos__noise-grid, .spar-cos__system-diagram, .spar-cos__systems-map, .spar-cos__quote-panel { max-width: 860px; } .spar-cos__actions { grid-template-columns: repeat(3, minmax(0, 1fr)); } } /* ============================================================ TABLET ============================================================ */ @media (max-width: 820px) { .spar-cos__container { width: min(calc(100% - 32px), 780px); } .spar-cos__answer { grid-template-columns: 60px minmax(0, 1fr); gap: 17px; } .spar-cos__answer-icon { width: 58px; height: 58px; } .spar-cos__overview, .spar-cos__process-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-cos__actions { grid-template-columns: minmax(0, 1fr); } } /* ============================================================ MOBILE ============================================================ */ @media (max-width: 580px) { .spar-cos { padding-block: 50px 62px; } .spar-cos__container { width: calc(100% - 28px); } .spar-cos__header, .spar-cos__process-header { text-align: left; } .spar-cos__eyebrow, .spar-cos__answer-label, .spar-cos__section-label, .spar-cos__principle-label, .spar-cos__clarity-label, .spar-cos__conversion-label { font-size: 0.67rem; letter-spacing: 0.06em; } .spar-cos__title { font-size: clamp(1.84rem, 9.4vw, 2.62rem); line-height: 1.1; } .spar-cos__direct-answer { font-size: 0.98rem; line-height: 1.63; } .spar-cos__intro { font-size: 0.91rem; line-height: 1.66; } .spar-cos__answer { grid-template-columns: minmax(0, 1fr); padding: 20px 17px; border-radius: 18px; } .spar-cos__answer-icon { width: 52px; height: 52px; border-radius: 15px; } .spar-cos__answer-icon svg { width: 32px; height: 32px; } .spar-cos__principle, .spar-cos__clarity { grid-template-columns: minmax(0, 1fr); align-items: start; padding: 20px 17px; border-radius: 18px; } .spar-cos__principle-icon, .spar-cos__clarity-icon { width: 54px; height: 54px; border-radius: 15px; } .spar-cos__principle-icon svg, .spar-cos__clarity-icon svg { width: 31px; height: 31px; } .spar-cos__overview, .spar-cos__process-list { grid-template-columns: minmax(0, 1fr); } .spar-cos__overview-card { padding: 18px 16px; border-radius: 16px; } .spar-cos__detail-content h3, .spar-cos__process-header h3, .spar-cos__conversion h3 { font-size: clamp(1.42rem, 7.4vw, 1.92rem); } .spar-cos__detail--dark { padding: 22px 17px; border-radius: 19px; } .spar-cos__factor-panel, .spar-cos__system-diagram, .spar-cos__systems-map, .spar-cos__quote-panel { padding: 17px 15px; border-radius: 18px; } .spar-cos__factor-header, .spar-cos__system-header, .spar-cos__quote-header, .spar-cos__systems-header { grid-template-columns: 50px minmax(0, 1fr); } .spar-cos__factor-header > span, .spar-cos__system-header > span, .spar-cos__quote-header > span, .spar-cos__systems-header > span { width: 50px; height: 50px; border-radius: 14px; } .spar-cos__factor-grid, .spar-cos__noise-grid, .spar-cos__systems-grid, .spar-cos__quote-steps, .spar-cos__system-notes { grid-template-columns: minmax(0, 1fr); } .spar-cos__wall { min-height: 225px; } .spar-cos__process-list li { padding: 18px 16px; border-radius: 16px; } .spar-cos__conversion { padding: 22px 17px; border-radius: 19px; } .spar-cos__button { width: 100%; min-height: 57px; padding-inline: 13px; font-size: 0.86rem; } } /* ============================================================ SMARTPHONE MOLTO STRETTI ============================================================ */ @media (max-width: 380px) { .spar-cos__container { width: calc(100% - 22px); } .spar-cos__title { font-size: 1.7rem; } .spar-cos__principle, .spar-cos__clarity, .spar-cos__overview-card, .spar-cos__detail--dark, .spar-cos__factor-panel, .spar-cos__system-diagram, .spar-cos__systems-map, .spar-cos__quote-panel, .spar-cos__process-list li, .spar-cos__conversion { padding-inline: 14px; } .spar-cos__button { gap: 8px; padding-inline: 10px; font-size: 0.82rem; } .spar-cos__button svg { flex-basis: 21px; width: 21px; height: 21px; } } /* ============================================================ ACCESSIBILITÀ ============================================================ */ @media (prefers-reduced-motion: reduce) { .spar-cos__overview-card, .spar-cos__survey-link, .spar-cos__button { transition: none; } .spar-cos__overview-card:hover, .spar-cos__survey-link:hover, .spar-cos__button:hover { transform: none; } } /* ============================================================ STAMPA ============================================================ */ @media print { .spar-cos { padding: 30px 0; background: #ffffff; } .spar-cos__detail--dark { border: 1px solid var(--spar-cos-border); background: #ffffff; box-shadow: none; } .spar-cos__detail--dark .spar-cos__detail-content h3, .spar-cos__detail--dark .spar-cos__detail-answer, .spar-cos__noise-card h4, .spar-cos__systems-header strong, .spar-cos__systems-grid h4 { color: var(--spar-cos-dark); } .spar-cos__detail--dark .spar-cos__detail-content > p:not( .spar-cos__section-label, .spar-cos__detail-answer, .spar-cos__highlight ), .spar-cos__noise-card p, .spar-cos__systems-grid p { color: var(--spar-cos-muted); } .spar-cos__actions { display: none; } }#imCell_31 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHTMLObject_1726_31 { position: relative; align-self: start; justify-self: center; max-width: 100%; box-sizing: border-box; z-index: 3; } #imCellStyleGraphics_31 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imCellStyleBorders_31 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } /* ============================================================ H2 — ISOLAMENTO ACUSTICO DELLE PARETI IN CONDOMINIO Pagina: /isolamento-acustico-pareti-roma.html ============================================================ */ .spar-cond, .spar-cond *, .spar-cond *::before, .spar-cond *::after { box-sizing: border-box; } .spar-cond { --spar-cond-dark: #07343b; --spar-cond-deep: #05282e; --spar-cond-medium: #0b5159; --spar-cond-teal: #24bfc1; --spar-cond-teal-light: #d9f4f2; --spar-cond-orange: #ff8a2a; --spar-cond-orange-dark: #c85c0a; --spar-cond-green: #27ad68; --spar-cond-green-dark: #19864f; --spar-cond-trustpilot: #00b67a; --spar-cond-white: #ffffff; --spar-cond-cream: #fff8ed; --spar-cond-light: #edf8f7; --spar-cond-text: #173c41; --spar-cond-muted: #557277; --spar-cond-border: #d4e6e4; --spar-cond-shadow: 0 20px 52px rgba(6, 52, 59, 0.1); width: 100%; max-width: 100%; overflow: hidden; padding-block: clamp(64px, 8vw, 105px); background: radial-gradient( circle at 5% 7%, rgba(36, 191, 193, 0.11), transparent 27% ), radial-gradient( circle at 96% 94%, rgba(255, 138, 42, 0.08), transparent 25% ), #ffffff; color: var(--spar-cond-text); } .spar-cond h2, .spar-cond h3, .spar-cond h4, .spar-cond h5, .spar-cond p, .spar-cond li, .spar-cond span, .spar-cond strong, .spar-cond small, .spar-cond a, .spar-cond blockquote, .spar-cond cite { max-width: 100%; white-space: normal; overflow-wrap: break-word; word-break: normal; } .spar-cond__container { width: min(calc(100% - 40px), 1220px); margin-inline: auto; } /* ============================================================ TESTI CONDIVISI ============================================================ */ .spar-cond__eyebrow, .spar-cond__answer-label, .spar-cond__section-label, .spar-cond__main-link-label, .spar-cond__proof-label, .spar-cond__written-label, .spar-cond__warning-label, .spar-cond__conversion-label { margin: 0 0 12px; color: var(--spar-cond-orange-dark); font-size: 0.74rem; font-weight: 900; line-height: 1.4; letter-spacing: 0.075em; text-transform: uppercase; } .spar-cond__header { width: min(100%, 980px); margin-inline: auto; text-align: center; } .spar-cond__title { margin: 0; color: var(--spar-cond-dark); font-size: clamp(2rem, 4.2vw, 3.55rem); font-weight: 900; line-height: 1.08; letter-spacing: -0.04em; text-wrap: balance; } .spar-cond__direct-answer { margin: 24px auto 0; color: var(--spar-cond-dark); font-size: clamp(1.04rem, 1.5vw, 1.2rem); font-weight: 650; line-height: 1.7; } .spar-cond__direct-answer strong { font-weight: 900; } .spar-cond__intro { margin: 14px auto 0; color: var(--spar-cond-muted); font-size: 1rem; line-height: 1.72; } /* ============================================================ RISPOSTA IMMEDIATA ============================================================ */ .spar-cond__answer { display: grid; grid-template-columns: 76px minmax(0, 1fr); align-items: center; gap: 22px; width: min(100%, 1000px); margin: clamp(35px, 5vw, 56px) auto 0; padding: clamp(22px, 3vw, 33px); border: 1px solid rgba(36, 191, 193, 0.28); border-radius: 22px; background: var(--spar-cond-cream); box-shadow: var(--spar-cond-shadow); } .spar-cond__answer-icon { display: grid; place-items: center; width: 70px; height: 70px; border-radius: 19px; background: var(--spar-cond-dark); color: var(--spar-cond-teal-light); } .spar-cond__answer-icon svg { width: 42px; height: 42px; } .spar-cond__answer-content { min-width: 0; } .spar-cond__answer-content h4 { margin: 0; color: var(--spar-cond-dark); font-size: clamp(1.2rem, 2vw, 1.6rem); font-weight: 900; line-height: 1.3; } .spar-cond__answer-content > p:last-child { margin: 9px 0 0; color: var(--spar-cond-muted); font-size: 0.95rem; line-height: 1.66; } /* ============================================================ LINK PAGINA PRINCIPALE ============================================================ */ .spar-cond__main-link { display: grid; grid-template-columns: 72px minmax(0, 1fr) minmax(250px, auto); align-items: center; gap: 22px; margin-top: clamp(34px, 5vw, 52px); padding: clamp(22px, 3vw, 32px); border: 1px solid rgba(36, 191, 193, 0.3); border-radius: 22px; background: radial-gradient( circle at 96% 6%, rgba(36, 191, 193, 0.14), transparent 34% ), var(--spar-cond-white); box-shadow: var(--spar-cond-shadow); } .spar-cond__main-link-icon { display: grid; place-items: center; width: 68px; height: 68px; border-radius: 19px; background: var(--spar-cond-light); color: var(--spar-cond-dark); } .spar-cond__main-link-icon svg { width: 39px; height: 39px; } .spar-cond__main-link-content { min-width: 0; } .spar-cond__main-link-content h4 { margin: 0; color: var(--spar-cond-dark); font-size: clamp(1.2rem, 2vw, 1.62rem); font-weight: 900; line-height: 1.3; } .spar-cond__main-link-content > p:last-child { margin: 9px 0 0; color: var(--spar-cond-muted); font-size: 0.89rem; line-height: 1.63; } .spar-cond__main-link-button, .spar-cond__survey-link, .spar-cond__proof-link, .spar-cond__written-link { display: flex; min-width: 0; min-height: 54px; align-items: center; justify-content: center; gap: 10px; padding: 13px 17px; border: 2px solid var(--spar-cond-dark); border-radius: 12px; background: var(--spar-cond-dark); color: var(--spar-cond-white); font-size: 0.83rem; font-weight: 850; line-height: 1.35; text-align: center; text-decoration: none; transition: transform 180ms ease, background-color 180ms ease, border-color 180ms ease; } .spar-cond__main-link-button:hover, .spar-cond__survey-link:hover, .spar-cond__proof-link:hover, .spar-cond__written-link:hover { transform: translateY(-2px); border-color: var(--spar-cond-medium); background: var(--spar-cond-medium); } .spar-cond__main-link-button:focus-visible, .spar-cond__survey-link:focus-visible, .spar-cond__proof-link:focus-visible, .spar-cond__written-link:focus-visible { outline: 3px solid var(--spar-cond-orange); outline-offset: 4px; } .spar-cond__main-link-button svg, .spar-cond__survey-link svg, .spar-cond__proof-link svg, .spar-cond__written-link svg { flex: 0 0 22px; width: 22px; height: 22px; } /* ============================================================ PANORAMICA ============================================================ */ .spar-cond__overview { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: clamp(52px, 7vw, 82px); } .spar-cond__overview-card { display: grid; grid-template-columns: minmax(0, 1fr) 28px; align-content: start; gap: 15px 10px; min-width: 0; padding: 22px; border: 1px solid var(--spar-cond-border); border-top: 5px solid var(--spar-cond-dark); border-radius: 18px; background: var(--spar-cond-white); color: var(--spar-cond-dark); text-decoration: none; box-shadow: 0 12px 30px rgba(6, 52, 59, 0.07); transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease; } .spar-cond__overview-card--teal { border-top-color: var(--spar-cond-teal); } .spar-cond__overview-card--orange { border-top-color: var(--spar-cond-orange); } .spar-cond__overview-card:hover { transform: translateY(-3px); border-color: var(--spar-cond-teal); box-shadow: 0 17px 38px rgba(6, 52, 59, 0.11); } .spar-cond__overview-card:focus-visible { outline: 3px solid var(--spar-cond-orange); outline-offset: 4px; } .spar-cond__overview-number { grid-column: 1 / -1; color: rgba(7, 52, 59, 0.23); font-size: 1.5rem; font-weight: 950; line-height: 1; } .spar-cond__overview-content { display: grid; min-width: 0; gap: 7px; } .spar-cond__overview-content strong { color: var(--spar-cond-dark); font-size: 1rem; font-weight: 900; line-height: 1.4; } .spar-cond__overview-content small { color: var(--spar-cond-muted); font-size: 0.8rem; line-height: 1.52; } .spar-cond__overview-arrow { align-self: center; color: var(--spar-cond-orange-dark); font-size: 1.25rem; font-weight: 900; text-align: right; } /* ============================================================ APPROFONDIMENTI H3 ============================================================ */ .spar-cond__detail { display: grid; grid-template-columns: minmax(0, 0.92fr) minmax(460px, 1.08fr); align-items: center; gap: clamp(36px, 5vw, 68px); margin-top: clamp(66px, 9vw, 106px); scroll-margin-top: 110px; } .spar-cond__detail--dark { padding: clamp(29px, 4vw, 49px); border-radius: 25px; background: radial-gradient( circle at 96% 4%, rgba(36, 191, 193, 0.2), transparent 30% ), linear-gradient( 135deg, var(--spar-cond-deep), var(--spar-cond-dark) ); box-shadow: 0 24px 60px rgba(3, 35, 40, 0.2); } .spar-cond__detail-content { min-width: 0; } .spar-cond__detail-content h3, .spar-cond__proof-header h4, .spar-cond__written-header h4, .spar-cond__warning-content h4, .spar-cond__conversion-content h4 { margin: 0; color: var(--spar-cond-dark); font-size: clamp(1.5rem, 2.9vw, 2.35rem); font-weight: 900; line-height: 1.18; letter-spacing: -0.03em; text-wrap: balance; } .spar-cond__detail-answer { margin: 19px 0 0; color: var(--spar-cond-dark); font-size: 1.02rem; font-weight: 750; line-height: 1.68; } .spar-cond__detail-content > p:not( .spar-cond__section-label, .spar-cond__detail-answer, .spar-cond__highlight ) { margin: 13px 0 0; color: var(--spar-cond-muted); font-size: 0.96rem; line-height: 1.7; } .spar-cond__detail--dark .spar-cond__section-label { color: var(--spar-cond-orange); } .spar-cond__detail--dark .spar-cond__detail-content h3, .spar-cond__detail--dark .spar-cond__detail-answer { color: var(--spar-cond-white); } .spar-cond__detail--dark .spar-cond__detail-content > p:not( .spar-cond__section-label, .spar-cond__detail-answer, .spar-cond__highlight ) { color: rgba(255, 255, 255, 0.73); } .spar-cond__highlight { margin: 18px 0 0; padding: 15px 17px; border-left: 4px solid var(--spar-cond-orange); border-radius: 0 12px 12px 0; background: #fff0e2; color: var(--spar-cond-dark); font-size: 0.94rem; font-weight: 750; line-height: 1.65; } .spar-cond__detail--dark .spar-cond__highlight { background: rgba(255, 255, 255, 0.08); color: var(--spar-cond-white); } /* ============================================================ PANNELLO INTERVENTO INTERNO ============================================================ */ .spar-cond__inside-panel, .spar-cond__assessment-panel { min-width: 0; padding: 22px; border: 1px solid rgba(36, 191, 193, 0.28); border-radius: 21px; background: var(--spar-cond-white); box-shadow: var(--spar-cond-shadow); } .spar-cond__panel-header, .spar-cond__dark-panel-header { display: grid; grid-template-columns: 58px minmax(0, 1fr); align-items: center; gap: 14px; } .spar-cond__panel-header > span, .spar-cond__dark-panel-header > span { display: grid; place-items: center; width: 58px; height: 58px; border-radius: 16px; background: var(--spar-cond-dark); color: var(--spar-cond-teal-light); font-size: 0.82rem; font-weight: 950; } .spar-cond__panel-header small, .spar-cond__dark-panel-header small { display: block; color: var(--spar-cond-orange-dark); font-size: 0.65rem; font-weight: 850; line-height: 1.35; text-transform: uppercase; } .spar-cond__panel-header strong, .spar-cond__dark-panel-header strong { display: block; margin-top: 4px; color: var(--spar-cond-dark); font-size: 1.04rem; font-weight: 900; line-height: 1.4; } .spar-cond__inside-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 20px; } .spar-cond__inside-grid article { min-width: 0; padding: 16px; border: 1px solid var(--spar-cond-border); border-radius: 14px; background: var(--spar-cond-light); } .spar-cond__inside-grid article > span { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 11px; background: var(--spar-cond-white); color: var(--spar-cond-medium); font-size: 0.9rem; font-weight: 950; } .spar-cond__inside-grid h4 { margin: 12px 0 0; color: var(--spar-cond-dark); font-size: 0.9rem; font-weight: 900; line-height: 1.4; } .spar-cond__inside-grid p { margin: 6px 0 0; color: var(--spar-cond-muted); font-size: 0.78rem; line-height: 1.54; } /* ============================================================ VIDEO RECENSIONI ============================================================ */ .spar-cond__proof, .spar-cond__written { margin-top: clamp(58px, 8vw, 92px); padding: clamp(27px, 4vw, 44px); border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 24px; background: radial-gradient( circle at 96% 5%, rgba(36, 191, 193, 0.13), transparent 31% ), var(--spar-cond-cream); box-shadow: var(--spar-cond-shadow); } .spar-cond__proof-header, .spar-cond__written-header { width: min(100%, 900px); margin-inline: auto; text-align: center; } .spar-cond__proof-header h4, .spar-cond__written-header h4 { font-size: clamp(1.5rem, 2.8vw, 2.25rem); } .spar-cond__proof-header > p:last-child, .spar-cond__written-header > p:last-child { margin: 15px auto 0; color: var(--spar-cond-muted); font-size: 0.95rem; line-height: 1.68; } .spar-cond__video-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 31px; } .spar-cond__video-card { min-width: 0; overflow: hidden; border: 1px solid var(--spar-cond-border); border-radius: 18px; background: var(--spar-cond-white); box-shadow: 0 13px 32px rgba(6, 52, 59, 0.09); } .spar-cond__video-frame { position: relative; width: 100%; aspect-ratio: 16 / 9; overflow: hidden; background: var(--spar-cond-dark); } .spar-cond__video-frame iframe { position: absolute; inset: 0; display: block; width: 100%; height: 100%; border: 0; } .spar-cond__video-content { padding: 18px; } .spar-cond__video-location { margin: 0; color: var(--spar-cond-orange-dark); font-size: 0.67rem; font-weight: 900; line-height: 1.4; letter-spacing: 0.055em; text-transform: uppercase; } .spar-cond__video-content h5 { margin: 8px 0 0; color: var(--spar-cond-dark); font-size: 1rem; font-weight: 900; line-height: 1.4; } .spar-cond__video-content > p:last-child { margin: 8px 0 0; color: var(--spar-cond-muted); font-size: 0.82rem; line-height: 1.58; } .spar-cond__proof-link, .spar-cond__written-link { width: fit-content; max-width: 100%; margin: 26px auto 0; } /* ============================================================ RECENSIONI SCRITTE ============================================================ */ .spar-cond__written { background: radial-gradient( circle at 5% 6%, rgba(255, 138, 42, 0.1), transparent 30% ), var(--spar-cond-white); } .spar-cond__written-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 31px; } .spar-cond__written-card { display: flex; min-width: 0; flex-direction: column; padding: 22px; border: 1px solid var(--spar-cond-border); border-top: 5px solid var(--spar-cond-teal); border-radius: 18px; background: var(--spar-cond-white); box-shadow: 0 12px 30px rgba(6, 52, 59, 0.08); } .spar-cond__written-card:nth-child(2) { border-top-color: var(--spar-cond-orange); } .spar-cond__written-card:nth-child(3) { border-top-color: var(--spar-cond-green); } .spar-cond__stars { display: flex; gap: 3px; color: var(--spar-cond-orange); font-size: 1rem; line-height: 1; } .spar-cond__written-type { margin: 16px 0 0; color: var(--spar-cond-orange-dark); font-size: 0.67rem; font-weight: 900; line-height: 1.4; letter-spacing: 0.055em; text-transform: uppercase; } .spar-cond__written-card blockquote { margin: 17px 0 0; padding: 0; border: 0; color: var(--spar-cond-dark); font-size: 1.02rem; font-weight: 750; line-height: 1.6; } .spar-cond__written-card footer { display: grid; gap: 4px; margin-top: auto; padding-top: 20px; } .spar-cond__written-card footer strong { color: var(--spar-cond-dark); font-size: 0.9rem; font-weight: 900; } .spar-cond__written-card footer span { color: var(--spar-cond-muted); font-size: 0.76rem; line-height: 1.45; } /* ============================================================ BOX TRUSTPILOT ============================================================ */ .spar-cond__trustpilot { display: grid; grid-template-columns: minmax(250px, 0.92fr) minmax(120px, auto) minmax(260px, 1fr) minmax(240px, auto); align-items: center; gap: 24px; margin-top: clamp(42px, 6vw, 70px); padding: clamp(25px, 4vw, 40px); border: 1px solid rgba(0, 182, 122, 0.3); border-radius: 23px; background: radial-gradient( circle at 95% 5%, rgba(0, 182, 122, 0.14), transparent 32% ), var(--spar-cond-white); box-shadow: var(--spar-cond-shadow); } .spar-cond__trustpilot-brand { display: grid; grid-template-columns: 58px minmax(0, 1fr); align-items: center; gap: 14px; min-width: 0; } .spar-cond__trustpilot-logo { width: 58px; height: 58px; padding: 10px; border-radius: 15px; background: var(--spar-cond-trustpilot); color: var(--spar-cond-white); } .spar-cond__trustpilot-brand p { margin: 0; color: var(--spar-cond-green-dark); font-size: 0.66rem; font-weight: 900; line-height: 1.4; letter-spacing: 0.055em; text-transform: uppercase; } .spar-cond__trustpilot-brand h4 { margin: 5px 0 0; color: var(--spar-cond-dark); font-size: 1.25rem; font-weight: 900; line-height: 1.3; } .spar-cond__trustpilot-score { display: grid; justify-items: center; min-width: 0; } .spar-cond__trustpilot-score strong { color: var(--spar-cond-dark); font-size: 2.6rem; font-weight: 950; line-height: 1; } .spar-cond__trustpilot-score span { margin-top: 5px; color: var(--spar-cond-muted); font-size: 0.75rem; font-weight: 800; } .spar-cond__trustpilot-rating { min-width: 0; } .spar-cond__trustpilot-stars { display: flex; gap: 4px; } .spar-cond__trustpilot-stars > span { display: grid; place-items: center; width: 30px; height: 30px; background: var(--spar-cond-trustpilot); color: var(--spar-cond-white); font-size: 1rem; line-height: 1; } .spar-cond__trustpilot-star--partial { background: linear-gradient( to right, var(--spar-cond-trustpilot) 50%, #d9e2df 50% ) !important; } .spar-cond__trustpilot-rating p { margin: 12px 0 0; color: var(--spar-cond-muted); font-size: 0.82rem; line-height: 1.55; } .spar-cond__trustpilot-rating p strong { color: var(--spar-cond-dark); font-weight: 900; } .spar-cond__trustpilot-rating small { display: block; margin-top: 4px; color: var(--spar-cond-muted); font-size: 0.68rem; line-height: 1.45; } .spar-cond__trustpilot-button { display: flex; min-width: 0; min-height: 56px; align-items: center; justify-content: center; gap: 10px; padding: 13px 17px; border: 2px solid var(--spar-cond-trustpilot); border-radius: 12px; background: var(--spar-cond-trustpilot); color: var(--spar-cond-white); font-size: 0.83rem; font-weight: 850; line-height: 1.35; text-align: center; text-decoration: none; transition: transform 180ms ease, background-color 180ms ease, border-color 180ms ease; } .spar-cond__trustpilot-button:hover { transform: translateY(-2px); border-color: #009b68; background: #009b68; } .spar-cond__trustpilot-button:focus-visible { outline: 3px solid var(--spar-cond-orange); outline-offset: 4px; } .spar-cond__trustpilot-button svg { flex: 0 0 22px; width: 22px; height: 22px; } /* ============================================================ PANNELLO RUMORI ============================================================ */ .spar-cond__noise-panel { min-width: 0; padding: 22px; border: 1px solid rgba(255, 255, 255, 0.14); border-radius: 21px; background: rgba(255, 255, 255, 0.08); } .spar-cond__dark-panel-header > span { background: var(--spar-cond-teal); color: var(--spar-cond-dark); } .spar-cond__dark-panel-header small { color: var(--spar-cond-orange); } .spar-cond__dark-panel-header strong { color: var(--spar-cond-white); } .spar-cond__noise-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 20px; } .spar-cond__noise-grid article { min-width: 0; padding: 17px; border: 1px solid rgba(255, 255, 255, 0.13); border-top: 4px solid var(--spar-cond-teal); border-radius: 15px; background: rgba(255, 255, 255, 0.07); } .spar-cond__noise-grid article.spar-cond__noise-emphasis { border-top-color: var(--spar-cond-orange); } .spar-cond__noise-grid article > span { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: rgba(36, 191, 193, 0.15); color: var(--spar-cond-teal-light); font-size: 0.72rem; font-weight: 950; } .spar-cond__noise-emphasis > span { background: rgba(255, 138, 42, 0.16) !important; color: #ffd4ae !important; } .spar-cond__noise-grid h4 { margin: 13px 0 0; color: var(--spar-cond-white); font-size: 0.93rem; font-weight: 900; line-height: 1.4; } .spar-cond__noise-grid p { margin: 7px 0 0; color: rgba(255, 255, 255, 0.68); font-size: 0.79rem; line-height: 1.55; } /* ============================================================ AVVERTENZA ============================================================ */ .spar-cond__warning { display: grid; grid-template-columns: 68px minmax(0, 1fr); align-items: center; gap: 20px; margin-top: clamp(44px, 6vw, 68px); padding: clamp(23px, 3vw, 34px); border: 1px solid rgba(255, 138, 42, 0.3); border-radius: 21px; background: #fff3e7; } .spar-cond__warning-icon { display: grid; place-items: center; width: 64px; height: 64px; border-radius: 18px; background: var(--spar-cond-orange); color: #321705; } .spar-cond__warning-icon svg { width: 38px; height: 38px; } .spar-cond__warning-content { min-width: 0; } .spar-cond__warning-content h4 { font-size: clamp(1.2rem, 2vw, 1.65rem); letter-spacing: -0.02em; } .spar-cond__warning-content > p:last-child { margin: 9px 0 0; color: var(--spar-cond-muted); font-size: 0.91rem; line-height: 1.66; } /* ============================================================ VALUTAZIONE TECNICA ============================================================ */ .spar-cond__assessment-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 20px 0 0; padding: 0; list-style: none; } .spar-cond__assessment-list li { display: grid; grid-template-columns: 38px minmax(0, 1fr); gap: 10px; min-width: 0; padding: 14px; border: 1px solid var(--spar-cond-border); border-radius: 14px; background: var(--spar-cond-light); } .spar-cond__assessment-list li > span { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 11px; background: var(--spar-cond-dark); color: var(--spar-cond-teal-light); font-size: 0.74rem; font-weight: 900; } .spar-cond__assessment-list li > div { min-width: 0; } .spar-cond__assessment-list strong { display: block; color: var(--spar-cond-dark); font-size: 0.86rem; font-weight: 900; line-height: 1.4; } .spar-cond__assessment-list p { margin: 5px 0 0; color: var(--spar-cond-muted); font-size: 0.77rem; line-height: 1.52; } .spar-cond__survey-link { width: 100%; margin-top: 18px; } /* ============================================================ CTA FINALE ============================================================ */ .spar-cond__conversion { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(330px, 0.92fr); align-items: center; gap: clamp(30px, 5vw, 64px); margin-top: clamp(52px, 7vw, 82px); padding: clamp(26px, 4vw, 45px); border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 23px; background: var(--spar-cond-cream); box-shadow: var(--spar-cond-shadow); } .spar-cond__conversion-content { min-width: 0; } .spar-cond__conversion-content h4 { font-size: clamp(1.5rem, 2.9vw, 2.35rem); } .spar-cond__conversion-content > p:not(.spar-cond__conversion-label) { margin: 15px 0 0; color: var(--spar-cond-muted); font-size: 0.95rem; line-height: 1.69; } .spar-cond__conversion-content > p + p { margin-top: 10px; } .spar-cond__actions { display: grid; gap: 11px; min-width: 0; } .spar-cond__button { display: flex; min-width: 0; min-height: 57px; align-items: center; justify-content: center; gap: 10px; padding: 13px 17px; border: 2px solid transparent; border-radius: 12px; font-family: inherit; font-size: 0.9rem; font-weight: 850; line-height: 1.3; text-align: center; text-decoration: none; transition: transform 180ms ease, background-color 180ms ease, border-color 180ms ease; } .spar-cond__button:hover { transform: translateY(-2px); } .spar-cond__button:focus-visible { outline: 3px solid var(--spar-cond-dark); outline-offset: 4px; } .spar-cond__button svg { flex: 0 0 23px; width: 23px; height: 23px; } .spar-cond__button--primary { background: var(--spar-cond-orange); color: #2c1504; } .spar-cond__button--primary:hover { background: #ff9b43; } .spar-cond__button--whatsapp { background: var(--spar-cond-green); color: var(--spar-cond-white); } .spar-cond__button--whatsapp:hover { background: var(--spar-cond-green-dark); } .spar-cond__button--phone { border-color: rgba(7, 52, 59, 0.3); background: var(--spar-cond-white); color: var(--spar-cond-dark); } .spar-cond__button--phone:hover { border-color: var(--spar-cond-teal); background: var(--spar-cond-light); } .spar-cond__phone-text { display: grid; min-width: 0; gap: 1px; text-align: left; } .spar-cond__phone-text small { font-size: 0.64rem; font-weight: 750; line-height: 1.1; letter-spacing: 0.055em; text-transform: uppercase; } .spar-cond__phone-text strong { color: inherit; font-size: 1rem; font-weight: 900; line-height: 1.15; } /* ============================================================ NOTEBOOK ============================================================ */ @media (max-width: 1120px) { .spar-cond__main-link { grid-template-columns: 68px minmax(0, 1fr); } .spar-cond__main-link-button { grid-column: 1 / -1; justify-self: start; } .spar-cond__detail, .spar-cond__conversion { grid-template-columns: minmax(0, 1fr); } .spar-cond__video-grid, .spar-cond__written-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-cond__trustpilot { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-cond__trustpilot-button { width: 100%; } .spar-cond__actions { grid-template-columns: repeat(3, minmax(0, 1fr)); } } /* ============================================================ TABLET ============================================================ */ @media (max-width: 820px) { .spar-cond__container { width: min(calc(100% - 32px), 780px); } .spar-cond__answer { grid-template-columns: 60px minmax(0, 1fr); gap: 17px; } .spar-cond__answer-icon { width: 58px; height: 58px; } .spar-cond__overview { grid-template-columns: minmax(0, 1fr); } .spar-cond__video-grid, .spar-cond__written-grid { grid-template-columns: minmax(0, 1fr); } .spar-cond__video-card, .spar-cond__written-card { width: min(100%, 680px); margin-inline: auto; } .spar-cond__actions { grid-template-columns: minmax(0, 1fr); } } /* ============================================================ MOBILE ============================================================ */ @media (max-width: 580px) { .spar-cond { padding-block: 50px 62px; } .spar-cond__container { width: calc(100% - 28px); } .spar-cond__header, .spar-cond__proof-header, .spar-cond__written-header { text-align: left; } .spar-cond__eyebrow, .spar-cond__answer-label, .spar-cond__section-label, .spar-cond__main-link-label, .spar-cond__proof-label, .spar-cond__written-label, .spar-cond__warning-label, .spar-cond__conversion-label { font-size: 0.67rem; letter-spacing: 0.06em; } .spar-cond__title { font-size: clamp(1.84rem, 9.4vw, 2.62rem); line-height: 1.1; } .spar-cond__direct-answer { font-size: 0.98rem; line-height: 1.63; } .spar-cond__intro { font-size: 0.91rem; line-height: 1.66; } .spar-cond__answer { grid-template-columns: minmax(0, 1fr); padding: 20px 17px; border-radius: 18px; } .spar-cond__answer-icon { width: 52px; height: 52px; border-radius: 15px; } .spar-cond__answer-icon svg { width: 32px; height: 32px; } .spar-cond__main-link { grid-template-columns: minmax(0, 1fr); padding: 20px 17px; border-radius: 18px; } .spar-cond__main-link-icon { width: 54px; height: 54px; border-radius: 15px; } .spar-cond__main-link-button { width: 100%; justify-self: stretch; } .spar-cond__overview-card { padding: 18px 16px; border-radius: 16px; } .spar-cond__detail-content h3, .spar-cond__proof-header h4, .spar-cond__written-header h4, .spar-cond__conversion-content h4 { font-size: clamp(1.42rem, 7.4vw, 1.92rem); } .spar-cond__inside-panel, .spar-cond__assessment-panel { padding: 17px 15px; border-radius: 18px; } .spar-cond__panel-header, .spar-cond__dark-panel-header { grid-template-columns: 50px minmax(0, 1fr); } .spar-cond__panel-header > span, .spar-cond__dark-panel-header > span { width: 50px; height: 50px; } .spar-cond__inside-grid, .spar-cond__noise-grid, .spar-cond__assessment-list { grid-template-columns: minmax(0, 1fr); } .spar-cond__proof, .spar-cond__written { padding: 22px 15px; border-radius: 19px; } .spar-cond__video-content, .spar-cond__written-card { padding: 17px 15px; } .spar-cond__trustpilot { grid-template-columns: minmax(0, 1fr); justify-items: stretch; padding: 22px 17px; border-radius: 19px; } .spar-cond__trustpilot-score { justify-items: start; } .spar-cond__trustpilot-rating { width: 100%; } .spar-cond__trustpilot-button { width: 100%; } .spar-cond__detail--dark { padding: 22px 17px; border-radius: 19px; } .spar-cond__noise-panel { padding: 17px 15px; border-radius: 18px; } .spar-cond__warning { grid-template-columns: minmax(0, 1fr); align-items: start; padding: 20px 17px; border-radius: 18px; } .spar-cond__warning-icon { width: 53px; height: 53px; border-radius: 15px; } .spar-cond__warning-icon svg { width: 31px; height: 31px; } .spar-cond__conversion { padding: 22px 17px; border-radius: 19px; } .spar-cond__button { width: 100%; min-height: 57px; padding-inline: 13px; font-size: 0.86rem; } } /* ============================================================ SMARTPHONE MOLTO STRETTI ============================================================ */ @media (max-width: 380px) { .spar-cond__container { width: calc(100% - 22px); } .spar-cond__title { font-size: 1.7rem; } .spar-cond__main-link, .spar-cond__overview-card, .spar-cond__inside-panel, .spar-cond__proof, .spar-cond__written, .spar-cond__written-card, .spar-cond__trustpilot, .spar-cond__detail--dark, .spar-cond__noise-panel, .spar-cond__warning, .spar-cond__assessment-panel, .spar-cond__conversion { padding-inline: 14px; } .spar-cond__trustpilot-stars > span { width: 27px; height: 27px; font-size: 0.9rem; } .spar-cond__button { gap: 8px; padding-inline: 10px; font-size: 0.82rem; } .spar-cond__button svg { flex-basis: 21px; width: 21px; height: 21px; } } /* ============================================================ ACCESSIBILITÀ ============================================================ */ @media (prefers-reduced-motion: reduce) { .spar-cond__main-link-button, .spar-cond__survey-link, .spar-cond__proof-link, .spar-cond__written-link, .spar-cond__overview-card, .spar-cond__trustpilot-button, .spar-cond__button { transition: none; } .spar-cond__main-link-button:hover, .spar-cond__survey-link:hover, .spar-cond__proof-link:hover, .spar-cond__written-link:hover, .spar-cond__overview-card:hover, .spar-cond__trustpilot-button:hover, .spar-cond__button:hover { transform: none; } } /* ============================================================ STAMPA ============================================================ */ @media print { .spar-cond { padding: 30px 0; background: #ffffff; } .spar-cond__video-grid { display: none; } .spar-cond__detail--dark { border: 1px solid var(--spar-cond-border); background: #ffffff; box-shadow: none; } .spar-cond__detail--dark .spar-cond__detail-content h3, .spar-cond__detail--dark .spar-cond__detail-answer, .spar-cond__dark-panel-header strong, .spar-cond__noise-grid h4 { color: var(--spar-cond-dark); } .spar-cond__detail--dark .spar-cond__detail-content > p:not( .spar-cond__section-label, .spar-cond__detail-answer, .spar-cond__highlight ), .spar-cond__noise-grid p { color: var(--spar-cond-muted); } .spar-cond__actions { display: none; } }#imCell_32 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHTMLObject_1726_32 { position: relative; align-self: start; justify-self: center; max-width: 100%; box-sizing: border-box; z-index: 3; } #imCellStyleGraphics_32 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imCellStyleBorders_32 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } /* ============================================================ H2 — PERCHÉ SCEGLIERE SORGEDIL PER LE PARETI INSONORIZZATE A ROMA Pagina: /isolamento-acustico-pareti-roma.html ============================================================ */ .spar-why, .spar-why *, .spar-why *::before, .spar-why *::after { box-sizing: border-box; } .spar-why { --spar-why-dark: #07343b; --spar-why-deep: #05282e; --spar-why-medium: #0b5159; --spar-why-teal: #24bfc1; --spar-why-teal-light: #d9f4f2; --spar-why-orange: #ff8a2a; --spar-why-orange-dark: #c85c0a; --spar-why-green: #27ad68; --spar-why-green-dark: #19864f; --spar-why-white: #ffffff; --spar-why-cream: #fff8ed; --spar-why-light: #edf8f7; --spar-why-text: #173c41; --spar-why-muted: #557277; --spar-why-border: #d4e6e4; --spar-why-shadow: 0 20px 52px rgba(6, 52, 59, 0.1); width: 100%; max-width: 100%; overflow: hidden; padding-block: clamp(64px, 8vw, 105px); background: radial-gradient( circle at 5% 7%, rgba(36, 191, 193, 0.11), transparent 27% ), radial-gradient( circle at 96% 94%, rgba(255, 138, 42, 0.08), transparent 25% ), var(--spar-why-cream); color: var(--spar-why-text); } .spar-why h2, .spar-why h3, .spar-why h4, .spar-why h5, .spar-why p, .spar-why li, .spar-why span, .spar-why strong, .spar-why small, .spar-why a, .spar-why figcaption { max-width: 100%; white-space: normal; overflow-wrap: break-word; word-break: normal; } .spar-why img, .spar-why svg { max-width: 100%; } .spar-why__container { width: min(calc(100% - 40px), 1220px); margin-inline: auto; } /* ============================================================ ETICHETTE ============================================================ */ .spar-why__eyebrow, .spar-why__answer-label, .spar-why__section-label, .spar-why__guarantee-label, .spar-why__books-label, .spar-why__criteria-label, .spar-why__trust-label, .spar-why__conversion-label { margin: 0 0 12px; color: var(--spar-why-orange-dark); font-size: 0.74rem; font-weight: 900; line-height: 1.4; letter-spacing: 0.075em; text-transform: uppercase; } /* ============================================================ INTESTAZIONE ============================================================ */ .spar-why__header { width: min(100%, 980px); margin-inline: auto; text-align: center; } .spar-why__title { margin: 0; color: var(--spar-why-dark); font-size: clamp(2rem, 4.2vw, 3.55rem); font-weight: 900; line-height: 1.08; letter-spacing: -0.04em; text-wrap: balance; } .spar-why__direct-answer { margin: 24px auto 0; color: var(--spar-why-dark); font-size: clamp(1.04rem, 1.5vw, 1.2rem); font-weight: 650; line-height: 1.7; } .spar-why__direct-answer strong { color: inherit; font-weight: 900; } .spar-why__intro { margin: 14px auto 0; color: var(--spar-why-muted); font-size: 1rem; line-height: 1.72; } /* ============================================================ RISPOSTA IMMEDIATA ============================================================ */ .spar-why__answer { display: grid; grid-template-columns: 76px minmax(0, 1fr); align-items: center; gap: 22px; width: min(100%, 1000px); margin: clamp(35px, 5vw, 56px) auto 0; padding: clamp(22px, 3vw, 33px); border: 1px solid rgba(36, 191, 193, 0.28); border-radius: 22px; background: var(--spar-why-white); box-shadow: var(--spar-why-shadow); } .spar-why__answer-icon { display: grid; place-items: center; width: 70px; height: 70px; border-radius: 19px; background: var(--spar-why-dark); color: var(--spar-why-teal-light); } .spar-why__answer-icon svg { display: block; width: 42px; height: 42px; } .spar-why__answer-content { min-width: 0; } .spar-why__answer-content h4 { margin: 0; color: var(--spar-why-dark); font-size: clamp(1.2rem, 2vw, 1.6rem); font-weight: 900; line-height: 1.3; } .spar-why__answer-content > p:last-child { margin: 9px 0 0; color: var(--spar-why-muted); font-size: 0.95rem; line-height: 1.66; } /* ============================================================ PANORAMICA ============================================================ */ .spar-why__overview { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: clamp(52px, 7vw, 82px); } .spar-why__overview-card { display: grid; grid-template-columns: minmax(0, 1fr) 28px; align-content: start; gap: 15px 10px; min-width: 0; padding: 22px; border: 1px solid var(--spar-why-border); border-top: 5px solid var(--spar-why-dark); border-radius: 18px; background: var(--spar-why-white); color: var(--spar-why-dark); text-decoration: none; box-shadow: 0 12px 30px rgba(6, 52, 59, 0.07); transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease; } .spar-why__overview-card--teal { border-top-color: var(--spar-why-teal); } .spar-why__overview-card--orange { border-top-color: var(--spar-why-orange); } .spar-why__overview-card:hover { transform: translateY(-3px); border-color: var(--spar-why-teal); box-shadow: 0 17px 38px rgba(6, 52, 59, 0.11); } .spar-why__overview-card:focus-visible { outline: 3px solid var(--spar-why-orange); outline-offset: 4px; } .spar-why__overview-number { grid-column: 1 / -1; color: rgba(7, 52, 59, 0.23); font-size: 1.5rem; font-weight: 950; line-height: 1; } .spar-why__overview-content { display: grid; min-width: 0; gap: 7px; } .spar-why__overview-content strong { color: var(--spar-why-dark); font-size: 1rem; font-weight: 900; line-height: 1.4; } .spar-why__overview-content small { color: var(--spar-why-muted); font-size: 0.8rem; line-height: 1.52; } .spar-why__overview-arrow { align-self: center; color: var(--spar-why-orange-dark); font-size: 1.25rem; font-weight: 900; text-align: right; } /* ============================================================ APPROFONDIMENTI H3 ============================================================ */ .spar-why__detail { display: grid; grid-template-columns: minmax(0, 0.92fr) minmax(460px, 1.08fr); align-items: center; gap: clamp(36px, 5vw, 68px); margin-top: clamp(66px, 9vw, 106px); scroll-margin-top: 110px; } .spar-why__detail--dark { padding: clamp(29px, 4vw, 49px); border-radius: 25px; background: radial-gradient( circle at 96% 4%, rgba(36, 191, 193, 0.2), transparent 30% ), linear-gradient( 135deg, var(--spar-why-deep), var(--spar-why-dark) ); box-shadow: 0 24px 60px rgba(3, 35, 40, 0.2); } .spar-why__detail-content { min-width: 0; } .spar-why__detail-content h3, .spar-why__books-header h4, .spar-why__criteria-header h4, .spar-why__trust-content h4, .spar-why__conversion-content h4 { margin: 0; color: var(--spar-why-dark); font-size: clamp(1.5rem, 2.9vw, 2.35rem); font-weight: 900; line-height: 1.18; letter-spacing: -0.03em; text-wrap: balance; } .spar-why__detail-answer { margin: 19px 0 0; color: var(--spar-why-dark); font-size: 1.02rem; font-weight: 750; line-height: 1.68; } .spar-why__detail-content > p:not( .spar-why__section-label, .spar-why__detail-answer, .spar-why__highlight ) { margin: 13px 0 0; color: var(--spar-why-muted); font-size: 0.96rem; line-height: 1.7; } .spar-why__detail--dark .spar-why__section-label { color: var(--spar-why-orange); } .spar-why__detail--dark .spar-why__detail-content h3, .spar-why__detail--dark .spar-why__detail-answer { color: var(--spar-why-white); } .spar-why__detail--dark .spar-why__detail-content > p:not( .spar-why__section-label, .spar-why__detail-answer, .spar-why__highlight ) { color: rgba(255, 255, 255, 0.73); } .spar-why__highlight { margin: 18px 0 0; padding: 15px 17px; border-left: 4px solid var(--spar-why-orange); border-radius: 0 12px 12px 0; background: #fff0e2; color: var(--spar-why-dark); font-size: 0.94rem; font-weight: 750; line-height: 1.65; } .spar-why__detail--dark .spar-why__highlight { background: rgba(255, 255, 255, 0.08); color: var(--spar-why-white); } /* ============================================================ PANNELLI CHIARI ============================================================ */ .spar-why__specialization-panel, .spar-why__process-panel { min-width: 0; padding: 22px; border: 1px solid rgba(36, 191, 193, 0.28); border-radius: 21px; background: var(--spar-why-white); box-shadow: var(--spar-why-shadow); } .spar-why__panel-header, .spar-why__dark-panel-header { display: grid; grid-template-columns: 58px minmax(0, 1fr); align-items: center; gap: 14px; } .spar-why__panel-header > span, .spar-why__dark-panel-header > span { display: grid; place-items: center; width: 58px; height: 58px; border-radius: 16px; background: var(--spar-why-dark); color: var(--spar-why-teal-light); font-size: 0.82rem; font-weight: 950; } .spar-why__panel-header small, .spar-why__dark-panel-header small { display: block; color: var(--spar-why-orange-dark); font-size: 0.65rem; font-weight: 850; line-height: 1.35; text-transform: uppercase; } .spar-why__panel-header strong, .spar-why__dark-panel-header strong { display: block; margin-top: 4px; color: var(--spar-why-dark); font-size: 1.04rem; font-weight: 900; line-height: 1.4; } .spar-why__specialization-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 20px; } .spar-why__specialization-grid article { min-width: 0; padding: 16px; border: 1px solid var(--spar-why-border); border-radius: 14px; background: var(--spar-why-light); } .spar-why__specialization-grid article > span { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 11px; background: var(--spar-why-white); color: var(--spar-why-medium); font-size: 0.85rem; font-weight: 950; } .spar-why__specialization-grid h4 { margin: 12px 0 0; color: var(--spar-why-dark); font-size: 0.9rem; font-weight: 900; line-height: 1.4; } .spar-why__specialization-grid p { margin: 6px 0 0; color: var(--spar-why-muted); font-size: 0.78rem; line-height: 1.54; } /* ============================================================ GARANZIA RISCHIO ZERO CON FOTO ============================================================ */ .spar-why__guarantee { display: grid; grid-template-columns: minmax(360px, 0.92fr) minmax(0, 1.08fr); align-items: center; gap: clamp(30px, 5vw, 58px); margin-top: clamp(54px, 8vw, 88px); padding: clamp(26px, 4vw, 43px); border: 1px solid rgba(39, 173, 104, 0.3); border-radius: 24px; background: radial-gradient( circle at 96% 5%, rgba(39, 173, 104, 0.13), transparent 32% ), var(--spar-why-white); box-shadow: var(--spar-why-shadow); } .spar-why__guarantee-figure { width: 100%; max-width: 500px; min-width: 0; margin: 0; } .spar-why__guarantee-image-link { display: block; color: inherit; text-decoration: none; } .spar-why__guarantee-image-link:focus-visible { outline: 3px solid var(--spar-why-orange); outline-offset: 5px; border-radius: 18px; } .spar-why__guarantee-image-frame { position: relative; display: block; width: 100%; aspect-ratio: 16 / 9; overflow: hidden; border: 1px solid rgba(39, 173, 104, 0.25); border-radius: 19px; background: var(--spar-why-dark); box-shadow: 0 17px 40px rgba(6, 52, 59, 0.15); } .spar-why__guarantee-image { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; transition: transform 260ms ease; } .spar-why__guarantee-image-overlay { position: absolute; right: 14px; bottom: 14px; left: 14px; display: flex; min-height: 48px; align-items: center; justify-content: center; padding: 11px 14px; border: 1px solid rgba(255, 255, 255, 0.28); border-radius: 11px; background: rgba(5, 40, 46, 0.88); color: var(--spar-why-white); font-size: 0.78rem; font-weight: 850; line-height: 1.35; text-align: center; backdrop-filter: blur(5px); } .spar-why__guarantee-image-link:hover .spar-why__guarantee-image { transform: scale(1.025); } .spar-why__guarantee-figure figcaption { margin: 11px auto 0; color: var(--spar-why-muted); font-size: 0.72rem; line-height: 1.5; text-align: center; } .spar-why__guarantee-content { min-width: 0; } .spar-why__guarantee-content h4 { margin: 0; color: var(--spar-why-dark); font-size: clamp(1.45rem, 2.7vw, 2.2rem); font-weight: 900; line-height: 1.2; letter-spacing: -0.03em; } .spar-why__guarantee-content > p:not( .spar-why__guarantee-label, .spar-why__guarantee-note ) { margin: 13px 0 0; color: var(--spar-why-muted); font-size: 0.94rem; line-height: 1.68; } .spar-why__guarantee-points { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 20px; } .spar-why__guarantee-points > div { display: grid; grid-template-columns: 34px minmax(0, 1fr); align-items: start; gap: 9px; min-width: 0; padding: 12px; border: 1px solid var(--spar-why-border); border-radius: 13px; background: var(--spar-why-light); } .spar-why__guarantee-points span { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: var(--spar-why-green); color: var(--spar-why-white); font-size: 0.75rem; font-weight: 900; } .spar-why__guarantee-points p { margin: 0; color: var(--spar-why-muted); font-size: 0.73rem; font-weight: 700; line-height: 1.48; } .spar-why__guarantee-note { margin: 17px 0 0; padding: 14px 16px; border-left: 4px solid var(--spar-why-green); border-radius: 0 11px 11px 0; background: #eaf8f0; color: var(--spar-why-dark); font-size: 0.83rem; line-height: 1.6; } .spar-why__guarantee-note strong { color: inherit; font-weight: 900; } .spar-why__guarantee-link { display: flex; width: fit-content; max-width: 100%; min-height: 54px; align-items: center; justify-content: center; gap: 10px; margin-top: 19px; padding: 13px 17px; border: 2px solid var(--spar-why-green); border-radius: 12px; background: var(--spar-why-green); color: var(--spar-why-white); font-size: 0.83rem; font-weight: 850; line-height: 1.35; text-align: center; text-decoration: none; transition: transform 180ms ease, background-color 180ms ease, border-color 180ms ease; } .spar-why__guarantee-link:hover { transform: translateY(-2px); border-color: var(--spar-why-green-dark); background: var(--spar-why-green-dark); } .spar-why__guarantee-link:focus-visible { outline: 3px solid var(--spar-why-orange); outline-offset: 4px; } .spar-why__guarantee-link svg { flex: 0 0 22px; width: 22px; height: 22px; } /* ============================================================ LIBRI GRATUITI CON COPERTINE REALI ============================================================ */ .spar-why__books { margin-top: clamp(58px, 8vw, 94px); padding: clamp(28px, 4vw, 46px); border-radius: 25px; background: radial-gradient( circle at 96% 4%, rgba(36, 191, 193, 0.2), transparent 30% ), linear-gradient( 135deg, var(--spar-why-deep), var(--spar-why-dark) ); box-shadow: 0 24px 60px rgba(3, 35, 40, 0.2); } .spar-why__books-header { width: min(100%, 900px); margin-inline: auto; text-align: center; } .spar-why__books-label { color: var(--spar-why-orange); } .spar-why__books-header h4 { color: var(--spar-why-white); } .spar-why__books-header > p:last-child { margin: 15px auto 0; color: rgba(255, 255, 255, 0.73); font-size: 0.95rem; line-height: 1.68; } .spar-why__books-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; margin-top: 32px; } .spar-why__book-card { display: grid; grid-template-columns: minmax(170px, 0.38fr) minmax(0, 0.62fr); min-width: 0; overflow: hidden; border: 1px solid rgba(255, 255, 255, 0.16); border-radius: 20px; background: var(--spar-why-white); box-shadow: 0 16px 38px rgba(0, 0, 0, 0.16); } .spar-why__book-figure { display: grid; min-width: 0; margin: 0; padding: 20px; place-items: center; background: radial-gradient( circle at 50% 20%, rgba(36, 191, 193, 0.2), transparent 48% ), #e8f3f2; } .spar-why__book-card--second .spar-why__book-figure { background: radial-gradient( circle at 50% 20%, rgba(255, 138, 42, 0.18), transparent 48% ), #f8eee2; } .spar-why__book-cover-link { display: block; width: min(100%, 220px); color: inherit; text-decoration: none; } .spar-why__book-cover-link:focus-visible { outline: 3px solid var(--spar-why-orange); outline-offset: 5px; border-radius: 10px; } .spar-why__book-cover-frame { display: grid; width: 100%; aspect-ratio: 2 / 3; place-items: center; } .spar-why__book-cover-image { display: block; width: 100%; height: 100%; object-fit: contain; object-position: center; filter: drop-shadow(0 17px 16px rgba(5, 40, 46, 0.2)); transition: transform 220ms ease, filter 220ms ease; } .spar-why__book-cover-link:hover .spar-why__book-cover-image { transform: translateY(-4px) scale(1.015); filter: drop-shadow(0 21px 19px rgba(5, 40, 46, 0.25)); } .spar-why__book-content { display: flex; min-width: 0; flex-direction: column; padding: 24px; } .spar-why__book-category { margin: 0; color: var(--spar-why-orange-dark); font-size: 0.65rem; font-weight: 900; line-height: 1.4; letter-spacing: 0.055em; text-transform: uppercase; } .spar-why__book-content h5 { margin: 8px 0 0; color: var(--spar-why-dark); font-size: 1.2rem; font-weight: 900; line-height: 1.35; } .spar-why__book-content > p:not(.spar-why__book-category) { margin: 10px 0 0; color: var(--spar-why-muted); font-size: 0.84rem; line-height: 1.6; } .spar-why__book-content ul { display: grid; gap: 7px; margin: 16px 0 0; padding: 0; list-style: none; } .spar-why__book-content li { position: relative; padding-left: 18px; color: var(--spar-why-muted); font-size: 0.78rem; line-height: 1.5; } .spar-why__book-content li::before { content: "✓"; position: absolute; top: 0; left: 0; color: var(--spar-why-green); font-weight: 900; } .spar-why__book-link { display: flex; min-height: 52px; align-items: center; justify-content: center; gap: 9px; margin-top: auto; padding: 13px 14px; border: 2px solid var(--spar-why-orange); border-radius: 11px; background: var(--spar-why-orange); color: #2d1504; font-size: 0.79rem; font-weight: 900; line-height: 1.35; text-align: center; text-decoration: none; transition: transform 180ms ease, background-color 180ms ease; } .spar-why__book-link--second { border-color: var(--spar-why-teal); background: var(--spar-why-teal); color: var(--spar-why-dark); } .spar-why__book-link:hover { transform: translateY(-2px); background: #ff9b43; } .spar-why__book-link--second:hover { background: #49cccd; } .spar-why__book-link:focus-visible { outline: 3px solid var(--spar-why-dark); outline-offset: 4px; } .spar-why__book-link svg { flex: 0 0 21px; width: 21px; height: 21px; } .spar-why__all-books-link { display: flex; width: fit-content; max-width: 100%; min-height: 54px; align-items: center; justify-content: center; gap: 10px; margin: 26px auto 0; padding: 13px 18px; border: 2px solid var(--spar-why-white); border-radius: 12px; background: transparent; color: var(--spar-why-white); font-size: 0.83rem; font-weight: 850; line-height: 1.35; text-align: center; text-decoration: none; transition: transform 180ms ease, background-color 180ms ease, color 180ms ease; } .spar-why__all-books-link:hover { transform: translateY(-2px); background: var(--spar-why-white); color: var(--spar-why-dark); } .spar-why__all-books-link:focus-visible { outline: 3px solid var(--spar-why-orange); outline-offset: 4px; } .spar-why__all-books-link svg { flex: 0 0 22px; width: 22px; height: 22px; } .spar-why__books-note { margin: 17px auto 0; color: rgba(255, 255, 255, 0.64); font-size: 0.74rem; line-height: 1.55; text-align: center; } /* ============================================================ PERCORSO DEL RUMORE ============================================================ */ .spar-why__path-panel { min-width: 0; padding: 21px; border: 1px solid rgba(255, 255, 255, 0.14); border-radius: 21px; background: rgba(255, 255, 255, 0.08); } .spar-why__dark-panel-header > span { background: var(--spar-why-teal); color: var(--spar-why-dark); } .spar-why__dark-panel-header small { color: var(--spar-why-orange); } .spar-why__dark-panel-header strong { color: var(--spar-why-white); } .spar-why__path-room { position: relative; min-height: 330px; margin-top: 20px; overflow: hidden; border-radius: 15px; background: var(--spar-why-white); } .spar-why__path-ceiling, .spar-why__path-floor, .spar-why__path-source, .spar-why__path-wall, .spar-why__path-protected { position: absolute; display: grid; place-items: center; padding: 8px; color: var(--spar-why-dark); font-size: 0.64rem; font-weight: 900; line-height: 1.3; text-align: center; text-transform: uppercase; } .spar-why__path-ceiling { top: 0; right: 0; left: 0; height: 17%; background: repeating-linear-gradient( 45deg, #d9e0e0, #d9e0e0 8px, #c9d2d2 8px, #c9d2d2 16px ); } .spar-why__path-floor { right: 0; bottom: 0; left: 0; height: 17%; background: repeating-linear-gradient( 135deg, #d9e0e0, #d9e0e0 8px, #c9d2d2 8px, #c9d2d2 16px ); } .spar-why__path-source { top: 17%; bottom: 17%; left: 0; width: 33%; background: #fff0e2; color: #703507; } .spar-why__path-wall { top: 17%; bottom: 17%; left: 33%; width: 18%; background: repeating-linear-gradient( 45deg, #cbeae8, #cbeae8 9px, #b5dfdc 9px, #b5dfdc 18px ); writing-mode: vertical-rl; transform: rotate(180deg); } .spar-why__path-protected { top: 17%; right: 0; bottom: 17%; width: 49%; background: var(--spar-why-light); } .spar-why__path-arrow { position: absolute; z-index: 2; color: var(--spar-why-orange-dark); font-size: 2rem; font-weight: 950; } .spar-why__path-arrow--direct { top: 50%; left: 43%; transform: translate(-50%, -50%); } .spar-why__path-arrow--top { top: 21%; left: 52%; } .spar-why__path-arrow--bottom { bottom: 21%; left: 52%; } .spar-why__path-legend { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; margin-top: 14px; } .spar-why__path-legend p { margin: 0; padding: 13px; border: 1px solid rgba(255, 255, 255, 0.13); border-radius: 12px; background: rgba(255, 255, 255, 0.07); color: rgba(255, 255, 255, 0.7); font-size: 0.77rem; line-height: 1.53; } .spar-why__path-legend strong { color: var(--spar-why-white); } /* ============================================================ CRITERI DI PROGETTAZIONE ============================================================ */ .spar-why__criteria { margin-top: clamp(60px, 8vw, 94px); } .spar-why__criteria-header { width: min(100%, 900px); margin-inline: auto; text-align: center; } .spar-why__criteria-header > p:last-child { margin: 15px auto 0; color: var(--spar-why-muted); font-size: 0.95rem; line-height: 1.68; } .spar-why__criteria-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; margin-top: 31px; } .spar-why__criteria-grid article { min-width: 0; padding: 21px; border: 1px solid var(--spar-why-border); border-top: 5px solid var(--spar-why-dark); border-radius: 17px; background: var(--spar-why-white); box-shadow: 0 11px 29px rgba(6, 52, 59, 0.07); } .spar-why__criteria-grid article:nth-child(2), .spar-why__criteria-grid article:nth-child(5) { border-top-color: var(--spar-why-teal); } .spar-why__criteria-grid article:nth-child(3), .spar-why__criteria-grid article:nth-child(6) { border-top-color: var(--spar-why-orange); } .spar-why__criteria-grid article > span { color: rgba(7, 52, 59, 0.23); font-size: 1.4rem; font-weight: 950; line-height: 1; } .spar-why__criteria-grid h5 { margin: 14px 0 0; color: var(--spar-why-dark); font-size: 0.96rem; font-weight: 900; line-height: 1.4; } .spar-why__criteria-grid p { margin: 7px 0 0; color: var(--spar-why-muted); font-size: 0.81rem; line-height: 1.56; } /* ============================================================ PROCESSO COMPLETO ============================================================ */ .spar-why__process-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 20px 0 0; padding: 0; list-style: none; } .spar-why__process-list li { display: grid; grid-template-columns: 38px minmax(0, 1fr); gap: 10px; min-width: 0; padding: 14px; border: 1px solid var(--spar-why-border); border-radius: 14px; background: var(--spar-why-light); } .spar-why__process-list li > span { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 11px; background: var(--spar-why-dark); color: var(--spar-why-teal-light); font-size: 0.74rem; font-weight: 900; } .spar-why__process-list li > div { min-width: 0; } .spar-why__process-list strong { display: block; color: var(--spar-why-dark); font-size: 0.86rem; font-weight: 900; line-height: 1.4; } .spar-why__process-list p { margin: 5px 0 0; color: var(--spar-why-muted); font-size: 0.77rem; line-height: 1.52; } .spar-why__survey-link { display: flex; width: 100%; min-height: 54px; align-items: center; justify-content: center; gap: 10px; margin-top: 18px; padding: 13px 17px; border: 2px solid var(--spar-why-dark); border-radius: 12px; background: var(--spar-why-dark); color: var(--spar-why-white); font-size: 0.83rem; font-weight: 850; line-height: 1.35; text-align: center; text-decoration: none; transition: transform 180ms ease, background-color 180ms ease, border-color 180ms ease; } .spar-why__survey-link:hover { transform: translateY(-2px); border-color: var(--spar-why-medium); background: var(--spar-why-medium); } .spar-why__survey-link:focus-visible { outline: 3px solid var(--spar-why-orange); outline-offset: 4px; } .spar-why__survey-link svg { flex: 0 0 22px; width: 22px; height: 22px; } /* ============================================================ BLOCCO DI FIDUCIA ============================================================ */ .spar-why__trust { display: grid; grid-template-columns: 70px minmax(0, 1fr); align-items: center; gap: 21px; margin-top: clamp(48px, 6vw, 72px); padding: clamp(23px, 3vw, 34px); border: 1px solid rgba(255, 138, 42, 0.3); border-radius: 21px; background: #fff3e7; } .spar-why__trust-icon { display: grid; place-items: center; width: 66px; height: 66px; border-radius: 18px; background: var(--spar-why-orange); color: #321705; } .spar-why__trust-icon svg { width: 38px; height: 38px; } .spar-why__trust-content { min-width: 0; } .spar-why__trust-content h4 { font-size: clamp(1.25rem, 2.1vw, 1.75rem); } .spar-why__trust-content > p:last-child { margin: 9px 0 0; color: var(--spar-why-muted); font-size: 0.91rem; line-height: 1.66; } /* ============================================================ CTA FINALE ============================================================ */ .spar-why__conversion { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(330px, 0.92fr); align-items: center; gap: clamp(30px, 5vw, 64px); margin-top: clamp(52px, 7vw, 82px); padding: clamp(26px, 4vw, 45px); border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 23px; background: var(--spar-why-white); box-shadow: var(--spar-why-shadow); } .spar-why__conversion-content { min-width: 0; } .spar-why__conversion-content > p:not(.spar-why__conversion-label) { margin: 15px 0 0; color: var(--spar-why-muted); font-size: 0.95rem; line-height: 1.69; } .spar-why__conversion-content > p + p { margin-top: 10px; } .spar-why__actions { display: grid; gap: 11px; min-width: 0; } .spar-why__button { display: flex; min-width: 0; min-height: 57px; align-items: center; justify-content: center; gap: 10px; padding: 13px 17px; border: 2px solid transparent; border-radius: 12px; font-family: inherit; font-size: 0.9rem; font-weight: 850; line-height: 1.3; text-align: center; text-decoration: none; transition: transform 180ms ease, background-color 180ms ease, border-color 180ms ease; } .spar-why__button:hover { transform: translateY(-2px); } .spar-why__button:focus-visible { outline: 3px solid var(--spar-why-dark); outline-offset: 4px; } .spar-why__button svg { flex: 0 0 23px; width: 23px; height: 23px; } .spar-why__button--primary { background: var(--spar-why-orange); color: #2c1504; } .spar-why__button--primary:hover { background: #ff9b43; } .spar-why__button--whatsapp { background: var(--spar-why-green); color: var(--spar-why-white); } .spar-why__button--whatsapp:hover { background: var(--spar-why-green-dark); } .spar-why__button--phone { border-color: rgba(7, 52, 59, 0.3); background: var(--spar-why-white); color: var(--spar-why-dark); } .spar-why__button--phone:hover { border-color: var(--spar-why-teal); background: var(--spar-why-light); } .spar-why__phone-text { display: grid; min-width: 0; gap: 1px; text-align: left; } .spar-why__phone-text small { font-size: 0.64rem; font-weight: 750; line-height: 1.1; letter-spacing: 0.055em; text-transform: uppercase; } .spar-why__phone-text strong { color: inherit; font-size: 1rem; font-weight: 900; line-height: 1.15; } /* ============================================================ NOTEBOOK ============================================================ */ @media (max-width: 1120px) { .spar-why__detail, .spar-why__conversion { grid-template-columns: minmax(0, 1fr); } .spar-why__detail-content, .spar-why__conversion-content { max-width: 860px; } .spar-why__specialization-panel, .spar-why__path-panel, .spar-why__process-panel { width: min(100%, 860px); } .spar-why__guarantee { grid-template-columns: minmax(300px, 0.86fr) minmax(0, 1.14fr); } .spar-why__guarantee-points { grid-template-columns: minmax(0, 1fr); } .spar-why__book-card { grid-template-columns: minmax(145px, 0.34fr) minmax(0, 0.66fr); } .spar-why__actions { grid-template-columns: repeat(3, minmax(0, 1fr)); } } /* ============================================================ TABLET ============================================================ */ @media (max-width: 880px) { .spar-why__container { width: min(calc(100% - 32px), 820px); } .spar-why__answer { grid-template-columns: 60px minmax(0, 1fr); gap: 17px; } .spar-why__answer-icon { width: 58px; height: 58px; } .spar-why__overview { grid-template-columns: minmax(0, 1fr); } .spar-why__guarantee { grid-template-columns: minmax(0, 1fr); } .spar-why__guarantee-figure { width: min(100%, 680px); max-width: 680px; margin-inline: auto; } .spar-why__guarantee-points { grid-template-columns: repeat(3, minmax(0, 1fr)); } .spar-why__books-grid { grid-template-columns: minmax(0, 1fr); } .spar-why__book-card { width: min(100%, 720px); margin-inline: auto; } .spar-why__criteria-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-why__actions { grid-template-columns: minmax(0, 1fr); } } /* ============================================================ MOBILE ============================================================ */ @media (max-width: 580px) { .spar-why { padding-block: 50px 62px; } .spar-why__container { width: calc(100% - 28px); } .spar-why__header, .spar-why__books-header, .spar-why__criteria-header { text-align: left; } .spar-why__eyebrow, .spar-why__answer-label, .spar-why__section-label, .spar-why__guarantee-label, .spar-why__books-label, .spar-why__criteria-label, .spar-why__trust-label, .spar-why__conversion-label { font-size: 0.67rem; letter-spacing: 0.06em; } .spar-why__title { font-size: clamp(1.84rem, 9.4vw, 2.62rem); line-height: 1.1; } .spar-why__direct-answer { font-size: 0.98rem; line-height: 1.63; } .spar-why__intro { font-size: 0.91rem; line-height: 1.66; } .spar-why__answer { grid-template-columns: minmax(0, 1fr); padding: 20px 17px; border-radius: 18px; } .spar-why__answer-icon { width: 52px; height: 52px; border-radius: 15px; } .spar-why__answer-icon svg { width: 32px; height: 32px; } .spar-why__overview-card { padding: 18px 16px; border-radius: 16px; } .spar-why__detail-content h3, .spar-why__books-header h4, .spar-why__criteria-header h4, .spar-why__conversion-content h4 { font-size: clamp(1.42rem, 7.4vw, 1.92rem); } .spar-why__specialization-panel, .spar-why__process-panel { padding: 17px 15px; border-radius: 18px; } .spar-why__panel-header, .spar-why__dark-panel-header { grid-template-columns: 50px minmax(0, 1fr); } .spar-why__panel-header > span, .spar-why__dark-panel-header > span { width: 50px; height: 50px; border-radius: 14px; } .spar-why__specialization-grid, .spar-why__process-list, .spar-why__criteria-grid { grid-template-columns: minmax(0, 1fr); } .spar-why__guarantee { gap: 25px; padding: 20px 16px; border-radius: 19px; } .spar-why__guarantee-image-frame { border-radius: 15px; } .spar-why__guarantee-image-overlay { right: 9px; bottom: 9px; left: 9px; min-height: 42px; padding: 9px 10px; font-size: 0.7rem; } .spar-why__guarantee-points { grid-template-columns: minmax(0, 1fr); } .spar-why__guarantee-link { width: 100%; } .spar-why__books { padding: 22px 15px; border-radius: 19px; } .spar-why__book-card { grid-template-columns: minmax(0, 1fr); } .spar-why__book-figure { padding: 22px; } .spar-why__book-cover-link { width: min(100%, 210px); } .spar-why__book-content { padding: 20px 17px; } .spar-why__book-link { margin-top: 19px; } .spar-why__all-books-link { width: 100%; } .spar-why__detail--dark { padding: 22px 17px; border-radius: 19px; } .spar-why__path-panel { padding: 17px 15px; border-radius: 18px; } .spar-why__path-room { min-height: 285px; } .spar-why__path-legend { grid-template-columns: minmax(0, 1fr); } .spar-why__trust { grid-template-columns: minmax(0, 1fr); align-items: start; padding: 20px 17px; border-radius: 18px; } .spar-why__trust-icon { width: 54px; height: 54px; border-radius: 15px; } .spar-why__trust-icon svg { width: 31px; height: 31px; } .spar-why__conversion { padding: 22px 17px; border-radius: 19px; } .spar-why__button { width: 100%; min-height: 57px; padding-inline: 13px; font-size: 0.86rem; } } /* ============================================================ SMARTPHONE MOLTO STRETTI ============================================================ */ @media (max-width: 380px) { .spar-why__container { width: calc(100% - 22px); } .spar-why__title { font-size: 1.7rem; } .spar-why__overview-card, .spar-why__specialization-panel, .spar-why__guarantee, .spar-why__books, .spar-why__book-content, .spar-why__detail--dark, .spar-why__path-panel, .spar-why__criteria-grid article, .spar-why__process-panel, .spar-why__trust, .spar-why__conversion { padding-inline: 14px; } .spar-why__book-cover-link { width: min(100%, 190px); } .spar-why__button { gap: 8px; padding-inline: 10px; font-size: 0.82rem; } .spar-why__button svg { flex-basis: 21px; width: 21px; height: 21px; } } /* ============================================================ ACCESSIBILITÀ ============================================================ */ @media (prefers-reduced-motion: reduce) { .spar-why__overview-card, .spar-why__guarantee-image, .spar-why__guarantee-link, .spar-why__book-cover-image, .spar-why__book-link, .spar-why__all-books-link, .spar-why__survey-link, .spar-why__button { transition: none; } .spar-why__overview-card:hover, .spar-why__guarantee-image-link:hover .spar-why__guarantee-image, .spar-why__guarantee-link:hover, .spar-why__book-cover-link:hover .spar-why__book-cover-image, .spar-why__book-link:hover, .spar-why__all-books-link:hover, .spar-why__survey-link:hover, .spar-why__button:hover { transform: none; } } /* ============================================================ STAMPA ============================================================ */ @media print { .spar-why { padding: 30px 0; background: #ffffff; } .spar-why__books, .spar-why__detail--dark { border: 1px solid var(--spar-why-border); background: #ffffff; box-shadow: none; } .spar-why__books-header h4, .spar-why__detail--dark .spar-why__detail-content h3, .spar-why__detail--dark .spar-why__detail-answer, .spar-why__dark-panel-header strong, .spar-why__path-legend strong { color: var(--spar-why-dark); } .spar-why__books-header > p:last-child, .spar-why__detail--dark .spar-why__detail-content > p:not( .spar-why__section-label, .spar-why__detail-answer, .spar-why__highlight ), .spar-why__path-legend p { color: var(--spar-why-muted); } .spar-why__guarantee-image-overlay, .spar-why__actions { display: none; } .spar-why__book-cover-image, .spar-why__guarantee-image { filter: none; } }#imCell_33 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHTMLObject_1726_33 { position: relative; align-self: start; justify-self: center; max-width: 100%; box-sizing: border-box; z-index: 3; } #imCellStyleGraphics_33 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imCellStyleBorders_33 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } /* ============================================================ H2 — DOVE REALIZZIAMO INTERVENTI SULLE PARETI A ROMA Pagina: /isolamento-acustico-pareti-roma.html ============================================================ */ .spar-zone, .spar-zone *, .spar-zone *::before, .spar-zone *::after { box-sizing: border-box; } .spar-zone { --spar-zone-dark: #07343b; --spar-zone-deep: #05282e; --spar-zone-medium: #0b5159; --spar-zone-teal: #24bfc1; --spar-zone-teal-light: #d9f4f2; --spar-zone-orange: #ff8a2a; --spar-zone-orange-dark: #c85c0a; --spar-zone-green: #27ad68; --spar-zone-green-dark: #19864f; --spar-zone-white: #ffffff; --spar-zone-cream: #fff8ed; --spar-zone-light: #edf8f7; --spar-zone-text: #173c41; --spar-zone-muted: #557277; --spar-zone-border: #d4e6e4; --spar-zone-shadow: 0 20px 52px rgba(6, 52, 59, 0.1); width: 100%; max-width: 100%; overflow: hidden; padding-block: clamp(64px, 8vw, 105px); background: radial-gradient( circle at 5% 6%, rgba(36, 191, 193, 0.11), transparent 27% ), radial-gradient( circle at 96% 94%, rgba(255, 138, 42, 0.08), transparent 25% ), #ffffff; color: var(--spar-zone-text); } .spar-zone h2, .spar-zone h3, .spar-zone h4, .spar-zone h5, .spar-zone p, .spar-zone li, .spar-zone span, .spar-zone strong, .spar-zone small, .spar-zone a, .spar-zone figcaption { max-width: 100%; white-space: normal; overflow-wrap: break-word; word-break: normal; } .spar-zone img, .spar-zone svg { max-width: 100%; } .spar-zone__container { width: min(calc(100% - 40px), 1220px); margin-inline: auto; } /* ============================================================ ETICHETTE ============================================================ */ .spar-zone__eyebrow, .spar-zone__answer-label, .spar-zone__section-label, .spar-zone__method-label, .spar-zone__not-listed-label, .spar-zone__milan-label, .spar-zone__conversion-label { margin: 0 0 12px; color: var(--spar-zone-orange-dark); font-size: 0.74rem; font-weight: 900; line-height: 1.4; letter-spacing: 0.075em; text-transform: uppercase; } /* ============================================================ INTESTAZIONE ============================================================ */ .spar-zone__header { width: min(100%, 980px); margin-inline: auto; text-align: center; } .spar-zone__title { margin: 0; color: var(--spar-zone-dark); font-size: clamp(2rem, 4.2vw, 3.55rem); font-weight: 900; line-height: 1.08; letter-spacing: -0.04em; text-wrap: balance; } .spar-zone__direct-answer { margin: 24px auto 0; color: var(--spar-zone-dark); font-size: clamp(1.04rem, 1.5vw, 1.2rem); font-weight: 650; line-height: 1.7; } .spar-zone__direct-answer strong { color: inherit; font-weight: 900; } .spar-zone__intro { margin: 14px auto 0; color: var(--spar-zone-muted); font-size: 1rem; line-height: 1.72; } /* ============================================================ RISPOSTA IMMEDIATA ============================================================ */ .spar-zone__answer { display: grid; grid-template-columns: 76px minmax(0, 1fr); align-items: center; gap: 22px; width: min(100%, 1000px); margin: clamp(35px, 5vw, 56px) auto 0; padding: clamp(22px, 3vw, 33px); border: 1px solid rgba(36, 191, 193, 0.28); border-radius: 22px; background: var(--spar-zone-cream); box-shadow: var(--spar-zone-shadow); } .spar-zone__answer-icon { display: grid; place-items: center; width: 70px; height: 70px; border-radius: 19px; background: var(--spar-zone-dark); color: var(--spar-zone-teal-light); } .spar-zone__answer-icon svg { display: block; width: 42px; height: 42px; } .spar-zone__answer-content { min-width: 0; } .spar-zone__answer-content h4 { margin: 0; color: var(--spar-zone-dark); font-size: clamp(1.2rem, 2vw, 1.6rem); font-weight: 900; line-height: 1.3; } .spar-zone__answer-content > p:last-child { margin: 9px 0 0; color: var(--spar-zone-muted); font-size: 0.95rem; line-height: 1.66; } /* ============================================================ FOTO FACOLTATIVA — MASSIMO 720 × 480 PX ============================================================ */ .spar-zone__media { width: min(720px, 100%); max-width: 100%; margin: clamp(34px, 4.5vw, 48px) auto 0; } .spar-zone__media-frame { position: relative; display: block; width: 100%; aspect-ratio: 3 / 2; overflow: hidden; border: 1px solid rgba(36, 191, 193, 0.26); border-radius: 20px; background: var(--spar-zone-light); box-shadow: 0 18px 44px rgba(6, 52, 59, 0.12); } .spar-zone__media-image { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; } .spar-zone__media figcaption { width: min(100%, 650px); margin: 12px auto 0; color: var(--spar-zone-muted); font-size: 0.78rem; line-height: 1.55; text-align: center; } /* ============================================================ PANORAMICA ============================================================ */ .spar-zone__overview { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: clamp(52px, 7vw, 82px); } .spar-zone__overview-card { display: grid; grid-template-columns: minmax(0, 1fr) 28px; align-content: start; gap: 15px 10px; min-width: 0; padding: 22px; border: 1px solid var(--spar-zone-border); border-top: 5px solid var(--spar-zone-dark); border-radius: 18px; background: var(--spar-zone-white); color: var(--spar-zone-dark); text-decoration: none; box-shadow: 0 12px 30px rgba(6, 52, 59, 0.07); transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease; } .spar-zone__overview-card--teal { border-top-color: var(--spar-zone-teal); } .spar-zone__overview-card--orange { border-top-color: var(--spar-zone-orange); } .spar-zone__overview-card:hover { transform: translateY(-3px); border-color: var(--spar-zone-teal); box-shadow: 0 17px 38px rgba(6, 52, 59, 0.11); } .spar-zone__overview-card:focus-visible { outline: 3px solid var(--spar-zone-orange); outline-offset: 4px; } .spar-zone__overview-number { grid-column: 1 / -1; color: rgba(7, 52, 59, 0.23); font-size: 1.5rem; font-weight: 950; line-height: 1; } .spar-zone__overview-content { display: grid; min-width: 0; gap: 7px; } .spar-zone__overview-content strong { color: var(--spar-zone-dark); font-size: 1rem; font-weight: 900; line-height: 1.4; } .spar-zone__overview-content small { color: var(--spar-zone-muted); font-size: 0.8rem; line-height: 1.52; } .spar-zone__overview-arrow { align-self: center; color: var(--spar-zone-orange-dark); font-size: 1.25rem; font-weight: 900; text-align: right; } /* ============================================================ APPROFONDIMENTI H3 ============================================================ */ .spar-zone__detail { display: grid; grid-template-columns: minmax(0, 0.92fr) minmax(460px, 1.08fr); align-items: center; gap: clamp(36px, 5vw, 68px); margin-top: clamp(66px, 9vw, 106px); scroll-margin-top: 110px; } .spar-zone__detail--dark { padding: clamp(29px, 4vw, 49px); border-radius: 25px; background: radial-gradient( circle at 96% 4%, rgba(36, 191, 193, 0.2), transparent 30% ), linear-gradient( 135deg, var(--spar-zone-deep), var(--spar-zone-dark) ); box-shadow: 0 24px 60px rgba(3, 35, 40, 0.2); } .spar-zone__detail-content { min-width: 0; } .spar-zone__detail-content h3, .spar-zone__subheader h4, .spar-zone__method-content h4, .spar-zone__not-listed-content h4, .spar-zone__milan-content h4, .spar-zone__conversion-content h4 { margin: 0; color: var(--spar-zone-dark); font-size: clamp(1.5rem, 2.9vw, 2.35rem); font-weight: 900; line-height: 1.18; letter-spacing: -0.03em; text-wrap: balance; } .spar-zone__detail-answer { margin: 19px 0 0; color: var(--spar-zone-dark); font-size: 1.02rem; font-weight: 750; line-height: 1.68; } .spar-zone__detail-content > p:not( .spar-zone__section-label, .spar-zone__detail-answer, .spar-zone__highlight ) { margin: 13px 0 0; color: var(--spar-zone-muted); font-size: 0.96rem; line-height: 1.7; } .spar-zone__detail--dark .spar-zone__section-label { color: var(--spar-zone-orange); } .spar-zone__detail--dark .spar-zone__detail-content h3, .spar-zone__detail--dark .spar-zone__detail-answer { color: var(--spar-zone-white); } .spar-zone__detail--dark .spar-zone__detail-content > p:not( .spar-zone__section-label, .spar-zone__detail-answer, .spar-zone__highlight ) { color: rgba(255, 255, 255, 0.73); } .spar-zone__highlight { margin: 18px 0 0; padding: 15px 17px; border-left: 4px solid var(--spar-zone-orange); border-radius: 0 12px 12px 0; background: #fff0e2; color: var(--spar-zone-dark); font-size: 0.94rem; font-weight: 750; line-height: 1.65; } .spar-zone__detail--dark .spar-zone__highlight { background: rgba(255, 255, 255, 0.08); color: var(--spar-zone-white); } /* ============================================================ PANNELLI CHIARI ============================================================ */ .spar-zone__city-panel, .spar-zone__metro-panel { min-width: 0; padding: 22px; border: 1px solid rgba(36, 191, 193, 0.28); border-radius: 21px; background: var(--spar-zone-white); box-shadow: var(--spar-zone-shadow); } .spar-zone__panel-header { display: grid; grid-template-columns: 58px minmax(0, 1fr); align-items: center; gap: 14px; } .spar-zone__panel-header > span { display: grid; place-items: center; width: 58px; height: 58px; border-radius: 16px; background: var(--spar-zone-dark); color: var(--spar-zone-teal-light); font-size: 0.76rem; font-weight: 950; } .spar-zone__panel-header small { display: block; color: var(--spar-zone-orange-dark); font-size: 0.65rem; font-weight: 850; line-height: 1.35; text-transform: uppercase; } .spar-zone__panel-header strong { display: block; margin-top: 4px; color: var(--spar-zone-dark); font-size: 1.04rem; font-weight: 900; line-height: 1.4; } .spar-zone__city-grid, .spar-zone__metro-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 20px; } .spar-zone__city-grid article, .spar-zone__metro-grid article { min-width: 0; padding: 16px; border: 1px solid var(--spar-zone-border); border-radius: 14px; background: var(--spar-zone-light); } .spar-zone__city-grid article > span, .spar-zone__metro-grid article > span { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 11px; background: var(--spar-zone-white); color: var(--spar-zone-medium); font-size: 0.78rem; font-weight: 950; } .spar-zone__city-grid h4, .spar-zone__metro-grid h4 { margin: 12px 0 0; color: var(--spar-zone-dark); font-size: 0.9rem; font-weight: 900; line-height: 1.4; } .spar-zone__city-grid p, .spar-zone__metro-grid p { margin: 6px 0 0; color: var(--spar-zone-muted); font-size: 0.78rem; line-height: 1.54; } .spar-zone__metro-card--contact { border-color: rgba(255, 138, 42, 0.38) !important; background: #fff2e6 !important; } /* ============================================================ METODO LOCALE ============================================================ */ .spar-zone__method, .spar-zone__not-listed { display: grid; grid-template-columns: 68px minmax(0, 1fr); align-items: center; gap: 20px; margin-top: clamp(44px, 6vw, 68px); padding: clamp(23px, 3vw, 34px); border: 1px solid rgba(255, 138, 42, 0.3); border-radius: 21px; background: #fff3e7; } .spar-zone__method-icon, .spar-zone__not-listed-icon { display: grid; place-items: center; width: 64px; height: 64px; border-radius: 18px; background: var(--spar-zone-orange); color: #321705; } .spar-zone__method-icon svg, .spar-zone__not-listed-icon svg { width: 38px; height: 38px; } .spar-zone__method-content, .spar-zone__not-listed-content { min-width: 0; } .spar-zone__method-content h4, .spar-zone__not-listed-content h4 { font-size: clamp(1.2rem, 2vw, 1.65rem); letter-spacing: -0.02em; } .spar-zone__method-content > p:last-child, .spar-zone__not-listed-content > p:last-child { margin: 9px 0 0; color: var(--spar-zone-muted); font-size: 0.91rem; line-height: 1.66; } /* ============================================================ MAPPA CONCETTUALE DEI QUARTIERI ============================================================ */ .spar-zone__district-map { position: relative; min-width: 0; min-height: 470px; overflow: hidden; border: 1px solid rgba(255, 255, 255, 0.14); border-radius: 21px; background: radial-gradient( circle at center, rgba(36, 191, 193, 0.23), transparent 25% ), rgba(255, 255, 255, 0.07); } .spar-zone__district-center, .spar-zone__district-area { position: absolute; display: grid; place-items: center; padding: 15px; border-radius: 16px; text-align: center; } .spar-zone__district-center { top: 50%; left: 50%; z-index: 2; width: 156px; height: 156px; transform: translate(-50%, -50%); border: 5px solid rgba(255, 255, 255, 0.2); border-radius: 50%; background: var(--spar-zone-teal); color: var(--spar-zone-dark); box-shadow: 0 16px 38px rgba(0, 0, 0, 0.17); } .spar-zone__district-center span { font-size: 1.5rem; font-weight: 950; line-height: 1; } .spar-zone__district-center strong { margin-top: 7px; color: inherit; font-size: 0.73rem; font-weight: 900; line-height: 1.35; text-transform: uppercase; } .spar-zone__district-area { width: 38%; min-height: 120px; border: 1px solid rgba(255, 255, 255, 0.15); background: rgba(255, 255, 255, 0.09); color: var(--spar-zone-white); } .spar-zone__district-area span { color: var(--spar-zone-orange); font-size: 0.78rem; font-weight: 950; line-height: 1.3; text-transform: uppercase; } .spar-zone__district-area small { margin-top: 8px; color: rgba(255, 255, 255, 0.72); font-size: 0.7rem; font-weight: 700; line-height: 1.5; } .spar-zone__district-area--north { top: 7%; left: 50%; transform: translateX(-50%); } .spar-zone__district-area--east { top: 50%; right: 4%; transform: translateY(-50%); } .spar-zone__district-area--south { bottom: 7%; left: 50%; transform: translateX(-50%); } .spar-zone__district-area--west { top: 50%; left: 4%; transform: translateY(-50%); } /* ============================================================ ELENCO QUARTIERI ============================================================ */ .spar-zone__districts, .spar-zone__process { margin-top: clamp(60px, 8vw, 94px); } .spar-zone__subheader { width: min(100%, 900px); margin-inline: auto; text-align: center; } .spar-zone__subheader > p:last-child { margin: 15px auto 0; color: var(--spar-zone-muted); font-size: 0.95rem; line-height: 1.68; } .spar-zone__district-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; margin-top: 31px; } .spar-zone__district-grid article { min-width: 0; padding: 21px; border: 1px solid var(--spar-zone-border); border-top: 5px solid var(--spar-zone-dark); border-radius: 17px; background: var(--spar-zone-white); box-shadow: 0 11px 29px rgba(6, 52, 59, 0.07); } .spar-zone__district-grid article:nth-child(2), .spar-zone__district-grid article:nth-child(5) { border-top-color: var(--spar-zone-teal); } .spar-zone__district-grid article:nth-child(3) { border-top-color: var(--spar-zone-orange); } .spar-zone__district-card--question { border-top-color: var(--spar-zone-green) !important; background: #effaf4 !important; } .spar-zone__district-number { color: rgba(7, 52, 59, 0.23); font-size: 1.4rem; font-weight: 950; line-height: 1; } .spar-zone__district-grid h5 { margin: 14px 0 0; color: var(--spar-zone-dark); font-size: 0.96rem; font-weight: 900; line-height: 1.4; } .spar-zone__district-grid p { margin: 7px 0 0; color: var(--spar-zone-muted); font-size: 0.81rem; line-height: 1.56; } /* ============================================================ COLLEGAMENTO A MILANO ============================================================ */ .spar-zone__milan { display: grid; grid-template-columns: 72px minmax(0, 1fr) minmax(255px, auto); align-items: center; gap: 22px; margin-top: clamp(44px, 6vw, 70px); padding: clamp(23px, 3vw, 34px); border: 1px solid rgba(36, 191, 193, 0.3); border-radius: 22px; background: radial-gradient( circle at 96% 6%, rgba(36, 191, 193, 0.14), transparent 34% ), var(--spar-zone-white); box-shadow: var(--spar-zone-shadow); } .spar-zone__milan-icon { display: grid; place-items: center; width: 68px; height: 68px; border-radius: 19px; background: var(--spar-zone-light); color: var(--spar-zone-dark); } .spar-zone__milan-icon svg { width: 39px; height: 39px; } .spar-zone__milan-content { min-width: 0; } .spar-zone__milan-content h4 { font-size: clamp(1.2rem, 2vw, 1.62rem); line-height: 1.3; letter-spacing: -0.02em; } .spar-zone__milan-content > p:last-child { margin: 9px 0 0; color: var(--spar-zone-muted); font-size: 0.89rem; line-height: 1.63; } .spar-zone__milan-link { display: flex; min-width: 0; min-height: 56px; align-items: center; justify-content: center; gap: 10px; padding: 13px 17px; border: 2px solid var(--spar-zone-dark); border-radius: 12px; background: var(--spar-zone-dark); color: var(--spar-zone-white); font-size: 0.83rem; font-weight: 850; line-height: 1.35; text-align: center; text-decoration: none; transition: transform 180ms ease, background-color 180ms ease, border-color 180ms ease; } .spar-zone__milan-link:hover { transform: translateY(-2px); border-color: var(--spar-zone-medium); background: var(--spar-zone-medium); } .spar-zone__milan-link:focus-visible { outline: 3px solid var(--spar-zone-orange); outline-offset: 4px; } .spar-zone__milan-link svg { flex: 0 0 22px; width: 22px; height: 22px; } /* ============================================================ PROCESSO ============================================================ */ .spar-zone__process-list { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; margin: 31px 0 0; padding: 0; list-style: none; } .spar-zone__process-list li { min-width: 0; padding: 19px; border: 1px solid var(--spar-zone-border); border-radius: 17px; background: var(--spar-zone-white); box-shadow: 0 11px 29px rgba(6, 52, 59, 0.07); } .spar-zone__process-list li > span { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; background: var(--spar-zone-dark); color: var(--spar-zone-teal-light); font-size: 0.78rem; font-weight: 900; } .spar-zone__process-list strong { display: block; margin-top: 16px; color: var(--spar-zone-dark); font-size: 0.88rem; font-weight: 900; line-height: 1.4; } .spar-zone__process-list p { margin: 7px 0 0; color: var(--spar-zone-muted); font-size: 0.79rem; line-height: 1.56; } /* ============================================================ CTA ============================================================ */ .spar-zone__conversion { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(330px, 0.92fr); align-items: center; gap: clamp(30px, 5vw, 64px); margin-top: clamp(52px, 7vw, 82px); padding: clamp(26px, 4vw, 45px); border: 1px solid rgba(36, 191, 193, 0.25); border-radius: 23px; background: var(--spar-zone-cream); box-shadow: var(--spar-zone-shadow); } .spar-zone__conversion-content { min-width: 0; } .spar-zone__conversion-content > p:not(.spar-zone__conversion-label) { margin: 15px 0 0; color: var(--spar-zone-muted); font-size: 0.95rem; line-height: 1.69; } .spar-zone__conversion-content > p + p { margin-top: 10px; } .spar-zone__actions { display: grid; gap: 11px; min-width: 0; } .spar-zone__button { display: flex; min-width: 0; min-height: 57px; align-items: center; justify-content: center; gap: 10px; padding: 13px 17px; border: 2px solid transparent; border-radius: 12px; font-family: inherit; font-size: 0.9rem; font-weight: 850; line-height: 1.3; text-align: center; text-decoration: none; transition: transform 180ms ease, background-color 180ms ease, border-color 180ms ease; } .spar-zone__button:hover { transform: translateY(-2px); } .spar-zone__button:focus-visible { outline: 3px solid var(--spar-zone-dark); outline-offset: 4px; } .spar-zone__button svg { flex: 0 0 23px; width: 23px; height: 23px; } .spar-zone__button--primary { background: var(--spar-zone-orange); color: #2c1504; } .spar-zone__button--primary:hover { background: #ff9b43; } .spar-zone__button--whatsapp { background: var(--spar-zone-green); color: var(--spar-zone-white); } .spar-zone__button--whatsapp:hover { background: var(--spar-zone-green-dark); } .spar-zone__button--phone { border-color: rgba(7, 52, 59, 0.3); background: var(--spar-zone-white); color: var(--spar-zone-dark); } .spar-zone__button--phone:hover { border-color: var(--spar-zone-teal); background: var(--spar-zone-light); } .spar-zone__phone-text { display: grid; min-width: 0; gap: 1px; text-align: left; } .spar-zone__phone-text small { font-size: 0.64rem; font-weight: 750; line-height: 1.1; letter-spacing: 0.055em; text-transform: uppercase; } .spar-zone__phone-text strong { color: inherit; font-size: 1rem; font-weight: 900; line-height: 1.15; } /* ============================================================ NOTEBOOK ============================================================ */ @media (max-width: 1120px) { .spar-zone__detail, .spar-zone__conversion { grid-template-columns: minmax(0, 1fr); } .spar-zone__detail-content, .spar-zone__conversion-content { max-width: 860px; } .spar-zone__city-panel, .spar-zone__metro-panel, .spar-zone__district-map { width: min(100%, 860px); } .spar-zone__milan { grid-template-columns: 68px minmax(0, 1fr); } .spar-zone__milan-link { grid-column: 1 / -1; justify-self: start; } .spar-zone__process-list { grid-template-columns: repeat(3, minmax(0, 1fr)); } .spar-zone__actions { grid-template-columns: repeat(3, minmax(0, 1fr)); } } /* ============================================================ TABLET ============================================================ */ @media (max-width: 860px) { .spar-zone__container { width: min(calc(100% - 32px), 800px); } .spar-zone__answer { grid-template-columns: 60px minmax(0, 1fr); gap: 17px; } .spar-zone__answer-icon { width: 58px; height: 58px; } .spar-zone__overview { grid-template-columns: minmax(0, 1fr); } .spar-zone__district-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-zone__process-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-zone__actions { grid-template-columns: minmax(0, 1fr); } } /* ============================================================ MOBILE ============================================================ */ @media (max-width: 580px) { .spar-zone { padding-block: 50px 62px; } .spar-zone__container { width: calc(100% - 28px); } .spar-zone__header, .spar-zone__subheader { text-align: left; } .spar-zone__eyebrow, .spar-zone__answer-label, .spar-zone__section-label, .spar-zone__method-label, .spar-zone__not-listed-label, .spar-zone__milan-label, .spar-zone__conversion-label { font-size: 0.67rem; letter-spacing: 0.06em; } .spar-zone__title { font-size: clamp(1.84rem, 9.4vw, 2.62rem); line-height: 1.1; } .spar-zone__direct-answer { font-size: 0.98rem; line-height: 1.63; } .spar-zone__intro { font-size: 0.91rem; line-height: 1.66; } .spar-zone__answer { grid-template-columns: minmax(0, 1fr); padding: 20px 17px; border-radius: 18px; } .spar-zone__answer-icon { width: 52px; height: 52px; border-radius: 15px; } .spar-zone__answer-icon svg { width: 32px; height: 32px; } .spar-zone__media { width: 100%; margin-top: 30px; } .spar-zone__media-frame { border-radius: 16px; } .spar-zone__overview-card { padding: 18px 16px; border-radius: 16px; } .spar-zone__detail-content h3, .spar-zone__subheader h4, .spar-zone__conversion-content h4 { font-size: clamp(1.42rem, 7.4vw, 1.92rem); } .spar-zone__city-panel, .spar-zone__metro-panel { padding: 17px 15px; border-radius: 18px; } .spar-zone__panel-header { grid-template-columns: 50px minmax(0, 1fr); } .spar-zone__panel-header > span { width: 50px; height: 50px; border-radius: 14px; } .spar-zone__city-grid, .spar-zone__metro-grid, .spar-zone__district-grid, .spar-zone__process-list { grid-template-columns: minmax(0, 1fr); } .spar-zone__method, .spar-zone__not-listed { grid-template-columns: minmax(0, 1fr); align-items: start; padding: 20px 17px; border-radius: 18px; } .spar-zone__method-icon, .spar-zone__not-listed-icon { width: 53px; height: 53px; border-radius: 15px; } .spar-zone__method-icon svg, .spar-zone__not-listed-icon svg { width: 31px; height: 31px; } .spar-zone__detail--dark { padding: 22px 17px; border-radius: 19px; } .spar-zone__district-map { min-height: auto; padding: 15px; } .spar-zone__district-center, .spar-zone__district-area { position: static; width: 100%; min-height: auto; transform: none; } .spar-zone__district-center { height: auto; margin-bottom: 12px; border-radius: 16px; } .spar-zone__district-area { margin-top: 10px; } .spar-zone__milan { grid-template-columns: minmax(0, 1fr); padding: 20px 17px; border-radius: 18px; } .spar-zone__milan-icon { width: 54px; height: 54px; border-radius: 15px; } .spar-zone__milan-icon svg { width: 31px; height: 31px; } .spar-zone__milan-link { width: 100%; justify-self: stretch; } .spar-zone__conversion { padding: 22px 17px; border-radius: 19px; } .spar-zone__button { width: 100%; min-height: 57px; padding-inline: 13px; font-size: 0.86rem; } } /* ============================================================ SMARTPHONE MOLTO STRETTI ============================================================ */ @media (max-width: 380px) { .spar-zone__container { width: calc(100% - 22px); } .spar-zone__title { font-size: 1.7rem; } .spar-zone__overview-card, .spar-zone__city-panel, .spar-zone__method, .spar-zone__detail--dark, .spar-zone__district-map, .spar-zone__district-grid article, .spar-zone__metro-panel, .spar-zone__not-listed, .spar-zone__milan, .spar-zone__process-list li, .spar-zone__conversion { padding-inline: 14px; } .spar-zone__button { gap: 8px; padding-inline: 10px; font-size: 0.82rem; } .spar-zone__button svg { flex-basis: 21px; width: 21px; height: 21px; } } /* ============================================================ ACCESSIBILITÀ ============================================================ */ @media (prefers-reduced-motion: reduce) { .spar-zone__overview-card, .spar-zone__milan-link, .spar-zone__button { transition: none; } .spar-zone__overview-card:hover, .spar-zone__milan-link:hover, .spar-zone__button:hover { transform: none; } } /* ============================================================ STAMPA ============================================================ */ @media print { .spar-zone { padding: 30px 0; background: #ffffff; } .spar-zone__detail--dark { border: 1px solid var(--spar-zone-border); background: #ffffff; box-shadow: none; } .spar-zone__detail--dark .spar-zone__detail-content h3, .spar-zone__detail--dark .spar-zone__detail-answer { color: var(--spar-zone-dark); } .spar-zone__detail--dark .spar-zone__detail-content > p:not( .spar-zone__section-label, .spar-zone__detail-answer, .spar-zone__highlight ) { color: var(--spar-zone-muted); } .spar-zone__actions { display: none; } }#imCell_34 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHTMLObject_1726_34 { position: relative; align-self: start; justify-self: center; max-width: 100%; box-sizing: border-box; z-index: 3; } #imCellStyleGraphics_34 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imCellStyleBorders_34 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } /* ============================================================ H2 — DOMANDE FREQUENTI SULL’ISOLAMENTO ACUSTICO DELLE PARETI Pagina: /isolamento-acustico-pareti-roma.html ============================================================ */ .spar-faq, .spar-faq *, .spar-faq *::before, .spar-faq *::after { box-sizing: border-box; } .spar-faq { --spar-faq-dark: #07343b; --spar-faq-deep: #05282e; --spar-faq-medium: #0b5159; --spar-faq-teal: #24bfc1; --spar-faq-teal-light: #d9f4f2; --spar-faq-orange: #ff8a2a; --spar-faq-orange-dark: #c85c0a; --spar-faq-green: #27ad68; --spar-faq-green-dark: #19864f; --spar-faq-white: #ffffff; --spar-faq-cream: #fff8ed; --spar-faq-light: #edf8f7; --spar-faq-text: #173c41; --spar-faq-muted: #557277; --spar-faq-border: #d4e6e4; --spar-faq-shadow: 0 20px 52px rgba(6, 52, 59, 0.1); width: 100%; max-width: 100%; overflow: hidden; padding-block: clamp(64px, 8vw, 105px); background: radial-gradient( circle at 5% 5%, rgba(36, 191, 193, 0.11), transparent 28% ), radial-gradient( circle at 96% 96%, rgba(255, 138, 42, 0.08), transparent 26% ), var(--spar-faq-cream); color: var(--spar-faq-text); } .spar-faq h2, .spar-faq h3, .spar-faq p, .spar-faq span, .spar-faq strong, .spar-faq small, .spar-faq a, .spar-faq summary { max-width: 100%; white-space: normal; overflow-wrap: break-word; word-break: normal; } .spar-faq svg { display: block; max-width: 100%; } .spar-faq__container { width: min(calc(100% - 40px), 1120px); margin-inline: auto; } /* ============================================================ INTESTAZIONE ============================================================ */ .spar-faq__header { width: min(100%, 930px); margin-inline: auto; text-align: center; } .spar-faq__eyebrow, .spar-faq__voice-label, .spar-faq__clarity-label, .spar-faq__conversion-label { margin: 0 0 12px; color: var(--spar-faq-orange-dark); font-size: 0.74rem; font-weight: 900; line-height: 1.4; letter-spacing: 0.075em; text-transform: uppercase; } .spar-faq__title { margin: 0; color: var(--spar-faq-dark); font-size: clamp(2rem, 4.2vw, 3.55rem); font-weight: 900; line-height: 1.08; letter-spacing: -0.04em; text-wrap: balance; } .spar-faq__direct-answer { margin: 24px auto 0; color: var(--spar-faq-dark); font-size: clamp(1.04rem, 1.5vw, 1.2rem); font-weight: 650; line-height: 1.7; } .spar-faq__direct-answer strong { color: inherit; font-weight: 900; } .spar-faq__intro { margin: 14px auto 0; color: var(--spar-faq-muted); font-size: 1rem; line-height: 1.72; } /* ============================================================ RISPOSTA VOCALE ============================================================ */ .spar-faq__voice-answer { display: grid; grid-template-columns: 78px minmax(0, 1fr); align-items: center; gap: 23px; width: min(100%, 990px); margin: clamp(36px, 5vw, 57px) auto 0; padding: clamp(23px, 3vw, 34px); border: 1px solid rgba(36, 191, 193, 0.3); border-radius: 22px; background: var(--spar-faq-white); box-shadow: var(--spar-faq-shadow); } .spar-faq__voice-icon { display: grid; place-items: center; width: 72px; height: 72px; border-radius: 20px; background: var(--spar-faq-dark); color: var(--spar-faq-teal-light); } .spar-faq__voice-icon svg { width: 42px; height: 42px; } .spar-faq__voice-content { min-width: 0; } .spar-faq__voice-content h3 { margin: 0; color: var(--spar-faq-dark); font-size: clamp(1.25rem, 2.2vw, 1.72rem); font-weight: 900; line-height: 1.28; } .spar-faq__voice-content > p:last-child { margin: 10px 0 0; color: var(--spar-faq-muted); font-size: 0.95rem; line-height: 1.67; } /* ============================================================ NAVIGAZIONE ARGOMENTI ============================================================ */ .spar-faq__topics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 13px; margin-top: clamp(48px, 7vw, 76px); } .spar-faq__topics a { display: grid; grid-template-columns: 42px minmax(0, 1fr); align-items: center; gap: 11px; min-width: 0; min-height: 72px; padding: 14px; border: 1px solid var(--spar-faq-border); border-top: 4px solid var(--spar-faq-dark); border-radius: 15px; background: var(--spar-faq-white); color: var(--spar-faq-dark); text-decoration: none; box-shadow: 0 10px 27px rgba(6, 52, 59, 0.07); transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease; } .spar-faq__topics a:nth-child(2) { border-top-color: var(--spar-faq-teal); } .spar-faq__topics a:nth-child(3) { border-top-color: var(--spar-faq-orange); } .spar-faq__topics a:nth-child(4) { border-top-color: var(--spar-faq-green); } .spar-faq__topics a:hover { transform: translateY(-3px); border-color: var(--spar-faq-teal); box-shadow: 0 15px 35px rgba(6, 52, 59, 0.11); } .spar-faq__topics a:focus-visible { outline: 3px solid var(--spar-faq-orange); outline-offset: 4px; } .spar-faq__topics span { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: var(--spar-faq-light); color: var(--spar-faq-medium); font-size: 0.7rem; font-weight: 950; } .spar-faq__topics strong { color: inherit; font-size: 0.82rem; font-weight: 900; line-height: 1.4; } /* ============================================================ GRUPPI DI FAQ ============================================================ */ .spar-faq__group { margin-top: clamp(62px, 8vw, 96px); scroll-margin-top: 110px; } .spar-faq__group--dark { padding: clamp(27px, 4vw, 46px); border-radius: 25px; background: radial-gradient( circle at 96% 4%, rgba(36, 191, 193, 0.19), transparent 31% ), linear-gradient( 135deg, var(--spar-faq-deep), var(--spar-faq-dark) ); box-shadow: 0 24px 60px rgba(3, 35, 40, 0.2); } .spar-faq__group-header { display: grid; grid-template-columns: 66px minmax(0, 1fr); align-items: center; gap: 18px; width: min(100%, 900px); } .spar-faq__group-number { display: grid; place-items: center; width: 64px; height: 64px; border-radius: 18px; background: var(--spar-faq-dark); color: var(--spar-faq-teal-light); font-size: 0.8rem; font-weight: 950; } .spar-faq__group-header > div { min-width: 0; } .spar-faq__group-header p { margin: 0 0 7px; color: var(--spar-faq-orange-dark); font-size: 0.68rem; font-weight: 900; line-height: 1.4; letter-spacing: 0.06em; text-transform: uppercase; } .spar-faq__group-header h3 { margin: 0; color: var(--spar-faq-dark); font-size: clamp(1.45rem, 2.8vw, 2.2rem); font-weight: 900; line-height: 1.2; letter-spacing: -0.03em; text-wrap: balance; } .spar-faq__group--dark .spar-faq__group-number { background: var(--spar-faq-teal); color: var(--spar-faq-dark); } .spar-faq__group--dark .spar-faq__group-header p { color: var(--spar-faq-orange); } .spar-faq__group--dark .spar-faq__group-header h3 { color: var(--spar-faq-white); } /* ============================================================ ELENCO E SINGOLA FAQ ============================================================ */ .spar-faq__list { display: grid; gap: 13px; margin-top: 28px; } .spar-faq__item { min-width: 0; overflow: hidden; border: 1px solid var(--spar-faq-border); border-radius: 16px; background: var(--spar-faq-white); box-shadow: 0 10px 27px rgba(6, 52, 59, 0.07); } .spar-faq__item[open] { border-color: rgba(36, 191, 193, 0.48); box-shadow: 0 15px 36px rgba(6, 52, 59, 0.11); } .spar-faq__item summary { display: grid; grid-template-columns: 44px minmax(0, 1fr) 38px; align-items: center; gap: 14px; min-width: 0; min-height: 78px; padding: 16px 18px; color: var(--spar-faq-dark); cursor: pointer; list-style: none; transition: background-color 180ms ease; } .spar-faq__item summary::-webkit-details-marker { display: none; } .spar-faq__item summary::marker { display: none; content: ""; } .spar-faq__item summary:hover { background: var(--spar-faq-light); } .spar-faq__item summary:focus-visible { outline: 3px solid var(--spar-faq-orange); outline-offset: -4px; } .spar-faq__item[open] summary { border-bottom: 1px solid var(--spar-faq-border); background: var(--spar-faq-light); } .spar-faq__question-number { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: var(--spar-faq-dark); color: var(--spar-faq-teal-light); font-size: 0.69rem; font-weight: 950; } .spar-faq__item summary strong { min-width: 0; color: inherit; font-size: clamp(0.94rem, 1.5vw, 1.06rem); font-weight: 900; line-height: 1.45; } .spar-faq__toggle { position: relative; display: grid; place-items: center; width: 36px; height: 36px; border-radius: 11px; background: var(--spar-faq-white); color: var(--spar-faq-medium); } .spar-faq__toggle::before, .spar-faq__toggle::after { content: ""; position: absolute; width: 14px; height: 2px; border-radius: 999px; background: currentColor; transition: transform 180ms ease; } .spar-faq__toggle::after { transform: rotate(90deg); } .spar-faq__item[open] .spar-faq__toggle::after { transform: rotate(0deg); } .spar-faq__answer { padding: 20px 24px 24px 76px; } .spar-faq__answer p { margin: 12px 0 0; color: var(--spar-faq-muted); font-size: 0.92rem; line-height: 1.7; } .spar-faq__answer p:first-child { margin-top: 0; } .spar-faq__answer-first { color: var(--spar-faq-dark) !important; font-size: 0.97rem !important; font-weight: 750; } .spar-faq__inline-link { display: inline-flex; align-items: center; margin-top: 17px; color: var(--spar-faq-medium); font-size: 0.82rem; font-weight: 900; line-height: 1.45; text-decoration: underline; text-decoration-color: rgba(36, 191, 193, 0.55); text-decoration-thickness: 2px; text-underline-offset: 4px; } .spar-faq__inline-link::after { content: "→"; margin-left: 7px; color: var(--spar-faq-orange-dark); font-size: 1rem; } .spar-faq__inline-link:hover { color: var(--spar-faq-dark); } .spar-faq__inline-link:focus-visible { outline: 3px solid var(--spar-faq-orange); outline-offset: 4px; border-radius: 3px; } /* ============================================================ CHIAREZZA ============================================================ */ .spar-faq__clarity { display: grid; grid-template-columns: 70px minmax(0, 1fr); align-items: center; gap: 21px; margin-top: clamp(48px, 7vw, 76px); padding: clamp(23px, 3vw, 34px); border: 1px solid rgba(255, 138, 42, 0.32); border-radius: 21px; background: #fff2e6; } .spar-faq__clarity-icon { display: grid; place-items: center; width: 66px; height: 66px; border-radius: 18px; background: var(--spar-faq-orange); color: #321705; } .spar-faq__clarity-icon svg { width: 38px; height: 38px; } .spar-faq__clarity-content { min-width: 0; } .spar-faq__clarity-content h3 { margin: 0; color: var(--spar-faq-dark); font-size: clamp(1.25rem, 2.2vw, 1.78rem); font-weight: 900; line-height: 1.28; letter-spacing: -0.025em; } .spar-faq__clarity-content > p:last-child { margin: 10px 0 0; color: var(--spar-faq-muted); font-size: 0.92rem; line-height: 1.67; } /* ============================================================ CTA FINALE ============================================================ */ .spar-faq__conversion { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(330px, 0.92fr); align-items: center; gap: clamp(30px, 5vw, 64px); margin-top: clamp(50px, 7vw, 80px); padding: clamp(27px, 4vw, 45px); border: 1px solid rgba(36, 191, 193, 0.27); border-radius: 23px; background: var(--spar-faq-white); box-shadow: var(--spar-faq-shadow); } .spar-faq__conversion-content { min-width: 0; } .spar-faq__conversion-content h3 { margin: 0; color: var(--spar-faq-dark); font-size: clamp(1.5rem, 2.9vw, 2.35rem); font-weight: 900; line-height: 1.18; letter-spacing: -0.03em; text-wrap: balance; } .spar-faq__conversion-content > p:not(.spar-faq__conversion-label) { margin: 15px 0 0; color: var(--spar-faq-muted); font-size: 0.95rem; line-height: 1.69; } .spar-faq__conversion-content > p + p { margin-top: 10px; } .spar-faq__actions { display: grid; gap: 11px; min-width: 0; } .spar-faq__button { display: flex; min-width: 0; min-height: 57px; align-items: center; justify-content: center; gap: 10px; padding: 13px 17px; border: 2px solid transparent; border-radius: 12px; font-family: inherit; font-size: 0.9rem; font-weight: 850; line-height: 1.3; text-align: center; text-decoration: none; transition: transform 180ms ease, background-color 180ms ease, border-color 180ms ease; } .spar-faq__button:hover { transform: translateY(-2px); } .spar-faq__button:focus-visible { outline: 3px solid var(--spar-faq-dark); outline-offset: 4px; } .spar-faq__button svg { flex: 0 0 23px; width: 23px; height: 23px; } .spar-faq__button--primary { background: var(--spar-faq-orange); color: #2c1504; } .spar-faq__button--primary:hover { background: #ff9b43; } .spar-faq__button--whatsapp { background: var(--spar-faq-green); color: var(--spar-faq-white); } .spar-faq__button--whatsapp:hover { background: var(--spar-faq-green-dark); } .spar-faq__button--phone { border-color: rgba(7, 52, 59, 0.3); background: var(--spar-faq-white); color: var(--spar-faq-dark); } .spar-faq__button--phone:hover { border-color: var(--spar-faq-teal); background: var(--spar-faq-light); } .spar-faq__phone-text { display: grid; min-width: 0; gap: 1px; text-align: left; } .spar-faq__phone-text small { font-size: 0.64rem; font-weight: 750; line-height: 1.1; letter-spacing: 0.055em; text-transform: uppercase; } .spar-faq__phone-text strong { color: inherit; font-size: 1rem; font-weight: 900; line-height: 1.15; } /* ============================================================ NOTEBOOK ============================================================ */ @media (max-width: 1050px) { .spar-faq__topics { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-faq__conversion { grid-template-columns: minmax(0, 1fr); } .spar-faq__conversion-content { max-width: 850px; } .spar-faq__actions { grid-template-columns: repeat(3, minmax(0, 1fr)); } } /* ============================================================ TABLET ============================================================ */ @media (max-width: 820px) { .spar-faq__container { width: min(calc(100% - 32px), 780px); } .spar-faq__voice-answer { grid-template-columns: 62px minmax(0, 1fr); gap: 18px; } .spar-faq__voice-icon { width: 60px; height: 60px; } .spar-faq__voice-icon svg { width: 35px; height: 35px; } .spar-faq__actions { grid-template-columns: minmax(0, 1fr); } } /* ============================================================ MOBILE ============================================================ */ @media (max-width: 580px) { .spar-faq { padding-block: 50px 62px; } .spar-faq__container { width: calc(100% - 28px); } .spar-faq__header { text-align: left; } .spar-faq__eyebrow, .spar-faq__voice-label, .spar-faq__clarity-label, .spar-faq__conversion-label { font-size: 0.67rem; letter-spacing: 0.06em; } .spar-faq__title { font-size: clamp(1.84rem, 9.4vw, 2.62rem); line-height: 1.1; } .spar-faq__direct-answer { font-size: 0.98rem; line-height: 1.63; } .spar-faq__intro { font-size: 0.91rem; line-height: 1.66; } .spar-faq__voice-answer { grid-template-columns: minmax(0, 1fr); padding: 20px 17px; border-radius: 18px; } .spar-faq__voice-icon { width: 52px; height: 52px; border-radius: 15px; } .spar-faq__voice-icon svg { width: 31px; height: 31px; } .spar-faq__topics { grid-template-columns: minmax(0, 1fr); } .spar-faq__group--dark { padding: 22px 14px; border-radius: 19px; } .spar-faq__group-header { grid-template-columns: 54px minmax(0, 1fr); gap: 14px; } .spar-faq__group-number { width: 52px; height: 52px; border-radius: 15px; } .spar-faq__group-header h3 { font-size: clamp(1.32rem, 7vw, 1.82rem); } .spar-faq__item { border-radius: 14px; } .spar-faq__item summary { grid-template-columns: 40px minmax(0, 1fr) 32px; gap: 10px; min-height: 72px; padding: 14px 12px; } .spar-faq__question-number { width: 38px; height: 38px; border-radius: 11px; font-size: 0.63rem; } .spar-faq__item summary strong { font-size: 0.9rem; line-height: 1.42; } .spar-faq__toggle { width: 31px; height: 31px; border-radius: 9px; } .spar-faq__answer { padding: 18px 15px 21px; } .spar-faq__answer p { font-size: 0.87rem; line-height: 1.66; } .spar-faq__answer-first { font-size: 0.91rem !important; } .spar-faq__clarity { grid-template-columns: minmax(0, 1fr); align-items: start; padding: 20px 17px; border-radius: 18px; } .spar-faq__clarity-icon { width: 53px; height: 53px; border-radius: 15px; } .spar-faq__clarity-icon svg { width: 31px; height: 31px; } .spar-faq__conversion { padding: 22px 17px; border-radius: 19px; } .spar-faq__conversion-content h3 { font-size: clamp(1.42rem, 7.4vw, 1.92rem); } .spar-faq__button { width: 100%; min-height: 57px; padding-inline: 13px; font-size: 0.86rem; } } /* ============================================================ SMARTPHONE MOLTO STRETTI ============================================================ */ @media (max-width: 380px) { .spar-faq__container { width: calc(100% - 22px); } .spar-faq__title { font-size: 1.7rem; } .spar-faq__voice-answer, .spar-faq__topics a, .spar-faq__group--dark, .spar-faq__clarity, .spar-faq__conversion { padding-inline: 13px; } .spar-faq__item summary { grid-template-columns: 36px minmax(0, 1fr) 29px; gap: 8px; padding-inline: 9px; } .spar-faq__question-number { width: 35px; height: 35px; } .spar-faq__toggle { width: 28px; height: 28px; } .spar-faq__toggle::before, .spar-faq__toggle::after { width: 12px; } .spar-faq__button { gap: 8px; padding-inline: 10px; font-size: 0.82rem; } .spar-faq__button svg { flex-basis: 21px; width: 21px; height: 21px; } } /* ============================================================ ACCESSIBILITÀ ============================================================ */ @media (prefers-reduced-motion: reduce) { .spar-faq__topics a, .spar-faq__item summary, .spar-faq__toggle::before, .spar-faq__toggle::after, .spar-faq__button { transition: none; } .spar-faq__topics a:hover, .spar-faq__button:hover { transform: none; } } /* ============================================================ STAMPA ============================================================ */ @media print { .spar-faq { padding: 30px 0; background: #ffffff; } .spar-faq__group--dark { border: 1px solid var(--spar-faq-border); background: #ffffff; box-shadow: none; } .spar-faq__group--dark .spar-faq__group-header h3 { color: var(--spar-faq-dark); } .spar-faq__item { break-inside: avoid; box-shadow: none; } .spar-faq__actions { display: none; } }#imCell_35 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHTMLObject_1726_35 { position: relative; align-self: start; justify-self: center; max-width: 100%; box-sizing: border-box; z-index: 3; } #imCellStyleGraphics_35 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imCellStyleBorders_35 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } /* ============================================================ H2 — RICHIEDI UNA VALUTAZIONE PER LA TUA PARETE A ROMA L’ID #form-contatto-pareti-roma è applicato direttamente alla card del modulo. Su tablet e mobile il modulo viene mostrato prima della colonna informativa. ============================================================ */ .spar-contact, .spar-contact *, .spar-contact *::before, .spar-contact *::after { box-sizing: border-box; } .spar-contact { --spar-contact-dark: #07343b; --spar-contact-deep: #05282e; --spar-contact-medium: #0b5159; --spar-contact-teal: #24bfc1; --spar-contact-teal-light: #d9f4f2; --spar-contact-orange: #ff8a2a; --spar-contact-orange-dark: #c85c0a; --spar-contact-green: #27ad68; --spar-contact-green-dark: #19864f; --spar-contact-white: #ffffff; --spar-contact-cream: #fff8ed; --spar-contact-light: #edf8f7; --spar-contact-text: #173c41; --spar-contact-muted: #557277; --spar-contact-border: #d4e6e4; --spar-contact-error: #a72f2f; --spar-contact-shadow: 0 22px 58px rgba(6, 52, 59, 0.12); width: 100%; max-width: 100%; overflow: hidden; padding-block: clamp(68px, 9vw, 112px); background: radial-gradient( circle at 5% 7%, rgba(36, 191, 193, 0.16), transparent 29% ), radial-gradient( circle at 96% 93%, rgba(255, 138, 42, 0.11), transparent 27% ), linear-gradient( 180deg, #ffffff, var(--spar-contact-cream) ); color: var(--spar-contact-text); } .spar-contact h2, .spar-contact h3, .spar-contact h4, .spar-contact p, .spar-contact li, .spar-contact span, .spar-contact strong, .spar-contact small, .spar-contact label, .spar-contact a, .spar-contact input, .spar-contact textarea, .spar-contact button { max-width: 100%; overflow-wrap: break-word; word-break: normal; } .spar-contact svg { display: block; max-width: 100%; } .spar-contact__container { width: min(calc(100% - 40px), 1180px); margin-inline: auto; } /* ============================================================ INTESTAZIONE ============================================================ */ .spar-contact__header { width: min(100%, 940px); margin-inline: auto; text-align: center; } .spar-contact__eyebrow, .spar-contact__information-label, .spar-contact__form-label, .spar-contact__quick-label, .spar-contact__trust-label { margin: 0 0 12px; color: var(--spar-contact-orange-dark); font-size: 0.74rem; font-weight: 900; line-height: 1.4; letter-spacing: 0.075em; text-transform: uppercase; } .spar-contact__title { margin: 0; color: var(--spar-contact-dark); font-size: clamp(2rem, 4.2vw, 3.55rem); font-weight: 900; line-height: 1.08; letter-spacing: -0.04em; text-wrap: balance; } .spar-contact__direct-answer { margin: 24px auto 0; color: var(--spar-contact-dark); font-size: clamp(1.04rem, 1.5vw, 1.2rem); font-weight: 650; line-height: 1.7; } .spar-contact__direct-answer strong { color: inherit; font-weight: 900; } .spar-contact__intro { margin: 14px auto 0; color: var(--spar-contact-muted); font-size: 1rem; line-height: 1.72; } /* ============================================================ LAYOUT PRINCIPALE ============================================================ */ .spar-contact__layout { display: grid; grid-template-columns: minmax(0, 0.86fr) minmax(500px, 1.14fr); align-items: start; gap: clamp(28px, 5vw, 58px); margin-top: clamp(46px, 7vw, 78px); } /* ============================================================ PUNTO DI ARRIVO DEI PULSANTI Compensa eventuali menu fissi presenti in alto. ============================================================ */ #form-contatto-pareti-roma { scroll-margin-top: 105px; } /* ============================================================ COLONNA INFORMATIVA ============================================================ */ .spar-contact__information { min-width: 0; padding: clamp(24px, 3vw, 36px); border-radius: 24px; background: radial-gradient( circle at 95% 5%, rgba(36, 191, 193, 0.23), transparent 31% ), linear-gradient( 145deg, var(--spar-contact-deep), var(--spar-contact-dark) ); color: var(--spar-contact-white); box-shadow: 0 24px 60px rgba(3, 35, 40, 0.21); } .spar-contact__information-header { display: grid; grid-template-columns: 68px minmax(0, 1fr); align-items: center; gap: 17px; } .spar-contact__information-icon { display: grid; place-items: center; width: 64px; height: 64px; border-radius: 18px; background: var(--spar-contact-teal); color: var(--spar-contact-dark); } .spar-contact__information-icon svg { width: 38px; height: 38px; } .spar-contact__information-header > div { min-width: 0; } .spar-contact__information-label { color: var(--spar-contact-orange); } .spar-contact__information-header h3 { margin: 0; color: var(--spar-contact-white); font-size: clamp(1.35rem, 2.5vw, 1.95rem); font-weight: 900; line-height: 1.22; letter-spacing: -0.03em; } /* ============================================================ PASSAGGI ============================================================ */ .spar-contact__steps { display: grid; gap: 12px; margin: 27px 0 0; padding: 0; list-style: none; } .spar-contact__steps li { display: grid; grid-template-columns: 44px minmax(0, 1fr); align-items: start; gap: 13px; min-width: 0; padding: 16px; border: 1px solid rgba(255, 255, 255, 0.13); border-radius: 15px; background: rgba(255, 255, 255, 0.075); } .spar-contact__step-number { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: var(--spar-contact-teal); color: var(--spar-contact-dark); font-size: 0.76rem; font-weight: 950; } .spar-contact__steps li > div { min-width: 0; } .spar-contact__steps h4 { margin: 0; color: var(--spar-contact-white); font-size: 0.93rem; font-weight: 900; line-height: 1.42; } .spar-contact__steps p { margin: 6px 0 0; color: rgba(255, 255, 255, 0.7); font-size: 0.8rem; line-height: 1.56; } /* ============================================================ RISPOSTA RAPIDA ============================================================ */ .spar-contact__quick-answer { margin-top: 20px; padding: 17px; border-left: 4px solid var(--spar-contact-orange); border-radius: 0 13px 13px 0; background: rgba(255, 255, 255, 0.08); } .spar-contact__quick-label { color: var(--spar-contact-orange); font-size: 0.66rem; } .spar-contact__quick-answer > p:last-child { margin: 0; color: rgba(255, 255, 255, 0.78); font-size: 0.83rem; font-weight: 700; line-height: 1.58; } /* ============================================================ CONTATTI DIRETTI ============================================================ */ .spar-contact__direct-channels { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; margin-top: 20px; } .spar-contact__channel { display: grid; grid-template-columns: 43px minmax(0, 1fr); align-items: center; gap: 10px; min-width: 0; min-height: 67px; padding: 12px; border: 1px solid rgba(255, 255, 255, 0.17); border-radius: 14px; color: var(--spar-contact-white); text-decoration: none; transition: transform 180ms ease, border-color 180ms ease, background-color 180ms ease; } .spar-contact__channel--phone { background: rgba(36, 191, 193, 0.12); } .spar-contact__channel--whatsapp { background: rgba(39, 173, 104, 0.15); } .spar-contact__channel:hover { transform: translateY(-2px); border-color: rgba(255, 255, 255, 0.4); background: rgba(255, 255, 255, 0.12); } .spar-contact__channel:focus-visible { outline: 3px solid var(--spar-contact-orange); outline-offset: 4px; } .spar-contact__channel-icon { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: rgba(255, 255, 255, 0.12); } .spar-contact__channel-icon svg { width: 24px; height: 24px; } .spar-contact__channel-content { display: grid; min-width: 0; gap: 2px; } .spar-contact__channel-content small { color: rgba(255, 255, 255, 0.65); font-size: 0.61rem; font-weight: 800; line-height: 1.2; letter-spacing: 0.05em; text-transform: uppercase; } .spar-contact__channel-content strong { color: var(--spar-contact-white); font-size: 0.91rem; font-weight: 900; line-height: 1.3; } /* ============================================================ CARD DEL MODULO ============================================================ */ .spar-contact__form-card { min-width: 0; padding: clamp(25px, 4vw, 42px); border: 1px solid rgba(36, 191, 193, 0.28); border-radius: 24px; background: var(--spar-contact-white); box-shadow: var(--spar-contact-shadow); } .spar-contact__form-header { min-width: 0; } .spar-contact__form-header h3 { margin: 0; color: var(--spar-contact-dark); font-size: clamp(1.5rem, 2.8vw, 2.25rem); font-weight: 900; line-height: 1.2; letter-spacing: -0.03em; text-wrap: balance; } .spar-contact__form-header > p:last-child { margin: 12px 0 0; color: var(--spar-contact-muted); font-size: 0.91rem; line-height: 1.64; } /* ============================================================ MODULO ============================================================ */ .spar-contact__form { position: relative; margin-top: 27px; } .spar-contact__fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; } .spar-contact__field { display: grid; min-width: 0; gap: 8px; } .spar-contact__field--full { grid-column: 1 / -1; } .spar-contact__field label { color: var(--spar-contact-dark); font-size: 0.82rem; font-weight: 850; line-height: 1.4; } .spar-contact__field label span, .spar-contact__privacy label > span { color: var(--spar-contact-error); font-weight: 900; } .spar-contact__field input, .spar-contact__field textarea { display: block; width: 100%; min-width: 0; border: 1px solid #c8dcda; border-radius: 12px; outline: none; background: #fbfdfd; color: var(--spar-contact-dark); font-family: inherit; font-size: 0.93rem; line-height: 1.45; transition: border-color 180ms ease, box-shadow 180ms ease, background-color 180ms ease; } .spar-contact__field input { min-height: 54px; padding: 12px 14px; } .spar-contact__field textarea { min-height: 168px; padding: 14px; resize: vertical; } .spar-contact__field input::placeholder, .spar-contact__field textarea::placeholder { color: #82999d; opacity: 1; } .spar-contact__field input:hover, .spar-contact__field textarea:hover { border-color: #9bc9c6; } .spar-contact__field input:focus, .spar-contact__field textarea:focus { border-color: var(--spar-contact-teal); background: var(--spar-contact-white); box-shadow: 0 0 0 4px rgba(36, 191, 193, 0.14); } .spar-contact__field input:invalid:not(:placeholder-shown), .spar-contact__field textarea:invalid:not(:placeholder-shown) { border-color: rgba(167, 47, 47, 0.55); } .spar-contact__field-help { margin: 0; color: var(--spar-contact-muted); font-size: 0.72rem; line-height: 1.5; } /* ============================================================ HONEYPOT ============================================================ */ .spar-contact__honeypot { position: absolute !important; top: auto !important; left: -10000px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; opacity: 0 !important; pointer-events: none !important; } /* ============================================================ PRIVACY ============================================================ */ .spar-contact__privacy { display: grid; grid-template-columns: 21px minmax(0, 1fr); align-items: start; gap: 10px; margin-top: 20px; padding: 15px; border: 1px solid var(--spar-contact-border); border-radius: 12px; background: var(--spar-contact-light); } .spar-contact__privacy input { width: 19px; height: 19px; margin: 2px 0 0; accent-color: var(--spar-contact-teal); cursor: pointer; } .spar-contact__privacy input:focus-visible { outline: 3px solid var(--spar-contact-orange); outline-offset: 3px; } .spar-contact__privacy label { color: var(--spar-contact-muted); font-size: 0.76rem; line-height: 1.56; cursor: pointer; } .spar-contact__privacy a { color: var(--spar-contact-medium); font-weight: 850; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; } .spar-contact__privacy a:hover { color: var(--spar-contact-dark); } .spar-contact__privacy a:focus-visible { outline: 3px solid var(--spar-contact-orange); outline-offset: 3px; border-radius: 3px; } /* ============================================================ RECAPTCHA ============================================================ */ .spar-contact__recaptcha { width: 100%; max-width: 100%; margin-top: 18px; overflow: hidden; } .spar-contact__recaptcha .g-recaptcha { transform-origin: top left; } /* ============================================================ PULSANTE INVIO ============================================================ */ .spar-contact__submit { display: flex; width: 100%; min-height: 60px; align-items: center; justify-content: center; gap: 11px; margin-top: 20px; padding: 14px 20px; border: 2px solid var(--spar-contact-orange); border-radius: 12px; background: var(--spar-contact-orange); color: #2f1705; font-family: inherit; font-size: 0.94rem; font-weight: 900; line-height: 1.3; text-align: center; cursor: pointer; box-shadow: 0 13px 30px rgba(255, 138, 42, 0.23); transition: transform 180ms ease, background-color 180ms ease, border-color 180ms ease, box-shadow 180ms ease; } .spar-contact__submit:hover { transform: translateY(-2px); border-color: #ff9b43; background: #ff9b43; box-shadow: 0 17px 36px rgba(255, 138, 42, 0.28); } .spar-contact__submit:active { transform: translateY(0); } .spar-contact__submit:focus-visible { outline: 3px solid var(--spar-contact-dark); outline-offset: 4px; } .spar-contact__submit svg { flex: 0 0 24px; width: 24px; height: 24px; } /* ============================================================ NOTE DEL MODULO ============================================================ */ .spar-contact__required-note { margin: 13px 0 0; color: var(--spar-contact-muted); font-size: 0.68rem; line-height: 1.45; text-align: center; } .spar-contact__security-note { display: flex; align-items: center; justify-content: center; gap: 7px; margin: 7px 0 0; color: var(--spar-contact-muted); font-size: 0.67rem; line-height: 1.45; text-align: center; } .spar-contact__security-note svg { flex: 0 0 17px; width: 17px; height: 17px; } /* ============================================================ CHIUSURA DI FIDUCIA ============================================================ */ .spar-contact__trust { display: grid; grid-template-columns: 70px minmax(0, 1fr); align-items: center; gap: 21px; margin-top: clamp(42px, 6vw, 68px); padding: clamp(23px, 3vw, 34px); border: 1px solid rgba(39, 173, 104, 0.3); border-radius: 21px; background: #ecf9f2; } .spar-contact__trust-icon { display: grid; place-items: center; width: 66px; height: 66px; border-radius: 18px; background: var(--spar-contact-green); color: var(--spar-contact-white); } .spar-contact__trust-icon svg { width: 39px; height: 39px; } .spar-contact__trust-content { min-width: 0; } .spar-contact__trust-label { color: var(--spar-contact-green-dark); } .spar-contact__trust-content h3 { margin: 0; color: var(--spar-contact-dark); font-size: clamp(1.25rem, 2.2vw, 1.75rem); font-weight: 900; line-height: 1.28; letter-spacing: -0.025em; } .spar-contact__trust-content > p:last-child { margin: 9px 0 0; color: var(--spar-contact-muted); font-size: 0.91rem; line-height: 1.66; } /* ============================================================ NOTEBOOK E TABLET Il modulo viene posizionato prima della colonna informativa. ============================================================ */ @media (max-width: 1080px) { .spar-contact__layout { grid-template-columns: minmax(0, 1fr); } .spar-contact__form-card { order: 1; width: min(100%, 850px); margin-inline: auto; } .spar-contact__information { order: 2; width: min(100%, 850px); margin-inline: auto; } #form-contatto-pareti-roma { scroll-margin-top: 90px; } } /* ============================================================ TABLET ============================================================ */ @media (max-width: 760px) { .spar-contact__container { width: min(calc(100% - 32px), 720px); } .spar-contact__fields { grid-template-columns: minmax(0, 1fr); } .spar-contact__field--full { grid-column: auto; } .spar-contact__direct-channels { grid-template-columns: minmax(0, 1fr); } } /* ============================================================ MOBILE ============================================================ */ @media (max-width: 580px) { .spar-contact { padding-block: 52px 66px; } .spar-contact__container { width: calc(100% - 28px); } .spar-contact__header { text-align: left; } .spar-contact__eyebrow, .spar-contact__information-label, .spar-contact__form-label, .spar-contact__quick-label, .spar-contact__trust-label { font-size: 0.67rem; letter-spacing: 0.06em; } .spar-contact__title { font-size: clamp(1.84rem, 9.4vw, 2.62rem); line-height: 1.1; } .spar-contact__direct-answer { font-size: 0.98rem; line-height: 1.63; } .spar-contact__intro { font-size: 0.91rem; line-height: 1.66; } .spar-contact__layout { margin-top: 38px; } /* * Quando l’utente arriva da un pulsante con: * href="#form-contatto-pareti-roma" * * il browser posiziona direttamente questa card * sotto l’eventuale menu fisso. */ #form-contatto-pareti-roma { scroll-margin-top: 76px; } .spar-contact__form-card { order: 1; padding: 20px 16px; border-radius: 19px; } .spar-contact__information { order: 2; padding: 20px 16px; border-radius: 19px; } .spar-contact__information-header { grid-template-columns: 54px minmax(0, 1fr); gap: 13px; } .spar-contact__information-icon { width: 52px; height: 52px; border-radius: 15px; } .spar-contact__information-icon svg { width: 31px; height: 31px; } .spar-contact__information-header h3, .spar-contact__form-header h3 { font-size: clamp(1.35rem, 7.1vw, 1.86rem); } .spar-contact__steps li { grid-template-columns: 40px minmax(0, 1fr); padding: 14px; } .spar-contact__step-number { width: 38px; height: 38px; border-radius: 11px; } .spar-contact__field input { min-height: 53px; } .spar-contact__field textarea { min-height: 160px; } .spar-contact__privacy { padding: 13px; } .spar-contact__submit { min-height: 58px; padding-inline: 14px; } .spar-contact__trust { grid-template-columns: minmax(0, 1fr); align-items: start; padding: 20px 17px; border-radius: 18px; } .spar-contact__trust-icon { width: 54px; height: 54px; border-radius: 15px; } .spar-contact__trust-icon svg { width: 32px; height: 32px; } } /* ============================================================ RECAPTCHA SU SCHERMI STRETTI ============================================================ */ @media (max-width: 390px) { .spar-contact__container { width: calc(100% - 22px); } .spar-contact__title { font-size: 1.7rem; } .spar-contact__information, .spar-contact__form-card, .spar-contact__trust { padding-inline: 13px; } .spar-contact__recaptcha { height: 70px; } .spar-contact__recaptcha .g-recaptcha { transform: scale(0.84); } .spar-contact__submit { gap: 8px; padding-inline: 10px; font-size: 0.86rem; } #form-contatto-pareti-roma { scroll-margin-top: 70px; } } /* ============================================================ SCHERMI MOLTO STRETTI ============================================================ */ @media (max-width: 340px) { .spar-contact__recaptcha { height: 64px; } .spar-contact__recaptcha .g-recaptcha { transform: scale(0.76); } } /* ============================================================ ACCESSIBILITÀ ============================================================ */ @media (prefers-reduced-motion: reduce) { .spar-contact__channel, .spar-contact__field input, .spar-contact__field textarea, .spar-contact__submit { transition: none; } .spar-contact__channel:hover, .spar-contact__submit:hover { transform: none; } } /* ============================================================ STAMPA ============================================================ */ @media print { .spar-contact { padding: 30px 0; background: #ffffff; } .spar-contact__information { border: 1px solid var(--spar-contact-border); background: #ffffff; color: var(--spar-contact-dark); box-shadow: none; } .spar-contact__information-header h3, .spar-contact__steps h4, .spar-contact__channel-content strong { color: var(--spar-contact-dark); } .spar-contact__steps p, .spar-contact__quick-answer > p:last-child, .spar-contact__channel-content small { color: var(--spar-contact-muted); } .spar-contact__direct-channels, .spar-contact__form-card { display: none; } }#imCell_36 { grid-template-columns: 100%; position: relative; box-sizing: border-box; } #imHTMLObject_1726_36 { position: relative; align-self: start; justify-self: center; max-width: 100%; box-sizing: border-box; z-index: 3; } #imCellStyleGraphics_36 { grid-row: 1 / -1; grid-column: 1 / -1; background-color: transparent; } #imCellStyleBorders_36 { grid-row: 1 / -1; grid-column: 1 / -1; z-index: 2; } /* ============================================================ FOOTER — ISOLAMENTO ACUSTICO PARETI ROMA Pagina: /isolamento-acustico-pareti-roma.html ============================================================ */ #footer-isolamento-acustico-pareti-roma { --spar-footer-dark: #073b46; --spar-footer-deep: #042d36; --spar-footer-deeper: #03262e; --spar-footer-teal: #008fa3; --spar-footer-cyan: #16bfd0; --spar-footer-orange: #f58220; --spar-footer-orange-dark: #d96813; --spar-footer-green: #2e9b67; --spar-footer-green-dark: #237c52; --spar-footer-white: #ffffff; --spar-footer-light: #eefafd; --spar-footer-cream: #fff8ed; --spar-footer-text: #183f48; --spar-footer-muted: #9ec0c7; --spar-footer-line: rgba(255, 255, 255, 0.14); --spar-footer-shadow: 0 18px 42px rgba(2, 27, 33, 0.24); width: 100%; max-width: 100%; overflow: hidden; background: var(--spar-footer-deep); color: var(--spar-footer-white); } #footer-isolamento-acustico-pareti-roma, #footer-isolamento-acustico-pareti-roma *, #footer-isolamento-acustico-pareti-roma *::before, #footer-isolamento-acustico-pareti-roma *::after, .spar-mobile-bar, .spar-mobile-bar *, .spar-mobile-bar *::before, .spar-mobile-bar *::after, .spar-back-to-top, .spar-back-to-top *, .spar-back-to-top *::before, .spar-back-to-top *::after { box-sizing: border-box; } #footer-isolamento-acustico-pareti-roma h2, #footer-isolamento-acustico-pareti-roma h3, #footer-isolamento-acustico-pareti-roma p, #footer-isolamento-acustico-pareti-roma span, #footer-isolamento-acustico-pareti-roma strong, #footer-isolamento-acustico-pareti-roma small, #footer-isolamento-acustico-pareti-roma a, .spar-mobile-bar a, .spar-mobile-bar span, .spar-back-to-top, .spar-back-to-top span { max-width: 100%; overflow-wrap: break-word; word-break: normal; } #footer-isolamento-acustico-pareti-roma svg, .spar-mobile-bar svg, .spar-back-to-top svg { display: block; max-width: 100%; } .spar-footer__container { width: min(calc(100% - 40px), 1180px); margin-inline: auto; } /* ============================================================ CTA SUPERIORE ============================================================ */ .spar-footer__cta { background: radial-gradient( circle at 92% 10%, rgba(22, 191, 208, 0.19), transparent 29% ), radial-gradient( circle at 5% 95%, rgba(245, 130, 32, 0.09), transparent 26% ), linear-gradient( 135deg, var(--spar-footer-dark), var(--spar-footer-deep) ); } .spar-footer__cta-inner { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, 340px); align-items: center; gap: clamp(30px, 5vw, 60px); padding-block: clamp(36px, 5vw, 58px); } .spar-footer__cta-copy { min-width: 0; } .spar-footer__eyebrow { margin: 0 0 10px; color: #8ce6ed; font-size: 10px; font-weight: 900; line-height: 1.4; letter-spacing: 0.08em; text-transform: uppercase; } .spar-footer__title { margin: 0; color: var(--spar-footer-white); font-size: clamp(27px, 3.6vw, 43px); font-weight: 900; line-height: 1.14; letter-spacing: -0.033em; text-wrap: balance; } .spar-footer__cta-text { max-width: 760px; margin: 15px 0 0; color: rgba(255, 255, 255, 0.8); font-size: 14px; line-height: 1.7; } .spar-footer__cta-actions { display: grid; gap: 10px; min-width: 0; } .spar-footer__cta-button { display: flex; width: 100%; min-width: 0; min-height: 56px; align-items: center; justify-content: center; gap: 10px; padding: 12px 17px; border: 2px solid transparent; border-radius: 12px; font-family: inherit; font-size: 13px; font-weight: 900; line-height: 1.35; text-align: center; text-decoration: none; transition: background-color 180ms ease, border-color 180ms ease, transform 180ms ease, box-shadow 180ms ease; } .spar-footer__cta-button:hover { transform: translateY(-2px); } .spar-footer__cta-button:focus-visible { outline: 3px solid rgba(22, 191, 208, 0.58); outline-offset: 4px; } .spar-footer__cta-button svg { flex: 0 0 22px; width: 22px; height: 22px; } .spar-footer__cta-button--primary { background: var(--spar-footer-orange); color: var(--spar-footer-white); box-shadow: 0 12px 27px rgba(245, 130, 32, 0.2); } .spar-footer__cta-button--primary:hover { background: var(--spar-footer-orange-dark); box-shadow: 0 16px 34px rgba(245, 130, 32, 0.25); } .spar-footer__cta-button--phone { border-color: rgba(255, 255, 255, 0.25); background: rgba(255, 255, 255, 0.08); color: var(--spar-footer-white); } .spar-footer__cta-button--phone:hover { background: rgba(255, 255, 255, 0.14); } .spar-footer__cta-phone-text { display: grid; min-width: 0; gap: 1px; text-align: left; } .spar-footer__cta-phone-text small { color: rgba(255, 255, 255, 0.7); font-size: 9px; font-weight: 750; line-height: 1.2; letter-spacing: 0.04em; text-transform: uppercase; } .spar-footer__cta-phone-text strong { color: var(--spar-footer-white); font-size: 17px; font-weight: 900; line-height: 1.2; } .spar-footer__cta-button--whatsapp { border-color: var(--spar-footer-green); background: var(--spar-footer-green); color: var(--spar-footer-white); } .spar-footer__cta-button--whatsapp:hover { border-color: var(--spar-footer-green-dark); background: var(--spar-footer-green-dark); } /* ============================================================ AREA PRINCIPALE ============================================================ */ .spar-footer__main { border-top: 1px solid var(--spar-footer-line); background: var(--spar-footer-deep); } .spar-footer__grid { display: grid; grid-template-columns: minmax(250px, 1.2fr) minmax(175px, 0.8fr) minmax(190px, 0.95fr) minmax(205px, 0.9fr); gap: clamp(27px, 4vw, 48px); padding-block: clamp(44px, 6vw, 70px); } .spar-footer__company, .spar-footer__column { min-width: 0; } /* ============================================================ AZIENDA ============================================================ */ .spar-footer__logo-link { display: inline-flex; align-items: center; padding: 8px 10px; border-radius: 11px; background: var(--spar-footer-white); text-decoration: none; } .spar-footer__logo-link:hover { background: #f2fbfc; } .spar-footer__logo-link:focus-visible { outline: 3px solid rgba(22, 191, 208, 0.58); outline-offset: 4px; } .spar-footer__logo { display: block; width: 135px; height: auto; object-fit: contain; } .spar-footer__company-name { margin: 18px 0 0; color: var(--spar-footer-white); font-size: 17px; font-weight: 900; line-height: 1.4; } .spar-footer__company-text { margin: 10px 0 0; color: var(--spar-footer-muted); font-size: 13px; line-height: 1.68; } .spar-footer__current-page { display: grid; gap: 4px; margin: 18px 0 0; padding: 13px 14px; border: 1px solid var(--spar-footer-line); border-left: 4px solid var(--spar-footer-orange); border-radius: 11px; background: rgba(255, 255, 255, 0.05); } .spar-footer__current-page span { color: #89e1e9; font-size: 9px; font-weight: 900; line-height: 1.25; letter-spacing: 0.07em; text-transform: uppercase; } .spar-footer__current-page strong { color: var(--spar-footer-white); font-size: 13px; font-weight: 900; line-height: 1.4; } /* ============================================================ COLONNE E LINK ============================================================ */ .spar-footer__column h3 { margin: 0 0 16px; color: var(--spar-footer-white); font-size: 15px; font-weight: 900; line-height: 1.35; } .spar-footer__column ul { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; } .spar-footer__column li { min-width: 0; } .spar-footer__column li a { position: relative; display: inline-flex; color: var(--spar-footer-muted); font-size: 12px; font-weight: 700; line-height: 1.5; text-decoration: none; transition: color 160ms ease, transform 160ms ease; } .spar-footer__column li a:hover { color: var(--spar-footer-white); transform: translateX(2px); } .spar-footer__column li a[aria-current="page"] { padding-left: 15px; color: var(--spar-footer-white); font-weight: 900; } .spar-footer__column li a[aria-current="page"]::before { content: ""; position: absolute; top: 0.58em; left: 0; width: 7px; height: 7px; border-radius: 50%; background: var(--spar-footer-orange); box-shadow: 0 0 0 4px rgba(245, 130, 32, 0.13); } .spar-footer__column li a:focus-visible { outline: 3px solid rgba(22, 191, 208, 0.55); outline-offset: 4px; border-radius: 3px; } /* ============================================================ CONTATTI ============================================================ */ .spar-footer__contacts { display: grid; align-content: start; gap: 10px; } .spar-footer__contacts h3 { margin-bottom: 6px; } .spar-footer__contact { display: grid; grid-template-columns: 38px minmax(0, 1fr); align-items: center; gap: 10px; min-width: 0; min-height: 62px; padding: 10px 11px; border: 1px solid var(--spar-footer-line); border-radius: 11px; background: rgba(255, 255, 255, 0.05); color: var(--spar-footer-white); text-decoration: none; transition: border-color 160ms ease, background-color 160ms ease, transform 160ms ease; } .spar-footer__contact:hover { transform: translateY(-2px); border-color: rgba(255, 255, 255, 0.26); background: rgba(255, 255, 255, 0.1); } .spar-footer__contact:focus-visible { outline: 3px solid rgba(22, 191, 208, 0.55); outline-offset: 4px; } .spar-footer__contact--whatsapp { border-color: rgba(46, 155, 103, 0.5); background: rgba(46, 155, 103, 0.16); } .spar-footer__contact--whatsapp:hover { border-color: rgba(46, 155, 103, 0.8); background: rgba(46, 155, 103, 0.25); } .spar-footer__contact-icon { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 9px; background: var(--spar-footer-teal); color: var(--spar-footer-white); } .spar-footer__contact--whatsapp .spar-footer__contact-icon { background: var(--spar-footer-green); } .spar-footer__contact-icon svg { width: 20px; height: 20px; } .spar-footer__contact-content { display: grid; min-width: 0; gap: 2px; } .spar-footer__contact small { color: var(--spar-footer-muted); font-size: 9px; font-weight: 750; line-height: 1.3; } .spar-footer__contact strong { color: var(--spar-footer-white); font-size: 13px; font-weight: 900; line-height: 1.35; overflow-wrap: anywhere; } .spar-footer__survey-link { display: inline-flex; margin-top: 4px; color: #8ce6ed; font-size: 11px; font-weight: 800; line-height: 1.5; text-decoration: underline; text-decoration-color: rgba(140, 230, 237, 0.45); text-decoration-thickness: 1px; text-underline-offset: 4px; } .spar-footer__survey-link:hover { color: var(--spar-footer-white); } .spar-footer__survey-link:focus-visible { outline: 3px solid rgba(22, 191, 208, 0.55); outline-offset: 4px; border-radius: 3px; } /* ============================================================ AREA LEGALE ============================================================ */ .spar-footer__legal { border-top: 1px solid var(--spar-footer-line); background: var(--spar-footer-deeper); } .spar-footer__legal-inner { display: flex; min-height: 74px; align-items: center; justify-content: space-between; gap: 22px; padding-block: 16px; } .spar-footer__legal p { margin: 0; color: #94b5bc; font-size: 11px; line-height: 1.55; } .spar-footer__legal p span { margin-inline: 6px; } .spar-footer__legal nav { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px 16px; } .spar-footer__legal nav a { color: #b8d2d7; font-size: 11px; font-weight: 750; line-height: 1.4; text-decoration: none; } .spar-footer__legal nav a:hover { color: var(--spar-footer-white); } .spar-footer__legal nav a:focus-visible { outline: 3px solid rgba(22, 191, 208, 0.55); outline-offset: 4px; border-radius: 3px; } /* ============================================================ PULSANTE FISSO TORNA SU ============================================================ */ .spar-back-to-top { position: fixed; z-index: 9997; right: 20px; bottom: 22px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 52px; padding: 7px 15px 7px 7px; border: 2px solid rgba(255, 255, 255, 0.9); border-radius: 999px; background: #073b46; color: #ffffff; font-family: inherit; font-size: 11px; font-weight: 900; line-height: 1.2; text-decoration: none; box-shadow: 0 14px 34px rgba(3, 38, 46, 0.28), 0 0 0 1px rgba(7, 59, 70, 0.14); transition: transform 180ms ease, background-color 180ms ease, box-shadow 180ms ease; } .spar-back-to-top:hover { transform: translateY(-3px); background: #008fa3; box-shadow: 0 18px 38px rgba(3, 38, 46, 0.32), 0 0 0 1px rgba(7, 59, 70, 0.14); } .spar-back-to-top:active { transform: translateY(-1px); } .spar-back-to-top:focus-visible { outline: 3px solid #f58220; outline-offset: 4px; } .spar-back-to-top__icon { display: grid; flex: 0 0 auto; place-items: center; width: 36px; height: 36px; border: 1px solid rgba(255, 255, 255, 0.3); border-radius: 50%; background: rgba(255, 255, 255, 0.12); color: inherit; } .spar-back-to-top__icon svg { width: 20px; height: 20px; } .spar-back-to-top__label { color: inherit; font-size: 11px; font-weight: 900; line-height: 1.2; white-space: nowrap; } /* ============================================================ BOTTOM BAR ============================================================ */ .spar-mobile-bar { --spar-mobile-dark: #073b46; --spar-mobile-green: #2e9b67; --spar-mobile-green-dark: #237c52; --spar-mobile-orange: #f58220; --spar-mobile-white: #ffffff; display: none; } /* ============================================================ NOTEBOOK E TABLET ORIZZONTALE ============================================================ */ @media (max-width: 1060px) { .spar-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .spar-footer__company { grid-column: 1 / -1; } .spar-footer__company-text { max-width: 760px; } } /* ============================================================ TABLET E SMARTPHONE ============================================================ */ @media (max-width: 900px) { body { padding-bottom: calc(80px + env(safe-area-inset-bottom)); } .spar-mobile-bar { position: fixed; z-index: 9998; right: 9px; bottom: calc(9px + env(safe-area-inset-bottom)); left: 9px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; padding: 7px; border: 1px solid rgba(7, 59, 70, 0.14); border-radius: 16px; background: rgba(255, 255, 255, 0.97); box-shadow: 0 14px 36px rgba(4, 45, 54, 0.22); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); } .spar-mobile-bar__item { display: grid; grid-template-columns: 25px minmax(0, auto); align-items: center; justify-content: center; gap: 6px; min-width: 0; min-height: 51px; padding: 8px 7px; border-radius: 11px; color: var(--spar-mobile-white); font-family: inherit; font-size: 10px; font-weight: 900; line-height: 1.2; text-align: center; text-decoration: none; transition: transform 160ms ease, filter 160ms ease; } .spar-mobile-bar__item:hover { transform: translateY(-1px); filter: brightness(1.04); } .spar-mobile-bar__item:focus-visible { outline: 3px solid var(--spar-mobile-dark); outline-offset: 3px; } .spar-mobile-bar__item--phone { background: var(--spar-mobile-green); } .spar-mobile-bar__item--whatsapp { background: var(--spar-mobile-green-dark); } .spar-mobile-bar__item--cta { background: var(--spar-mobile-orange); } .spar-mobile-bar__icon { display: grid; place-items: center; width: 25px; height: 25px; border: 1px solid rgba(255, 255, 255, 0.28); border-radius: 7px; background: rgba(255, 255, 255, 0.12); color: inherit; } .spar-mobile-bar__icon svg { width: 15px; height: 15px; } /* * Il pulsante Torna su viene posizionato * sopra la bottom bar mobile. */ .spar-back-to-top { right: 14px; bottom: calc(94px + env(safe-area-inset-bottom)); width: 52px; min-width: 52px; height: 52px; min-height: 52px; padding: 6px; border-radius: 50%; } .spar-back-to-top__icon { width: 36px; height: 36px; } .spar-back-to-top__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; } } /* ============================================================ TABLET VERTICALE ============================================================ */ @media (max-width: 760px) { .spar-footer__container { width: min(calc(100% - 28px), 1180px); } .spar-footer__cta-inner { grid-template-columns: minmax(0, 1fr); gap: 24px; padding-block: 35px; } .spar-footer__cta-actions { grid-template-columns: minmax(0, 1fr); } .spar-footer__grid { grid-template-columns: minmax(0, 1fr); gap: 32px; padding-block: 42px; } .spar-footer__company { grid-column: auto; } .spar-footer__legal-inner { align-items: flex-start; flex-direction: column; } .spar-footer__legal nav { justify-content: flex-start; } } /* ============================================================ SMARTPHONE ============================================================ */ @media (max-width: 560px) { .spar-footer__container { width: calc(100% - 26px); } .spar-footer__eyebrow { font-size: 9px; } .spar-footer__title { font-size: clamp(25px, 8vw, 34px); } .spar-footer__cta-text { font-size: 13px; line-height: 1.65; } .spar-footer__cta-button { min-height: 55px; padding-inline: 13px; } .spar-footer__grid { gap: 30px; padding-block: 38px; } .spar-footer__company-name { font-size: 16px; } .spar-footer__legal p span { display: none; } .spar-footer__legal p { display: grid; gap: 3px; } } /* ============================================================ SMARTPHONE STRETTI ============================================================ */ @media (max-width: 420px) { body { padding-bottom: calc(73px + env(safe-area-inset-bottom)); } .spar-mobile-bar { right: 5px; bottom: calc(5px + env(safe-area-inset-bottom)); left: 5px; gap: 5px; padding: 5px; border-radius: 14px; } .spar-mobile-bar__item { grid-template-columns: 21px minmax(0, auto); gap: 4px; min-height: 48px; padding-inline: 4px; border-radius: 10px; font-size: 9px; } .spar-mobile-bar__icon { width: 21px; height: 21px; border-radius: 6px; } .spar-mobile-bar__icon svg { width: 13px; height: 13px; } .spar-back-to-top { right: 9px; bottom: calc(82px + env(safe-area-inset-bottom)); width: 48px; min-width: 48px; height: 48px; min-height: 48px; } .spar-back-to-top__icon { width: 33px; height: 33px; } .spar-back-to-top__icon svg { width: 18px; height: 18px; } } /* ============================================================ SMARTPHONE MOLTO STRETTI ============================================================ */ @media (max-width: 340px) { .spar-mobile-bar__item { grid-template-columns: minmax(0, 1fr); gap: 3px; min-height: 51px; padding: 5px 2px; } .spar-mobile-bar__icon { margin-inline: auto; } .spar-back-to-top { right: 7px; bottom: calc(84px + env(safe-area-inset-bottom)); } } /* ============================================================ ACCESSIBILITÀ ============================================================ */ @media (prefers-reduced-motion: reduce) { .spar-footer__cta-button, .spar-footer__column li a, .spar-footer__contact, .spar-mobile-bar__item, .spar-back-to-top { transition: none; } .spar-footer__cta-button:hover, .spar-footer__column li a:hover, .spar-footer__contact:hover, .spar-mobile-bar__item:hover, .spar-back-to-top:hover { transform: none; } } /* ============================================================ STAMPA ============================================================ */ @media print { #footer-isolamento-acustico-pareti-roma { border-top: 1px solid #d4e2e4; background: #ffffff; color: #073b46; } .spar-footer__cta, .spar-footer__main, .spar-footer__legal { background: #ffffff; } .spar-footer__title, .spar-footer__company-name, .spar-footer__current-page strong, .spar-footer__column h3, .spar-footer__contact strong { color: #073b46; } .spar-footer__cta-text, .spar-footer__company-text, .spar-footer__column li a, .spar-footer__legal p, .spar-footer__legal nav a { color: #557277; } .spar-footer__cta-actions, .spar-footer__contacts, .spar-mobile-bar, .spar-back-to-top { display: none !important; } }@media (min-width: 1200.0px) { #imContent { padding-inline-start: 50px; padding-inline-end: 50px; } #imCell_1, #imCell_2, #imCell_3, #imCell_4, #imCell_5, #imCell_6, #imCell_7, #imCell_8, #imCell_9, #imCell_10, #imCell_11, #imCell_12, #imCell_13, #imCell_14, #imCell_15, #imCell_16, #imCell_17, #imCell_18, #imCell_19, #imCell_20, #imCell_21, #imCell_22, #imCell_23, #imCell_24, #imCell_25, #imCell_26, #imCell_27, #imCell_28, #imCell_29, #imCell_30, #imCell_31, #imCell_32, #imCell_33, #imCell_34, #imCell_35, #imCell_36, .imPageRow { margin-inline-start: -50px; margin-inline-end: -50px; } #imBreadcrumb { width: 1086px; margin-inline-start: 6px; margin-inline-end: 6px; } #imCell_1 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; } #imCell_1 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_01 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_1 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_2 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; } #imCell_2 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_02 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_2 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_3 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; } #imCell_3 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_03 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_3 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_4 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; } #imCell_4 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_04 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_4 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_5 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; } #imCell_5 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_05 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_5 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_6 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; } #imCell_6 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_06 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_6 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_7 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; } #imCell_7 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_07 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_7 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_8 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; } #imCell_8 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_08 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_8 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_9 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; } #imCell_9 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_09 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_9 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_10 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; } #imCell_10 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_10 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_10 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_11 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; } #imCell_11 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_11 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_11 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_12 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; } #imCell_12 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_12 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_12 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_13 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; } #imCell_13 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_13 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_13 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_14 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; } #imCell_14 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_14 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_14 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_15 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; } #imCell_15 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_15 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_15 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_16 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; } #imCell_16 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_16 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_16 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_17 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; } #imCell_17 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_17 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_17 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_18 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; } #imCell_18 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_18 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_18 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_19 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; } #imCell_19 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_19 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_19 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_20 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; } #imCell_20 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_20 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_20 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_21 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; } #imCell_21 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_21 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_21 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_22 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; } #imCell_22 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_22 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_22 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_23 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; } #imCell_23 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_23 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_23 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_24 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; } #imCell_24 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_24 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_24 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_25 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; } #imCell_25 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_25 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_25 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_26 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; } #imCell_26 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_26 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_26 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_27 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; } #imCell_27 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_27 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_27 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_28 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; } #imCell_28 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_28 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_28 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_29 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; } #imCell_29 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_29 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_29 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_30 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; } #imCell_30 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_30 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_30 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_31 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; } #imCell_31 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_31 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_31 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_32 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; } #imCell_32 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_32 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_32 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_33 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; } #imCell_33 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_33 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_33 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_34 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; } #imCell_34 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_34 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_34 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_35 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; } #imCell_35 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_35 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_35 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_36 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; } #imCell_36 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_36 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_36 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } } @media (max-width: 1199.9px) and (min-width: 720.0px) { #imContent { padding-inline-start: 10px; padding-inline-end: 10px; } #imCell_1, #imCell_2, #imCell_3, #imCell_4, #imCell_5, #imCell_6, #imCell_7, #imCell_8, #imCell_9, #imCell_10, #imCell_11, #imCell_12, #imCell_13, #imCell_14, #imCell_15, #imCell_16, #imCell_17, #imCell_18, #imCell_19, #imCell_20, #imCell_21, #imCell_22, #imCell_23, #imCell_24, #imCell_25, #imCell_26, #imCell_27, #imCell_28, #imCell_29, #imCell_30, #imCell_31, #imCell_32, #imCell_33, #imCell_34, #imCell_35, #imCell_36, .imPageRow { margin-inline-start: -10px; margin-inline-end: -10px; } #imBreadcrumb { width: 686px; margin-inline-start: 6px; margin-inline-end: 6px; } #imCell_1 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 6px; padding-inline-end: 6px; } #imCell_1 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_01 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_1 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_2 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 6px; padding-inline-end: 6px; } #imCell_2 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_02 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_2 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_3 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 6px; padding-inline-end: 6px; } #imCell_3 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_03 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_3 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_4 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 6px; padding-inline-end: 6px; } #imCell_4 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_04 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_4 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_5 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 6px; padding-inline-end: 6px; } #imCell_5 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_05 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_5 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_6 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 6px; padding-inline-end: 6px; } #imCell_6 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_06 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_6 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_7 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 6px; padding-inline-end: 6px; } #imCell_7 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_07 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_7 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_8 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 6px; padding-inline-end: 6px; } #imCell_8 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_08 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_8 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_9 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 6px; padding-inline-end: 6px; } #imCell_9 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_09 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_9 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_10 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 6px; padding-inline-end: 6px; } #imCell_10 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_10 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_10 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_11 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 6px; padding-inline-end: 6px; } #imCell_11 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_11 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_11 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_12 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 6px; padding-inline-end: 6px; } #imCell_12 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_12 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_12 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_13 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 6px; padding-inline-end: 6px; } #imCell_13 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_13 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_13 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_14 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 6px; padding-inline-end: 6px; } #imCell_14 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_14 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_14 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_15 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 6px; padding-inline-end: 6px; } #imCell_15 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_15 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_15 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_16 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 6px; padding-inline-end: 6px; } #imCell_16 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_16 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_16 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_17 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 6px; padding-inline-end: 6px; } #imCell_17 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_17 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_17 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_18 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 6px; padding-inline-end: 6px; } #imCell_18 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_18 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_18 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_19 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 6px; padding-inline-end: 6px; } #imCell_19 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_19 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_19 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_20 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 6px; padding-inline-end: 6px; } #imCell_20 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_20 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_20 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_21 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 6px; padding-inline-end: 6px; } #imCell_21 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_21 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_21 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_22 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 6px; padding-inline-end: 6px; } #imCell_22 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_22 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_22 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_23 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 6px; padding-inline-end: 6px; } #imCell_23 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_23 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_23 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_24 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 6px; padding-inline-end: 6px; } #imCell_24 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_24 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_24 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_25 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 6px; padding-inline-end: 6px; } #imCell_25 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_25 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_25 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_26 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 6px; padding-inline-end: 6px; } #imCell_26 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_26 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_26 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_27 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 6px; padding-inline-end: 6px; } #imCell_27 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_27 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_27 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_28 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 6px; padding-inline-end: 6px; } #imCell_28 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_28 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_28 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_29 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 6px; padding-inline-end: 6px; } #imCell_29 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_29 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_29 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_30 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 6px; padding-inline-end: 6px; } #imCell_30 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_30 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_30 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_31 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 6px; padding-inline-end: 6px; } #imCell_31 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_31 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_31 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_32 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 6px; padding-inline-end: 6px; } #imCell_32 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_32 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_32 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_33 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 6px; padding-inline-end: 6px; } #imCell_33 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_33 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_33 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_34 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 6px; padding-inline-end: 6px; } #imCell_34 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_34 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_34 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_35 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 6px; padding-inline-end: 6px; } #imCell_35 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_35 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_35 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_36 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 6px; padding-inline-end: 6px; } #imCell_36 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_36 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_36 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } } @media (max-width: 719.9px) and (min-width: 480.0px) { #imContent { padding-inline-start: 10px; padding-inline-end: 10px; } #imCell_1, #imCell_2, #imCell_3, #imCell_4, #imCell_5, #imCell_6, #imCell_7, #imCell_8, #imCell_9, #imCell_10, #imCell_11, #imCell_12, #imCell_13, #imCell_14, #imCell_15, #imCell_16, #imCell_17, #imCell_18, #imCell_19, #imCell_20, #imCell_21, #imCell_22, #imCell_23, #imCell_24, #imCell_25, #imCell_26, #imCell_27, #imCell_28, #imCell_29, #imCell_30, #imCell_31, #imCell_32, #imCell_33, #imCell_34, #imCell_35, #imCell_36, .imPageRow { margin-inline-start: -10px; margin-inline-end: -10px; } #imBreadcrumb { width: 446px; margin-inline-start: 6px; margin-inline-end: 6px; } #imCell_1 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 4px; padding-inline-end: 4px; } #imCell_1 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_01 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_1 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_2 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 4px; padding-inline-end: 4px; } #imCell_2 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_02 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_2 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_3 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 4px; padding-inline-end: 4px; } #imCell_3 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_03 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_3 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_4 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 4px; padding-inline-end: 4px; } #imCell_4 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_04 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_4 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_5 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 4px; padding-inline-end: 4px; } #imCell_5 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_05 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_5 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_6 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 4px; padding-inline-end: 4px; } #imCell_6 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_06 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_6 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_7 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 4px; padding-inline-end: 4px; } #imCell_7 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_07 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_7 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_8 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 4px; padding-inline-end: 4px; } #imCell_8 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_08 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_8 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_9 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 4px; padding-inline-end: 4px; } #imCell_9 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_09 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_9 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_10 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 4px; padding-inline-end: 4px; } #imCell_10 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_10 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_10 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_11 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 4px; padding-inline-end: 4px; } #imCell_11 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_11 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_11 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_12 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 4px; padding-inline-end: 4px; } #imCell_12 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_12 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_12 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_13 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 4px; padding-inline-end: 4px; } #imCell_13 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_13 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_13 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_14 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 4px; padding-inline-end: 4px; } #imCell_14 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_14 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_14 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_15 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 4px; padding-inline-end: 4px; } #imCell_15 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_15 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_15 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_16 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 4px; padding-inline-end: 4px; } #imCell_16 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_16 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_16 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_17 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 4px; padding-inline-end: 4px; } #imCell_17 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_17 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_17 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_18 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 4px; padding-inline-end: 4px; } #imCell_18 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_18 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_18 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_19 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 4px; padding-inline-end: 4px; } #imCell_19 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_19 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_19 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_20 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 4px; padding-inline-end: 4px; } #imCell_20 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_20 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_20 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_21 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 4px; padding-inline-end: 4px; } #imCell_21 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_21 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_21 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_22 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 4px; padding-inline-end: 4px; } #imCell_22 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_22 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_22 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_23 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 4px; padding-inline-end: 4px; } #imCell_23 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_23 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_23 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_24 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 4px; padding-inline-end: 4px; } #imCell_24 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_24 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_24 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_25 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 4px; padding-inline-end: 4px; } #imCell_25 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_25 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_25 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_26 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 4px; padding-inline-end: 4px; } #imCell_26 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_26 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_26 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_27 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 4px; padding-inline-end: 4px; } #imCell_27 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_27 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_27 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_28 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 4px; padding-inline-end: 4px; } #imCell_28 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_28 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_28 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_29 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 4px; padding-inline-end: 4px; } #imCell_29 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_29 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_29 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_30 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 4px; padding-inline-end: 4px; } #imCell_30 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_30 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_30 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_31 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 4px; padding-inline-end: 4px; } #imCell_31 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_31 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_31 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_32 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 4px; padding-inline-end: 4px; } #imCell_32 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_32 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_32 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_33 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 4px; padding-inline-end: 4px; } #imCell_33 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_33 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_33 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_34 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 4px; padding-inline-end: 4px; } #imCell_34 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_34 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_34 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_35 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 4px; padding-inline-end: 4px; } #imCell_35 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_35 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_35 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imCell_36 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 4px; padding-inline-end: 4px; } #imCell_36 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_36 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleBorders_36 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } } @media (max-width: 479.9px) { #imContent { padding-inline-start: 10px; padding-inline-end: 10px; } #imCell_1, #imCell_2, #imCell_3, #imCell_4, #imCell_5, #imCell_6, #imCell_7, #imCell_8, #imCell_9, #imCell_10, #imCell_11, #imCell_12, #imCell_13, #imCell_14, #imCell_15, #imCell_16, #imCell_17, #imCell_18, #imCell_19, #imCell_20, #imCell_21, #imCell_22, #imCell_23, #imCell_24, #imCell_25, #imCell_26, #imCell_27, #imCell_28, #imCell_29, #imCell_30, #imCell_31, #imCell_32, #imCell_33, #imCell_34, #imCell_35, #imCell_36, .imPageRow { margin-inline-start: -10px; margin-inline-end: -10px; } #imBreadcrumb { width: 100%; margin-inline-start: 0px; margin-inline-end: 0px; } #imCell_1 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 5px; padding-inline-end: 5px; } #imCell_1 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_01 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleGraphics_1 { box-sizing: border-box; } #imCell_2 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 5px; padding-inline-end: 5px; } #imCell_2 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_02 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleGraphics_2 { box-sizing: border-box; } #imCell_3 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 5px; padding-inline-end: 5px; } #imCell_3 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_03 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleGraphics_3 { box-sizing: border-box; } #imCell_4 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 5px; padding-inline-end: 5px; } #imCell_4 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_04 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleGraphics_4 { box-sizing: border-box; } #imCell_5 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 5px; padding-inline-end: 5px; } #imCell_5 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_05 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleGraphics_5 { box-sizing: border-box; } #imCell_6 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 5px; padding-inline-end: 5px; } #imCell_6 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_06 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleGraphics_6 { box-sizing: border-box; } #imCell_7 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 5px; padding-inline-end: 5px; } #imCell_7 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_07 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleGraphics_7 { box-sizing: border-box; } #imCell_8 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 5px; padding-inline-end: 5px; } #imCell_8 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_08 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleGraphics_8 { box-sizing: border-box; } #imCell_9 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 5px; padding-inline-end: 5px; } #imCell_9 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_09 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleGraphics_9 { box-sizing: border-box; } #imCell_10 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 5px; padding-inline-end: 5px; } #imCell_10 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_10 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleGraphics_10 { box-sizing: border-box; } #imCell_11 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 5px; padding-inline-end: 5px; } #imCell_11 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_11 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleGraphics_11 { box-sizing: border-box; } #imCell_12 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 5px; padding-inline-end: 5px; } #imCell_12 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_12 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleGraphics_12 { box-sizing: border-box; } #imCell_13 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 5px; padding-inline-end: 5px; } #imCell_13 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_13 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleGraphics_13 { box-sizing: border-box; } #imCell_14 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 5px; padding-inline-end: 5px; } #imCell_14 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_14 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleGraphics_14 { box-sizing: border-box; } #imCell_15 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 5px; padding-inline-end: 5px; } #imCell_15 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_15 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleGraphics_15 { box-sizing: border-box; } #imCell_16 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 5px; padding-inline-end: 5px; } #imCell_16 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_16 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleGraphics_16 { box-sizing: border-box; } #imCell_17 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 5px; padding-inline-end: 5px; } #imCell_17 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_17 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleGraphics_17 { box-sizing: border-box; } #imCell_18 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 5px; padding-inline-end: 5px; } #imCell_18 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_18 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleGraphics_18 { box-sizing: border-box; } #imCell_19 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 5px; padding-inline-end: 5px; } #imCell_19 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_19 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleGraphics_19 { box-sizing: border-box; } #imCell_20 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 5px; padding-inline-end: 5px; } #imCell_20 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_20 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleGraphics_20 { box-sizing: border-box; } #imCell_21 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 5px; padding-inline-end: 5px; } #imCell_21 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_21 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleGraphics_21 { box-sizing: border-box; } #imCell_22 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 5px; padding-inline-end: 5px; } #imCell_22 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_22 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleGraphics_22 { box-sizing: border-box; } #imCell_23 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 5px; padding-inline-end: 5px; } #imCell_23 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_23 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleGraphics_23 { box-sizing: border-box; } #imCell_24 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 5px; padding-inline-end: 5px; } #imCell_24 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_24 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleGraphics_24 { box-sizing: border-box; } #imCell_25 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 5px; padding-inline-end: 5px; } #imCell_25 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_25 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleGraphics_25 { box-sizing: border-box; } #imCell_26 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 5px; padding-inline-end: 5px; } #imCell_26 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_26 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleGraphics_26 { box-sizing: border-box; } #imCell_27 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 5px; padding-inline-end: 5px; } #imCell_27 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_27 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleGraphics_27 { box-sizing: border-box; } #imCell_28 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 5px; padding-inline-end: 5px; } #imCell_28 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_28 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleGraphics_28 { box-sizing: border-box; } #imCell_29 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 5px; padding-inline-end: 5px; } #imCell_29 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_29 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleGraphics_29 { box-sizing: border-box; } #imCell_30 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 5px; padding-inline-end: 5px; } #imCell_30 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_30 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleGraphics_30 { box-sizing: border-box; } #imCell_31 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 5px; padding-inline-end: 5px; } #imCell_31 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_31 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleGraphics_31 { box-sizing: border-box; } #imCell_32 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 5px; padding-inline-end: 5px; } #imCell_32 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_32 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleGraphics_32 { box-sizing: border-box; } #imCell_33 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 5px; padding-inline-end: 5px; } #imCell_33 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_33 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleGraphics_33 { box-sizing: border-box; } #imCell_34 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 5px; padding-inline-end: 5px; } #imCell_34 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_34 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleGraphics_34 { box-sizing: border-box; } #imCell_35 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 5px; padding-inline-end: 5px; } #imCell_35 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_35 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleGraphics_35 { box-sizing: border-box; } #imCell_36 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 5px; padding-inline-end: 5px; } #imCell_36 { grid-template-rows: [row-content] auto ; } #imHTMLObject_1726_36 { padding-top: 10px; padding-bottom: 10px; padding-inline-start: 10px; padding-inline-end: 10px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imCellStyleGraphics_36 { box-sizing: border-box; } } @media (min-width: 1200.0px) { #imHeader_imObjectImage_63_wrapper { display: none; } #imHeader_imObjectImage_63_wrapper img {-webkit-clip-path: inset(0 0 -44.538% 0);clip-path: inset(0 0 -44.538% 0);}#imHeader_imCell_63 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_63 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectImage_63 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_63 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_imObjectImage_07_wrapper { position: absolute; top: 5px; inset-inline-start: 1px; width: 118px; height: 80px; text-align: center; z-index: 1002; overflow: hidden; } #imHeader_imObjectImage_07_wrapper img {-webkit-clip-path: inset(0 0 -5.263% 0);clip-path: inset(0 0 -5.263% 0);}#imHeader_imCell_7 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_7 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectImage_07 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_7 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_imObjectButton_45_wrapper { position: absolute; top: 24px; inset-inline-start: 486px; width: 211px; height: 45px; text-align: center; z-index: 1003; } #imHeader_imCell_45 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_45 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectButton_45 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_45 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_imObjectButton_45_button { margin: 0px; } #imHeader_imObjectButton_51_wrapper { position: absolute; top: 24px; inset-inline-start: 774px; width: 244px; height: 45px; text-align: center; z-index: 1004; } #imHeader_imCell_51 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_51 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectButton_51 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_51 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_imObjectButton_51_button { margin: 0px; } #imHeader_imObjectButton_52_wrapper { display: none; } #imHeader_imCell_52 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_52 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectButton_52 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_52 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_imObjectButton_52_button { margin: 0px; } #imHeader_imObjectImage_58_wrapper { display: none; } #imHeader_imObjectImage_58_wrapper img {-webkit-clip-path: inset(0 0 -42.342% 0);clip-path: inset(0 0 -42.342% 0);}#imHeader_imCell_58 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_58 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectImage_58 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_58 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_imObjectImage_61_wrapper { display: none; } #imHeader_imObjectImage_61_wrapper img {-webkit-clip-path: inset(0 0 5.042% 0);clip-path: inset(0 0 5.042% 0);}#imHeader_imCell_61 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_61 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectImage_61 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_61 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_imObjectImage_62_wrapper { display: none; } #imHeader_imObjectImage_62_wrapper img {-webkit-clip-path: inset(0 0 6.612% 0);clip-path: inset(0 0 6.612% 0);}#imHeader_imCell_62 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_62 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectImage_62 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_62 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_imMenuObject_84_wrapper { position: absolute; top: 86px; inset-inline-start: 0px; width: 1201px; height: 103px; text-align: center; z-index: 1010; } #imHeader_imCell_84 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_84 { grid-template-rows: [row-content] auto ; } #imHeader_imMenuObject_84 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_84 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } /* Main menu background */ #imHeader_imMenuObject_84_container { border: solid; border-block-color: transparent transparent; border-inline-color: transparent transparent; border-width: 0px; border-radius: 0px; width: 100%; box-sizing: border-box; background-color: transparent; padding: 0px; display: inline-table;} #imHeader_imMenuObject_84_container > ul:after {content: '';display: table;clear: both; } /* Main menu button size and position */ #imHeader_imMenuObject_84_container > ul > li {position: relative;margin-inline-start: 0px; margin-top: 0px; display: inline-block; vertical-align: top; } #imHeader_imMenuObject_84_container > ul > li > .label-wrapper, #imHeader_imMenuObject_84_container > ul > li > div > .label-wrapper { display: block; overflow: hidden; width: 193px; height: 47px; padding-block: 0px; padding-inline: 1px; border-width: 0px; border-radius: 0px; } #imHeader_imMenuObject_84_container > ul > li > .label-wrapper:has(:focus-visible), #imHeader_imMenuObject_84_container > ul > li > div > .label-wrapper:has(:focus-visible) { overflow: visible; } #imHeader_imMenuObject_84 .hamburger-button {cursor: pointer; width: 47px; height: 47px; display: inline-block; vertical-align: top; padding: 0; box-sizing: content-box; border-width: 0px; border-radius: 0px; } #imHeader_imMenuObject_84 .hamburger-bar { margin: 5px auto; width: 65%; height: 5px; background-color: rgba(31, 112, 174, 1); display: block; } #imHeader_imMenuObject_84 .label-inner-wrapper, #imHeader_imMenuObject_84 .hamburger-button > div { display: table; width: 100%; height: 100%; position: relative; z-index: 1; } #imHeader_imMenuObject_84_container > ul > li .label, #imHeader_imMenuObject_84 .hamburger-button > div > div { display: table-cell; vertical-align: middle; } /* Main menu default button style */ #imHeader_imMenuObject_84_container > ul > li > .label-wrapper {background-color: transparent;background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imHeader_imMenuObject_84_container > ul > li > .label-wrapper .label, #imHeader_imMenuObject_84_container > ul > li > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(31, 112, 174, 1);font-weight: bold;} /* Hamburger button style */ #imHeader_imMenuObject_84 .hamburger-button {background-color: transparent;background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imHeader_imMenuObject_84 .hamburger-button .label, #imHeader_imMenuObject_84 .hamburger-button button {width: 100%;height: 100%;font-family: Arial;font-size: 11pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(31, 112, 174, 1);font-weight: normal;} /* Main menu current button style */ #imHeader_imMenuObject_84_container > ul > .imMnMnCurrent > .label-wrapper {background-color: transparent;background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imHeader_imMenuObject_84_container > ul > .imMnMnCurrent > .label-wrapper .label, #imHeader_imMenuObject_84_container > ul > .imMnMnCurrent > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(0, 152, 70, 1);font-weight: bold;} /* Main menu hover button style */ #imHeader_imMenuObject_84_container > ul > li.imPage > .label-wrapper.label-wrapper-over {background-color: transparent;background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imHeader_imMenuObject_84_container > ul > li.imPage > .label-wrapper.label-wrapper-over .label, #imHeader_imMenuObject_84_container > ul > li.imPage > .label-wrapper.label-wrapper-over button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(0, 152, 70, 1);font-weight: bold;} #imHeader_imMenuObject_84_container > ul > li.imPage > .label-wrapper.label-wrapper-over { position: absolute; top: 0; left: 0; z-index: -1; opacity: 0; transition: opacity 0.5s;}#imHeader_imMenuObject_84_container > ul > li.imPage > .label-wrapper.label-wrapper-over.animated {z-index: 1; opacity: 1;}#imHeader_imMenuObject_84_container > ul > li.imLevel > .label-wrapper.label-wrapper-over {background-color: transparent;background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imHeader_imMenuObject_84_container > ul > li.imLevel > .label-wrapper.label-wrapper-over .label, #imHeader_imMenuObject_84_container > ul > li.imLevel > .label-wrapper.label-wrapper-over button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(0, 152, 70, 1);font-weight: bold;} #imHeader_imMenuObject_84_container > ul > li.imLevel > .label-wrapper.label-wrapper-over { position: absolute; top: 0; left: 0; z-index: -1; opacity: 0; transition: opacity 0.5s;}#imHeader_imMenuObject_84_container > ul > li.imLevel > .label-wrapper.label-wrapper-over.animated {z-index: 1; opacity: 1;}/* Main menu separator button style */ #imHeader_imMenuObject_84_container > ul > .imMnMnSeparator > .label-wrapper {background-color: rgba(255, 255, 255, 1);background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imHeader_imMenuObject_84_container > ul > .imMnMnSeparator > .label-wrapper .label, #imHeader_imMenuObject_84_container > ul > .imMnMnSeparator > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(0, 0, 0, 1);font-weight: bold;} #imHeader_imMenuObject_84 .imLevel { cursor: default; } #imHeader_imMenuObject_84-menu-opened .imLevel { cursor: default; } #imHeader_imMenuObject_84 { text-align: center; } /* Level menu background */ #imHeader_imMenuObject_84 ul ul { border: solid; border-block-color: transparent transparent; border-inline-color: transparent transparent; border-width: 0px; border-radius: 0px; background-color: rgba(255, 255, 255, 1); } /* Level menu button size and position */ #imHeader_imMenuObject_84 ul ul li {position: relative;margin-bottom: 2px; display: inline-block; vertical-align: top; } /* Multiple column menu buttons position */ #imHeader_imMenuObject_84 .multiple-column > ul {max-width: 250px;} #imHeader_imMenuObject_84 ul ul li:last-child {margin-bottom: 0px; } #imHeader_imMenuObject_84 ul ul .label-wrapper { display: block; overflow: hidden; width: 244px; height: 60px; padding-block: 0px; padding-inline: 3px; } #imHeader_imMenuObject_84 ul ul .label-wrapper:has(:focus-visible) { overflow: visible; } #imHeader_imMenuObject_84 ul ul .label { display: table-cell; vertical-align: middle; } /* Level menu default button style */ #imHeader_imMenuObject_84 ul ul .label-wrapper {background-color: rgba(255, 255, 255, 1);background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imHeader_imMenuObject_84 ul ul .label-wrapper .label, #imHeader_imMenuObject_84 ul ul .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 11pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(31, 112, 174, 1);font-weight: bold;} /* Level menu hover button style */ #imHeader_imMenuObject_84 ul ul li.imLevel:hover > .label-wrapper {background-color: rgba(255, 255, 255, 1);background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imHeader_imMenuObject_84 ul ul li.imLevel:hover > .label-wrapper .label, #imHeader_imMenuObject_84 ul ul li.imLevel:hover > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 11pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(8, 156, 68, 1);font-weight: bold;} #imHeader_imMenuObject_84 ul ul li.imPage:hover > .label-wrapper {background-color: rgba(255, 255, 255, 1);background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imHeader_imMenuObject_84 ul ul li.imPage:hover > .label-wrapper .label, #imHeader_imMenuObject_84 ul ul li.imPage:hover > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 11pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(8, 156, 68, 1);font-weight: bold;} /* Level menu separator button style */ #imHeader_imMenuObject_84 ul ul .imMnMnSeparator > .label-wrapper {background-color: rgba(255, 255, 255, 1);background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imHeader_imMenuObject_84 ul ul .imMnMnSeparator > .label-wrapper .label, #imHeader_imMenuObject_84 ul ul .imMnMnSeparator > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 11pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(31, 112, 174, 1);font-weight: bold;} /* Level menu separation line style */ #imHeader_imMenuObject_84 ul ul li::after {display: block; position: relative; height: 0; content: ''; width: 100%; inset-inline-start: 0%; border-block-width: 1px 0px; border-inline-width: 0px; border-color: rgba(0, 152, 70, 1); border-style: solid; } /* Level menu current button style */ #imHeader_imMenuObject_84 .imMnMnCurrent > ul > .imMnMnCurrent > .label-wrapper {background-color: rgba(255, 255, 255, 1);background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imHeader_imMenuObject_84 .imMnMnCurrent > ul > .imMnMnCurrent > .label-wrapper .label, #imHeader_imMenuObject_84 .imMnMnCurrent > ul > .imMnMnCurrent > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 11pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(8, 156, 68, 1);font-weight: bold;} #imHeader_imMenuObject_84 ul ul { z-index: 2; }/* Level menu show/hide directives */ #imHeader_imMenuObject_84 .multiple-column {position: absolute; z-index: 2;inset-inline-start: 0px; } #imHeader_imMenuObject_84 .multiple-column > ul {position: static; display: inline-block;vertical-align: top;} #imHeader_imMenuObject_84 .multiple-column > ul > li {display: block;} #imHeader_imMenuObject_84_container > ul > li > ul {position: absolute; top: 47px; } #imHeader_imMenuObject_84_container > ul > li > ul.open-bottom { inset-inline-start: 0px; } #imHeader_imMenuObject_84_container > ul > li > ul.open-left { inset-inline-end: 195px; } #imHeader_imMenuObject_84_container > ul > li > ul.open-right { inset-inline-start: 195px; } #imHeader_imMenuObject_84_container > ul > li > ul ul, #imHeader_imMenuObject_84_container .multiple-column > ul > li ul {position: absolute; top: 0; } #imHeader_imMenuObject_84_container > ul > li > ul ul.open-left, #imHeader_imMenuObject_84_container .multiple-column > ul > li ul.open-left{ inset-inline-end: 250px; } #imHeader_imMenuObject_84_container > ul > li > ul ul.open-right, #imHeader_imMenuObject_84_container .multiple-column > ul > li ul.open-right{ inset-inline-start: 250px; } #imHeader_imMenuObject_84 ul > li > ul, #imHeader_imMenuObject_84 .multiple-column { display: none; } #imHeader_imMenuObject_84_container > ul > li:nth-child(6n+1) { margin-inline-start: 0px; clear: left; clear: inline-start; } #imHeader_imMenuObject_84_container > ul > li:nth-child(n+7) { margin-top: 0px; } #imHeader_imMenuObject_84-menu-opened { display: none; } #imHeader_imMenuObject_84 .hamburger-component { display: none; } #imHeader_pluginAppObj_85_wrapper { position: absolute; top: 21px; inset-inline-start: 149px; width: 238px; height: 41px; text-align: center; z-index: 1011; } #imHeader_imCell_85 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_85 { grid-template-rows: [row-content] auto ; } #imHeader_pluginAppObj_85 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_85 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_imObjectImage_86_wrapper { position: absolute; top: 30px; inset-inline-start: 1138px; width: 24px; height: 31px; text-align: center; z-index: 1012; overflow: hidden; } #imHeader_imObjectImage_86_wrapper img {-webkit-clip-path: inset(0 0 -29.167% 0);clip-path: inset(0 0 -29.167% 0);}#imHeader_imCell_86 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_86 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectImage_86 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_86 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_pluginAppObj_87_wrapper { display: none; } #imHeader_imCell_87 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_87 { grid-template-rows: [row-content] auto ; } #imHeader_pluginAppObj_87 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_87 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_pluginAppObj_88_wrapper { display: none; } #imHeader_imCell_88 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_88 { grid-template-rows: [row-content] auto ; } #imHeader_pluginAppObj_88 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_88 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_pluginAppObj_89_wrapper { display: none; } #imHeader_imCell_89 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_89 { grid-template-rows: [row-content] auto ; } #imHeader_pluginAppObj_89 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_89 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_pluginAppObj_90_wrapper { display: none; } #imHeader_imCell_90 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_90 { grid-template-rows: [row-content] auto ; } #imHeader_pluginAppObj_90 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_90 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_pluginAppObj_91_wrapper { display: none; } #imHeader_imCell_91 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_91 { grid-template-rows: [row-content] auto ; } #imHeader_pluginAppObj_91 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_91 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_pluginAppObj_92_wrapper { display: none; } #imHeader_imCell_92 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_92 { grid-template-rows: [row-content] auto ; } #imHeader_pluginAppObj_92 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_92 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_imObjectImage_93_wrapper { display: none; } #imHeader_imObjectImage_93_wrapper img {-webkit-clip-path: inset(0 0 -52.941% 0);clip-path: inset(0 0 -52.941% 0);}#imHeader_imCell_93 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_93 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectImage_93 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_93 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_imObjectButton_94_wrapper { display: none; } #imHeader_imCell_94 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_94 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectButton_94 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_94 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_imObjectButton_94_button { margin: 0px; } #imHeader_imObjectButton_95_wrapper { display: none; } #imHeader_imCell_95 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_95 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectButton_95 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_95 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_imObjectButton_95_button { margin: 0px; } } @media (max-width: 1199.9px) and (min-width: 720.0px) { #imHeader_imObjectImage_63_wrapper { display: none; } #imHeader_imObjectImage_63_wrapper img {-webkit-clip-path: inset(0 0 -51.754% 0);clip-path: inset(0 0 -51.754% 0);}#imHeader_imCell_63 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_63 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectImage_63 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_63 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_imObjectImage_07_wrapper { display: none; } #imHeader_imObjectImage_07_wrapper img {-webkit-clip-path: inset(0 0 -5.556% 0);clip-path: inset(0 0 -5.556% 0);}#imHeader_imCell_7 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_7 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectImage_07 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_7 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_imObjectButton_45_wrapper { display: none; } #imHeader_imCell_45 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_45 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectButton_45 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_45 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_imObjectButton_45_button { margin: 0px; } #imHeader_imObjectButton_51_wrapper { display: none; } #imHeader_imCell_51 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_51 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectButton_51 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_51 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_imObjectButton_51_button { margin: 0px; } #imHeader_imObjectButton_52_wrapper { display: none; } #imHeader_imCell_52 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_52 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectButton_52 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_52 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_imObjectButton_52_button { margin: 0px; } #imHeader_imObjectImage_58_wrapper { display: none; } #imHeader_imObjectImage_58_wrapper img {-webkit-clip-path: inset(0 0 -17.021% 0);clip-path: inset(0 0 -17.021% 0);}#imHeader_imCell_58 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_58 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectImage_58 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_58 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_imObjectImage_61_wrapper { position: absolute; top: 2px; inset-inline-start: 2px; width: 112px; height: 75px; text-align: center; z-index: 1007; overflow: hidden; } #imHeader_imObjectImage_61_wrapper img {-webkit-clip-path: inset(0 0 -2.74% 0);clip-path: inset(0 0 -2.74% 0);}#imHeader_imCell_61 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_61 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectImage_61 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_61 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_imObjectImage_62_wrapper { display: none; } #imHeader_imObjectImage_62_wrapper img {-webkit-clip-path: inset(0 0 1.724% 0);clip-path: inset(0 0 1.724% 0);}#imHeader_imCell_62 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_62 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectImage_62 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_62 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_imMenuObject_84_wrapper { position: absolute; top: 17px; inset-inline-start: 670px; width: 48px; height: 49px; text-align: center; z-index: 1010; } #imHeader_imCell_84 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_84 { grid-template-rows: [row-content] auto ; } #imHeader_imMenuObject_84 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_84 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } /* Main menu background */ #imHeader_imMenuObject_84_container { border: solid; border-block-color: transparent transparent; border-inline-color: transparent transparent; border-width: 0px; border-radius: 0px; width: 100%; box-sizing: border-box; background-color: transparent; padding: 0px; display: inline-table;} #imHeader_imMenuObject_84_container > ul:after {content: '';display: table;clear: both; } /* Main menu button size and position */ #imHeader_imMenuObject_84_container > ul > li {position: relative;margin-inline-start: 0px; margin-top: 0px; display: inline-block; vertical-align: top; } #imHeader_imMenuObject_84_container > ul > li > .label-wrapper, #imHeader_imMenuObject_84_container > ul > li > div > .label-wrapper { display: block; overflow: hidden; width: 193px; height: 47px; padding-block: 0px; padding-inline: 1px; border-width: 0px; border-radius: 0px; } #imHeader_imMenuObject_84_container > ul > li > .label-wrapper:has(:focus-visible), #imHeader_imMenuObject_84_container > ul > li > div > .label-wrapper:has(:focus-visible) { overflow: visible; } #imHeader_imMenuObject_84 .hamburger-button {cursor: pointer; width: 47px; height: 47px; display: inline-block; vertical-align: top; padding: 0; box-sizing: content-box; border-width: 0px; border-radius: 0px; } #imHeader_imMenuObject_84 .hamburger-bar { margin: 5px auto; width: 65%; height: 5px; background-color: rgba(31, 112, 174, 1); display: block; } #imHeader_imMenuObject_84 .label-inner-wrapper, #imHeader_imMenuObject_84 .hamburger-button > div { display: table; width: 100%; height: 100%; position: relative; z-index: 1; } #imHeader_imMenuObject_84_container > ul > li .label, #imHeader_imMenuObject_84 .hamburger-button > div > div { display: table-cell; vertical-align: middle; } /* Main menu default button style */ #imHeader_imMenuObject_84_container > ul > li > .label-wrapper {background-color: transparent;background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imHeader_imMenuObject_84_container > ul > li > .label-wrapper .label, #imHeader_imMenuObject_84_container > ul > li > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(31, 112, 174, 1);font-weight: bold;} /* Hamburger button style */ #imHeader_imMenuObject_84 .hamburger-button {background-color: transparent;background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imHeader_imMenuObject_84 .hamburger-button .label, #imHeader_imMenuObject_84 .hamburger-button button {width: 100%;height: 100%;font-family: Arial;font-size: 11pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(31, 112, 174, 1);font-weight: normal;} /* Main menu current button style */ #imHeader_imMenuObject_84_container > ul > .imMnMnCurrent > .label-wrapper {background-color: transparent;background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imHeader_imMenuObject_84_container > ul > .imMnMnCurrent > .label-wrapper .label, #imHeader_imMenuObject_84_container > ul > .imMnMnCurrent > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(0, 152, 70, 1);font-weight: bold;} /* Main menu hover button style */ #imHeader_imMenuObject_84_container > ul > li.imPage > .label-wrapper.label-wrapper-over {background-color: transparent;background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imHeader_imMenuObject_84_container > ul > li.imPage > .label-wrapper.label-wrapper-over .label, #imHeader_imMenuObject_84_container > ul > li.imPage > .label-wrapper.label-wrapper-over button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(0, 152, 70, 1);font-weight: bold;} #imHeader_imMenuObject_84_container > ul > li.imPage > .label-wrapper.label-wrapper-over { position: absolute; top: 0; left: 0; z-index: -1; opacity: 0; transition: opacity 0.5s;}#imHeader_imMenuObject_84_container > ul > li.imPage > .label-wrapper.label-wrapper-over.animated {z-index: 1; opacity: 1;}#imHeader_imMenuObject_84_container > ul > li.imLevel > .label-wrapper.label-wrapper-over {background-color: transparent;background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imHeader_imMenuObject_84_container > ul > li.imLevel > .label-wrapper.label-wrapper-over .label, #imHeader_imMenuObject_84_container > ul > li.imLevel > .label-wrapper.label-wrapper-over button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(0, 152, 70, 1);font-weight: bold;} #imHeader_imMenuObject_84_container > ul > li.imLevel > .label-wrapper.label-wrapper-over { position: absolute; top: 0; left: 0; z-index: -1; opacity: 0; transition: opacity 0.5s;}#imHeader_imMenuObject_84_container > ul > li.imLevel > .label-wrapper.label-wrapper-over.animated {z-index: 1; opacity: 1;}/* Main menu separator button style */ #imHeader_imMenuObject_84_container > ul > .imMnMnSeparator > .label-wrapper {background-color: rgba(255, 255, 255, 1);background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imHeader_imMenuObject_84_container > ul > .imMnMnSeparator > .label-wrapper .label, #imHeader_imMenuObject_84_container > ul > .imMnMnSeparator > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(0, 0, 0, 1);font-weight: bold;} #imHeader_imMenuObject_84 .imLevel { cursor: default; } #imHeader_imMenuObject_84-menu-opened .imLevel { cursor: default; } #imHeader_imMenuObject_84 { text-align: center; } #imHeader_imMenuObject_84 .hidden { display: none; } #imHeader_imMenuObject_84-menu-opened { overflow: visible; z-index: 10402; } #imHeader_imMenuObject_84-menu-opened ul ul { display: none; } #imHeader_imMenuObject_84-menu-opened li > div { display: none; } #imHeader_imMenuObject_84-menu-opened #imHeader_imMenuObject_84_container-menu-opened div > ul { display: block; } #imHeader_imMenuObject_84-menu-opened #imHeader_imMenuObject_84_container-menu-opened > ul { position: absolute; inset-inline-end: 0px; inset-inline-start: auto; top: 40px; background-color: rgba(255, 255, 255, 1); overflow-x: hidden; overflow-y: auto; height: calc(100% - 40px); width: 100%; } #imHeader_imMenuObject_84-menu-opened .hamburger-menu-close-button { display: block; font-family: Arial; font-size: 30px; text-align: end; padding-block: 5px; padding-inline: 10px; color: rgba(31, 112, 174, 1); } #imHeader_imMenuObject_84-menu-opened .hamburger-menu-close-button span { cursor: pointer; } #imHeader_imMenuObject_84-menu-opened { position:fixed; top: 0; bottom: 0; inset-inline-end: 0px; width: 310px; border: solid; border-block-color: transparent transparent; border-inline-color: transparent transparent; border-width: 0px; border-radius: 0px; ; } #imPageExtContainer:after{ position: fixed; top: 0; inset-inline-end: 0px; width: 0; height: 0; content: ''; opacity: 0; transition: opacity 1000ms; z-index: 10401;} .menu-imHeader_imMenuObject_84-opened #imPageExtContainer:after{ width: 100%; height: 100%; background-color: rgba(255, 255, 255, 1); opacity: 0.6;} .menu-imHeader_imMenuObject_84-towards-closing #imPageExtContainer:after { width: 100%; height: 100%; background-color: transparent; opacity: 0.6; transition: background-color 1000ms linear, opacity;} #imHeader_imMenuObject_84 .hidden { display: none; } /* Responsive menu button size and position */ #imHeader_imMenuObject_84-menu-opened li {position: relative;margin-bottom: 5px; display: inline-block; vertical-align: top; } #imHeader_imMenuObject_84-menu-opened li:last-child {margin-bottom: 0px; } #imHeader_imMenuObject_84-menu-opened .label-wrapper { display: block; overflow: hidden; position: relative; width: 292px; height: 71px; padding-block: 0px; padding-inline: 9px; } #imHeader_imMenuObject_84-menu-opened .label-inner-wrapper { display: table; width: 100%; height: 100%; z-index: 1; position: relative; } #imHeader_imMenuObject_84-menu-opened .label { display: table-cell; vertical-align: middle; } #imHeader_imMenuObject_84-menu-opened .hamburger-menu-background { position: absolute;display: block;top: 0;bottom: 0;width: 310px;inset-inline-end: 0px; inset-inline-start: auto; background-color: rgba(255, 255, 255, 1);transition: left 500ms, right 500ms, opacity 500ms;} /* Responsive menu default button style */ #imHeader_imMenuObject_84-menu-opened ul > li > .label-wrapper {background-color: transparent;background-image: none;} #imHeader_imMenuObject_84-menu-opened ul > li > .label-wrapper .label, #imHeader_imMenuObject_84-menu-opened ul > li > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(31, 112, 174, 1);font-weight: bold;} #imHeader_imMenuObject_84-menu-opened ul ul > li > .label-wrapper {background-color: transparent;background-image: none;} #imHeader_imMenuObject_84-menu-opened ul ul > li > .label-wrapper .label, #imHeader_imMenuObject_84-menu-opened ul ul > li > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(31, 112, 174, 1);font-weight: bold;} #imHeader_imMenuObject_84-menu-opened ul ul ul > li > .label-wrapper {background-color: transparent;background-image: none;} #imHeader_imMenuObject_84-menu-opened ul ul ul > li > .label-wrapper .label, #imHeader_imMenuObject_84-menu-opened ul ul ul > li > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(31, 112, 174, 1);font-weight: bold;} #imHeader_imMenuObject_84-menu-opened ul ul ul ul > li > .label-wrapper {background-color: transparent;background-image: none;} #imHeader_imMenuObject_84-menu-opened ul ul ul ul > li > .label-wrapper .label, #imHeader_imMenuObject_84-menu-opened ul ul ul ul > li > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(31, 112, 174, 1);font-weight: bold;} /* Responsive menu hover button style */ #imHeader_imMenuObject_84-menu-opened ul > li:hover:not(.imMnMnSeparator) > .label-wrapper {background-color: transparent;background-image: none;} #imHeader_imMenuObject_84-menu-opened ul > li:hover:not(.imMnMnSeparator) > .label-wrapper .label, #imHeader_imMenuObject_84-menu-opened ul > li:hover:not(.imMnMnSeparator) > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(0, 189, 102, 1);font-weight: bold;} /* Responsive menu current button style */ #imHeader_imMenuObject_84-menu-opened #imHeader_imMenuObject_84_container-menu-opened > ul > .imMnMnCurrent > .label-wrapper {background-color: transparent;background-image: none;} #imHeader_imMenuObject_84-menu-opened #imHeader_imMenuObject_84_container-menu-opened > ul > .imMnMnCurrent > .label-wrapper .label, #imHeader_imMenuObject_84-menu-opened #imHeader_imMenuObject_84_container-menu-opened > ul > .imMnMnCurrent > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(0, 189, 102, 1);font-weight: bold;} #imHeader_imMenuObject_84-menu-opened .imMnMnCurrent > ul > .imMnMnCurrent > .label-wrapper {background-color: transparent;background-image: none;} #imHeader_imMenuObject_84-menu-opened .imMnMnCurrent > ul > .imMnMnCurrent > .label-wrapper .label, #imHeader_imMenuObject_84-menu-opened .imMnMnCurrent > ul > .imMnMnCurrent > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(0, 189, 102, 1);font-weight: bold;} /* Responsive menu separator button style */ #imHeader_imMenuObject_84-menu-opened ul > .imMnMnSeparator > .label-wrapper {background-color: transparent;background-image: none;} #imHeader_imMenuObject_84-menu-opened ul > .imMnMnSeparator > .label-wrapper .label, #imHeader_imMenuObject_84-menu-opened ul > .imMnMnSeparator > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(31, 112, 174, 1);font-weight: bold;} /* Responsive menu separation line style */ #imHeader_imMenuObject_84-menu-opened ul li::after {display: block; position: relative; height: 0; content: ''; width: 100%; inset-inline-start: 0%; border-block-width: 1px 0px; border-inline-width: 0px; border-color: rgba(8, 156, 68, 1); border-style: solid; } #imHeader_imMenuObject_84-menu-opened { transform: translate3d(310px, 0 ,0); transition: transform 1000ms;} #imHeader_imMenuObject_84-menu-opened.animated { transform: translate3d(0, 0, 0);} #imHeader_pluginAppObj_85_wrapper { display: none; } #imHeader_imCell_85 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_85 { grid-template-rows: [row-content] auto ; } #imHeader_pluginAppObj_85 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_85 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_imObjectImage_86_wrapper { position: absolute; top: 27px; inset-inline-start: 615px; width: 24px; height: 31px; text-align: center; z-index: 1012; overflow: hidden; } #imHeader_imObjectImage_86_wrapper img {-webkit-clip-path: inset(0 0 -29.167% 0);clip-path: inset(0 0 -29.167% 0);}#imHeader_imCell_86 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_86 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectImage_86 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_86 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_pluginAppObj_87_wrapper { position: absolute; top: 13px; inset-inline-start: 123px; width: 228px; height: 47px; text-align: center; z-index: 1013; } #imHeader_imCell_87 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_87 { grid-template-rows: [row-content] auto ; } #imHeader_pluginAppObj_87 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_87 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_pluginAppObj_88_wrapper { position: absolute; top: 17px; inset-inline-start: 517px; width: 43px; height: 39px; text-align: center; z-index: 1014; } #imHeader_imCell_88 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_88 { grid-template-rows: [row-content] auto ; } #imHeader_pluginAppObj_88 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_88 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_pluginAppObj_89_wrapper { position: absolute; top: 17px; inset-inline-start: 457px; width: 43px; height: 39px; text-align: center; z-index: 1015; } #imHeader_imCell_89 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_89 { grid-template-rows: [row-content] auto ; } #imHeader_pluginAppObj_89 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_89 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_pluginAppObj_90_wrapper { display: none; } #imHeader_imCell_90 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_90 { grid-template-rows: [row-content] auto ; } #imHeader_pluginAppObj_90 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_90 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_pluginAppObj_91_wrapper { display: none; } #imHeader_imCell_91 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_91 { grid-template-rows: [row-content] auto ; } #imHeader_pluginAppObj_91 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_91 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_pluginAppObj_92_wrapper { display: none; } #imHeader_imCell_92 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_92 { grid-template-rows: [row-content] auto ; } #imHeader_pluginAppObj_92 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_92 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_imObjectImage_93_wrapper { display: none; } #imHeader_imObjectImage_93_wrapper img {-webkit-clip-path: inset(0 0 -52.941% 0);clip-path: inset(0 0 -52.941% 0);}#imHeader_imCell_93 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_93 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectImage_93 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_93 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_imObjectButton_94_wrapper { display: none; } #imHeader_imCell_94 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_94 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectButton_94 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_94 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_imObjectButton_94_button { margin: 0px; } #imHeader_imObjectButton_95_wrapper { display: none; } #imHeader_imCell_95 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_95 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectButton_95 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_95 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_imObjectButton_95_button { margin: 0px; } } @media (max-width: 719.9px) and (min-width: 480.0px) { #imHeader_imObjectImage_63_wrapper { display: none; } #imHeader_imObjectImage_63_wrapper img {-webkit-clip-path: inset(0 0 -52.586% 0);clip-path: inset(0 0 -52.586% 0);}#imHeader_imCell_63 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_63 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectImage_63 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_63 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_imObjectImage_07_wrapper { display: none; } #imHeader_imObjectImage_07_wrapper img {-webkit-clip-path: inset(0 0 -7.273% 0);clip-path: inset(0 0 -7.273% 0);}#imHeader_imCell_7 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_7 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectImage_07 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_7 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_imObjectButton_45_wrapper { display: none; } #imHeader_imCell_45 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_45 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectButton_45 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_45 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_imObjectButton_45_button { margin: 0px; } #imHeader_imObjectButton_51_wrapper { display: none; } #imHeader_imCell_51 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_51 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectButton_51 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_51 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_imObjectButton_51_button { margin: 0px; } #imHeader_imObjectButton_52_wrapper { display: none; } #imHeader_imCell_52 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_52 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectButton_52 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_52 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_imObjectButton_52_button { margin: 0px; } #imHeader_imObjectImage_58_wrapper { display: none; } #imHeader_imObjectImage_58_wrapper img {-webkit-clip-path: inset(0 0 -47.297% 0);clip-path: inset(0 0 -47.297% 0);}#imHeader_imCell_58 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_58 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectImage_58 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_58 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_imObjectImage_61_wrapper { display: none; } #imHeader_imObjectImage_61_wrapper img {-webkit-clip-path: inset(0 0 -1.724% 0);clip-path: inset(0 0 -1.724% 0);}#imHeader_imCell_61 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_61 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectImage_61 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_61 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_imObjectImage_62_wrapper { position: absolute; top: 46px; inset-inline-start: 3px; width: 95px; height: 65px; text-align: center; z-index: 1010; overflow: hidden; } #imHeader_imObjectImage_62_wrapper img {-webkit-clip-path: inset(0 0 -4.839% 0);clip-path: inset(0 0 -4.839% 0);}#imHeader_imCell_62 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_62 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectImage_62 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_62 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_imMenuObject_84_wrapper { position: absolute; top: 62px; inset-inline-start: 422px; width: 48px; height: 46px; text-align: center; z-index: 1012; } #imHeader_imCell_84 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_84 { grid-template-rows: [row-content] auto ; } #imHeader_imMenuObject_84 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_84 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } /* Main menu background */ #imHeader_imMenuObject_84_container { border: solid; border-block-color: transparent transparent; border-inline-color: transparent transparent; border-width: 0px; border-radius: 0px; width: 100%; box-sizing: border-box; background-color: transparent; padding: 0px; display: inline-table;} #imHeader_imMenuObject_84_container > ul:after {content: '';display: table;clear: both; } /* Main menu button size and position */ #imHeader_imMenuObject_84_container > ul > li {position: relative;margin-inline-start: 0px; margin-top: 0px; display: inline-block; vertical-align: top; } #imHeader_imMenuObject_84_container > ul > li > .label-wrapper, #imHeader_imMenuObject_84_container > ul > li > div > .label-wrapper { display: block; overflow: hidden; width: 193px; height: 47px; padding-block: 0px; padding-inline: 1px; border-width: 0px; border-radius: 0px; } #imHeader_imMenuObject_84_container > ul > li > .label-wrapper:has(:focus-visible), #imHeader_imMenuObject_84_container > ul > li > div > .label-wrapper:has(:focus-visible) { overflow: visible; } #imHeader_imMenuObject_84 .hamburger-button {cursor: pointer; width: 47px; height: 47px; display: inline-block; vertical-align: top; padding: 0; box-sizing: content-box; border-width: 0px; border-radius: 0px; } #imHeader_imMenuObject_84 .hamburger-bar { margin: 5px auto; width: 65%; height: 5px; background-color: rgba(31, 112, 174, 1); display: block; } #imHeader_imMenuObject_84 .label-inner-wrapper, #imHeader_imMenuObject_84 .hamburger-button > div { display: table; width: 100%; height: 100%; position: relative; z-index: 1; } #imHeader_imMenuObject_84_container > ul > li .label, #imHeader_imMenuObject_84 .hamburger-button > div > div { display: table-cell; vertical-align: middle; } /* Main menu default button style */ #imHeader_imMenuObject_84_container > ul > li > .label-wrapper {background-color: transparent;background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imHeader_imMenuObject_84_container > ul > li > .label-wrapper .label, #imHeader_imMenuObject_84_container > ul > li > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(31, 112, 174, 1);font-weight: bold;} /* Hamburger button style */ #imHeader_imMenuObject_84 .hamburger-button {background-color: transparent;background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imHeader_imMenuObject_84 .hamburger-button .label, #imHeader_imMenuObject_84 .hamburger-button button {width: 100%;height: 100%;font-family: Arial;font-size: 11pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(31, 112, 174, 1);font-weight: normal;} /* Main menu current button style */ #imHeader_imMenuObject_84_container > ul > .imMnMnCurrent > .label-wrapper {background-color: transparent;background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imHeader_imMenuObject_84_container > ul > .imMnMnCurrent > .label-wrapper .label, #imHeader_imMenuObject_84_container > ul > .imMnMnCurrent > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(0, 152, 70, 1);font-weight: bold;} /* Main menu hover button style */ #imHeader_imMenuObject_84_container > ul > li.imPage > .label-wrapper.label-wrapper-over {background-color: transparent;background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imHeader_imMenuObject_84_container > ul > li.imPage > .label-wrapper.label-wrapper-over .label, #imHeader_imMenuObject_84_container > ul > li.imPage > .label-wrapper.label-wrapper-over button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(0, 152, 70, 1);font-weight: bold;} #imHeader_imMenuObject_84_container > ul > li.imPage > .label-wrapper.label-wrapper-over { position: absolute; top: 0; left: 0; z-index: -1; opacity: 0; transition: opacity 0.5s;}#imHeader_imMenuObject_84_container > ul > li.imPage > .label-wrapper.label-wrapper-over.animated {z-index: 1; opacity: 1;}#imHeader_imMenuObject_84_container > ul > li.imLevel > .label-wrapper.label-wrapper-over {background-color: transparent;background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imHeader_imMenuObject_84_container > ul > li.imLevel > .label-wrapper.label-wrapper-over .label, #imHeader_imMenuObject_84_container > ul > li.imLevel > .label-wrapper.label-wrapper-over button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(0, 152, 70, 1);font-weight: bold;} #imHeader_imMenuObject_84_container > ul > li.imLevel > .label-wrapper.label-wrapper-over { position: absolute; top: 0; left: 0; z-index: -1; opacity: 0; transition: opacity 0.5s;}#imHeader_imMenuObject_84_container > ul > li.imLevel > .label-wrapper.label-wrapper-over.animated {z-index: 1; opacity: 1;}/* Main menu separator button style */ #imHeader_imMenuObject_84_container > ul > .imMnMnSeparator > .label-wrapper {background-color: rgba(255, 255, 255, 1);background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imHeader_imMenuObject_84_container > ul > .imMnMnSeparator > .label-wrapper .label, #imHeader_imMenuObject_84_container > ul > .imMnMnSeparator > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(0, 0, 0, 1);font-weight: bold;} #imHeader_imMenuObject_84 .imLevel { cursor: default; } #imHeader_imMenuObject_84-menu-opened .imLevel { cursor: default; } #imHeader_imMenuObject_84 { text-align: center; } #imHeader_imMenuObject_84 .hidden { display: none; } #imHeader_imMenuObject_84-menu-opened { overflow: visible; z-index: 10402; } #imHeader_imMenuObject_84-menu-opened ul ul { display: none; } #imHeader_imMenuObject_84-menu-opened li > div { display: none; } #imHeader_imMenuObject_84-menu-opened #imHeader_imMenuObject_84_container-menu-opened div > ul { display: block; } #imHeader_imMenuObject_84-menu-opened #imHeader_imMenuObject_84_container-menu-opened > ul { position: absolute; inset-inline-end: 0px; inset-inline-start: auto; top: 40px; background-color: rgba(255, 255, 255, 1); overflow-x: hidden; overflow-y: auto; height: calc(100% - 40px); width: 100%; } #imHeader_imMenuObject_84-menu-opened .hamburger-menu-close-button { display: block; font-family: Arial; font-size: 30px; text-align: end; padding-block: 5px; padding-inline: 10px; color: rgba(31, 112, 174, 1); } #imHeader_imMenuObject_84-menu-opened .hamburger-menu-close-button span { cursor: pointer; } #imHeader_imMenuObject_84-menu-opened { position:fixed; top: 0; bottom: 0; inset-inline-end: 0px; width: 310px; border: solid; border-block-color: transparent transparent; border-inline-color: transparent transparent; border-width: 0px; border-radius: 0px; ; } #imPageExtContainer:after{ position: fixed; top: 0; inset-inline-end: 0px; width: 0; height: 0; content: ''; opacity: 0; transition: opacity 1000ms; z-index: 10401;} .menu-imHeader_imMenuObject_84-opened #imPageExtContainer:after{ width: 100%; height: 100%; background-color: rgba(255, 255, 255, 1); opacity: 0.6;} .menu-imHeader_imMenuObject_84-towards-closing #imPageExtContainer:after { width: 100%; height: 100%; background-color: transparent; opacity: 0.6; transition: background-color 1000ms linear, opacity;} #imHeader_imMenuObject_84 .hidden { display: none; } /* Responsive menu button size and position */ #imHeader_imMenuObject_84-menu-opened li {position: relative;margin-bottom: 5px; display: inline-block; vertical-align: top; } #imHeader_imMenuObject_84-menu-opened li:last-child {margin-bottom: 0px; } #imHeader_imMenuObject_84-menu-opened .label-wrapper { display: block; overflow: hidden; position: relative; width: 292px; height: 71px; padding-block: 0px; padding-inline: 9px; } #imHeader_imMenuObject_84-menu-opened .label-inner-wrapper { display: table; width: 100%; height: 100%; z-index: 1; position: relative; } #imHeader_imMenuObject_84-menu-opened .label { display: table-cell; vertical-align: middle; } #imHeader_imMenuObject_84-menu-opened .hamburger-menu-background { position: absolute;display: block;top: 0;bottom: 0;width: 310px;inset-inline-end: 0px; inset-inline-start: auto; background-color: rgba(255, 255, 255, 1);transition: left 500ms, right 500ms, opacity 500ms;} /* Responsive menu default button style */ #imHeader_imMenuObject_84-menu-opened ul > li > .label-wrapper {background-color: transparent;background-image: none;} #imHeader_imMenuObject_84-menu-opened ul > li > .label-wrapper .label, #imHeader_imMenuObject_84-menu-opened ul > li > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(31, 112, 174, 1);font-weight: bold;} #imHeader_imMenuObject_84-menu-opened ul ul > li > .label-wrapper {background-color: transparent;background-image: none;} #imHeader_imMenuObject_84-menu-opened ul ul > li > .label-wrapper .label, #imHeader_imMenuObject_84-menu-opened ul ul > li > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(31, 112, 174, 1);font-weight: bold;} #imHeader_imMenuObject_84-menu-opened ul ul ul > li > .label-wrapper {background-color: transparent;background-image: none;} #imHeader_imMenuObject_84-menu-opened ul ul ul > li > .label-wrapper .label, #imHeader_imMenuObject_84-menu-opened ul ul ul > li > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(31, 112, 174, 1);font-weight: bold;} #imHeader_imMenuObject_84-menu-opened ul ul ul ul > li > .label-wrapper {background-color: transparent;background-image: none;} #imHeader_imMenuObject_84-menu-opened ul ul ul ul > li > .label-wrapper .label, #imHeader_imMenuObject_84-menu-opened ul ul ul ul > li > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(31, 112, 174, 1);font-weight: bold;} /* Responsive menu hover button style */ #imHeader_imMenuObject_84-menu-opened ul > li:hover:not(.imMnMnSeparator) > .label-wrapper {background-color: transparent;background-image: none;} #imHeader_imMenuObject_84-menu-opened ul > li:hover:not(.imMnMnSeparator) > .label-wrapper .label, #imHeader_imMenuObject_84-menu-opened ul > li:hover:not(.imMnMnSeparator) > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(0, 189, 102, 1);font-weight: bold;} /* Responsive menu current button style */ #imHeader_imMenuObject_84-menu-opened #imHeader_imMenuObject_84_container-menu-opened > ul > .imMnMnCurrent > .label-wrapper {background-color: transparent;background-image: none;} #imHeader_imMenuObject_84-menu-opened #imHeader_imMenuObject_84_container-menu-opened > ul > .imMnMnCurrent > .label-wrapper .label, #imHeader_imMenuObject_84-menu-opened #imHeader_imMenuObject_84_container-menu-opened > ul > .imMnMnCurrent > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(0, 189, 102, 1);font-weight: bold;} #imHeader_imMenuObject_84-menu-opened .imMnMnCurrent > ul > .imMnMnCurrent > .label-wrapper {background-color: transparent;background-image: none;} #imHeader_imMenuObject_84-menu-opened .imMnMnCurrent > ul > .imMnMnCurrent > .label-wrapper .label, #imHeader_imMenuObject_84-menu-opened .imMnMnCurrent > ul > .imMnMnCurrent > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(0, 189, 102, 1);font-weight: bold;} /* Responsive menu separator button style */ #imHeader_imMenuObject_84-menu-opened ul > .imMnMnSeparator > .label-wrapper {background-color: transparent;background-image: none;} #imHeader_imMenuObject_84-menu-opened ul > .imMnMnSeparator > .label-wrapper .label, #imHeader_imMenuObject_84-menu-opened ul > .imMnMnSeparator > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(31, 112, 174, 1);font-weight: bold;} /* Responsive menu separation line style */ #imHeader_imMenuObject_84-menu-opened ul li::after {display: block; position: relative; height: 0; content: ''; width: 100%; inset-inline-start: 0%; border-block-width: 1px 0px; border-inline-width: 0px; border-color: rgba(8, 156, 68, 1); border-style: solid; } #imHeader_imMenuObject_84-menu-opened { transform: translate3d(310px, 0 ,0); transition: transform 1000ms;} #imHeader_imMenuObject_84-menu-opened.animated { transform: translate3d(0, 0, 0);} #imHeader_pluginAppObj_85_wrapper { display: none; } #imHeader_imCell_85 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_85 { grid-template-rows: [row-content] auto ; } #imHeader_pluginAppObj_85 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_85 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_imObjectImage_86_wrapper { display: none; } #imHeader_imObjectImage_86_wrapper img {-webkit-clip-path: inset(0 0 -29.167% 0);clip-path: inset(0 0 -29.167% 0);}#imHeader_imCell_86 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_86 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectImage_86 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_86 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_pluginAppObj_87_wrapper { display: none; } #imHeader_imCell_87 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_87 { grid-template-rows: [row-content] auto ; } #imHeader_pluginAppObj_87 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_87 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_pluginAppObj_88_wrapper { display: none; } #imHeader_imCell_88 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_88 { grid-template-rows: [row-content] auto ; } #imHeader_pluginAppObj_88 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_88 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_pluginAppObj_89_wrapper { display: none; } #imHeader_imCell_89 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_89 { grid-template-rows: [row-content] auto ; } #imHeader_pluginAppObj_89 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_89 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_pluginAppObj_90_wrapper { position: absolute; top: 4px; inset-inline-start: 4px; width: 142px; height: 40px; text-align: center; z-index: 1002; } #imHeader_imCell_90 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_90 { grid-template-rows: [row-content] auto ; } #imHeader_pluginAppObj_90 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_90 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_pluginAppObj_91_wrapper { position: absolute; top: 16px; inset-inline-start: 381px; width: 43px; height: 38px; text-align: center; z-index: 1017; } #imHeader_imCell_91 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_91 { grid-template-rows: [row-content] auto ; } #imHeader_pluginAppObj_91 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_91 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_pluginAppObj_92_wrapper { position: absolute; top: 16px; inset-inline-start: 337px; width: 43px; height: 39px; text-align: center; z-index: 1018; } #imHeader_imCell_92 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_92 { grid-template-rows: [row-content] auto ; } #imHeader_pluginAppObj_92 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_92 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_imObjectImage_93_wrapper { position: absolute; top: 20px; inset-inline-start: 453px; width: 17px; height: 26px; text-align: center; z-index: 1019; overflow: hidden; } #imHeader_imObjectImage_93_wrapper img {-webkit-clip-path: inset(0 0 -52.941% 0);clip-path: inset(0 0 -52.941% 0);}#imHeader_imCell_93 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_93 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectImage_93 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_93 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_imObjectButton_94_wrapper { position: absolute; top: 65px; inset-inline-start: 109px; width: 297px; height: 39px; text-align: center; z-index: 1020; } #imHeader_imCell_94 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_94 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectButton_94 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_94 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_imObjectButton_94_button { margin: 0px; } #imHeader_imObjectButton_95_wrapper { display: none; } #imHeader_imCell_95 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_95 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectButton_95 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleBorders_95 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imHeader_imObjectButton_95_button { margin: 0px; } } @media (max-width: 479.9px) { #imHeader_imObjectImage_63_wrapper { position: absolute; top: 53px; inset-inline-start: 0px; width: 84px; height: 58px; text-align: center; z-index: 1002; overflow: hidden; } #imHeader_imObjectImage_63_wrapper img {-webkit-clip-path: inset(0 0 -7.407% 0);clip-path: inset(0 0 -7.407% 0);}#imHeader_imCell_63 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_63 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectImage_63 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleGraphics_63 { box-sizing: border-box; } #imHeader_imObjectImage_07_wrapper { display: none; } #imHeader_imObjectImage_07_wrapper img {-webkit-clip-path: inset(0 0 50.476% 0);clip-path: inset(0 0 50.476% 0);}#imHeader_imCell_7 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_7 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectImage_07 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleGraphics_7 { box-sizing: border-box; } #imHeader_imObjectButton_45_wrapper { display: none; } #imHeader_imCell_45 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_45 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectButton_45 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleGraphics_45 { box-sizing: border-box; } #imHeader_imObjectButton_45_button { margin: 0px; } #imHeader_imObjectButton_51_wrapper { display: none; } #imHeader_imCell_51 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_51 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectButton_51 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleGraphics_51 { box-sizing: border-box; } #imHeader_imObjectButton_51_button { margin: 0px; } #imHeader_imObjectButton_52_wrapper { display: none; } #imHeader_imCell_52 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_52 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectButton_52 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleGraphics_52 { box-sizing: border-box; } #imHeader_imObjectButton_52_button { margin: 0px; } #imHeader_imObjectImage_58_wrapper { display: none; } #imHeader_imObjectImage_58_wrapper img {-webkit-clip-path: inset(0 0 -25.532% 0);clip-path: inset(0 0 -25.532% 0);}#imHeader_imCell_58 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_58 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectImage_58 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleGraphics_58 { box-sizing: border-box; } #imHeader_imObjectImage_61_wrapper { display: none; } #imHeader_imObjectImage_61_wrapper img {-webkit-clip-path: inset(0 0 53.153% 0);clip-path: inset(0 0 53.153% 0);}#imHeader_imCell_61 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_61 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectImage_61 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleGraphics_61 { box-sizing: border-box; } #imHeader_imObjectImage_62_wrapper { display: none; } #imHeader_imObjectImage_62_wrapper img {-webkit-clip-path: inset(0 0 53.982% 0);clip-path: inset(0 0 53.982% 0);}#imHeader_imCell_62 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_62 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectImage_62 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleGraphics_62 { box-sizing: border-box; } #imHeader_imMenuObject_84_wrapper { position: absolute; top: 63px; inset-inline-start: 275px; width: 42px; height: 46px; text-align: center; z-index: 1010; } #imHeader_imCell_84 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_84 { grid-template-rows: [row-content] auto ; } #imHeader_imMenuObject_84 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleGraphics_84 { box-sizing: border-box; } /* Main menu background */ #imHeader_imMenuObject_84_container { border: solid; border-block-color: transparent transparent; border-inline-color: transparent transparent; border-width: 0px; border-radius: 0px; width: 100%; box-sizing: border-box; background-color: transparent; padding: 0px; display: inline-table;} #imHeader_imMenuObject_84_container > ul:after {content: '';display: table;clear: both; } /* Main menu button size and position */ #imHeader_imMenuObject_84_container > ul > li {position: relative;margin-inline-start: 0px; margin-top: 0px; display: inline-block; vertical-align: top; } #imHeader_imMenuObject_84_container > ul > li > .label-wrapper, #imHeader_imMenuObject_84_container > ul > li > div > .label-wrapper { display: block; overflow: hidden; width: 193px; height: 47px; padding-block: 0px; padding-inline: 1px; border-width: 0px; border-radius: 0px; } #imHeader_imMenuObject_84_container > ul > li > .label-wrapper:has(:focus-visible), #imHeader_imMenuObject_84_container > ul > li > div > .label-wrapper:has(:focus-visible) { overflow: visible; } #imHeader_imMenuObject_84 .hamburger-button {cursor: pointer; width: 47px; height: 47px; display: inline-block; vertical-align: top; padding: 0; box-sizing: content-box; border-width: 0px; border-radius: 0px; } #imHeader_imMenuObject_84 .hamburger-bar { margin: 5px auto; width: 65%; height: 5px; background-color: rgba(31, 112, 174, 1); display: block; } #imHeader_imMenuObject_84 .label-inner-wrapper, #imHeader_imMenuObject_84 .hamburger-button > div { display: table; width: 100%; height: 100%; position: relative; z-index: 1; } #imHeader_imMenuObject_84_container > ul > li .label, #imHeader_imMenuObject_84 .hamburger-button > div > div { display: table-cell; vertical-align: middle; } /* Main menu default button style */ #imHeader_imMenuObject_84_container > ul > li > .label-wrapper {background-color: transparent;background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imHeader_imMenuObject_84_container > ul > li > .label-wrapper .label, #imHeader_imMenuObject_84_container > ul > li > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(31, 112, 174, 1);font-weight: bold;} /* Hamburger button style */ #imHeader_imMenuObject_84 .hamburger-button {background-color: transparent;background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imHeader_imMenuObject_84 .hamburger-button .label, #imHeader_imMenuObject_84 .hamburger-button button {width: 100%;height: 100%;font-family: Arial;font-size: 11pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(31, 112, 174, 1);font-weight: normal;} /* Main menu current button style */ #imHeader_imMenuObject_84_container > ul > .imMnMnCurrent > .label-wrapper {background-color: transparent;background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imHeader_imMenuObject_84_container > ul > .imMnMnCurrent > .label-wrapper .label, #imHeader_imMenuObject_84_container > ul > .imMnMnCurrent > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(0, 152, 70, 1);font-weight: bold;} /* Main menu hover button style */ #imHeader_imMenuObject_84_container > ul > li.imPage > .label-wrapper.label-wrapper-over {background-color: transparent;background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imHeader_imMenuObject_84_container > ul > li.imPage > .label-wrapper.label-wrapper-over .label, #imHeader_imMenuObject_84_container > ul > li.imPage > .label-wrapper.label-wrapper-over button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(0, 152, 70, 1);font-weight: bold;} #imHeader_imMenuObject_84_container > ul > li.imPage > .label-wrapper.label-wrapper-over { position: absolute; top: 0; left: 0; z-index: -1; opacity: 0; transition: opacity 0.5s;}#imHeader_imMenuObject_84_container > ul > li.imPage > .label-wrapper.label-wrapper-over.animated {z-index: 1; opacity: 1;}#imHeader_imMenuObject_84_container > ul > li.imLevel > .label-wrapper.label-wrapper-over {background-color: transparent;background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imHeader_imMenuObject_84_container > ul > li.imLevel > .label-wrapper.label-wrapper-over .label, #imHeader_imMenuObject_84_container > ul > li.imLevel > .label-wrapper.label-wrapper-over button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(0, 152, 70, 1);font-weight: bold;} #imHeader_imMenuObject_84_container > ul > li.imLevel > .label-wrapper.label-wrapper-over { position: absolute; top: 0; left: 0; z-index: -1; opacity: 0; transition: opacity 0.5s;}#imHeader_imMenuObject_84_container > ul > li.imLevel > .label-wrapper.label-wrapper-over.animated {z-index: 1; opacity: 1;}/* Main menu separator button style */ #imHeader_imMenuObject_84_container > ul > .imMnMnSeparator > .label-wrapper {background-color: rgba(255, 255, 255, 1);background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imHeader_imMenuObject_84_container > ul > .imMnMnSeparator > .label-wrapper .label, #imHeader_imMenuObject_84_container > ul > .imMnMnSeparator > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(0, 0, 0, 1);font-weight: bold;} #imHeader_imMenuObject_84 .imLevel { cursor: default; } #imHeader_imMenuObject_84-menu-opened .imLevel { cursor: default; } #imHeader_imMenuObject_84 { text-align: center; } #imHeader_imMenuObject_84 .hidden { display: none; } #imHeader_imMenuObject_84-menu-opened { overflow: visible; z-index: 10402; } #imHeader_imMenuObject_84-menu-opened ul ul { display: none; } #imHeader_imMenuObject_84-menu-opened li > div { display: none; } #imHeader_imMenuObject_84-menu-opened #imHeader_imMenuObject_84_container-menu-opened div > ul { display: block; } #imHeader_imMenuObject_84-menu-opened #imHeader_imMenuObject_84_container-menu-opened > ul { position: absolute; inset-inline-end: 0px; inset-inline-start: auto; top: 40px; background-color: rgba(255, 255, 255, 1); overflow-x: hidden; overflow-y: auto; height: calc(100% - 40px); width: 100%; } #imHeader_imMenuObject_84-menu-opened .hamburger-menu-close-button { display: block; font-family: Arial; font-size: 30px; text-align: end; padding-block: 5px; padding-inline: 10px; color: rgba(31, 112, 174, 1); } #imHeader_imMenuObject_84-menu-opened .hamburger-menu-close-button span { cursor: pointer; } #imHeader_imMenuObject_84-menu-opened { position:fixed; top: 0; bottom: 0; inset-inline-end: 0px; width: 310px; border: solid; border-block-color: transparent transparent; border-inline-color: transparent transparent; border-width: 0px; border-radius: 0px; ; } #imPageExtContainer:after{ position: fixed; top: 0; inset-inline-end: 0px; width: 0; height: 0; content: ''; opacity: 0; transition: opacity 1000ms; z-index: 10401;} .menu-imHeader_imMenuObject_84-opened #imPageExtContainer:after{ width: 100%; height: 100%; background-color: rgba(255, 255, 255, 1); opacity: 0.6;} .menu-imHeader_imMenuObject_84-towards-closing #imPageExtContainer:after { width: 100%; height: 100%; background-color: transparent; opacity: 0.6; transition: background-color 1000ms linear, opacity;} #imHeader_imMenuObject_84 .hidden { display: none; } /* Responsive menu button size and position */ #imHeader_imMenuObject_84-menu-opened li {position: relative;margin-bottom: 5px; display: inline-block; vertical-align: top; } #imHeader_imMenuObject_84-menu-opened li:last-child {margin-bottom: 0px; } #imHeader_imMenuObject_84-menu-opened .label-wrapper { display: block; overflow: hidden; position: relative; width: 292px; height: 71px; padding-block: 0px; padding-inline: 9px; } #imHeader_imMenuObject_84-menu-opened .label-inner-wrapper { display: table; width: 100%; height: 100%; z-index: 1; position: relative; } #imHeader_imMenuObject_84-menu-opened .label { display: table-cell; vertical-align: middle; } #imHeader_imMenuObject_84-menu-opened .hamburger-menu-background { position: absolute;display: block;top: 0;bottom: 0;width: 310px;inset-inline-end: 0px; inset-inline-start: auto; background-color: rgba(255, 255, 255, 1);transition: left 500ms, right 500ms, opacity 500ms;} /* Responsive menu default button style */ #imHeader_imMenuObject_84-menu-opened ul > li > .label-wrapper {background-color: transparent;background-image: none;} #imHeader_imMenuObject_84-menu-opened ul > li > .label-wrapper .label, #imHeader_imMenuObject_84-menu-opened ul > li > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(31, 112, 174, 1);font-weight: bold;} #imHeader_imMenuObject_84-menu-opened ul ul > li > .label-wrapper {background-color: transparent;background-image: none;} #imHeader_imMenuObject_84-menu-opened ul ul > li > .label-wrapper .label, #imHeader_imMenuObject_84-menu-opened ul ul > li > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(31, 112, 174, 1);font-weight: bold;} #imHeader_imMenuObject_84-menu-opened ul ul ul > li > .label-wrapper {background-color: transparent;background-image: none;} #imHeader_imMenuObject_84-menu-opened ul ul ul > li > .label-wrapper .label, #imHeader_imMenuObject_84-menu-opened ul ul ul > li > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(31, 112, 174, 1);font-weight: bold;} #imHeader_imMenuObject_84-menu-opened ul ul ul ul > li > .label-wrapper {background-color: transparent;background-image: none;} #imHeader_imMenuObject_84-menu-opened ul ul ul ul > li > .label-wrapper .label, #imHeader_imMenuObject_84-menu-opened ul ul ul ul > li > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(31, 112, 174, 1);font-weight: bold;} /* Responsive menu hover button style */ #imHeader_imMenuObject_84-menu-opened ul > li:hover:not(.imMnMnSeparator) > .label-wrapper {background-color: transparent;background-image: none;} #imHeader_imMenuObject_84-menu-opened ul > li:hover:not(.imMnMnSeparator) > .label-wrapper .label, #imHeader_imMenuObject_84-menu-opened ul > li:hover:not(.imMnMnSeparator) > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(0, 189, 102, 1);font-weight: bold;} /* Responsive menu current button style */ #imHeader_imMenuObject_84-menu-opened #imHeader_imMenuObject_84_container-menu-opened > ul > .imMnMnCurrent > .label-wrapper {background-color: transparent;background-image: none;} #imHeader_imMenuObject_84-menu-opened #imHeader_imMenuObject_84_container-menu-opened > ul > .imMnMnCurrent > .label-wrapper .label, #imHeader_imMenuObject_84-menu-opened #imHeader_imMenuObject_84_container-menu-opened > ul > .imMnMnCurrent > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(0, 189, 102, 1);font-weight: bold;} #imHeader_imMenuObject_84-menu-opened .imMnMnCurrent > ul > .imMnMnCurrent > .label-wrapper {background-color: transparent;background-image: none;} #imHeader_imMenuObject_84-menu-opened .imMnMnCurrent > ul > .imMnMnCurrent > .label-wrapper .label, #imHeader_imMenuObject_84-menu-opened .imMnMnCurrent > ul > .imMnMnCurrent > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(0, 189, 102, 1);font-weight: bold;} /* Responsive menu separator button style */ #imHeader_imMenuObject_84-menu-opened ul > .imMnMnSeparator > .label-wrapper {background-color: transparent;background-image: none;} #imHeader_imMenuObject_84-menu-opened ul > .imMnMnSeparator > .label-wrapper .label, #imHeader_imMenuObject_84-menu-opened ul > .imMnMnSeparator > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(31, 112, 174, 1);font-weight: bold;} /* Responsive menu separation line style */ #imHeader_imMenuObject_84-menu-opened ul li::after {display: block; position: relative; height: 0; content: ''; width: 100%; inset-inline-start: 0%; border-block-width: 1px 0px; border-inline-width: 0px; border-color: rgba(8, 156, 68, 1); border-style: solid; } #imHeader_imMenuObject_84-menu-opened { transform: translate3d(310px, 0 ,0); transition: transform 1000ms;} #imHeader_imMenuObject_84-menu-opened.animated { transform: translate3d(0, 0, 0);} #imHeader_pluginAppObj_85_wrapper { display: none; } #imHeader_imCell_85 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_85 { grid-template-rows: [row-content] auto ; } #imHeader_pluginAppObj_85 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleGraphics_85 { box-sizing: border-box; } #imHeader_imObjectImage_86_wrapper { display: none; } #imHeader_imObjectImage_86_wrapper img {-webkit-clip-path: inset(0 0 -29.167% 0);clip-path: inset(0 0 -29.167% 0);}#imHeader_imCell_86 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_86 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectImage_86 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleGraphics_86 { box-sizing: border-box; } #imHeader_pluginAppObj_87_wrapper { display: none; } #imHeader_imCell_87 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_87 { grid-template-rows: [row-content] auto ; } #imHeader_pluginAppObj_87 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleGraphics_87 { box-sizing: border-box; } #imHeader_pluginAppObj_88_wrapper { display: none; } #imHeader_imCell_88 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_88 { grid-template-rows: [row-content] auto ; } #imHeader_pluginAppObj_88 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleGraphics_88 { box-sizing: border-box; } #imHeader_pluginAppObj_89_wrapper { display: none; } #imHeader_imCell_89 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_89 { grid-template-rows: [row-content] auto ; } #imHeader_pluginAppObj_89 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleGraphics_89 { box-sizing: border-box; } #imHeader_pluginAppObj_90_wrapper { position: absolute; top: 5px; inset-inline-start: 0px; width: 152px; height: 36px; text-align: center; z-index: 1016; } #imHeader_imCell_90 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_90 { grid-template-rows: [row-content] auto ; } #imHeader_pluginAppObj_90 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleGraphics_90 { box-sizing: border-box; } #imHeader_pluginAppObj_91_wrapper { position: absolute; top: 12px; inset-inline-start: 225px; width: 43px; height: 21px; text-align: center; z-index: 1017; } #imHeader_imCell_91 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_91 { grid-template-rows: [row-content] auto ; } #imHeader_pluginAppObj_91 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleGraphics_91 { box-sizing: border-box; } #imHeader_pluginAppObj_92_wrapper { position: absolute; top: 12px; inset-inline-start: 183px; width: 43px; height: 21px; text-align: center; z-index: 1018; } #imHeader_imCell_92 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_92 { grid-template-rows: [row-content] auto ; } #imHeader_pluginAppObj_92 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleGraphics_92 { box-sizing: border-box; } #imHeader_imObjectImage_93_wrapper { position: absolute; top: 19px; inset-inline-start: 291px; width: 17px; height: 26px; text-align: center; z-index: 1019; overflow: hidden; } #imHeader_imObjectImage_93_wrapper img {-webkit-clip-path: inset(0 0 -52.941% 0);clip-path: inset(0 0 -52.941% 0);}#imHeader_imCell_93 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_93 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectImage_93 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleGraphics_93 { box-sizing: border-box; } #imHeader_imObjectButton_94_wrapper { display: none; } #imHeader_imCell_94 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_94 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectButton_94 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleGraphics_94 { box-sizing: border-box; } #imHeader_imObjectButton_94_button { margin: 0px; } #imHeader_imObjectButton_95_wrapper { position: absolute; top: 68px; inset-inline-start: 98px; width: 168px; height: 39px; text-align: center; z-index: 1021; } #imHeader_imCell_95 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imHeader_imCell_95 { grid-template-rows: [row-content] auto ; } #imHeader_imObjectButton_95 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imHeader_imCellStyleGraphics_95 { box-sizing: border-box; } #imHeader_imObjectButton_95_button { margin: 0px; } } @media (min-width: 1200.0px) { #imFooter_imHTMLObject_24_wrapper { position: absolute; top: 1364px; inset-inline-start: 1px; width: 1201px; height: 412px; text-align: center; z-index: 1002; overflow: hidden; } #imFooter_imCell_24 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imFooter_imCell_24 { grid-template-rows: [row-content] auto ; } #imFooter_imHTMLObject_24 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imFooter_imCellStyleBorders_24 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imFooter_imHTMLObject_25_wrapper { position: absolute; top: 0px; inset-inline-start: 3px; width: 1197px; height: 1360px; text-align: center; z-index: 1003; overflow: hidden; } #imFooter_imCell_25 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imFooter_imCell_25 { grid-template-rows: [row-content] auto ; } #imFooter_imHTMLObject_25 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imFooter_imCellStyleBorders_25 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imFooter_imHTMLObject_26_wrapper { display: none; } #imFooter_imCell_26 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imFooter_imCell_26 { grid-template-rows: [row-content] auto ; } #imFooter_imHTMLObject_26 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imFooter_imCellStyleBorders_26 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imFooter_imHTMLObject_27_wrapper { display: none; } #imFooter_imCell_27 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imFooter_imCell_27 { grid-template-rows: [row-content] auto ; } #imFooter_imHTMLObject_27 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imFooter_imCellStyleBorders_27 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imFooter_imHTMLObject_28_wrapper { display: none; } #imFooter_imCell_28 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imFooter_imCell_28 { grid-template-rows: [row-content] auto ; } #imFooter_imHTMLObject_28 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imFooter_imCellStyleBorders_28 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } } @media (max-width: 1199.9px) and (min-width: 720.0px) { #imFooter_imHTMLObject_24_wrapper { display: none; } #imFooter_imCell_24 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imFooter_imCell_24 { grid-template-rows: [row-content] auto ; } #imFooter_imHTMLObject_24 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imFooter_imCellStyleBorders_24 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imFooter_imHTMLObject_25_wrapper { display: none; } #imFooter_imCell_25 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imFooter_imCell_25 { grid-template-rows: [row-content] auto ; } #imFooter_imHTMLObject_25 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imFooter_imCellStyleBorders_25 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imFooter_imHTMLObject_26_wrapper { position: absolute; top: 1px; inset-inline-start: 1px; width: 719px; height: 1696px; text-align: center; z-index: 1004; overflow: hidden; } #imFooter_imCell_26 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imFooter_imCell_26 { grid-template-rows: [row-content] auto ; } #imFooter_imHTMLObject_26 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imFooter_imCellStyleBorders_26 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imFooter_imHTMLObject_27_wrapper { display: none; } #imFooter_imCell_27 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imFooter_imCell_27 { grid-template-rows: [row-content] auto ; } #imFooter_imHTMLObject_27 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imFooter_imCellStyleBorders_27 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imFooter_imHTMLObject_28_wrapper { display: none; } #imFooter_imCell_28 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imFooter_imCell_28 { grid-template-rows: [row-content] auto ; } #imFooter_imHTMLObject_28 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imFooter_imCellStyleBorders_28 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } } @media (max-width: 719.9px) and (min-width: 480.0px) { #imFooter_imHTMLObject_24_wrapper { display: none; } #imFooter_imCell_24 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imFooter_imCell_24 { grid-template-rows: [row-content] auto ; } #imFooter_imHTMLObject_24 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imFooter_imCellStyleBorders_24 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imFooter_imHTMLObject_25_wrapper { display: none; } #imFooter_imCell_25 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imFooter_imCell_25 { grid-template-rows: [row-content] auto ; } #imFooter_imHTMLObject_25 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imFooter_imCellStyleBorders_25 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imFooter_imHTMLObject_26_wrapper { display: none; } #imFooter_imCell_26 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imFooter_imCell_26 { grid-template-rows: [row-content] auto ; } #imFooter_imHTMLObject_26 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imFooter_imCellStyleBorders_26 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imFooter_imHTMLObject_27_wrapper { position: absolute; top: 0px; inset-inline-start: 0px; width: 477px; height: 1888px; text-align: center; z-index: 1005; overflow: hidden; } #imFooter_imCell_27 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imFooter_imCell_27 { grid-template-rows: [row-content] auto ; } #imFooter_imHTMLObject_27 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imFooter_imCellStyleBorders_27 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imFooter_imHTMLObject_28_wrapper { display: none; } #imFooter_imCell_28 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imFooter_imCell_28 { grid-template-rows: [row-content] auto ; } #imFooter_imHTMLObject_28 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imFooter_imCellStyleBorders_28 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } } @media (max-width: 479.9px) { #imFooter_imHTMLObject_24_wrapper { display: none; } #imFooter_imCell_24 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imFooter_imCell_24 { grid-template-rows: [row-content] auto ; } #imFooter_imHTMLObject_24 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imFooter_imCellStyleGraphics_24 { box-sizing: border-box; } #imFooter_imHTMLObject_25_wrapper { display: none; } #imFooter_imCell_25 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imFooter_imCell_25 { grid-template-rows: [row-content] auto ; } #imFooter_imHTMLObject_25 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imFooter_imCellStyleGraphics_25 { box-sizing: border-box; } #imFooter_imHTMLObject_26_wrapper { display: none; } #imFooter_imCell_26 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imFooter_imCell_26 { grid-template-rows: [row-content] auto ; } #imFooter_imHTMLObject_26 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imFooter_imCellStyleGraphics_26 { box-sizing: border-box; } #imFooter_imHTMLObject_27_wrapper { display: none; } #imFooter_imCell_27 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imFooter_imCell_27 { grid-template-rows: [row-content] auto ; } #imFooter_imHTMLObject_27 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imFooter_imCellStyleGraphics_27 { box-sizing: border-box; } #imFooter_imHTMLObject_28_wrapper { position: absolute; top: 0px; inset-inline-start: 0px; width: 318px; height: 1848px; text-align: center; z-index: 1006; overflow: hidden; } #imFooter_imCell_28 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imFooter_imCell_28 { grid-template-rows: [row-content] auto ; } #imFooter_imHTMLObject_28 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imFooter_imCellStyleGraphics_28 { box-sizing: border-box; } } @media (min-width: 1200.0px) { #imSideBar_imObjectTitle_19_wrapper { position: absolute; top: 0px; inset-inline-start: 1px; width: 248px; height: 85px; text-align: center; z-index: 1003; } #imSideBar_imCell_19 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imSideBar_imCell_19 { grid-template-rows: [row-content] auto ; } #imSideBar_imObjectTitle_19 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imSideBar_imCellStyleBorders_19 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imSideBar_imObjectTitle_19 { width: 100%; } #imSideBar_imObjectTitle_19_text { margin: 0px; } #imSideBar_imObjectForm_21_wrapper { position: absolute; top: 0px; inset-inline-start: 7px; width: 242px; height: 463px; text-align: center; z-index: 1004; overflow: hidden; } #imSideBar_imCell_21 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imSideBar_imCell_21 { grid-template-rows: [row-content] auto ; } #imSideBar_imObjectForm_21 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imSideBar_imCellStyleBorders_21 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imSideBar_imObjectImage_22_wrapper { position: absolute; top: 0px; inset-inline-start: 0px; width: 251px; height: 520px; text-align: center; z-index: 1002; overflow: hidden; } #imSideBar_imObjectImage_22_wrapper img {-webkit-clip-path: inset(0 0 -Infinity% 0);clip-path: inset(0 0 -Infinity% 0);} } @media (max-width: 1199.9px) and (min-width: 720.0px) { #imSideBar_imObjectTitle_19_wrapper { position: absolute; top: 0px; inset-inline-start: 2px; width: 246px; height: 86px; text-align: center; z-index: 1003; } #imSideBar_imCell_19 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imSideBar_imCell_19 { grid-template-rows: [row-content] auto ; } #imSideBar_imObjectTitle_19 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imSideBar_imCellStyleBorders_19 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imSideBar_imObjectTitle_19 { width: 100%; } #imSideBar_imObjectTitle_19_text { margin: 0px; } #imSideBar_imObjectForm_21_wrapper { position: absolute; top: 0px; inset-inline-start: 5px; width: 244px; height: 463px; text-align: center; z-index: 1004; overflow: hidden; } #imSideBar_imCell_21 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imSideBar_imCell_21 { grid-template-rows: [row-content] auto ; } #imSideBar_imObjectForm_21 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imSideBar_imCellStyleBorders_21 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imSideBar_imObjectImage_22_wrapper { position: absolute; top: 0px; inset-inline-start: 0px; width: 251px; height: 529px; text-align: center; z-index: 1002; overflow: hidden; } #imSideBar_imObjectImage_22_wrapper img {-webkit-clip-path: inset(0 0 -Infinity% 0);clip-path: inset(0 0 -Infinity% 0);} } @media (max-width: 719.9px) and (min-width: 480.0px) { #imSideBar_imObjectTitle_19_wrapper { position: absolute; top: 0px; inset-inline-start: 0px; width: 248px; height: 60px; text-align: center; z-index: 1002; } #imSideBar_imCell_19 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imSideBar_imCell_19 { grid-template-rows: [row-content] auto ; } #imSideBar_imObjectTitle_19 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imSideBar_imCellStyleBorders_19 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imSideBar_imObjectTitle_19 { width: 100%; } #imSideBar_imObjectTitle_19_text { margin: 0px; } #imSideBar_imObjectForm_21_wrapper { position: absolute; top: 0px; inset-inline-start: 0px; width: 249px; height: 463px; text-align: center; z-index: 1003; overflow: hidden; } #imSideBar_imCell_21 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imSideBar_imCell_21 { grid-template-rows: [row-content] auto ; } #imSideBar_imObjectForm_21 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imSideBar_imCellStyleBorders_21 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imSideBar_imObjectImage_22_wrapper { position: absolute; top: 0px; inset-inline-start: 0px; width: 251px; height: 419px; text-align: center; z-index: 1004; overflow: hidden; } #imSideBar_imObjectImage_22_wrapper img {-webkit-clip-path: inset(0 0 -Infinity% 0);clip-path: inset(0 0 -Infinity% 0);} } @media (max-width: 479.9px) { #imSideBar_imObjectTitle_19_wrapper { position: absolute; top: 0px; inset-inline-start: 0px; width: 248px; height: 60px; text-align: center; z-index: 1002; } #imSideBar_imCell_19 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imSideBar_imCell_19 { grid-template-rows: [row-content] auto ; } #imSideBar_imObjectTitle_19 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imSideBar_imCellStyleGraphics_19 { box-sizing: border-box; } #imSideBar_imObjectTitle_19 { width: 100%; } #imSideBar_imObjectTitle_19_text { margin: 0px; } #imSideBar_imObjectForm_21_wrapper { position: absolute; top: 0px; inset-inline-start: 0px; width: 249px; height: 463px; text-align: center; z-index: 1003; overflow: hidden; } #imSideBar_imCell_21 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imSideBar_imCell_21 { grid-template-rows: [row-content] auto ; } #imSideBar_imObjectForm_21 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imSideBar_imCellStyleGraphics_21 { box-sizing: border-box; } #imObjectForm_21_1_container { width: 100%; } #imObjectForm_21_2_container { width: 100%; } #imObjectForm_21_3_container { width: 100%; } #imObjectForm_21_4_container { width: 100%; } #imObjectForm_21_5_container { width: 100%; } #imObjectForm_21_6_container { width: 100%; } .imObjectForm_21_6_radiobutton { width: 100%; } .imObjectForm_21_6_radiobutton.firstrow { padding-top: 0; } .imObjectForm_21_6_radiobutton.firstrow.firstcolumn { padding-top: 5px; } #imObjectForm_21_7_container { width: 100%; } #imSideBar_imObjectImage_22_wrapper { position: absolute; top: 0px; inset-inline-start: 0px; width: 251px; height: 419px; text-align: center; z-index: 1004; overflow: hidden; } #imSideBar_imObjectImage_22_wrapper img {-webkit-clip-path: inset(0 0 -Infinity% 0);clip-path: inset(0 0 -Infinity% 0);} } @media (min-width: 1200.0px) { #imStickyBar_imObjectImage_100_wrapper { display: none; } #imStickyBar_imObjectImage_100_wrapper img {-webkit-clip-path: inset(0 0 -47.458% 0);clip-path: inset(0 0 -47.458% 0);}#imStickyBar_imCell_100 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_100 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectImage_100 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_100 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectImage_69_wrapper { display: none; } #imStickyBar_imObjectImage_69_wrapper img {-webkit-clip-path: inset(0 0 9.091% 0);clip-path: inset(0 0 9.091% 0);}#imStickyBar_imCell_69 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_69 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectImage_69 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_69 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectImage_70_wrapper { position: absolute; top: 5px; inset-inline-start: 1px; width: 118px; height: 80px; text-align: center; z-index: 1003; overflow: hidden; } #imStickyBar_imObjectImage_70_wrapper img {-webkit-clip-path: inset(0 0 -5.263% 0);clip-path: inset(0 0 -5.263% 0);}#imStickyBar_imCell_70 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_70 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectImage_70 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_70 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectButton_88_wrapper { position: absolute; top: 24px; inset-inline-start: 486px; width: 211px; height: 45px; text-align: center; z-index: 1004; } #imStickyBar_imCell_88 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_88 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectButton_88 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_88 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectButton_88_button { margin: 0px; } #imStickyBar_imObjectButton_95_wrapper { display: none; } #imStickyBar_imCell_95 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_95 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectButton_95 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_95 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectButton_95_button { margin: 0px; } #imStickyBar_imObjectImage_98_wrapper { display: none; } #imStickyBar_imObjectImage_98_wrapper img {-webkit-clip-path: inset(0 0 -59.091% 0);clip-path: inset(0 0 -59.091% 0);}#imStickyBar_imCell_98 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_98 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectImage_98 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_98 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectImage_104_wrapper { display: none; } #imStickyBar_imObjectImage_104_wrapper img {-webkit-clip-path: inset(0 0 0% 0);clip-path: inset(0 0 0% 0);}#imStickyBar_imCell_104 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_104 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectImage_104 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_104 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectImage_105_wrapper { display: none; } #imStickyBar_imObjectImage_105_wrapper img {-webkit-clip-path: inset(0 0 0% 0);clip-path: inset(0 0 0% 0);}#imStickyBar_imCell_105 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_105 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectImage_105 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_105 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectButton_106_wrapper { display: none; } #imStickyBar_imCell_106 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_106 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectButton_106 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_106 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectButton_106_button { margin: 0px; } #imStickyBar_imObjectButton_107_wrapper { display: none; } #imStickyBar_imCell_107 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_107 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectButton_107 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_107 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectButton_107_button { margin: 0px; } #imStickyBar_imObjectButton_108_wrapper { display: none; } #imStickyBar_imCell_108 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_108 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectButton_108 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_108 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectButton_108_button { margin: 0px; } #imStickyBar_imObjectButton_112_wrapper { position: absolute; top: 24px; inset-inline-start: 774px; width: 244px; height: 45px; text-align: center; z-index: 1013; } #imStickyBar_imCell_112 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_112 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectButton_112 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_112 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectButton_112_button { margin: 0px; } #imStickyBar_pluginAppObj_114_wrapper { position: absolute; top: 21px; inset-inline-start: 149px; width: 238px; height: 41px; text-align: center; z-index: 1014; } #imStickyBar_imCell_114 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_114 { grid-template-rows: [row-content] auto ; } #imStickyBar_pluginAppObj_114 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_114 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectImage_115_wrapper { position: absolute; top: 30px; inset-inline-start: 1138px; width: 24px; height: 31px; text-align: center; z-index: 1015; overflow: hidden; } #imStickyBar_imObjectImage_115_wrapper img {-webkit-clip-path: inset(0 0 -29.167% 0);clip-path: inset(0 0 -29.167% 0);}#imStickyBar_imCell_115 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_115 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectImage_115 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_115 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imMenuObject_117_wrapper { position: absolute; top: 90px; inset-inline-start: -1px; width: 1203px; height: 96px; text-align: center; z-index: 1016; } #imStickyBar_imCell_117 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_117 { grid-template-rows: [row-content] auto ; } #imStickyBar_imMenuObject_117 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_117 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } /* Main menu background */ #imStickyBar_imMenuObject_117_container { border: solid; border-block-color: transparent transparent; border-inline-color: transparent transparent; border-width: 0px; border-radius: 0px; width: 100%; box-sizing: border-box; background-color: transparent; padding: 0px; display: inline-table;} #imStickyBar_imMenuObject_117_container > ul:after {content: '';display: table;clear: both; } /* Main menu button size and position */ #imStickyBar_imMenuObject_117_container > ul > li {position: relative;margin-inline-start: 0px; margin-top: 0px; display: inline-block; vertical-align: top; } #imStickyBar_imMenuObject_117_container > ul > li > .label-wrapper, #imStickyBar_imMenuObject_117_container > ul > li > div > .label-wrapper { display: block; overflow: hidden; width: 193px; height: 47px; padding-block: 0px; padding-inline: 1px; border-width: 0px; border-radius: 0px; } #imStickyBar_imMenuObject_117_container > ul > li > .label-wrapper:has(:focus-visible), #imStickyBar_imMenuObject_117_container > ul > li > div > .label-wrapper:has(:focus-visible) { overflow: visible; } #imStickyBar_imMenuObject_117 .hamburger-button {cursor: pointer; width: 47px; height: 47px; display: inline-block; vertical-align: top; padding: 0; box-sizing: content-box; border-width: 0px; border-radius: 0px; } #imStickyBar_imMenuObject_117 .hamburger-bar { margin: 5px auto; width: 65%; height: 5px; background-color: rgba(31, 112, 174, 1); display: block; } #imStickyBar_imMenuObject_117 .label-inner-wrapper, #imStickyBar_imMenuObject_117 .hamburger-button > div { display: table; width: 100%; height: 100%; position: relative; z-index: 1; } #imStickyBar_imMenuObject_117_container > ul > li .label, #imStickyBar_imMenuObject_117 .hamburger-button > div > div { display: table-cell; vertical-align: middle; } /* Main menu default button style */ #imStickyBar_imMenuObject_117_container > ul > li > .label-wrapper {background-color: transparent;background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imStickyBar_imMenuObject_117_container > ul > li > .label-wrapper .label, #imStickyBar_imMenuObject_117_container > ul > li > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(31, 112, 174, 1);font-weight: bold;} /* Hamburger button style */ #imStickyBar_imMenuObject_117 .hamburger-button {background-color: transparent;background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imStickyBar_imMenuObject_117 .hamburger-button .label, #imStickyBar_imMenuObject_117 .hamburger-button button {width: 100%;height: 100%;font-family: Arial;font-size: 11pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(31, 112, 174, 1);font-weight: normal;} /* Main menu current button style */ #imStickyBar_imMenuObject_117_container > ul > .imMnMnCurrent > .label-wrapper {background-color: transparent;background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imStickyBar_imMenuObject_117_container > ul > .imMnMnCurrent > .label-wrapper .label, #imStickyBar_imMenuObject_117_container > ul > .imMnMnCurrent > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(0, 152, 70, 1);font-weight: bold;} /* Main menu hover button style */ #imStickyBar_imMenuObject_117_container > ul > li.imPage > .label-wrapper.label-wrapper-over {background-color: transparent;background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imStickyBar_imMenuObject_117_container > ul > li.imPage > .label-wrapper.label-wrapper-over .label, #imStickyBar_imMenuObject_117_container > ul > li.imPage > .label-wrapper.label-wrapper-over button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(0, 152, 70, 1);font-weight: bold;} #imStickyBar_imMenuObject_117_container > ul > li.imPage > .label-wrapper.label-wrapper-over { position: absolute; top: 0; left: 0; z-index: -1; opacity: 0; transition: opacity 0.5s;}#imStickyBar_imMenuObject_117_container > ul > li.imPage > .label-wrapper.label-wrapper-over.animated {z-index: 1; opacity: 1;}#imStickyBar_imMenuObject_117_container > ul > li.imLevel > .label-wrapper.label-wrapper-over {background-color: transparent;background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imStickyBar_imMenuObject_117_container > ul > li.imLevel > .label-wrapper.label-wrapper-over .label, #imStickyBar_imMenuObject_117_container > ul > li.imLevel > .label-wrapper.label-wrapper-over button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(0, 152, 70, 1);font-weight: bold;} #imStickyBar_imMenuObject_117_container > ul > li.imLevel > .label-wrapper.label-wrapper-over { position: absolute; top: 0; left: 0; z-index: -1; opacity: 0; transition: opacity 0.5s;}#imStickyBar_imMenuObject_117_container > ul > li.imLevel > .label-wrapper.label-wrapper-over.animated {z-index: 1; opacity: 1;}/* Main menu separator button style */ #imStickyBar_imMenuObject_117_container > ul > .imMnMnSeparator > .label-wrapper {background-color: rgba(255, 255, 255, 1);background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imStickyBar_imMenuObject_117_container > ul > .imMnMnSeparator > .label-wrapper .label, #imStickyBar_imMenuObject_117_container > ul > .imMnMnSeparator > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(0, 0, 0, 1);font-weight: bold;} #imStickyBar_imMenuObject_117 .imLevel { cursor: default; } #imStickyBar_imMenuObject_117-menu-opened .imLevel { cursor: default; } #imStickyBar_imMenuObject_117 { text-align: center; } /* Level menu background */ #imStickyBar_imMenuObject_117 ul ul { border: solid; border-block-color: transparent transparent; border-inline-color: transparent transparent; border-width: 0px; border-radius: 0px; background-color: rgba(255, 255, 255, 1); } /* Level menu button size and position */ #imStickyBar_imMenuObject_117 ul ul li {position: relative;margin-bottom: 2px; display: inline-block; vertical-align: top; } /* Multiple column menu buttons position */ #imStickyBar_imMenuObject_117 .multiple-column > ul {max-width: 250px;} #imStickyBar_imMenuObject_117 ul ul li:last-child {margin-bottom: 0px; } #imStickyBar_imMenuObject_117 ul ul .label-wrapper { display: block; overflow: hidden; width: 244px; height: 60px; padding-block: 0px; padding-inline: 3px; } #imStickyBar_imMenuObject_117 ul ul .label-wrapper:has(:focus-visible) { overflow: visible; } #imStickyBar_imMenuObject_117 ul ul .label { display: table-cell; vertical-align: middle; } /* Level menu default button style */ #imStickyBar_imMenuObject_117 ul ul .label-wrapper {background-color: rgba(255, 255, 255, 1);background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imStickyBar_imMenuObject_117 ul ul .label-wrapper .label, #imStickyBar_imMenuObject_117 ul ul .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 11pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(31, 112, 174, 1);font-weight: bold;} /* Level menu hover button style */ #imStickyBar_imMenuObject_117 ul ul li.imLevel:hover > .label-wrapper {background-color: rgba(255, 255, 255, 1);background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imStickyBar_imMenuObject_117 ul ul li.imLevel:hover > .label-wrapper .label, #imStickyBar_imMenuObject_117 ul ul li.imLevel:hover > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 11pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(0, 152, 70, 1);font-weight: bold;} #imStickyBar_imMenuObject_117 ul ul li.imPage:hover > .label-wrapper {background-color: rgba(255, 255, 255, 1);background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imStickyBar_imMenuObject_117 ul ul li.imPage:hover > .label-wrapper .label, #imStickyBar_imMenuObject_117 ul ul li.imPage:hover > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 11pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(0, 152, 70, 1);font-weight: bold;} /* Level menu separator button style */ #imStickyBar_imMenuObject_117 ul ul .imMnMnSeparator > .label-wrapper {background-color: rgba(255, 255, 255, 1);background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imStickyBar_imMenuObject_117 ul ul .imMnMnSeparator > .label-wrapper .label, #imStickyBar_imMenuObject_117 ul ul .imMnMnSeparator > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 11pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(31, 112, 174, 1);font-weight: bold;} /* Level menu separation line style */ #imStickyBar_imMenuObject_117 ul ul li::after {display: block; position: relative; height: 0; content: ''; width: 100%; inset-inline-start: 0%; border-block-width: 1px 0px; border-inline-width: 0px; border-color: rgba(0, 152, 70, 1); border-style: solid; } /* Level menu current button style */ #imStickyBar_imMenuObject_117 .imMnMnCurrent > ul > .imMnMnCurrent > .label-wrapper {background-color: rgba(255, 255, 255, 1);background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imStickyBar_imMenuObject_117 .imMnMnCurrent > ul > .imMnMnCurrent > .label-wrapper .label, #imStickyBar_imMenuObject_117 .imMnMnCurrent > ul > .imMnMnCurrent > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 11pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(0, 152, 70, 1);font-weight: bold;} #imStickyBar_imMenuObject_117 ul ul { z-index: 2; }/* Level menu show/hide directives */ #imStickyBar_imMenuObject_117 .multiple-column {position: absolute; z-index: 2;inset-inline-start: 0px; } #imStickyBar_imMenuObject_117 .multiple-column > ul {position: static; display: inline-block;vertical-align: top;} #imStickyBar_imMenuObject_117 .multiple-column > ul > li {display: block;} #imStickyBar_imMenuObject_117_container > ul > li > ul {position: absolute; top: 47px; } #imStickyBar_imMenuObject_117_container > ul > li > ul.open-bottom { inset-inline-start: 0px; } #imStickyBar_imMenuObject_117_container > ul > li > ul.open-left { inset-inline-end: 195px; } #imStickyBar_imMenuObject_117_container > ul > li > ul.open-right { inset-inline-start: 195px; } #imStickyBar_imMenuObject_117_container > ul > li > ul ul, #imStickyBar_imMenuObject_117_container .multiple-column > ul > li ul {position: absolute; top: 0; } #imStickyBar_imMenuObject_117_container > ul > li > ul ul.open-left, #imStickyBar_imMenuObject_117_container .multiple-column > ul > li ul.open-left{ inset-inline-end: 250px; } #imStickyBar_imMenuObject_117_container > ul > li > ul ul.open-right, #imStickyBar_imMenuObject_117_container .multiple-column > ul > li ul.open-right{ inset-inline-start: 250px; } #imStickyBar_imMenuObject_117 ul > li > ul, #imStickyBar_imMenuObject_117 .multiple-column { display: none; } #imStickyBar_imMenuObject_117_container > ul > li:nth-child(6n+1) { margin-inline-start: 0px; clear: left; clear: inline-start; } #imStickyBar_imMenuObject_117_container > ul > li:nth-child(n+7) { margin-top: 0px; } #imStickyBar_imMenuObject_117-menu-opened { display: none; } #imStickyBar_imMenuObject_117 .hamburger-component { display: none; } #imStickyBar_imObjectButton_118_wrapper { display: none; } #imStickyBar_imCell_118 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_118 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectButton_118 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_118 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectButton_118_button { margin: 0px; } #imStickyBar_imObjectButton_119_wrapper { display: none; } #imStickyBar_imCell_119 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_119 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectButton_119 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_119 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectButton_119_button { margin: 0px; } } @media (max-width: 1199.9px) and (min-width: 720.0px) { #imStickyBar_imObjectImage_100_wrapper { display: none; } #imStickyBar_imObjectImage_100_wrapper img {-webkit-clip-path: inset(0 0 -48.305% 0);clip-path: inset(0 0 -48.305% 0);}#imStickyBar_imCell_100 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_100 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectImage_100 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_100 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectImage_69_wrapper { display: none; } #imStickyBar_imObjectImage_69_wrapper img {-webkit-clip-path: inset(0 0 9.091% 0);clip-path: inset(0 0 9.091% 0);}#imStickyBar_imCell_69 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_69 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectImage_69 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_69 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectImage_70_wrapper { display: none; } #imStickyBar_imObjectImage_70_wrapper img {-webkit-clip-path: inset(0 0 -5.556% 0);clip-path: inset(0 0 -5.556% 0);}#imStickyBar_imCell_70 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_70 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectImage_70 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_70 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectButton_88_wrapper { display: none; } #imStickyBar_imCell_88 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_88 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectButton_88 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_88 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectButton_88_button { margin: 0px; } #imStickyBar_imObjectButton_95_wrapper { display: none; } #imStickyBar_imCell_95 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_95 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectButton_95 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_95 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectButton_95_button { margin: 0px; } #imStickyBar_imObjectImage_98_wrapper { display: none; } #imStickyBar_imObjectImage_98_wrapper img {-webkit-clip-path: inset(0 0 -60% 0);clip-path: inset(0 0 -60% 0);}#imStickyBar_imCell_98 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_98 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectImage_98 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_98 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectImage_104_wrapper { display: none; } #imStickyBar_imObjectImage_104_wrapper img {-webkit-clip-path: inset(0 0 0% 0);clip-path: inset(0 0 0% 0);}#imStickyBar_imCell_104 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_104 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectImage_104 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_104 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectImage_105_wrapper { position: absolute; top: 2px; inset-inline-start: 2px; width: 74px; height: 49px; text-align: center; z-index: 1009; overflow: hidden; } #imStickyBar_imObjectImage_105_wrapper img {-webkit-clip-path: inset(0 0 -2.083% 0);clip-path: inset(0 0 -2.083% 0);}#imStickyBar_imCell_105 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_105 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectImage_105 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_105 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectButton_106_wrapper { display: none; } #imStickyBar_imCell_106 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_106 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectButton_106 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_106 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectButton_106_button { margin: 0px; } #imStickyBar_imObjectButton_107_wrapper { display: none; } #imStickyBar_imCell_107 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_107 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectButton_107 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_107 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectButton_107_button { margin: 0px; } #imStickyBar_imObjectButton_108_wrapper { display: none; } #imStickyBar_imCell_108 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_108 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectButton_108 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_108 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectButton_108_button { margin: 0px; } #imStickyBar_imObjectButton_112_wrapper { display: none; } #imStickyBar_imCell_112 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_112 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectButton_112 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_112 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectButton_112_button { margin: 0px; } #imStickyBar_pluginAppObj_114_wrapper { display: none; } #imStickyBar_imCell_114 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_114 { grid-template-rows: [row-content] auto ; } #imStickyBar_pluginAppObj_114 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_114 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectImage_115_wrapper { display: none; } #imStickyBar_imObjectImage_115_wrapper img {-webkit-clip-path: inset(0 0 -29.167% 0);clip-path: inset(0 0 -29.167% 0);}#imStickyBar_imCell_115 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_115 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectImage_115 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_115 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imMenuObject_117_wrapper { position: absolute; top: 5px; inset-inline-start: 669px; width: 48px; height: 49px; text-align: center; z-index: 1016; } #imStickyBar_imCell_117 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_117 { grid-template-rows: [row-content] auto ; } #imStickyBar_imMenuObject_117 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_117 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } /* Main menu background */ #imStickyBar_imMenuObject_117_container { border: solid; border-block-color: transparent transparent; border-inline-color: transparent transparent; border-width: 0px; border-radius: 0px; width: 100%; box-sizing: border-box; background-color: transparent; padding: 0px; display: inline-table;} #imStickyBar_imMenuObject_117_container > ul:after {content: '';display: table;clear: both; } /* Main menu button size and position */ #imStickyBar_imMenuObject_117_container > ul > li {position: relative;margin-inline-start: 0px; margin-top: 0px; display: inline-block; vertical-align: top; } #imStickyBar_imMenuObject_117_container > ul > li > .label-wrapper, #imStickyBar_imMenuObject_117_container > ul > li > div > .label-wrapper { display: block; overflow: hidden; width: 193px; height: 47px; padding-block: 0px; padding-inline: 1px; border-width: 0px; border-radius: 0px; } #imStickyBar_imMenuObject_117_container > ul > li > .label-wrapper:has(:focus-visible), #imStickyBar_imMenuObject_117_container > ul > li > div > .label-wrapper:has(:focus-visible) { overflow: visible; } #imStickyBar_imMenuObject_117 .hamburger-button {cursor: pointer; width: 47px; height: 47px; display: inline-block; vertical-align: top; padding: 0; box-sizing: content-box; border-width: 0px; border-radius: 0px; } #imStickyBar_imMenuObject_117 .hamburger-bar { margin: 5px auto; width: 65%; height: 5px; background-color: rgba(31, 112, 174, 1); display: block; } #imStickyBar_imMenuObject_117 .label-inner-wrapper, #imStickyBar_imMenuObject_117 .hamburger-button > div { display: table; width: 100%; height: 100%; position: relative; z-index: 1; } #imStickyBar_imMenuObject_117_container > ul > li .label, #imStickyBar_imMenuObject_117 .hamburger-button > div > div { display: table-cell; vertical-align: middle; } /* Main menu default button style */ #imStickyBar_imMenuObject_117_container > ul > li > .label-wrapper {background-color: transparent;background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imStickyBar_imMenuObject_117_container > ul > li > .label-wrapper .label, #imStickyBar_imMenuObject_117_container > ul > li > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(31, 112, 174, 1);font-weight: bold;} /* Hamburger button style */ #imStickyBar_imMenuObject_117 .hamburger-button {background-color: transparent;background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imStickyBar_imMenuObject_117 .hamburger-button .label, #imStickyBar_imMenuObject_117 .hamburger-button button {width: 100%;height: 100%;font-family: Arial;font-size: 11pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(31, 112, 174, 1);font-weight: normal;} /* Main menu current button style */ #imStickyBar_imMenuObject_117_container > ul > .imMnMnCurrent > .label-wrapper {background-color: transparent;background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imStickyBar_imMenuObject_117_container > ul > .imMnMnCurrent > .label-wrapper .label, #imStickyBar_imMenuObject_117_container > ul > .imMnMnCurrent > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(0, 152, 70, 1);font-weight: bold;} /* Main menu hover button style */ #imStickyBar_imMenuObject_117_container > ul > li.imPage > .label-wrapper.label-wrapper-over {background-color: transparent;background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imStickyBar_imMenuObject_117_container > ul > li.imPage > .label-wrapper.label-wrapper-over .label, #imStickyBar_imMenuObject_117_container > ul > li.imPage > .label-wrapper.label-wrapper-over button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(0, 152, 70, 1);font-weight: bold;} #imStickyBar_imMenuObject_117_container > ul > li.imPage > .label-wrapper.label-wrapper-over { position: absolute; top: 0; left: 0; z-index: -1; opacity: 0; transition: opacity 0.5s;}#imStickyBar_imMenuObject_117_container > ul > li.imPage > .label-wrapper.label-wrapper-over.animated {z-index: 1; opacity: 1;}#imStickyBar_imMenuObject_117_container > ul > li.imLevel > .label-wrapper.label-wrapper-over {background-color: transparent;background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imStickyBar_imMenuObject_117_container > ul > li.imLevel > .label-wrapper.label-wrapper-over .label, #imStickyBar_imMenuObject_117_container > ul > li.imLevel > .label-wrapper.label-wrapper-over button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(0, 152, 70, 1);font-weight: bold;} #imStickyBar_imMenuObject_117_container > ul > li.imLevel > .label-wrapper.label-wrapper-over { position: absolute; top: 0; left: 0; z-index: -1; opacity: 0; transition: opacity 0.5s;}#imStickyBar_imMenuObject_117_container > ul > li.imLevel > .label-wrapper.label-wrapper-over.animated {z-index: 1; opacity: 1;}/* Main menu separator button style */ #imStickyBar_imMenuObject_117_container > ul > .imMnMnSeparator > .label-wrapper {background-color: rgba(255, 255, 255, 1);background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imStickyBar_imMenuObject_117_container > ul > .imMnMnSeparator > .label-wrapper .label, #imStickyBar_imMenuObject_117_container > ul > .imMnMnSeparator > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(0, 0, 0, 1);font-weight: bold;} #imStickyBar_imMenuObject_117 .imLevel { cursor: default; } #imStickyBar_imMenuObject_117-menu-opened .imLevel { cursor: default; } #imStickyBar_imMenuObject_117 { text-align: center; } #imStickyBar_imMenuObject_117 .hidden { display: none; } #imStickyBar_imMenuObject_117-menu-opened { overflow: visible; z-index: 10402; } #imStickyBar_imMenuObject_117-menu-opened ul ul { display: none; } #imStickyBar_imMenuObject_117-menu-opened li > div { display: none; } #imStickyBar_imMenuObject_117-menu-opened #imStickyBar_imMenuObject_117_container-menu-opened div > ul { display: block; } #imStickyBar_imMenuObject_117-menu-opened #imStickyBar_imMenuObject_117_container-menu-opened > ul { position: absolute; inset-inline-end: 0px; inset-inline-start: auto; top: 40px; background-color: rgba(255, 255, 255, 1); overflow-x: hidden; overflow-y: auto; height: calc(100% - 40px); width: 100%; } #imStickyBar_imMenuObject_117-menu-opened .hamburger-menu-close-button { display: block; font-family: Arial; font-size: 30px; text-align: end; padding-block: 5px; padding-inline: 10px; color: rgba(31, 112, 174, 1); } #imStickyBar_imMenuObject_117-menu-opened .hamburger-menu-close-button span { cursor: pointer; } #imStickyBar_imMenuObject_117-menu-opened { position:fixed; top: 0; bottom: 0; inset-inline-end: 0px; width: 310px; border: solid; border-block-color: transparent transparent; border-inline-color: transparent transparent; border-width: 0px; border-radius: 0px; ; } #imPageExtContainer:after{ position: fixed; top: 0; inset-inline-end: 0px; width: 0; height: 0; content: ''; opacity: 0; transition: opacity 1000ms; z-index: 10401;} .menu-imStickyBar_imMenuObject_117-opened #imPageExtContainer:after{ width: 100%; height: 100%; background-color: rgba(243, 243, 243, 1); opacity: 0.6;} .menu-imStickyBar_imMenuObject_117-towards-closing #imPageExtContainer:after { width: 100%; height: 100%; background-color: transparent; opacity: 0.6; transition: background-color 1000ms linear, opacity;} #imStickyBar_imMenuObject_117 .hidden { display: none; } /* Responsive menu button size and position */ #imStickyBar_imMenuObject_117-menu-opened li {position: relative;margin-bottom: 5px; display: inline-block; vertical-align: top; } #imStickyBar_imMenuObject_117-menu-opened li:last-child {margin-bottom: 0px; } #imStickyBar_imMenuObject_117-menu-opened .label-wrapper { display: block; overflow: hidden; position: relative; width: 292px; height: 71px; padding-block: 0px; padding-inline: 9px; } #imStickyBar_imMenuObject_117-menu-opened .label-inner-wrapper { display: table; width: 100%; height: 100%; z-index: 1; position: relative; } #imStickyBar_imMenuObject_117-menu-opened .label { display: table-cell; vertical-align: middle; } #imStickyBar_imMenuObject_117-menu-opened .hamburger-menu-background { position: absolute;display: block;top: 0;bottom: 0;width: 310px;inset-inline-end: 0px; inset-inline-start: auto; background-color: rgba(255, 255, 255, 1);transition: left 500ms, right 500ms, opacity 500ms;} /* Responsive menu default button style */ #imStickyBar_imMenuObject_117-menu-opened ul > li > .label-wrapper {background-color: transparent;background-image: none;} #imStickyBar_imMenuObject_117-menu-opened ul > li > .label-wrapper .label, #imStickyBar_imMenuObject_117-menu-opened ul > li > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(31, 112, 174, 1);font-weight: bold;} #imStickyBar_imMenuObject_117-menu-opened ul ul > li > .label-wrapper {background-color: transparent;background-image: none;} #imStickyBar_imMenuObject_117-menu-opened ul ul > li > .label-wrapper .label, #imStickyBar_imMenuObject_117-menu-opened ul ul > li > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(31, 112, 174, 1);font-weight: bold;} #imStickyBar_imMenuObject_117-menu-opened ul ul ul > li > .label-wrapper {background-color: transparent;background-image: none;} #imStickyBar_imMenuObject_117-menu-opened ul ul ul > li > .label-wrapper .label, #imStickyBar_imMenuObject_117-menu-opened ul ul ul > li > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(31, 112, 174, 1);font-weight: bold;} #imStickyBar_imMenuObject_117-menu-opened ul ul ul ul > li > .label-wrapper {background-color: transparent;background-image: none;} #imStickyBar_imMenuObject_117-menu-opened ul ul ul ul > li > .label-wrapper .label, #imStickyBar_imMenuObject_117-menu-opened ul ul ul ul > li > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(31, 112, 174, 1);font-weight: bold;} /* Responsive menu hover button style */ #imStickyBar_imMenuObject_117-menu-opened ul > li:hover:not(.imMnMnSeparator) > .label-wrapper {background-color: transparent;background-image: none;} #imStickyBar_imMenuObject_117-menu-opened ul > li:hover:not(.imMnMnSeparator) > .label-wrapper .label, #imStickyBar_imMenuObject_117-menu-opened ul > li:hover:not(.imMnMnSeparator) > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(0, 189, 102, 1);font-weight: bold;} /* Responsive menu current button style */ #imStickyBar_imMenuObject_117-menu-opened #imStickyBar_imMenuObject_117_container-menu-opened > ul > .imMnMnCurrent > .label-wrapper {background-color: transparent;background-image: none;} #imStickyBar_imMenuObject_117-menu-opened #imStickyBar_imMenuObject_117_container-menu-opened > ul > .imMnMnCurrent > .label-wrapper .label, #imStickyBar_imMenuObject_117-menu-opened #imStickyBar_imMenuObject_117_container-menu-opened > ul > .imMnMnCurrent > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(0, 189, 102, 1);font-weight: bold;} #imStickyBar_imMenuObject_117-menu-opened .imMnMnCurrent > ul > .imMnMnCurrent > .label-wrapper {background-color: transparent;background-image: none;} #imStickyBar_imMenuObject_117-menu-opened .imMnMnCurrent > ul > .imMnMnCurrent > .label-wrapper .label, #imStickyBar_imMenuObject_117-menu-opened .imMnMnCurrent > ul > .imMnMnCurrent > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(0, 189, 102, 1);font-weight: bold;} /* Responsive menu separator button style */ #imStickyBar_imMenuObject_117-menu-opened ul > .imMnMnSeparator > .label-wrapper {background-color: transparent;background-image: none;} #imStickyBar_imMenuObject_117-menu-opened ul > .imMnMnSeparator > .label-wrapper .label, #imStickyBar_imMenuObject_117-menu-opened ul > .imMnMnSeparator > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(31, 112, 174, 1);font-weight: bold;} /* Responsive menu separation line style */ #imStickyBar_imMenuObject_117-menu-opened ul li::after {display: block; position: relative; height: 0; content: ''; width: 100%; inset-inline-start: 0%; border-block-width: 1px 0px; border-inline-width: 0px; border-color: rgba(8, 156, 68, 1); border-style: solid; } #imStickyBar_imMenuObject_117-menu-opened { transform: translate3d(310px, 0 ,0); transition: transform 1000ms;} #imStickyBar_imMenuObject_117-menu-opened.animated { transform: translate3d(0, 0, 0);} #imStickyBar_imObjectButton_118_wrapper { position: absolute; top: 8px; inset-inline-start: 187px; width: 387px; height: 39px; text-align: center; z-index: 1017; } #imStickyBar_imCell_118 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_118 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectButton_118 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_118 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectButton_118_button { margin: 0px; } #imStickyBar_imObjectButton_119_wrapper { display: none; } #imStickyBar_imCell_119 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_119 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectButton_119 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_119 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectButton_119_button { margin: 0px; } } @media (max-width: 719.9px) and (min-width: 480.0px) { #imStickyBar_imObjectImage_100_wrapper { display: none; } #imStickyBar_imObjectImage_100_wrapper img {-webkit-clip-path: inset(0 0 7.143% 0);clip-path: inset(0 0 7.143% 0);}#imStickyBar_imCell_100 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_100 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectImage_100 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_100 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectImage_69_wrapper { display: none; } #imStickyBar_imObjectImage_69_wrapper img {-webkit-clip-path: inset(0 0 11.364% 0);clip-path: inset(0 0 11.364% 0);}#imStickyBar_imCell_69 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_69 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectImage_69 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_69 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectImage_70_wrapper { display: none; } #imStickyBar_imObjectImage_70_wrapper img {-webkit-clip-path: inset(0 0 51.724% 0);clip-path: inset(0 0 51.724% 0);}#imStickyBar_imCell_70 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_70 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectImage_70 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_70 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectButton_88_wrapper { display: none; } #imStickyBar_imCell_88 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_88 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectButton_88 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_88 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectButton_88_button { margin: 0px; } #imStickyBar_imObjectButton_95_wrapper { display: none; } #imStickyBar_imCell_95 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_95 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectButton_95 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_95 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectButton_95_button { margin: 0px; } #imStickyBar_imObjectImage_98_wrapper { position: absolute; top: 2px; inset-inline-start: 3px; width: 73px; height: 47px; text-align: center; z-index: 1006; overflow: hidden; } #imStickyBar_imObjectImage_98_wrapper img {-webkit-clip-path: inset(0 0 2.083% 0);clip-path: inset(0 0 2.083% 0);}#imStickyBar_imCell_98 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_98 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectImage_98 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_98 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectImage_104_wrapper { display: none; } #imStickyBar_imObjectImage_104_wrapper img {-webkit-clip-path: inset(0 0 0% 0);clip-path: inset(0 0 0% 0);}#imStickyBar_imCell_104 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_104 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectImage_104 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_104 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectImage_105_wrapper { display: none; } #imStickyBar_imObjectImage_105_wrapper img {-webkit-clip-path: inset(0 0 52.137% 0);clip-path: inset(0 0 52.137% 0);}#imStickyBar_imCell_105 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_105 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectImage_105 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_105 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectButton_106_wrapper { display: none; } #imStickyBar_imCell_106 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_106 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectButton_106 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_106 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectButton_106_button { margin: 0px; } #imStickyBar_imObjectButton_107_wrapper { display: none; } #imStickyBar_imCell_107 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_107 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectButton_107 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_107 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectButton_107_button { margin: 0px; } #imStickyBar_imObjectButton_108_wrapper { display: none; } #imStickyBar_imCell_108 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_108 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectButton_108 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_108 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectButton_108_button { margin: 0px; } #imStickyBar_imObjectButton_112_wrapper { display: none; } #imStickyBar_imCell_112 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_112 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectButton_112 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_112 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectButton_112_button { margin: 0px; } #imStickyBar_pluginAppObj_114_wrapper { display: none; } #imStickyBar_imCell_114 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_114 { grid-template-rows: [row-content] auto ; } #imStickyBar_pluginAppObj_114 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_114 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectImage_115_wrapper { display: none; } #imStickyBar_imObjectImage_115_wrapper img {-webkit-clip-path: inset(0 0 -29.167% 0);clip-path: inset(0 0 -29.167% 0);}#imStickyBar_imCell_115 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_115 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectImage_115 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_115 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imMenuObject_117_wrapper { position: absolute; top: 2px; inset-inline-start: 425px; width: 48px; height: 46px; text-align: center; z-index: 1016; } #imStickyBar_imCell_117 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_117 { grid-template-rows: [row-content] auto ; } #imStickyBar_imMenuObject_117 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_117 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } /* Main menu background */ #imStickyBar_imMenuObject_117_container { border: solid; border-block-color: transparent transparent; border-inline-color: transparent transparent; border-width: 0px; border-radius: 0px; width: 100%; box-sizing: border-box; background-color: transparent; padding: 0px; display: inline-table;} #imStickyBar_imMenuObject_117_container > ul:after {content: '';display: table;clear: both; } /* Main menu button size and position */ #imStickyBar_imMenuObject_117_container > ul > li {position: relative;margin-inline-start: 0px; margin-top: 0px; display: inline-block; vertical-align: top; } #imStickyBar_imMenuObject_117_container > ul > li > .label-wrapper, #imStickyBar_imMenuObject_117_container > ul > li > div > .label-wrapper { display: block; overflow: hidden; width: 193px; height: 47px; padding-block: 0px; padding-inline: 1px; border-width: 0px; border-radius: 0px; } #imStickyBar_imMenuObject_117_container > ul > li > .label-wrapper:has(:focus-visible), #imStickyBar_imMenuObject_117_container > ul > li > div > .label-wrapper:has(:focus-visible) { overflow: visible; } #imStickyBar_imMenuObject_117 .hamburger-button {cursor: pointer; width: 47px; height: 47px; display: inline-block; vertical-align: top; padding: 0; box-sizing: content-box; border-width: 0px; border-radius: 0px; } #imStickyBar_imMenuObject_117 .hamburger-bar { margin: 5px auto; width: 65%; height: 5px; background-color: rgba(31, 112, 174, 1); display: block; } #imStickyBar_imMenuObject_117 .label-inner-wrapper, #imStickyBar_imMenuObject_117 .hamburger-button > div { display: table; width: 100%; height: 100%; position: relative; z-index: 1; } #imStickyBar_imMenuObject_117_container > ul > li .label, #imStickyBar_imMenuObject_117 .hamburger-button > div > div { display: table-cell; vertical-align: middle; } /* Main menu default button style */ #imStickyBar_imMenuObject_117_container > ul > li > .label-wrapper {background-color: transparent;background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imStickyBar_imMenuObject_117_container > ul > li > .label-wrapper .label, #imStickyBar_imMenuObject_117_container > ul > li > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(31, 112, 174, 1);font-weight: bold;} /* Hamburger button style */ #imStickyBar_imMenuObject_117 .hamburger-button {background-color: transparent;background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imStickyBar_imMenuObject_117 .hamburger-button .label, #imStickyBar_imMenuObject_117 .hamburger-button button {width: 100%;height: 100%;font-family: Arial;font-size: 11pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(31, 112, 174, 1);font-weight: normal;} /* Main menu current button style */ #imStickyBar_imMenuObject_117_container > ul > .imMnMnCurrent > .label-wrapper {background-color: transparent;background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imStickyBar_imMenuObject_117_container > ul > .imMnMnCurrent > .label-wrapper .label, #imStickyBar_imMenuObject_117_container > ul > .imMnMnCurrent > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(0, 152, 70, 1);font-weight: bold;} /* Main menu hover button style */ #imStickyBar_imMenuObject_117_container > ul > li.imPage > .label-wrapper.label-wrapper-over {background-color: transparent;background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imStickyBar_imMenuObject_117_container > ul > li.imPage > .label-wrapper.label-wrapper-over .label, #imStickyBar_imMenuObject_117_container > ul > li.imPage > .label-wrapper.label-wrapper-over button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(0, 152, 70, 1);font-weight: bold;} #imStickyBar_imMenuObject_117_container > ul > li.imPage > .label-wrapper.label-wrapper-over { position: absolute; top: 0; left: 0; z-index: -1; opacity: 0; transition: opacity 0.5s;}#imStickyBar_imMenuObject_117_container > ul > li.imPage > .label-wrapper.label-wrapper-over.animated {z-index: 1; opacity: 1;}#imStickyBar_imMenuObject_117_container > ul > li.imLevel > .label-wrapper.label-wrapper-over {background-color: transparent;background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imStickyBar_imMenuObject_117_container > ul > li.imLevel > .label-wrapper.label-wrapper-over .label, #imStickyBar_imMenuObject_117_container > ul > li.imLevel > .label-wrapper.label-wrapper-over button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(0, 152, 70, 1);font-weight: bold;} #imStickyBar_imMenuObject_117_container > ul > li.imLevel > .label-wrapper.label-wrapper-over { position: absolute; top: 0; left: 0; z-index: -1; opacity: 0; transition: opacity 0.5s;}#imStickyBar_imMenuObject_117_container > ul > li.imLevel > .label-wrapper.label-wrapper-over.animated {z-index: 1; opacity: 1;}/* Main menu separator button style */ #imStickyBar_imMenuObject_117_container > ul > .imMnMnSeparator > .label-wrapper {background-color: rgba(255, 255, 255, 1);background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imStickyBar_imMenuObject_117_container > ul > .imMnMnSeparator > .label-wrapper .label, #imStickyBar_imMenuObject_117_container > ul > .imMnMnSeparator > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(0, 0, 0, 1);font-weight: bold;} #imStickyBar_imMenuObject_117 .imLevel { cursor: default; } #imStickyBar_imMenuObject_117-menu-opened .imLevel { cursor: default; } #imStickyBar_imMenuObject_117 { text-align: center; } #imStickyBar_imMenuObject_117 .hidden { display: none; } #imStickyBar_imMenuObject_117-menu-opened { overflow: visible; z-index: 10402; } #imStickyBar_imMenuObject_117-menu-opened ul ul { display: none; } #imStickyBar_imMenuObject_117-menu-opened li > div { display: none; } #imStickyBar_imMenuObject_117-menu-opened #imStickyBar_imMenuObject_117_container-menu-opened div > ul { display: block; } #imStickyBar_imMenuObject_117-menu-opened #imStickyBar_imMenuObject_117_container-menu-opened > ul { position: absolute; inset-inline-end: 0px; inset-inline-start: auto; top: 40px; background-color: rgba(255, 255, 255, 1); overflow-x: hidden; overflow-y: auto; height: calc(100% - 40px); width: 100%; } #imStickyBar_imMenuObject_117-menu-opened .hamburger-menu-close-button { display: block; font-family: Arial; font-size: 30px; text-align: end; padding-block: 5px; padding-inline: 10px; color: rgba(31, 112, 174, 1); } #imStickyBar_imMenuObject_117-menu-opened .hamburger-menu-close-button span { cursor: pointer; } #imStickyBar_imMenuObject_117-menu-opened { position:fixed; top: 0; bottom: 0; inset-inline-end: 0px; width: 310px; border: solid; border-block-color: transparent transparent; border-inline-color: transparent transparent; border-width: 0px; border-radius: 0px; ; } #imPageExtContainer:after{ position: fixed; top: 0; inset-inline-end: 0px; width: 0; height: 0; content: ''; opacity: 0; transition: opacity 1000ms; z-index: 10401;} .menu-imStickyBar_imMenuObject_117-opened #imPageExtContainer:after{ width: 100%; height: 100%; background-color: rgba(243, 243, 243, 1); opacity: 0.6;} .menu-imStickyBar_imMenuObject_117-towards-closing #imPageExtContainer:after { width: 100%; height: 100%; background-color: transparent; opacity: 0.6; transition: background-color 1000ms linear, opacity;} #imStickyBar_imMenuObject_117 .hidden { display: none; } /* Responsive menu button size and position */ #imStickyBar_imMenuObject_117-menu-opened li {position: relative;margin-bottom: 5px; display: inline-block; vertical-align: top; } #imStickyBar_imMenuObject_117-menu-opened li:last-child {margin-bottom: 0px; } #imStickyBar_imMenuObject_117-menu-opened .label-wrapper { display: block; overflow: hidden; position: relative; width: 292px; height: 71px; padding-block: 0px; padding-inline: 9px; } #imStickyBar_imMenuObject_117-menu-opened .label-inner-wrapper { display: table; width: 100%; height: 100%; z-index: 1; position: relative; } #imStickyBar_imMenuObject_117-menu-opened .label { display: table-cell; vertical-align: middle; } #imStickyBar_imMenuObject_117-menu-opened .hamburger-menu-background { position: absolute;display: block;top: 0;bottom: 0;width: 310px;inset-inline-end: 0px; inset-inline-start: auto; background-color: rgba(255, 255, 255, 1);transition: left 500ms, right 500ms, opacity 500ms;} /* Responsive menu default button style */ #imStickyBar_imMenuObject_117-menu-opened ul > li > .label-wrapper {background-color: transparent;background-image: none;} #imStickyBar_imMenuObject_117-menu-opened ul > li > .label-wrapper .label, #imStickyBar_imMenuObject_117-menu-opened ul > li > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(31, 112, 174, 1);font-weight: bold;} #imStickyBar_imMenuObject_117-menu-opened ul ul > li > .label-wrapper {background-color: transparent;background-image: none;} #imStickyBar_imMenuObject_117-menu-opened ul ul > li > .label-wrapper .label, #imStickyBar_imMenuObject_117-menu-opened ul ul > li > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(31, 112, 174, 1);font-weight: bold;} #imStickyBar_imMenuObject_117-menu-opened ul ul ul > li > .label-wrapper {background-color: transparent;background-image: none;} #imStickyBar_imMenuObject_117-menu-opened ul ul ul > li > .label-wrapper .label, #imStickyBar_imMenuObject_117-menu-opened ul ul ul > li > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(31, 112, 174, 1);font-weight: bold;} #imStickyBar_imMenuObject_117-menu-opened ul ul ul ul > li > .label-wrapper {background-color: transparent;background-image: none;} #imStickyBar_imMenuObject_117-menu-opened ul ul ul ul > li > .label-wrapper .label, #imStickyBar_imMenuObject_117-menu-opened ul ul ul ul > li > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(31, 112, 174, 1);font-weight: bold;} /* Responsive menu hover button style */ #imStickyBar_imMenuObject_117-menu-opened ul > li:hover:not(.imMnMnSeparator) > .label-wrapper {background-color: transparent;background-image: none;} #imStickyBar_imMenuObject_117-menu-opened ul > li:hover:not(.imMnMnSeparator) > .label-wrapper .label, #imStickyBar_imMenuObject_117-menu-opened ul > li:hover:not(.imMnMnSeparator) > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(0, 189, 102, 1);font-weight: bold;} /* Responsive menu current button style */ #imStickyBar_imMenuObject_117-menu-opened #imStickyBar_imMenuObject_117_container-menu-opened > ul > .imMnMnCurrent > .label-wrapper {background-color: transparent;background-image: none;} #imStickyBar_imMenuObject_117-menu-opened #imStickyBar_imMenuObject_117_container-menu-opened > ul > .imMnMnCurrent > .label-wrapper .label, #imStickyBar_imMenuObject_117-menu-opened #imStickyBar_imMenuObject_117_container-menu-opened > ul > .imMnMnCurrent > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(0, 189, 102, 1);font-weight: bold;} #imStickyBar_imMenuObject_117-menu-opened .imMnMnCurrent > ul > .imMnMnCurrent > .label-wrapper {background-color: transparent;background-image: none;} #imStickyBar_imMenuObject_117-menu-opened .imMnMnCurrent > ul > .imMnMnCurrent > .label-wrapper .label, #imStickyBar_imMenuObject_117-menu-opened .imMnMnCurrent > ul > .imMnMnCurrent > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(0, 189, 102, 1);font-weight: bold;} /* Responsive menu separator button style */ #imStickyBar_imMenuObject_117-menu-opened ul > .imMnMnSeparator > .label-wrapper {background-color: transparent;background-image: none;} #imStickyBar_imMenuObject_117-menu-opened ul > .imMnMnSeparator > .label-wrapper .label, #imStickyBar_imMenuObject_117-menu-opened ul > .imMnMnSeparator > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(31, 112, 174, 1);font-weight: bold;} /* Responsive menu separation line style */ #imStickyBar_imMenuObject_117-menu-opened ul li::after {display: block; position: relative; height: 0; content: ''; width: 100%; inset-inline-start: 0%; border-block-width: 1px 0px; border-inline-width: 0px; border-color: rgba(8, 156, 68, 1); border-style: solid; } #imStickyBar_imMenuObject_117-menu-opened { transform: translate3d(310px, 0 ,0); transition: transform 1000ms;} #imStickyBar_imMenuObject_117-menu-opened.animated { transform: translate3d(0, 0, 0);} #imStickyBar_imObjectButton_118_wrapper { position: absolute; top: 8px; inset-inline-start: 77px; width: 350px; height: 39px; text-align: center; z-index: 1017; } #imStickyBar_imCell_118 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_118 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectButton_118 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_118 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectButton_118_button { margin: 0px; } #imStickyBar_imObjectButton_119_wrapper { display: none; } #imStickyBar_imCell_119 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_119 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectButton_119 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleBorders_119 { border-top: 0; border-bottom: 0; border-inline-start-width: 0px; border-inline-end-width: 0px; } #imStickyBar_imObjectButton_119_button { margin: 0px; } } @media (max-width: 479.9px) { #imStickyBar_imObjectImage_100_wrapper { position: absolute; top: 2px; inset-inline-start: 2px; width: 61px; height: 42px; text-align: center; z-index: 1002; overflow: hidden; } #imStickyBar_imObjectImage_100_wrapper img {-webkit-clip-path: inset(0 0 -7.692% 0);clip-path: inset(0 0 -7.692% 0);}#imStickyBar_imCell_100 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_100 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectImage_100 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleGraphics_100 { box-sizing: border-box; } #imStickyBar_imObjectImage_69_wrapper { display: none; } #imStickyBar_imObjectImage_69_wrapper img {-webkit-clip-path: inset(0 0 2.632% 0);clip-path: inset(0 0 2.632% 0);}#imStickyBar_imCell_69 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_69 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectImage_69 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleGraphics_69 { box-sizing: border-box; } #imStickyBar_imObjectImage_70_wrapper { display: none; } #imStickyBar_imObjectImage_70_wrapper img {-webkit-clip-path: inset(0 0 50.495% 0);clip-path: inset(0 0 50.495% 0);}#imStickyBar_imCell_70 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_70 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectImage_70 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleGraphics_70 { box-sizing: border-box; } #imStickyBar_imObjectButton_88_wrapper { display: none; } #imStickyBar_imCell_88 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_88 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectButton_88 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleGraphics_88 { box-sizing: border-box; } #imStickyBar_imObjectButton_88_button { margin: 0px; } #imStickyBar_imObjectButton_95_wrapper { display: none; } #imStickyBar_imCell_95 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_95 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectButton_95 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleGraphics_95 { box-sizing: border-box; } #imStickyBar_imObjectButton_95_button { margin: 0px; } #imStickyBar_imObjectImage_98_wrapper { display: none; } #imStickyBar_imObjectImage_98_wrapper img {-webkit-clip-path: inset(0 0 -8.738% 0);clip-path: inset(0 0 -8.738% 0);}#imStickyBar_imCell_98 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_98 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectImage_98 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleGraphics_98 { box-sizing: border-box; } #imStickyBar_imObjectImage_104_wrapper { display: none; } #imStickyBar_imObjectImage_104_wrapper img {-webkit-clip-path: inset(0 0 0% 0);clip-path: inset(0 0 0% 0);}#imStickyBar_imCell_104 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_104 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectImage_104 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleGraphics_104 { box-sizing: border-box; } #imStickyBar_imObjectImage_105_wrapper { display: none; } #imStickyBar_imObjectImage_105_wrapper img {-webkit-clip-path: inset(0 0 50.495% 0);clip-path: inset(0 0 50.495% 0);}#imStickyBar_imCell_105 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_105 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectImage_105 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleGraphics_105 { box-sizing: border-box; } #imStickyBar_imObjectButton_106_wrapper { display: none; } #imStickyBar_imCell_106 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_106 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectButton_106 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleGraphics_106 { box-sizing: border-box; } #imStickyBar_imObjectButton_106_button { margin: 0px; } #imStickyBar_imObjectButton_107_wrapper { display: none; } #imStickyBar_imCell_107 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_107 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectButton_107 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleGraphics_107 { box-sizing: border-box; } #imStickyBar_imObjectButton_107_button { margin: 0px; } #imStickyBar_imObjectButton_108_wrapper { display: none; } #imStickyBar_imCell_108 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_108 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectButton_108 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleGraphics_108 { box-sizing: border-box; } #imStickyBar_imObjectButton_108_button { margin: 0px; } #imStickyBar_imObjectButton_112_wrapper { display: none; } #imStickyBar_imCell_112 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_112 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectButton_112 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleGraphics_112 { box-sizing: border-box; } #imStickyBar_imObjectButton_112_button { margin: 0px; } #imStickyBar_pluginAppObj_114_wrapper { display: none; } #imStickyBar_imCell_114 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_114 { grid-template-rows: [row-content] auto ; } #imStickyBar_pluginAppObj_114 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleGraphics_114 { box-sizing: border-box; } #imStickyBar_imObjectImage_115_wrapper { display: none; } #imStickyBar_imObjectImage_115_wrapper img {-webkit-clip-path: inset(0 0 -29.167% 0);clip-path: inset(0 0 -29.167% 0);}#imStickyBar_imCell_115 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_115 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectImage_115 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleGraphics_115 { box-sizing: border-box; } #imStickyBar_imMenuObject_117_wrapper { position: absolute; top: -1px; inset-inline-start: 276px; width: 40px; height: 43px; text-align: center; z-index: 1016; } #imStickyBar_imCell_117 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_117 { grid-template-rows: [row-content] auto ; } #imStickyBar_imMenuObject_117 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleGraphics_117 { box-sizing: border-box; } /* Main menu background */ #imStickyBar_imMenuObject_117_container { border: solid; border-block-color: transparent transparent; border-inline-color: transparent transparent; border-width: 0px; border-radius: 0px; width: 100%; box-sizing: border-box; background-color: transparent; padding: 0px; display: inline-table;} #imStickyBar_imMenuObject_117_container > ul:after {content: '';display: table;clear: both; } /* Main menu button size and position */ #imStickyBar_imMenuObject_117_container > ul > li {position: relative;margin-inline-start: 0px; margin-top: 0px; display: inline-block; vertical-align: top; } #imStickyBar_imMenuObject_117_container > ul > li > .label-wrapper, #imStickyBar_imMenuObject_117_container > ul > li > div > .label-wrapper { display: block; overflow: hidden; width: 193px; height: 47px; padding-block: 0px; padding-inline: 1px; border-width: 0px; border-radius: 0px; } #imStickyBar_imMenuObject_117_container > ul > li > .label-wrapper:has(:focus-visible), #imStickyBar_imMenuObject_117_container > ul > li > div > .label-wrapper:has(:focus-visible) { overflow: visible; } #imStickyBar_imMenuObject_117 .hamburger-button {cursor: pointer; width: 47px; height: 47px; display: inline-block; vertical-align: top; padding: 0; box-sizing: content-box; border-width: 0px; border-radius: 0px; } #imStickyBar_imMenuObject_117 .hamburger-bar { margin: 5px auto; width: 65%; height: 5px; background-color: rgba(31, 112, 174, 1); display: block; } #imStickyBar_imMenuObject_117 .label-inner-wrapper, #imStickyBar_imMenuObject_117 .hamburger-button > div { display: table; width: 100%; height: 100%; position: relative; z-index: 1; } #imStickyBar_imMenuObject_117_container > ul > li .label, #imStickyBar_imMenuObject_117 .hamburger-button > div > div { display: table-cell; vertical-align: middle; } /* Main menu default button style */ #imStickyBar_imMenuObject_117_container > ul > li > .label-wrapper {background-color: transparent;background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imStickyBar_imMenuObject_117_container > ul > li > .label-wrapper .label, #imStickyBar_imMenuObject_117_container > ul > li > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(31, 112, 174, 1);font-weight: bold;} /* Hamburger button style */ #imStickyBar_imMenuObject_117 .hamburger-button {background-color: transparent;background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imStickyBar_imMenuObject_117 .hamburger-button .label, #imStickyBar_imMenuObject_117 .hamburger-button button {width: 100%;height: 100%;font-family: Arial;font-size: 11pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(31, 112, 174, 1);font-weight: normal;} /* Main menu current button style */ #imStickyBar_imMenuObject_117_container > ul > .imMnMnCurrent > .label-wrapper {background-color: transparent;background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imStickyBar_imMenuObject_117_container > ul > .imMnMnCurrent > .label-wrapper .label, #imStickyBar_imMenuObject_117_container > ul > .imMnMnCurrent > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(0, 152, 70, 1);font-weight: bold;} /* Main menu hover button style */ #imStickyBar_imMenuObject_117_container > ul > li.imPage > .label-wrapper.label-wrapper-over {background-color: transparent;background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imStickyBar_imMenuObject_117_container > ul > li.imPage > .label-wrapper.label-wrapper-over .label, #imStickyBar_imMenuObject_117_container > ul > li.imPage > .label-wrapper.label-wrapper-over button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(0, 152, 70, 1);font-weight: bold;} #imStickyBar_imMenuObject_117_container > ul > li.imPage > .label-wrapper.label-wrapper-over { position: absolute; top: 0; left: 0; z-index: -1; opacity: 0; transition: opacity 0.5s;}#imStickyBar_imMenuObject_117_container > ul > li.imPage > .label-wrapper.label-wrapper-over.animated {z-index: 1; opacity: 1;}#imStickyBar_imMenuObject_117_container > ul > li.imLevel > .label-wrapper.label-wrapper-over {background-color: transparent;background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imStickyBar_imMenuObject_117_container > ul > li.imLevel > .label-wrapper.label-wrapper-over .label, #imStickyBar_imMenuObject_117_container > ul > li.imLevel > .label-wrapper.label-wrapper-over button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(0, 152, 70, 1);font-weight: bold;} #imStickyBar_imMenuObject_117_container > ul > li.imLevel > .label-wrapper.label-wrapper-over { position: absolute; top: 0; left: 0; z-index: -1; opacity: 0; transition: opacity 0.5s;}#imStickyBar_imMenuObject_117_container > ul > li.imLevel > .label-wrapper.label-wrapper-over.animated {z-index: 1; opacity: 1;}/* Main menu separator button style */ #imStickyBar_imMenuObject_117_container > ul > .imMnMnSeparator > .label-wrapper {background-color: rgba(255, 255, 255, 1);background-image: none;border-block-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-inline-color: rgba(211, 211, 211, 1) rgba(211, 211, 211, 1); border-style: solid; } #imStickyBar_imMenuObject_117_container > ul > .imMnMnSeparator > .label-wrapper .label, #imStickyBar_imMenuObject_117_container > ul > .imMnMnSeparator > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: center; color: rgba(0, 0, 0, 1);font-weight: bold;} #imStickyBar_imMenuObject_117 .imLevel { cursor: default; } #imStickyBar_imMenuObject_117-menu-opened .imLevel { cursor: default; } #imStickyBar_imMenuObject_117 { text-align: center; } #imStickyBar_imMenuObject_117 .hidden { display: none; } #imStickyBar_imMenuObject_117-menu-opened { overflow: visible; z-index: 10402; } #imStickyBar_imMenuObject_117-menu-opened ul ul { display: none; } #imStickyBar_imMenuObject_117-menu-opened li > div { display: none; } #imStickyBar_imMenuObject_117-menu-opened #imStickyBar_imMenuObject_117_container-menu-opened div > ul { display: block; } #imStickyBar_imMenuObject_117-menu-opened #imStickyBar_imMenuObject_117_container-menu-opened > ul { position: absolute; inset-inline-end: 0px; inset-inline-start: auto; top: 40px; background-color: rgba(255, 255, 255, 1); overflow-x: hidden; overflow-y: auto; height: calc(100% - 40px); width: 100%; } #imStickyBar_imMenuObject_117-menu-opened .hamburger-menu-close-button { display: block; font-family: Arial; font-size: 30px; text-align: end; padding-block: 5px; padding-inline: 10px; color: rgba(31, 112, 174, 1); } #imStickyBar_imMenuObject_117-menu-opened .hamburger-menu-close-button span { cursor: pointer; } #imStickyBar_imMenuObject_117-menu-opened { position:fixed; top: 0; bottom: 0; inset-inline-end: 0px; width: 310px; border: solid; border-block-color: transparent transparent; border-inline-color: transparent transparent; border-width: 0px; border-radius: 0px; ; } #imPageExtContainer:after{ position: fixed; top: 0; inset-inline-end: 0px; width: 0; height: 0; content: ''; opacity: 0; transition: opacity 1000ms; z-index: 10401;} .menu-imStickyBar_imMenuObject_117-opened #imPageExtContainer:after{ width: 100%; height: 100%; background-color: rgba(243, 243, 243, 1); opacity: 0.6;} .menu-imStickyBar_imMenuObject_117-towards-closing #imPageExtContainer:after { width: 100%; height: 100%; background-color: transparent; opacity: 0.6; transition: background-color 1000ms linear, opacity;} #imStickyBar_imMenuObject_117 .hidden { display: none; } /* Responsive menu button size and position */ #imStickyBar_imMenuObject_117-menu-opened li {position: relative;margin-bottom: 5px; display: inline-block; vertical-align: top; } #imStickyBar_imMenuObject_117-menu-opened li:last-child {margin-bottom: 0px; } #imStickyBar_imMenuObject_117-menu-opened .label-wrapper { display: block; overflow: hidden; position: relative; width: 292px; height: 71px; padding-block: 0px; padding-inline: 9px; } #imStickyBar_imMenuObject_117-menu-opened .label-inner-wrapper { display: table; width: 100%; height: 100%; z-index: 1; position: relative; } #imStickyBar_imMenuObject_117-menu-opened .label { display: table-cell; vertical-align: middle; } #imStickyBar_imMenuObject_117-menu-opened .hamburger-menu-background { position: absolute;display: block;top: 0;bottom: 0;width: 310px;inset-inline-end: 0px; inset-inline-start: auto; background-color: rgba(255, 255, 255, 1);transition: left 500ms, right 500ms, opacity 500ms;} /* Responsive menu default button style */ #imStickyBar_imMenuObject_117-menu-opened ul > li > .label-wrapper {background-color: transparent;background-image: none;} #imStickyBar_imMenuObject_117-menu-opened ul > li > .label-wrapper .label, #imStickyBar_imMenuObject_117-menu-opened ul > li > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(31, 112, 174, 1);font-weight: bold;} #imStickyBar_imMenuObject_117-menu-opened ul ul > li > .label-wrapper {background-color: transparent;background-image: none;} #imStickyBar_imMenuObject_117-menu-opened ul ul > li > .label-wrapper .label, #imStickyBar_imMenuObject_117-menu-opened ul ul > li > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(31, 112, 174, 1);font-weight: bold;} #imStickyBar_imMenuObject_117-menu-opened ul ul ul > li > .label-wrapper {background-color: transparent;background-image: none;} #imStickyBar_imMenuObject_117-menu-opened ul ul ul > li > .label-wrapper .label, #imStickyBar_imMenuObject_117-menu-opened ul ul ul > li > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(31, 112, 174, 1);font-weight: bold;} #imStickyBar_imMenuObject_117-menu-opened ul ul ul ul > li > .label-wrapper {background-color: transparent;background-image: none;} #imStickyBar_imMenuObject_117-menu-opened ul ul ul ul > li > .label-wrapper .label, #imStickyBar_imMenuObject_117-menu-opened ul ul ul ul > li > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(31, 112, 174, 1);font-weight: bold;} /* Responsive menu hover button style */ #imStickyBar_imMenuObject_117-menu-opened ul > li:hover:not(.imMnMnSeparator) > .label-wrapper {background-color: transparent;background-image: none;} #imStickyBar_imMenuObject_117-menu-opened ul > li:hover:not(.imMnMnSeparator) > .label-wrapper .label, #imStickyBar_imMenuObject_117-menu-opened ul > li:hover:not(.imMnMnSeparator) > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(0, 189, 102, 1);font-weight: bold;} /* Responsive menu current button style */ #imStickyBar_imMenuObject_117-menu-opened #imStickyBar_imMenuObject_117_container-menu-opened > ul > .imMnMnCurrent > .label-wrapper {background-color: transparent;background-image: none;} #imStickyBar_imMenuObject_117-menu-opened #imStickyBar_imMenuObject_117_container-menu-opened > ul > .imMnMnCurrent > .label-wrapper .label, #imStickyBar_imMenuObject_117-menu-opened #imStickyBar_imMenuObject_117_container-menu-opened > ul > .imMnMnCurrent > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(0, 189, 102, 1);font-weight: bold;} #imStickyBar_imMenuObject_117-menu-opened .imMnMnCurrent > ul > .imMnMnCurrent > .label-wrapper {background-color: transparent;background-image: none;} #imStickyBar_imMenuObject_117-menu-opened .imMnMnCurrent > ul > .imMnMnCurrent > .label-wrapper .label, #imStickyBar_imMenuObject_117-menu-opened .imMnMnCurrent > ul > .imMnMnCurrent > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(0, 189, 102, 1);font-weight: bold;} /* Responsive menu separator button style */ #imStickyBar_imMenuObject_117-menu-opened ul > .imMnMnSeparator > .label-wrapper {background-color: transparent;background-image: none;} #imStickyBar_imMenuObject_117-menu-opened ul > .imMnMnSeparator > .label-wrapper .label, #imStickyBar_imMenuObject_117-menu-opened ul > .imMnMnSeparator > .label-wrapper button {width: 100%;height: 100%;font-family: Arial;font-size: 12pt;font-style: normal;text-decoration: none;text-align: start; color: rgba(31, 112, 174, 1);font-weight: bold;} /* Responsive menu separation line style */ #imStickyBar_imMenuObject_117-menu-opened ul li::after {display: block; position: relative; height: 0; content: ''; width: 100%; inset-inline-start: 0%; border-block-width: 1px 0px; border-inline-width: 0px; border-color: rgba(8, 156, 68, 1); border-style: solid; } #imStickyBar_imMenuObject_117-menu-opened { transform: translate3d(310px, 0 ,0); transition: transform 1000ms;} #imStickyBar_imMenuObject_117-menu-opened.animated { transform: translate3d(0, 0, 0);} #imStickyBar_imObjectButton_118_wrapper { display: none; } #imStickyBar_imCell_118 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_118 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectButton_118 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleGraphics_118 { box-sizing: border-box; } #imStickyBar_imObjectButton_118_button { margin: 0px; } #imStickyBar_imObjectButton_119_wrapper { position: absolute; top: 4px; inset-inline-start: 81px; width: 168px; height: 39px; text-align: center; z-index: 1018; } #imStickyBar_imCell_119 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; } #imStickyBar_imCell_119 { grid-template-rows: [row-content] auto ; } #imStickyBar_imObjectButton_119 { padding-top: 0px; padding-bottom: 0px; padding-inline-start: 0px; padding-inline-end: 0px; grid-row: row-content / span 1; grid-column: 1 / -1; } #imStickyBar_imCellStyleGraphics_119 { box-sizing: border-box; } #imStickyBar_imObjectButton_119_button { margin: 0px; } } #imPage.without-id_animation-in-progress { overflow: hidden }