@charset "utf-8";
/* CSS Document */

:root {
    --white: rgba(255,255,255,1); /* #fff */
    --black: rgba(0,0,0,1); /* #000 */
    --dark: rgba(36,26,26,1); /* #241a1a */
    --primary: rgba(124,128,129,1); /* #7c8081 */
    --grey: rgba(136,136,136,1); /* #888 */
    --lightgrey: rgba(244,243,241,1); /* #f4f3f1 */
}

* {box-sizing: border-box;}
*, a, a:hover {transition: all .5s;}

body {font-family: "Montserrat", sans-serif; }
.container {max-width: 1350px;}
i {-webkit-font-smoothing: antialiased;}

h1 {margin: 0; padding: 0; font-size: 65px; line-height: 70px; color: var(--black); font-weight: 500;}
h1 span {font-family: "Playfair", serif; font-size: 80px; line-height: 80px; font-style: italic; font-weight: 800;}
h2 {margin: 25px 0 0; padding: 0; font-size: 34px; line-height: 40px; color: var(--black); font-weight: 500;}
h2 span {font-family: "Playfair", serif; font-size: 38px; font-style: italic;}
h3 {margin: 0; padding: 0; font-size: 16px; line-height: 24px; color: var(--black); font-weight: 400; text-transform: uppercase;}
h4 {margin: 0; padding: 0; font-size: 15px; line-height: 22px; color: var(--black); font-weight: 300;}
h5 {margin: 0; padding: 0; font-size: 15px; line-height: 22px; color: var(--grey); font-weight: 500;}
p {margin: 20px 0 0 0; padding: 0; font-size: 21px; line-height: 30px; color: var(--black); font-weight: 400;}
strong {font-weight: 500;}
ul, ol {margin: 0; padding: 0; font-size: 21px; line-height: 30px; color: var(--black);}
ul {list-style: none; font-weight: 500;}
ul li {margin-bottom: 0;}
ul li:last-child {margin-bottom: 0;}
label {font-family: 'Montserrat', sans-serif; }
.form-check {padding-left: 0;}
.form-check label {margin-top: 0;}
input.form-control {font-family: 'Montserrat', sans-serif; border-radius: 3px; background-color: transparent; color: var(--black);}
select.form-select {font-family: 'Montserrat', sans-serif; border-radius: 3px; background-color: transparent; color: var(--black);}
textarea.form-control {font-family: 'Montserrat', sans-serif; border: 1px solid var(--red); border-radius: 3px; background-color: transparent; color: var(--black); resize: none; min-height: 130px; max-height: 130px;}
.form-check-input {border: var(--bs-border-width) solid var(--black);}

.btn.btn-primary, .btn.btn-secondary {background: var(--black); color: var(--white); border-radius: 0; border: none; padding: 10px 50px; font-weight: 600; font-size: 18px; line-height: 25px; transition: all .5s !important;}

.btn.btn-primary {background: var(--black); color: var(--white); border: 2px solid var(--black);}
.btn.btn-primary:hover {background: var(--white); color: var(--black); border: 2px solid var(--black);}

.btn.btn-secondary {background: var(--white); color: var(--dark);}
.btn.btn-secondary:hover {background: var(--dark); color: var(--white);}

