/*
Theme Name: 	together
Description: 	Responsive WordPress Theme based on Boostrap and Font Awesome.
Version:     	1.0.0
Author:     	Ness Communication
Author URI:   http://www.nesscommunication.com
Site:         http://www.nesscommunication.com
Text Domain: 	together-ness
Domain Path: 	/languages
Tags:        	grid-layout, blog, custom-menu, featured-images, right-sidebar
License:    	GNU General Public License v3.0
License URI:	http://www.gnu.org/licenses/gpl-3.0.html
*/


@font-face {font-family: 'STKBureauSans';   src: url('fonts/STKBureauSans-Light.woff2') format('woff2'), url('fonts/STKBureauSans-Light.woff') format('woff'); font-weight: 300; font-style: normal;}
@font-face {font-family: 'STKBureauSans';   src: url('fonts/STKBureauSans-LightItalic.woff2') format('woff2'), url('fonts/STKBureauSans-LightItalic.woff') format('woff'); font-weight: 300; font-style: italic;}

@font-face {font-family: 'STKBureauSans';   src: url('fonts/STKBureauSans-Book.woff2') format('woff2'), url('fonts/STKBureauSans-Book.woff') format('woff'); font-weight: 400; font-style: normal;}
@font-face {font-family: 'STKBureauSans';   src: url('fonts/STKBureauSans-Italic.woff2') format('woff2'), url('fonts/STKBureauSans-Italic.woff') format('woff'); font-weight: 400; font-style: italic;}

@font-face {font-family: 'STKBureauSans';   src: url('fonts/STKBureauSans-Medium.woff2') format('woff2'), url('fonts/STKBureauSans-Medium.woff') format('woff'); font-weight: 500; font-style: normal;}
@font-face {font-family: 'STKBureauSans';   src: url('fonts/STKBureauSans-MediumItalic.woff2') format('woff2'), url('fonts/STKBureauSans-MediumItalic.woff') format('woff'); font-weight: 500; font-style: italic;}

@font-face {font-family: 'STKBureauSans';   src: url('fonts/STKBureauSans-SemiBold.woff2') format('woff2'), url('fonts/STKBureauSans-SemiBold.woff') format('woff'); font-weight: 600; font-style: normal;}
@font-face {font-family: 'STKBureauSans';   src: url('fonts/STKBureauSans-SemiBoldItalic.woff2') format('woff2'), url('fonts/STKBureauSans-SemiBoldItalic.woff') format('woff'); font-weight: 600; font-style: italic;}

@font-face {font-family: 'STKBureauSans';   src: url('fonts/STKBureauSans-Bold.woff2') format('woff2'), url('fonts/STKBureauSans-Bold.woff') format('woff'); font-weight: 700; font-style: normal;}
@font-face {font-family: 'STKBureauSans';   src: url('fonts/STKBureauSans-BoldItalic.woff2') format('woff2'), url('fonts/STKBureauSans-BoldItalic.woff') format('woff'); font-weight: 700; font-style: italic;}