/** BUTTON EFFECT **/
a.effect-6 {font-weight: 600; font-size: 18px;}
a.effect-6, a.effect-6 > span {position: relative; color: inherit; text-decoration: none; line-height: 24px;}
a.effect-6:before, a.effect-6:after, a.effect-6 > span:before, a.effect-6 > span:after {content: ""; position: absolute; transition: transform 0.5s ease;}
a.effect-6 {display: inline-block; overflow: hidden; color: var(--black); text-decoration: none;}
a.effect-6:before, a.effect-6:after {right: 0; bottom: 0; background: var(--black); transition: transform 0.3s ease;}
a.effect-6:before {width: 100%; height: 2px; transform: translateX(0%); transition-delay: 0.9s;}
a.effect-6:after {width: 2px; height: 100%; transform: translateY(100%); transition-delay: 0.6s;}
a.effect-6 > span {display: block; padding: 10px;}
a.effect-6 > span:before, a.effect-6 > span:after {left: 0; top: 0; background: var(--black); transition: transform 0.3s ease;}
a.effect-6 > span:before {width: 100%; height: 2px; transform: translateX(100%); transition-delay: 0.3s;}
a.effect-6 > span:after {width: 2px; height: 100%; transform: translateY(-100%); transition-delay: 0s;}
a.effect-6:hover:before, a.effect-6:hover:after, a.effect-6:hover > span:before, a.effect-6:hover > span:after {transform: translate(0, 0);}
a.effect-6:hover:before {transition-delay: 0s;}
a.effect-6:hover:after {transition-delay: 0.3s;}
a.effect-6:hover > span:before {transition-delay: 0.6s;}
a.effect-6:hover > span:after {transition-delay: 0.9s;}

::placeholder {color: var(--black); opacity: 1;}
:-ms-input-placeholder {color: var(--black);}
::-ms-input-placeholder {color: var(--black);}

/** NAVBAR **/
nav.navbar.home a.navbar-brand img, nav.navbar.bg-dark a.navbar-brand img {filter: brightness(0) invert(1);}
nav.navbar .navbar-brand {margin: 0; padding: 30px 0;}
nav.navbar.bg-dark {background: rgba(0,0,0,.8) !important;}
nav.navbar.bg-dark .navbar-brand {padding: 10px 0;}
nav.navbar .container {justify-content: space-between;}
nav.navbar .navbar-toggler {border: 1px solid var(--black); border-radius: 25px; font-size: 14px; color: var(--black); text-transform: none; padding: 12px 25px; display: flex; justify-content: space-between; align-items: center; outline: none; min-width: 145px; max-width: 145px;}
nav.navbar .navbar-toggler .bars {display: inline-block;}
nav.navbar .navbar-toggler .bars span {width: 22px; height: 1px; background: var(--black); margin: 2px 0; display: block;}

nav.navbar.home .navbar-toggler, nav.navbar.bg-dark .navbar-toggler {border: 1px solid var(--white); color: var(--white);}
nav.navbar.home .navbar-toggler .bars span, nav.navbar.bg-dark .navbar-toggler .bars span {background: var(--white);}

nav.navbar form {border: 1px solid var(--black); border-radius: 25px; font-size: 14px; color: var(--black); max-width: 145px;}
nav.navbar form .form-control {color: var(--black);}
nav.navbar form .form-control::placeholder {color: var(--black);}
nav.navbar form input.form-control {border-radius: 0; background-color: transparent; font-size: 14px; color: var(--black); border: none; border-top-left-radius: 25px; border-bottom-left-radius: 25px;}
nav.navbar form button.btn.btn-outline-success {color: var(--black); border: none; border-top-right-radius: 25px; border-bottom-right-radius: 25px;}
nav.navbar form button.btn.btn-outline-success:hover {background: var(--grey);}
nav.navbar form button.btn.btn-outline-success:hover i {color: var(--white);}

nav.navbar.home form, nav.navbar.bg-dark form {border: 1px solid var(--white); color: var(--white);}
nav.navbar.home form .form-control, nav.navbar.bg-dark form .form-control {color: var(--white);}
nav.navbar.home form .form-control::placeholder, nav.navbar.bg-dark form .form-control::placeholder {color: var(--white);}
nav.navbar.home form input.form-control, nav.navbar.bg-dark form input.form-control {color: var(--white);}
nav.navbar.home form button.btn.btn-outline-success, nav.navbar.bg-dark form button.btn.btn-outline-success {color: var(--white);}

nav.navbar a.contact {border-radius: 25px; font-size: 14px; padding: 8px 25px; border: 1px solid var(--black); margin-left: 25px; color: var(--black); text-decoration: none; min-width: 145px; max-width: 145px; display: flex; justify-content: space-between; align-items: center;}
nav.navbar a.contact:hover {color: var(--white); background: var(--grey);}
nav.navbar.home a.contact, nav.navbar.bg-dark a.contact {border: 1px solid var(--white); color: var(--white);}

nav.navbar .left, nav.navbar .right {min-width: 315px; max-width: 315px;}
nav.navbar .offcanvas {background: var(--black);}
nav.navbar .offcanvas-start {width: 98vw; top: 20px; left: 20px; right: 20px; bottom: 20px;}
nav.navbar .nav-link {font-size: 50px; font-weight: 700; display: inline-block; color: var(--white); margin: 15px 0;}
nav.navbar .nav-link:hover {color: var(--grey);}
nav.navbar .offcanvas-header {padding: 3rem 5rem 0;}
nav.navbar .offcanvas .btn-close {color: var(--white); background: transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e") center/1em auto no-repeat; opacity: 1;}
nav.navbar .offcanvas-body p {font-size: 19px; margin-bottom: 35px; margin-top: 0; line-height: 22px; color: var(--white); font-weight: 500;}
nav.navbar .offcanvas-body .dati {border-top: 1px solid var(--grey); margin-top: 8%; padding-top: 3%;}
nav.navbar .offcanvas-body .dati ul.social {display: flex; flex-direction: row;}
nav.navbar .offcanvas-body .dati ul.social li {margin-right: 20px;}
nav.navbar .offcanvas-body .dati ul.social li i {font-size: 28px;}
nav.navbar .offcanvas-body .dati ul.social li a {color: var(--white);}
nav.navbar .offcanvas-body .dati ul.social li a:hover {color: var(--grey);}
nav.navbar .offcanvas-body .dati p {font-size: 11px; color: var(--grey); line-height: 15px; font-weight: 300;}
nav.navbar .offcanvas-body .dati p a {color: var(--grey); text-decoration: none;}
nav.navbar .offcanvas-body .dati p a:hover {color: var(--grey); text-decoration: underline;}

/** HERO VIDEO **/
.hero-youtube {position: relative; width: 100%; height: 100vh; overflow: hidden; background: #000;}
.hero-youtube__video {position: absolute; inset: 0; overflow: hidden;}
.hero-youtube__video video {position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center center; pointer-events: none;}
.hero-youtube__overlay {position: relative; z-index: 2; color: #fff;}
.hero-youtube__video--desktop {display: block;}
.hero-youtube__video--mobile {display: none;}
.hero-youtube::after {content: ""; position: absolute; inset: 0; background: rgba(0,0,0,.35); pointer-events: none; z-index: 3;}
.hero-youtube__overlay {position: relative; z-index: 5; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; height: 100%; color: white;}
.hero-youtube__overlay p {color: var(--light); font-size: 100px; line-height: 110px; font-weight: 600;}
.hero-youtube__overlay p #typed-text {font-family: "Playfair", serif; font-style: italic; text-decoration: underline;}

/** CONTENT **/
.content {padding: 5% 0;}
.content.black {background: var(--black);}
.content.light {background: var(--lightgrey);}
.content.line {border-top: 2px solid var(--black);}
.content.black h1, .content.black h2, .content.black h3, .content.black h4, .content.black p {color: var(--white);}
.content hr {background: var(--black); opacity: 1;}
.content ul.list-focus {display: flex; justify-content: space-between; flex-wrap: wrap; flex-direction: row;}
.content ul.list-focus li {flex-basis: 30%;}
.content ul.list-focus li h3 {font-size: 13px; line-height: 25px; font-weight: 600;}
.content ul.list-focus li h3 span {font-size: 24px;}
.content ul.list-focus li p {font-size: 13px; line-height: 18px; font-weight: 400;}
.content ul.certificati {display: flex; justify-content: space-between; flex-wrap: wrap; flex-direction: row; margin-top: 25px;}
.content ul.certificati li {flex-basis: 25%; text-align: center;}
.content ul.certificati li img {border-radius: 50%; max-width: 140px; border: 1px solid var(--lightgrey);}
.content ul.certificati li p {font-size: 16px;}

/** ACCORDION **/
.content .accordion {margin-top: 15px;}
.content h2.accordion-header {margin: 10px 0 0; font-size: 16px; font-weight: 800;}
.content .accordion-item:first-of-type .accordion-button, .content .accordion-item:first-of-type, .content .accordion-item:first-of-type .accordion-button, .accordion-item {border: none !important;}
.content .accordion-button:not(.collapsed) {color: var(--black); background-color: transparent;}
.content button.accordion-button {padding: 0; font-weight: 700;}
.content .accordion .accordion-body {font-size: 16px; padding: 10px 0 0;}
.content .accordion .accordion-body p {font-size: 16px; margin: 0;}
.content .accordion-button::after {background-image: none; content: '+'; height: auto; font-size: 24px; width: 15px; text-align: center;}
.content .accordion-button:not(.collapsed)::after {background-image: none; font-size: 24px; content: '-';}

/** METODO **/
.content .box-metodo {border: 1px solid var(--black); margin-top: 35px; display: flex; flex-direction: row; flex-wrap: wrap;}
.content .box-metodo .box-text {flex-basis: 50%; padding: 0 0 20px 0; display: flex; flex-direction: column; min-height: 485px; justify-content: space-between;}
.content .box-metodo .box-text h3 {border-bottom: 1px solid var(--black); padding: 0 20px; line-height: 27px;}
.content .box-metodo .box-text h2, .content .box-metodo .box-text p {margin-left: 20px; margin-right: 20px;}
.content .box-metodo .box-text h2 {margin-bottom: 20px;}
.content .box-metodo .box-text p {font-size: 14px; line-height: 22px; margin-top: 0px;}
.content .box-metodo .box-text span {display: block;}
.content .box-metodo .box-text.left {border-left: 1px solid var(--black);}
.content .box-metodo .box-text.right {border-right: 1px solid var(--black);}
.content .box-metodo .box-img {flex-basis: 50%; padding: 25px;}

/** LISTA FASI **/
ul.list-fasi {margin: 0; padding: 0; display: flex; flex-wrap: wrap; flex-direction: row; justify-content: flex-start;}
ul.list-fasi li {flex-basis: 33%; margin: 0 0 45px 0; padding: 0 20px; border-right: 1px solid var(--black);}
ul.list-fasi li:last-child {border-right: none;}
ul.list-fasi li img {max-width: 60px; max-height: 60px; margin-bottom: 20px;}
ul.list-fasi li p {font-size: 13px; line-height: 20px;}

/** BOX CTA **/
.box-cta {background-size: cover !important; background-position: center !important; background-repeat: no-repeat !important; padding: 90px 0; background-attachment: fixed !important;}
.box-cta h2 {margin-top: 0;}

/** REFERENZE **/
.box-referenze {margin-top: 7%;}
.box-referenze.light {background: var(--lightgrey); margin-top: 0; padding: 5% 0;}
.box-referenze.line {border-top: 1px solid var(--grey); margin-top: 0; padding: 5% 0;}
.box-referenze ul {margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center;}
.box-referenze ul li {flex-basis: 150px; margin: 0 40px;}
.box-referenze ul li:hover img {opacity: .7;}

/** BOX NEWS **/
.box-news {margin-top: 7%; padding-bottom: 5%;}
.box-news .box {position: relative; margin-top: 30px; overflow: hidden}
.box-news img {position: relative;}
.box-news a:hover img {transform: scale(1.1); transition: transform 0.5s ease;}
.box-news .box:hover a.btn {background: var(--black); color: var(--white);}
.box-news .box:hover img {transform: scale(1.1);}
.box-news a.btn.btn-secondary {position: absolute; bottom: 0; right: 0; z-index: 99; font-size: 14px; text-transform: uppercase; padding: 10px 20px;}
.box-news h3 {margin-top: 10px;}
.box-news p {margin-top: 5px; font-weight: 600;}
.box-news p a {color: var(--black); text-decoration: none;}
.box-news p a:hover {color: var(--black); text-decoration: underline;}

/** FOOTER **/
footer {padding: 5% 0; background: var(--black);}
footer h2, footer h3, footer h4, footer h5, footer p {color: var(--white); margin: 0;}
footer img {filter: brightness(0) invert(1); max-width: 100px; margin-bottom: 15px;}
footer form .form {display: flex; margin-top: 30px;}
footer .form input.form-control {border: none; background-color: transparent !important; border-bottom: 1px solid var(--white); border-radius: 0; color: var(--white); padding: 0; font-size: 18px; font-weight: 400;}
footer .form input.form-control::placeholder {color: var(--white);}
footer .form input[type="submit"] {font-style: 18px; border: none; border-bottom: 1px solid var(--white); background: none; color: var(--white); font-weight: 600;}
footer .wpcf7-list-item {margin-left: 0; color: var(--white); font-size: 12px;}
footer input[type="checkbox"] {margin-right: 5px;}
footer p {margin: 0 0 15px; line-height: 22px; font-size: 16px;}
footer h5 {color: var(--grey); line-height: 20px;}

/** COPY **/
.copy {border-top: 1px solid var(--white); background: var(--black); padding: 25px 0;}
.copy p {margin: 0; font-size: 11px; color: var(--grey); line-height: 15px; font-weight: 300;}
.copy p a {color: var(--primary); text-decoration: none;}
.copy p a:hover {color: var(--primary); text-decoration: underline;}
.copy ul.social {display: flex; flex-direction: row; justify-content: flex-end;}
.copy ul.social li {margin-left: 20px;}
.copy ul.social li i {font-size: 20px;}
.copy ul.social li a {color: var(--grey);}
.copy ul.social li a:hover {color: var(--white);}

/** HEADER INTERNAL **/
.title-int {margin-top: 10%;}
.title-int h5 {font-size: 13px; text-transform: uppercase; color: var(--white); background: var(--black); border-radius: 25px; text-transform: uppercase; display: inline-block; font-weight: 300; padding: 5px 15px; margin-bottom: 30px;}

/** HEADER CONTATTI **/
.title-contatti {margin-top: 10%;}
.title-contatti h1 {font-size: 100px; font-weight: 700; line-height: 100px;}
.title-contatti h1 span {font-size: 105px;}
.title-contatti .contatti p {margin: 0 0 20px;}

.hd-int {background-position: center !important; background-repeat: no-repeat !important; background-size: cover !important; background-attachment: fixed !important; padding: 20% 0; margin-top: 40px; position: relative; overflow: hidden;}
.hd-video {position: absolute; top: 50%; left: 50%; min-width: 100%; min-height: 100%; width: auto; height: auto; transform: translate(-50%, -50%); object-fit: cover; z-index: 0;}
.hd-int::after {content: ""; position: absolute; inset: 0; background: rgba(0,0,0,0.3); z-index: 1;}

/** GALLERY **/
.gallery {margin-top: 5%; overflow: hidden;}
.gallery .slick-slide {height: auto; margin: 0 50px;}
.gallery .slick-track {margin: 0 -50px;}

/** PARALLAX **/
.parallax {height: 700px; background-attachment: fixed !important; background-position: center !important; background-repeat: no-repeat !important; background-size: cover !important;}

/** CONTENT PUZZLE **/
.content.puzzle-section {background: var(--dark); height: 85vh; padding: 100px 0 50px 0;}
.content.puzzle-section h2, .content.puzzle-section h3, .content.puzzle-section p {color: var(--white);}
.content.puzzle-section .image-puzzle {position: relative; width: 100%; height: 100%; margin: 0 auto;}
.content.puzzle-section .puzzle-card {position: absolute; overflow: hidden;}
.content.puzzle-section .puzzle-card img {width: 100%; height: 100%; object-fit: cover; display: block;}
.content.puzzle-section .card-left {width: 300px; height: 400px; left: 0; top: 20px; z-index: 1;}
.content.puzzle-section .card-top-right {width: 300px; height: 400px; right: 60px; top: -30px; z-index: 1;}
.content.puzzle-section .card-bottom-center {width: 300px; height: 400px; left: 150px; top: 230px; z-index: 2;}

/** CONTENT CAROUSEL **/
.content .carousel-indicators [data-bs-target] {height: 15px; width: 15px; border-radius: 50%; background: transparent; border: 1px solid #d9d9d9; opacity: 1;}
.content .carousel-indicators .active {background: #d9d9d9;}

/** FILTER NEWS **/
section.filter {padding: 5% 0;}
section.filter .filters {width: 100%; text-align: center;}
section.filter .filters ul {list-style: none; padding: 20px 0; display: flex; justify-content: center; align-items: flex-start;}
section.filter .filters li {border-bottom: 4px solid transparent; max-width: 250px; display: inline; margin: 0 25px; font-size: 14px; color: var(--dark); font-weight: 400; cursor: pointer; text-transform: uppercase;}
section.filter .filters li:hover {color: var(--darkgrey);}
section.filter .filters li.active {border-bottom: 2px solid var(--dark);}
section.filter .single-content {margin: 20px 35px;}
section.filter .single-content ul {position: relative; list-style: none; margin-top: 15px; padding-top: 10px; font-size: 20px; line-height: 25px;}
section.filter .single-content ul:before {content: ""; position: absolute; top: 0; left: 0; width: 50px; height: 2px; background: var(--red);}
section.filter .single-content ul li {margin-bottom: 5px;}
section.filter .single-content ul li i {width: 25px; margin-right: 10px;}
section.filter .single-content img, .single-content .sold-out-img {width: 370px; height: 100%;}
.single-content picture { position: relative; line-height: 0; display: block; height: 100%; }
.sold-out-img.sold-out-img { position: absolute; top: 0; left: 0; height: auto; }
section.filter .single-content .cnt-text {display: flex; flex-wrap: wrap; flex-direction: row; margin-top: 15px; align-items: flex-start; justify-content: space-between; max-width: 370px;}
section.filter .single-content .cnt-text p {font-size: 16px; line-height: 22px; margin: 0; flex-basis: 75%; font-weight: 700;}
section.filter .single-content .cnt-text p a {color: var(--black); text-decoration: none;}
section.filter .single-content .cnt-text p a:hover {color: var(--primary); text-decoration: none;}
section.filter .single-content .cnt-text p span {display: block; font-size: 15px; font-weight: 300; color: var(--grey);}
section.filter .single-content .cnt-text h5 {font-weight: 300;}
section.filter .single-content:hover img {opacity: .7;}
section.filter .single-content .img a {position: relative; z-index: 99; display: block;}
section.filter .single-content .img a:hover:after {content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,.6) url(../img/ico-arrow.svg); background-size: 50px; background-repeat: no-repeat; background-position: center;}

/*@media (max-width: 1500px) {
    section.filter .single-content img, .single-content .sold-out-img {width: calc(100vw/(1500/370)); height: 100%; margin-bottom: 15px;}
}

@media (max-width: 1200px) {
    section.filter .single-content img, .single-content .sold-out-img {width: calc(100vw/(1200/370)); height: 100%; margin-bottom: 15px;}
}

@media (max-width: 1000px) {
    section.filter .single-content img, .single-content .sold-out-img {width: calc(100vw/(1000/370)); height: 100%; margin-bottom: 15px;}
}

@media (max-width: 780px) {
    section.filter .single-content img, .single-content .sold-out-img {width: 100%; height: 100%; margin-bottom: 15px;}
}*/

/** DETTAGLIO NEWS **/
section.cnt-news {padding: 5% 0;}

/** NEWS CORRELATE **/
.content ul.correlati {display: flex; flex-direction: row; flex-wrap: wrap; margin-top: 50px;}
.content ul.correlati li {flex-basis: 25%; text-align: center; padding: 0 10px;}
.content ul.correlati li:hover img {opacity: .7;}
.content ul.correlati li p {font-size: 16px; line-height: 22px; flex-basis: 75%; font-weight: 700;}
.content ul.correlati li p a {color: var(--black); text-decoration: none;}
.content ul.correlati li p a:hover {color: var(--primary); text-decoration: none;}
.content ul.correlati li p span {display: block; font-size: 15px; font-weight: 300; color: var(--grey);}

/** DETTAGLIO PORTFOLIO **/
section.cnt-portfolio {padding: 5% 0;}

/** DATI PORTFOLIO **/
.detail-portfolio {padding: 3% 0;}
.detail-portfolio ul {display: flex; flex-wrap: wrap; font-size: 15px; line-height: 22px; color: var(--grey); font-weight: 300; justify-content: flex-start;}
.detail-portfolio ul li {flex-basis: 180px; margin-right: 40px;}
.detail-portfolio ul li span {color: var(--black); display: block;}

/** PAGINA CONTATTI **/
.cnt-contatti {margin-top: 5%; padding: 90px 0; background-position: -60% 0% !important; background-size: contain !important; background-attachment: fixed !important;}
.cnt-contatti form input.form-control {min-height: 100px; border-radius: 0;}

.cnt-contatti .material-field {position: relative;}
.cnt-contatti .material-field .wpcf7-form-control-wrap {display: block;}
/*.cnt-contatti form .material-field-input {font-size: 18px; padding: 15px 25px; width: 100%; border-radius: 0; border: 1px solid var(--black); background: var(--white); border-bottom: 0;}*/
.cnt-contatti form textarea.material-field-input {}
.cnt-contatti form .material-field-input:focus {outline: none; border: 1px solid var(--black);}
.cnt-contatti form .material-field-input:focus ~ .material-field-label {}
.cnt-contatti form .material-field-label {color: var(--grey); background: #fff; font-size: 16px; font-weight: normal; position: absolute; pointer-events: none; top: 10px; left: 15px; padding: 0 8px; transition: 150ms cubic-bezier(0.4, 0, 0.2, 1) all; -moz-transition: 150ms cubic-bezier(0.4, 0, 0.2, 1) all; -webkit-transition: 150ms cubic-bezier(0.4, 0, 0.2, 1) all;}
.cnt-contatti form .form-check-input {border: 1px solid var(--grey);}
.cnt-contatti form .form-check label {color: var(--grey);}
.cnt-contatti form .btn.btn-primary {width: 100%;}


.cnt-contatti .material-field-input {width: 100%; border: 1px solid var(--black); background: var(--white); padding: 15px 25px; border-bottom: 0; font-size: 18px; line-height: 1.4; outline: none; border-radius: 0; box-shadow: none; min-height: 100px; display: block;}
.cnt-contatti textarea.material-field-input {border-bottom: 1px solid var(--black); min-height: 350px; resize: none;}
.cnt-contatti .material-field-label {position: absolute; top: 16px; left: 16px; font-size: 16px; line-height: 1; pointer-events: none; transition: all 0.2s ease; background: #fff; padding: 0 4px;}
.cnt-contatti .material-field:focus-within .material-field-label {top: -8px; font-size: 12px;}
.cnt-contatti .material-field:has(.material-field-input:not(:placeholder-shown)) .material-field-label {top: -8px; font-size: 12px;}
.cnt-contatti .material-field:focus-within .material-field-input {border-color: var(--black);}
.cnt-contatti .material-field .wpcf7-not-valid {border-color: #dc3232;}
.cnt-contatti .material-field .wpcf7-not-valid-tip {margin-top: 6px; font-size: 12px;}
.cnt-contatti .material-submit input[type="submit"] {border: 0; padding: 14px 28px; cursor: pointer;}
.cnt-contatti .wpcf7-list-item {margin-left: 0;}