body, html{font-size: 1em; color: #000;}
body.home{background-color: #B5AFF9;}
body { font-family: 'STKBureauSans', sans-serif; font-weight: 300; overflow-x: hidden!important;}
strong { font-weight: 700; /* Bold */ }
em { font-style: italic; }


* { box-sizing: border-box; }

/*--------------------------
General
--------------------------*/

hr{border:none; border-bottom: 1px solid;}

/* form  */
input{border: 1px solid;}

input, textarea, select, button {
	width : auto;
	margin: 0;
	-webkit-box-sizing: border-box; /* For legacy WebKit based browsers */
	-moz-box-sizing: border-box; /* For legacy (Firefox <29) Gecko based browsers */
	box-sizing: border-box;
	border: 0;
}

pre{overflow: hidden}

/* Video Resposnive */
figure{margin:0;}
.video-container { position: relative; padding-bottom: 56.25%; /* 16:9 */ padding-top: 25px; height: 0;}
.video-container iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%;}

a{color: #000;}
img{width: 100%;height: auto;}


.desktop{display: block;}
.mobile{display: none;}



#cmplz-document, .editor-styles-wrapper .cmplz-unlinked-mode{max-width: 100%;}

/*--------------------------
Layout
--------------------------*/

h1,h2,h3,h4,h5{font-weight: 500;margin:0;}
h1{font-size: 36px;}
h2{font-size: 28px;}
h3{font-size: 24px;}
h4{font-size: 21px;}
h5{font-size: 18px;}
p{margin: 0;line-height: 26px;}

.p-0{padding: 0;}
.pl-0{padding-left:0;}
.pr-0{padding-right:0;}

.p-10{padding: 10px;}
.p-20{padding: 20px;}
.p-30{padding: 30px;}
.p-40{padding: 40px;}
.p-50{padding: 50px;}
.p-60{padding: 60px;}

.pb-0{padding-bottom: 0;}
.pb-10{padding-bottom: 10px;}
.pb-20{padding-bottom: 20px;}
.pb-30{padding-bottom: 30px;}
.pb-40{padding-bottom: 40px;}
.pb-60{padding-bottom: 60px;}

.pt-10{padding-top: 10px;}
.pt-20{padding-top: 20px;}
.pt-30{padding-top: 30px;}
.pt-40{padding-top: 40px;}
.pt-50{padding-top: 50px;}
.pt-60{padding-top: 60px;}
.pt-200{padding-top: 200px;}

.m-0{margin: 0;}
.ml-0{margin-left:0;}
.mr-0{margin-right:0;}

.m-10{margin: 10px;}
.m-20{margin: 20px;}
.m-30{margin: 30px;}
.m-40{margin: 40px;}
.m-50{margin: 50px;}
.m-60{margin: 60px;}

.mb-0{margin-bottom: 0;}
.mb-10{margin-bottom: 10px;}
.mb-20{margin-bottom: 20px;}
.mb-30{margin-bottom: 30px;}
.mb-40{margin-bottom: 40px;}
.mb-60{margin-bottom: 60px;}

.mt-10{margin-top: 10px;}
.mt-20{margin-top: 20px;}
.mt-30{margin-top: 30px;}
.mt-40{margin-top: 40px;}
.mt-50{margin-top: 50px;}
.mt-60{margin-top: 60px;}

.d-f{display: flex;flex-wrap: wrap;}
.fd-c{flex-direction: column;}

.jc-c{justify-content: center;}
.jc-sb{justify-content: space-between;}
.jc-fs{justify-content: flex-start;}
.jc-fe{justify-content: flex-end;}

.ac-c{align-content: center;}
.ac-fs{align-content: flex-start;}
.ac-fe{align-content: flex-end;}

.ai-c{align-items: center;}
.ai-fs{align-items: flex-start;}
.ai-fe{align-items: flex-end;}

.ta-l{text-align: left;}
.ta-c{text-align: center;}
.ta-r{text-align: right;}

.fw-1{font-weight: 100;}
.fw-2{font-weight: 200;}
.fw-3{font-weight: 300;}
.fw-4{font-weight: 400;}
.fw-5{font-weight: 500;}
.fw-6{font-weight: 600;}
.fw-7{font-weight: 700;}
.fw-8{font-weight: 800;}
.fw-9{font-weight: 900;}

.fs-12{font-size: 0.75em;}
.fs-13{font-size: 0.8125em;}
.fs-14{font-size: 0.875em;}
.fs-15{font-size: 0.9375em;}
.fs-16{font-size: 1em;}
.fs-17{font-size: 1.0625em;}
.fs-18{font-size: 1.125em;}
.fs-19{font-size: 1.1875em;}
.fs-20{font-size: 1.25em;}
.fs-21{font-size: 1.312em;}
.fs-22{font-size: 1.375em;}
.fs-23{font-size: 1.4375em;}
.fs-24{font-size: 1.5em;}
.fs-25{font-size: 1.5em;}
.fs-26{font-size: 1.625em;}
.fs-27{font-size: 1.6875em;}
.fs-28{font-size: 1.75em;}
.fs-29{font-size: 1.8125em;}
.fs-30{font-size: 1.875em;}
.fs-31{font-size: 1.9375em;}
.fs-32{font-size: 2em;}
.fs-33{font-size: 2.0625em;}
.fs-34{font-size: 2.125em;}
.fs-35{font-size: 2.1875em;}
.fs-36{font-size: 2.25em;}
.fs-37{font-size: 2.3125em;}
.fs-38{font-size: 2.375em;}
.fs-39{font-size: 2.4375em;}
.fs-40{font-size: 2.5em;}
.fs-41{font-size: 2.5625em;}
.fs-42{font-size: 2.625em;}
.fs-100{font-size: 6.25em;}

.tt-u{text-transform: uppercase;}

.w-33{width: 33.33%;}
.w-50{width: 50%;}
.w-66{width: 66.66%;}
.w-100{width: 100%;}
.h-100{height: 100%}

.width-wrap{max-width: 1440px;margin: 0 auto; gap: 0;}

.wpcf7 p {display: flex;flex-wrap: wrap;justify-content: space-between;align-items: center;align-content: center;}
.wpcf7 p .wpcf7-form-control-wrap[data-name="acceptance"] { margin: 0; font-size: 12px; line-height: 18px; width: 70%; margin-right: auto; padding-left: 20px; }
.wpcf7 p .wpcf7-form-control-wrap input[type="checkbox"] { width: auto; margin: 0;}
.wpcf7 p .wpcf7-form-control-wrap input { width: 100%; text-transform: uppercase;margin-bottom: 20px;padding: 5px 10px;}
.wpcf7 p .wpcf7-form-control-wrap { width: calc(50% - 20px); }
.wpcf7 p .wpcf7-form-control-wrap[data-name="your-email"] { width: calc(100% - 20px); }
.wpcf7 p .wpcf7-form-control-wrap[data-name="your-message"] { width: calc(100% - 20px);}
.wpcf7 p .wpcf7-form-control-wrap textarea{width: 100%;height: 150px;padding: 5px 10px;margin-bottom: 20px;text-transform: uppercase;}
.wpcf7 p .wpcf7-form-control-wrap[data-name="acceptance"] a{display: inline-block; margin: 0; font-weight: 400;padding: 0;} 
.wpcf7-list-item{margin: 0;}
.wpcf7 p input[type="submit"]{background:#0d3857; color:#fff; border:none; width: calc(30% - 20px);padding: 10px;}
span.wpcf7-spinner{position: absolute;bottom: 40px;}

.button { padding: 5px 30px; border: 1px solid; width: auto; text-align: center; display: inline-block; border-radius: 20px; text-decoration: none; margin-left: 5px; text-transform: uppercase; font-size: 14px; font-weight: 600; }


/*--------------------------
Header
--------------------------*/

.header { width: 100%; display: flex ; flex-wrap: wrap; justify-content: space-between; align-content: center; align-items: center; padding: 20px 40px; position: fixed; top: 0; width: 100%; z-index: 11; height: auto; transition: all .5s; }
.header.scrolled { transform: translateY(-100%); }


.header__logo img{width: 60px;}

.home .header__logo img { width:60px; opacity: 0; visibility: hidden; transform: scale(0.9); transition: opacity 0.2s ease, transform 0.2s ease; }
.home .header__logo.show-logo img { opacity: 1; visibility: visible; transform: scale(1); }

.header nav { display: flex ; flex-wrap: wrap; justify-content: space-between; align-content: flex-start; align-items: flex-start; width: auto; }
.header__menu{padding:0;margin:0;list-style-type: none;text-align: center;}
.header__menu .menu-item{display: inline-block;}
.header__menu .menu-item a { padding: 12px 20px; text-decoration: none; font-size: 1.25em; line-height: 1em; font-weight: 300; display: inline-block; text-transform: uppercase; }
.header__menu .menu-item a:hover{text-decoration: underline;}



.header__menu .menu-item.active > a {text-decoration: underline;}



.header__icon-bar { display: none; }

.menu-overlay{display: none;}

.custom-cursor { width: 15px; height: 15px;  border-radius: 50%; position: fixed; pointer-events: none; transform: translate(-50%, -50%); background: #000; z-index: 9999;
  transition: transform 0.1s ease, background-color 0.3s ease, width 0.3s ease, height 0.3s ease; background: #000; z-index: 9999; }

.custom-cursor.hovering-link { width: 30px; height: 30px; background-color: #fff;}

/*--------------------------
Home
--------------------------*/

.container:before { content: ''; background: linear-gradient(to bottom, rgba(181, 175, 249, 1.00) 15%, rgba(181, 175, 249, 0.16) 90%, rgba(181, 175, 249, 0.00) 100% 100% ); height: 200px; position: absolute; left: 0; right: 0; top: 0; width: 100%; z-index: 9; }



.payoff{position: absolute; top: 50%; transform: translateY(-50%); left: 0; right: 0;}


.hero-scroll-wrapper { height: 200vh; position: relative; }
.hero { position: sticky; top: 0; height: 100vh; overflow: hidden; background-color: #DBEA18;}
.hero-content { position: relative; z-index: 2; height: 100vh; display: flex; flex-direction: column; justify-content: center; align-items: center; transition: transform 0.3s ease-out, opacity 0.3s ease-out; }
.hero-logo { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%) scale(1); transition: transform 0.6s ease, opacity 0.6s ease; transform-origin: center; z-index: 5; opacity: 1; }
.hero-logo.moving { top: 0; left: 0; transform: translate(0, 0) scale(0.2); /* oppure scale dinamica via JS */ }

#heroLogoDistort { width: 100%; max-width: 100%; aspect-ratio: 1448 / 547; }
#heroLogoDistort canvas { display: block; }


.hero-logo img{width: 70vw; margin: 0 auto;}
.hero-background { position: fixed; top: 0; left: 0; z-index: 0; width: 110%; height: 120%; background-size: cover; background-position: center; }
.hero-background img { width: 100%; height: 120%; object-fit: cover; transform: translateY(0); transition: transform 0.4s ease-out; will-change: transform; object-position: top; }

.hero-title { opacity: 0; transform: translate(-50%, -50%) translateY(50px); transition: opacity 0.6s ease, transform 0.6s ease; position: absolute; top: 50%; left: 50%; z-index: 2; text-align: center; 
  font-size: 4vw; font-weight: 100; width: 100%; display: flex ; flex-wrap: wrap; align-items: center; align-content: center; }
.hero-title.visible { opacity: 1; transform: translate(-50%, -50%) translateY(0); }
.hero-title em{ font-family: "Spectral", serif; font-weight: 900; font-style: italic;}

.hero-title span { width: 100%; display: inline-block; overflow: hidden; }


.show-more { position: absolute; bottom: 0; left: 0; right: 0; margin: 0 auto; text-align: center; padding: 100px; z-index: 3;}
.show-more a { text-transform: uppercase; text-decoration: none; font-size: 1.5em; margin: 0 auto; }
.show-more img { height: 15px; width: auto; margin: 0 10px; }


#showreel { position: relative; }
#showreel iframe{pointer-events: none;}


#progetti { position: relative; height: 100vh; overflow: hidden; background-color: #B5AFF9;  z-index: 10;}
#progetti>img { position: absolute; top: -150px; bottom: 0; height: calc(100vh + 150px); object-fit: cover; }


.titolo-projects { display: flex ; flex-wrap: wrap; justify-content: center; align-items: center; align-content: center; position: relative; z-index: 1; top: 0; left: 0; right: 0; margin: 0 auto; }
.titolo-projects img { height: 20px; width: auto; justify-content: center; align-items: center; align-content: center; }
.titolo-projects h2 { text-transform: uppercase; font-weight: 300; margin: 0 10px; }

.titolo { display: flex ; flex-direction: column; align-items: center; align-content: center; padding:0 40px;overflow: hidden;}
.projects-inner { display: flex ; flex-wrap: wrap; height: 100%; align-items: center; align-content: center; padding-top: 200px;}
.projects-inner h3{font-family: "Spectral", serif;font-size: 2em;font-style: italic;font-weight: 700;text-align: center;}
.projects-inner h4{font-family: "Spectral", serif;font-size: 4em;font-weight: 700;text-align: center;}

#progetti .swiper-container{height: auto;width: 100%;}
#progetti ul.swiper-wrapper { padding: 0; list-style-type: none; margin: 0;}
#progetti li.swiper-slide { height: auto; display: flex ; justify-content: center; align-items: center; flex-wrap: wrap; align-content: center; }

#progetti li.swiper-slide a { width: 75%; max-width: 750px; margin: 40px auto; display: flex ; height: 100%; flex-wrap: wrap; align-content: center; align-items: center; justify-content: center; text-decoration: none;z-index: 99;position: relative;}





.image-wrap { position: relative; width: 100%;}

.project-thumbnail { position: relative; overflow: hidden; width: 100%; height: auto; z-index: 10;aspect-ratio: 16/9;}
.project-thumbnail img { position: absolute; top: 0; left: 0; width: 100%; height: auto; object-fit: cover; z-index: 11;}
.img-hover { opacity: 0; z-index: 11; }
.project-thumbnail:hover .img-hover { opacity: 1; }
.project-thumbnail:hover .img-default { opacity: 0; }

.marquee { width: 100%; overflow: hidden; position: absolute; background: transparent; white-space: nowrap; height: auto; font-size: 4vw; font-family: "Spectral", serif; font-style: italic; transform: translateY(-50%) translateZ(0); z-index: -1; will-change: transform;pointer-events: none;}
.marquee-1{top: 25%;}
.marquee-2{top: 42%;}
.marquee-3{top: 59%;}
.marquee-4{top: 76%;}
.marquee-track { display: flex; width: fit-content; }

.marquee-1 .marquee-track, .marquee-3 .marquee-track{animation: marquee-scroll 14s linear infinite; }
.marquee-2 .marquee-track, .marquee-4 .marquee-track{animation: marquee-scroll-reverse 14s linear infinite; }
.marquee-content { flex-shrink: 0; display: flex; white-space: nowrap; }
.marquee-content strong { margin-right: 25px; margin-left: 25px; }

.marquee strong{font-weight: 800;font-style: normal;}

@keyframes marquee-scroll {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(-50%);
  }
}

@keyframes marquee-scroll-reverse {
  0% {
    transform: translateX(-50%);
  }
  100% {
    transform: translateX(0%);
  }
}


.pagination-custom { position: relative; bottom: 0; left: 0; right: 0; z-index: 20; width: auto; height: auto; text-align: center; margin: 0 auto; padding: 100px 0; }
.pagination-wrap { position: relative; width: auto; display: flex ; justify-content: center; align-content: center; align-items: center; padding: 10px 20px; max-width: 200px; margin: 0 auto; }
.swiper-pagination { color: black; font-weight: bold; position: relative!important; margin: 0; bottom: unset !important; }
.swiper-button-next, .swiper-button-prev { background-image: url(https://togetherness.it/wp-content/uploads/2025/06/arrow-bottom.png) !important; background-size: contain !important; width: 10px !important; height: 40px !important; }
.pagination-custom a { text-transform: uppercase; font-size: 1.5em; text-decoration:none;}



/*--------------------------
Page
--------------------------*/

#content-page h1{margin-bottom: 40px;}


/*--------------------------
Contact
--------------------------*/



/*--------------------------
Index, Single, Page
--------------------------*/

.content{width: 100%;}
.content__title{font-size: 42px;}

	.post{padding:40px; border-bottom: 1px solid #eee;}
  .post img{max-width: 100%; height: auto;}

  .content .tag {margin-top:40px;}
	.content .tag a{background: #666; color:#fff; padding:5px 10px; text-decoration: none; display: inline-block;;margin-top:5px;font-size: 12px;}

	/* Comments */
	.comments{margin: 40px 0; border-top: 1px solid #eee}
	.commentlist,
	.commentlist .children{list-style-type: none}

	.comment-body{margin: 40px 0}
	.comment-author.vcard img{border-radius: 100%;}

	.comment-form-comment textarea{background: #eee; width:100%;border: 1px solid #ddd;margin-top:5px;}
	.comment-form-author input,
	.comment-form-email input,
	.comment-form-url input{background: #eee; width:200px; max-width:300px;border: 1px solid #ddd;padding:5px}

	.comment-form-author label,
	.comment-form-email label,
	.comment-form-url label{ width:100px;display: inline-block;}

	.form-submit input{background: #333; color:#fff; border:none;font-size: 16px;padding: 10px 15px;width: auto;}

  /* Pagination */
  .pagination{padding:40px;}
  .pagination a,
  .pagination span{padding: 10px 15px; border: 1px solid #ddd; text-decoration: none;}
  .pagination a:hover{background: #eee}

  /* Caption Images */
  .wp-caption { margin-bottom: 20px; padding: 10px; max-width: 97%; border: 1px solid #ddd; text-align: center; }
  .wp-caption img { margin: 0; padding: 0; width: 100%!important; height: auto; border: 0 none; }
  .wp-caption p.wp-caption-text { margin: 0; padding: 8px; font-size: 1em; line-height: 17px; }

  /* Gallery */
  .gallery { padding: 40px 0 40px 0; width: 100%; }
  .gallery-item {  width: 33.333333%; text-align: center; }
  .gallery img { margin: 0 5% 0 5%; width: 90%; height: auto; border: none!important; }
  .gallery-caption { width: 90%;margin:10px 0 0 0;}


/*--------------------------
Sidebar
--------------------------*/

.sidebar{width:30%;}
	.widget{padding:40px;}
	.widget ul{padding: 0;list-style-type: none;}
	.widget ul li a{text-decoration: none;display: block;border-bottom: 1px solid #eee;padding:10px 15px}

	.widget_search label{display: none;}


  .footer-top { display: flex ; flex-wrap: wrap; justify-content: space-between; background-color: #DBEA18; padding: 40px; }
  
  .footer-wrap{max-width: 1200px; margin: 0 auto; display: flex ; flex-wrap: wrap; justify-content: space-between; width:100%;}
  .footer-left, .footer-right { width: 50%; display: flex ; flex-wrap: wrap; align-content: flex-start; align-items: flex-start; }
  .footer-right { justify-content: flex-end; }
  .footer-top img{width: 80px;}


  .address { padding: 0 20px; text-transform: uppercase; }
  .address h5 { font-size: 1.5em; font-weight: 100; }
  .address p { font-size: 1em; margin-top: 10px; }



  ul.social { display: flex ; flex-wrap: wrap; padding: 0; list-style-type: none; gap: 20px; width: 100%; text-align: right; justify-content: flex-end; }
  ul.social li img { width: 40px; }


.gruppo { text-align: right; text-transform: uppercase; }
.gruppo h6 { font-size: 1em; font-weight: 100; margin: 10px 0; }
.gruppo img { height: 35px; width: auto; }


footer{background-color: #000;position: relative;}
footer .copyright { padding: 20px 40px; text-align: center; text-transform: uppercase; color: #fff; }
footer .copyright a{color: #fff;text-decoration: none;}

/*--------------------------
Desktop
--------------------------*/

@media (max-width: 1920px) {

  .marquee{font-size: 5vw;}

}


@media (max-width: 1536px) {
.projects-inner{padding-top: 100px;}
.pagination-custom{padding: 20px;}
}

@media (max-width: 1440px) {

.hero-title{padding: 60px;}

.show-more{padding: 40px;}

#progetti li.swiper-slide a { max-width: 500px; margin: 20px auto; }
.projects-inner{padding-top: 80px;}
    

.projects-inner h4{font-size: 3em;}

}



@media (max-width: 1280px) {
	
}


/*--------------------------
Tablet
--------------------------*/

@media (max-width: 998px) {

.custom-cursor {display: none;}


.desktop{display: none;}
.mobile{display: block;}
#heroLogoDistort{max-width: 100%;}
#heroLogoDistort canvas{display: none;}



.header>nav{ width: 80%; overflow: hidden; -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out; position: fixed; top: 0; bottom: 0; height: 80vh; background: #fff; right: 0; z-index: 9; transform: translateX(100%); display: flex ; flex-wrap: wrap; align-content: flex-start; flex-direction: column; justify-content: center; text-align: left; padding-left: 30px; 
    background: conic-gradient(from 90deg at 50% 50%, #DBEA18 0deg, #DBEA18 0deg, #B5AFF9 60deg, #B5AFF9 90deg, #C8CD88 210deg, #DBEA18 360deg);
}

.menu-overlay { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.5); z-index: 8; /* deve essere inferiore al menu (che ha z-index 9) e all'icona (z-index 11) */ display: none; }
.menu-overlay.active { display: block; }



	.header__icon-bar {display: block; position: relative; width: 40px; height: 20px; transition-duration: 0.5s;z-index: 11;}
	.header__icon-bar .icon-left { transition-duration: 0.5s; position: absolute; height: 2px; width: 20px; top: 50%; transform: translateY(-50%); background-color: #000;}
	.header__icon-bar .icon-left:before { transition-duration: 0.5s; position: absolute; width: 20px; height: 2px; background-color: #000; content: ""; top: -8px;margin: 0;}
	.header__icon-bar .icon-left:after { transition-duration: 0.5s; position: absolute; width: 20px; height: 2px; background-color: #000; content: ""; top: 8px;}
	.header__icon-bar .icon-left:hover { cursor: pointer;}
	.header__icon-bar .icon-right { transition-duration: 0.5s; position: absolute; height: 2px; width: 20px; top: 50%; transform: translateY(-50%); background-color: #000; left: 20px;}
	.header__icon-bar .icon-right:before { transition-duration: 0.5s; position: absolute; width: 20px; height: 2px; background-color: #000; content: ""; top: -8px;margin: 0;}
	.header__icon-bar .icon-right:after { transition-duration: 0.5s; position: absolute; width: 20px; height: 2px; background-color: #000; content: ""; top: 8px;}
  .header__icon-bar.open .icon-left { background: transparent; }
  .header__icon-bar.open .icon-left:before { transform: rotateZ(45deg) scaleX(1.2) translateY(0); -webkit-transform: rotateZ(45deg) scaleX(1.2) translateY(0); }
  .header__icon-bar.open .icon-left:after { transform: rotateZ(-45deg) scaleX(1.2) translateY(0); -webkit-transform: rotateZ(-45deg) scaleX(1.2) translateY(0); }
  .header__icon-bar.open .icon-right { background: transparent; left: 16px; }
  .header__icon-bar.open .icon-right:before { transform: rotateZ(-45deg) scaleX(1.2) translateY(0); -webkit-transform: rotateZ(-45deg) scaleX(1.2) translateY(0); }
  .header__icon-bar.open .icon-right:after { transform: rotateZ(45deg) scaleX(1.2) translateY(0); -webkit-transform: rotateZ(45deg) scaleX(1.2) translateY(0); }

	.header__icon-bar:hover { cursor: pointer;}
	.header nav.show-menu{transform: translateX(0);}
  
  .header__menu{display: flex ; flex-direction: column; align-items: center; align-content: center; justify-content: center;}
  .header__menu .menu-item a{font-family: "Spectral", serif; font-style: italic;text-transform: none;font-size: 2em;}

.header { padding: 20px; background-color: linear-gradient(to bottom, rgba(181, 175, 249, 1.00) 70%, rgba(181, 175, 249, 0.36) 90%, rgba(181, 175, 249, 0.00) 100%); justify-content: space-between; }


.hero{height: 100dvh;}

.hero-logo img{width: 100vw;}
.hero-title{font-size: 5vw; padding: 40px;}


.hero-background img { margin-top: 0; height: 100%; object-fit: cover; }
#progetti>img { margin-top: 0; height: 100%; object-fit: cover; top: 0;}
#pixi-canvas{display: none;}
.titolo{padding: 0 40px;}

#progetti{height: 100dvh;}
.titolo-projects { top: unset; position: relative; left: 0; right: 0; margin: 0 auto; }
#progetti .swiper-container{height: auto;}
#progetti li.swiper-slide {align-items: flex-start; align-content: flex-start; height: auto;}
#progetti li.swiper-slide a{margin: 20px auto;max-width: 80%;}
.projects-inner { height: 100%; display: flex ; flex-wrap: wrap; align-items: center; align-content: center; padding-top: 120px;}
.swiper-button-prev { transform: rotate(90deg); }
.swiper-button-next { transform: rotate(-90deg); }
.pagination-custom{padding: 20px;bottom: 0; position: relative;}
.pagination-wrap{margin-bottom: 20px;} 

.footer-top{padding: 20px;}
.footer-top img { width: 40px; }
.footer-left { width: 70%; flex-wrap: nowrap; }
.footer-right { width: 30%; display: flex ; flex-wrap: wrap; }
.gruppo img{height: 20px;width: auto;}

.address h5 { font-size: 1em; }
.address p { font-size: .75em; margin-top: 0;}

ul.social li img{width: 20px;}

}


/*--------------------------
Smartphone
--------------------------*/

@media (max-width: 782px) {
  .hero-title { font-size: 7vw; padding: 20px; position: absolute; top: 50%; transform: translateY(-50%); width: 100%; left: 50%; right: 0; }
  .hero-content { top: 0; height: 100%; }

  .show-more{bottom: 0;}

  .projects-inner h3{font-size: 1em;}
  .projects-inner h4{font-size: 2em;}

  .marquee-content strong { margin-right: 15px; margin-left: 15px; }

  #progetti{padding: 40px 0;}
  
  .show-more{padding: 20px;}

  .marquee{font-size: 6vw;}


.footer-top img { width: 30px; }
.gruppo img{height: 17px;width: auto;}




}



@media (max-width: 480px) {

}