/*

┏━━━┓ ┏┓ ┏┓ ┏━━━┓ ┏━━━━┓ ┏━━━┓ ┏━┓┏━┓   ┏━━━┓ ┏━━━┓ ┏━━━┓
┃┏━┓┃ ┃┃ ┃┃ ┃┏━┓┃ ┃┏┓┏┓┃ ┃┏━┓┃ ┃ ┗┛ ┃   ┃┏━┓┃ ┃┏━┓┃ ┃┏━┓┃
┃┃ ┗┛ ┃┃ ┃┃ ┃┗━━┓ ┗┛┃┃┗┛ ┃┃ ┃┃ ┃┏┓┏┓┃   ┃┃ ┗┛ ┃┗━━┓ ┃┗━━┓
┃┃ ┏┓ ┃┃ ┃┃ ┗━━┓┃   ┃┃   ┃┃ ┃┃ ┃┃┃┃┃┃   ┃┃ ┏┓ ┗━━┓┃ ┗━━┓┃
┃┗━┛┃ ┃┗━┛┃ ┃┗━┛┃   ┃┃   ┃┗━┛┃ ┃┃┃┃┃┃   ┃┗━┛┃ ┃┗━┛┃ ┃┗━┛┃
┗━━━┛ ┗━━━┛ ┗━━━┛   ┗┛   ┗━━━┛ ┗┛┗┛┗┛ ▀ ┗━━━┛ ┗━━━┛ ┗━━━┛ - "CUSTOM STYLESHEET"

DESIGN BY © LO STUDIO

CUSTOM.CSS STYLESHEET FOR => " CBG -  Mobility "

BASE (MOBILE) SIZE

/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/




/**
 *
 *  █  █  █▀▀  ▄▀▀▄  █▀▀▄  █▀▀  █▀▀▄
 *  █▀▀█  █▀▀  █▀▀█  █  █  █▀▀  █▐█▀
 *  ▀  ▀  ▀▀▀  ▀  ▀  ▀▀▀   ▀▀▀  ▀ ▀▀ - HEADER
 *
 * ░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░
 */


header { z-index: 4; }
.head_wrapper { padding: 1.5em 1.5em; z-index: 2; }




/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ LOGO ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

.head_logo { display: flex; justify-content: center; align-items: center; gap: 1rem; }
.head_logo img { width: auto; height: 4rem; }



/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ HEAD CONTENT ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

.ico_link span { margin-right: .5rem; }
.ico_link .ico { height: 1.5rem; }


.head_wrapper .flex-el { gap: 1rem; }


.link.link_head { padding: .5em 2.25em .5em 1.25em; font-size: .95rem; position: relative; display: none; }
.link.link_head::after {
    content: ""; width: .75rem; height: .75rem; position: absolute; right: .75rem; top: 50%; transform: translateY(-50%); 
    background: url(../images/svg/arrow.svg) no-repeat center / .75rem; filter: brightness(0) invert(1); 
}
.link.link_head:hover::after { filter: brightness(1) invert(0); }




.link_head.user { display: inline-block; padding: .5em 1.25em; }
.link_head.user::after { display: none; }
.link_head.user img { width: 1rem; }

.sub_menu_user .voce { font-size: 1.25em; color: var(--white); line-height: 1.5; font-weight: 400; }
.sub_menu_user p.voce { opacity: .75; padding-bottom: 1rem; margin-bottom: 1rem; border-bottom: 1px solid rgb(var(--white-rgb) / 50%); }
.sub_menu_user a, .sub_menu_user button { text-decoration: underline; }
.sub_menu_user a:hover, .sub_menu_user button:hover { opacity: .5; }













.sub_menu {
    width: 60vw; height: auto; background: linear-gradient(var(--blue), #32478c); border-radius: 2rem;
    position: absolute; top: calc(60px + (90 - 60) * ((100vw - 320px) / 1600));
    pointer-events: none; opacity: 0; transition: .5s ease; z-index: 1;
}
.sub_menu::before {
    content: ""; width: 0; height: 0; border-left: .75rem solid transparent; border-right: .75rem solid transparent; border-bottom: .75rem solid var(--blue);
    position: absolute; right: 2rem; top: 0; transform: translateY(-100%);
}
.sub_menu .menu_i { padding: var(--c7v) var(--c2o); }



.sub_menu_azienda {  }
.sub_menu_privati {  }
.sub_menu_user { right: -.5rem; }



.sub_menu.open { pointer-events: initial; opacity: 1; }
.filter_close {
    pointer-events: initial; background-color: rgb(30 30 30 / 20%); backdrop-filter: blur(5px); -webkit-backdrop-filter: blur(5px);
    position: absolute; height: 100vh;
    display: none;
}








/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ HAMBURGER / MENU ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

#hamburger { 
	display: inline-block; font-size: var(--rem); line-height: 0;
	padding: .5em .5em; 
	overflow: visible; cursor: pointer; transition: .25s ease;

}
#hamburger .wrap { width: 2.5em; height: 2em; }
#hamburger span {
	display: block; position: absolute; left: 50%; transform: translateX(-50%);
	width: 2.5em; height: 4px; border-radius: 1rem;
	background-color: var(--blue);
	transform-origin: center; will-change: transform; transition: .25s ease;
}
#hamburger .top_bun { top: 0; }
#hamburger .burger { top: calc(50% - 2px); }
#hamburger .bottom_bun { bottom: 0; }

/* Tapped / Clicked animation */
/*
 * Copiare l'animazione scelta dal file hamburger.css
 * oppure utilizare quella base qui sotto
 */
#hamburger.tapped span { background-color: var(--blue); transition: .25s ease; }
#hamburger.tapped .burger { opacity: 0; }
#hamburger.tapped .top_bun { top: 50%; transform: translate(-50%,-50%) rotate(45deg); }
#hamburger.tapped .bottom_bun { top: 50%; transform: translate(-50%,-50%) rotate(-45deg); }




/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ NAV MENU ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

#main_nav { 
	display: none; 
	position: absolute; top: 0; left: 0;
	z-index: 1;
}
#main_nav .menu_wrapper {
    top: calc( 80px + ( 140 - 80 ) * ( (100vw - 320px) / 1600 ) ); left: 1.25%; 
    background: linear-gradient(var(--gradient)); width: 97.5%; height: calc( 97.5% -  (80px + ( 140 - 80 ) * ( (100vw - 320px) / 1600 )) ); border-radius: 2rem; 
}
#main_nav .menu_wrapper::before {
    content: "";
    width: 0; height: 0; border-left: 1rem solid transparent; border-right: 1rem solid transparent; border-bottom: 1.5rem solid var(--blue);
    position: absolute; right: 2rem; top: 0; transform: translateY(-100%);
}



.menu_i { width: 100%; padding: var(--c10v) var(--c5o); }
.menu_i > p { font-size: 2.5em; color: var(--white); font-weight: 400; margin-bottom: 1rem; }



.tit_menu { width: 100%; border-bottom: 1px solid rgb(var(--white-rgb) / 25%); }
.tit_menu > a { padding: 1rem 0;  font-size: 1.25em; text-transform: uppercase; line-height: 1.1; color: var(--white); font-weight: 500; position: relative; padding-right: 2rem; }
.tit_menu > a::after {
    content: ""; width: 1.5rem; height: 1.5rem; position: absolute; right: 0; top: 50%; transform: translateY(-50%);
    background: url(../images/svg/arrow.svg) no-repeat center; background-size: contain; filter: brightness(0) invert(1);
}
.tit_menu .sub-menu { margin-left: 0; padding-bottom: 1rem; display: none; }
.tit_menu .sub-menu a { font-size: 1em; color: var(--white); line-height: 1.5; }

.tit_menu > a:hover { opacity: .5; }
.tit_menu .sub-menu a:hover { opacity: .5; }






/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ DARKMODE SWITCHER ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/








/**
 *
 *  ▄▀▀▄  ▄▀▀  ▄▀▀  █▀▀  ▀▀█▀▀  ▄▀▀
 *  █▀▀█   ▀▄   ▀▄  █▀▀    █     ▀▄
 *  ▀  ▀  ▀▀   ▀▀   ▀▀▀    ▀    ▀▀  - ASSETS
 *
 * ░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░
 */


/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ LINKs / BTNs STYLE ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

.link {
	display: inline-block; position: relative; width: fit-content;
    padding: .625em 1.5em; margin: ;
    background-color: var(--blue); border: 2px solid var(--blue); border-radius: 5rem;
	font: inherit; font-size: 1.25rem; color: var(--white); text-transform: uppercase; font-weight: 400;
}
.link:not(.disabled):hover, .link:not(.disabled):active { background-color: var(--white); color: var(--blue); }

.link.grey { background-color: #D9D9D9; border-color: #D9D9D9; color: #989898; }
.link.grey:not(.disabled):hover, .link.grey:not(.disabled):active { background-color: var(--white); color: #989898; }

.link.border { background-color: transparent; border-color: #32478c; color: #32478c; }
.link.border:not(.disabled):hover, .link.border:not(.disabled):active { background-color: #32478c; color: var(--white); }

.link.white { background-color: var(--white); border-color: var(--white); color: var(--blue); }
.link.white:not(.disabled):hover, .link.white:not(.disabled):active { background-color: rgb(var(--white-rgb) / 50%); color: var(--white); }



.link.flex { display: inline-flex; }
.link.flex svg { margin-left: .75rem; width: auto; height: 1rem; }
.link.flex svg path { fill: var(--white); transition: .25s ease; }
.link.flex:not(.disabled):hover svg path { fill: var(--blue); transition: .25s ease; }




/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ FILTERS STYLE ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

.filter_color {
	background-color: var(--color);
	mix-blend-mode: multiply;
	opacity: .5;
}




/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ VARS ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

.pretitle { text-transform: uppercase; font-weight: 500; font-size: 110%; }



/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ SCROLL BUTTON ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

#scroll_btn {
	display: inline-block;
	position: absolute; left: 50%; bottom: 1.5em; 
	--scroll-px: 40px;
	--scroll-min: 40;
	--scroll-max: 60;
	max-width: 60px;
	transform: translateX(-50%);
	cursor: pointer; z-index: 1;
}
#scroll_btn svg { 
	width: 100%; 
	animation: hang_scroll 1.5s ease-in-out infinite forwards alternate;
	animation-play-state: running;
}
@keyframes hang_scroll {
	from { transform: translateY(0); }
	to { transform: translateY(.5em); }
}
#scroll_btn:hover svg, #scroll_btn:focus svg, #scroll_btn:active svg { animation-play-state: paused; }
#scroll_btn svg path { fill: var(--black); transition: .25s ease; }




/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ SWIPER NAV ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

.nav_btn { 
	top: 50%; transform: translateY(-50%); 
	width: 3.5em; padding: .25em; 
	z-index: 1; cursor: pointer; transition: .25s ease; 
}
.nav_btn :where(img, svg) { width: 100%; }
.nav_btn svg path { fill: var(--black); transition: .25s ease; }

.nav_prev { left: 0; }
.nav_next { right: 0; }

.nav_btn.swiper-button-disabled { display: none; }


/* Dots */
.nav_dots {}




/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ COMPONENTS ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

/* Social */
.social { gap: 1rem; }
.social li { list-style: none; }
.social a { display: inline-block; height: 1.5em; width: auto; }
.social a :where(img,svg) { width: 100%; height: 100%; }
.social a svg path { transition: .25s ease; fill: var(--white); }




/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ SIDEBAR ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

/*
 * Se presenti position sticky, ricordarsi di disattivare nel foundation l' "overflow: hidden;" del "main" - riga 360
 * Il valore "top" è indispensabile ed è l'offset dal top dello schermo se impostato
 */
.sticky { top: 5vh; }




/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ BREADCRUMBS ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

.breadcrumbs { display: flex; align-items: center; justify-content: flex-start; flex-wrap: wrap; gap: .25em .75em; }
.breadcrumbs li { 
    display: flex; align-items: center; justify-content: flex-start; gap: .75em; list-style: none; margin: 0; 
    text-transform: uppercase; font-size: .9rem;
}
.breadcrumbs li::after { content: ">"; display: inline-block; }
.breadcrumbs li:last-of-type::after { display: none; }



/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ ANIMAZIONI ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

/* Testi */
.s1_title.textAnim h1 { opacity: 0; }
.s1_title.textAnim.active h1 { opacity: 1; }

.textAnim h1, .textAnim h2 { opacity: 0; transform: translateY(50%); transition: 1s ease; }
.textAnim.active h1, .textAnim.active h2 { opacity: 1; transform: translateY(0); }

.textAnim p, .textAnim li, .textAnim p a, .textAnim li a { opacity: 0; transform: translateY(50%); transition: 1s ease .25s; }
.textAnim.active p, .textAnim.active li, .textAnim.active p a, .textAnim.active li a { opacity: 1; transform: translateY(0); }


/* Extra */
.sec_trigger.toTop { transform: translateY(25%); opacity: 0; transition: .75s cubic-bezier(.76,0,.24,1); }
.sec_trigger.toTop.active { transform: translateY(0); opacity: 1; }










/**
 *
 *  █▀▀  ▄▀▀▄  ▄▀▀▄  ▀▀█▀▀  █▀▀  █▀▀▄
 *  █▀▀  █  █  █  █    █    █▀▀  █▐█▀
 *  ▀     ▀▀    ▀▀     ▀    ▀▀▀  ▀ ▀▀ - FOOTER
 *
 * ░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░
 */


footer { background-color: var(--blue); }


/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ STRUCTURE ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

.content_wrapper { grid-gap: var(--c15v) var(--c2o); position: relative; }
.content_wrapper::after { content: ""; width: calc(100% - var(--c5o)); height: 1px; background-color: rgb(var(--white-rgb) / 50%); position: absolute; left: var(--c2o); top: 0 ; }

.foot_block h4 { text-transform: uppercase; color: var(--white); font-size: 1.45rem; font-weight: 500; margin-bottom: 2rem; }
.foot_block p { color: var(--white); font-weight: 300; }
.foot_block p a { font: inherit; font-weight: 500; }
.foot_block p a:hover { opacity: .5; }

.foot_block .txt { font-size: 3rem; font-weight: 400; line-height: 1.1; }


/* Foot Logo */
.foot_logo { display: flex; justify-content: center; align-items: center; gap: 4vw; }
.foot_logo .line { width: 1px; height: 8vw; min-height: 4rem; background-color: rgb(var(--white-rgb) / 50%); }

.foot_logo img { width: auto; height: 8vw; min-height: 4rem; }


/* Foot Social */
.foot_block .social_wrp { margin-top: var(--c15v); }



/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ CREDITS ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

#credits { margin-top: var(--c15v); }
#credits p { font-weight: 300; }
#credits a { display: inline-block; font: inherit; color: inherit; font-weight: 300; }




/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ BACK TO TOP ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

#back_top {
	display: none; z-index: 2; 
	bottom: .5em; right: .5em;
	--back-top-px: 40px;
	--back-top-min: 40;
	--back-top-max: 60;
	max-width: 60px; 
	padding: .25em; background-color: rgb(255 255 255 / 25%);
	cursor: pointer; transition: .25s ease;
}
#back_top :where(img, svg) { width: 100%; }
#back_top svg path { fill: var(--black); }








/**
 *
 *  ▄▀▀  █▀▀  ▄▀▀  ▀▀█▀▀  ▀  ▄▀▀▄  █▄ █  ▄▀▀ 
 *   ▀▄  █▀▀  █      █    █  █  █  █ ▀█   ▀▄ 
 *  ▀▀   ▀▀▀   ▀▀    ▀    ▀   ▀▀   ▀  ▀  ▀▀  - SECTIONS
 *
 * ░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░
 */


/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ SECTION 1 ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

.s1 {  }
.s1 .container { padding-top: calc( 84px + ( 150 - 84 ) * ( (100vw - 320px) / 1600 ) ); }



/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ SECTION NEWS ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

#slider_news { background-color: var(--blue); padding-bottom: 1.25rem; }

#slider_news .nav_dots { position: absolute; bottom: .5rem; right: 1rem; left: unset; width: auto; }
#slider_news .nav_dots .swiper-pagination-bullet { border: 1px solid var(--white); background: transparent; opacity: 1; width: 10px; height: 10px; }
#slider_news .nav_dots .swiper-pagination-bullet-active { background-color: var(--white); }

.card_news { text-align: center; }

.news_date { padding: 2rem; border-bottom: 1px solid rgb(var(--white-rgb) / 50%); }
.news_date span { font-size: 1.5rem; font-weight: 400; text-transform: uppercase; color: var(--white); }
.news_date span.day { font-size: 4rem; }

.news_content { padding: 2rem; }
.news_content h4 { color: var(--white); }
.news_content p { color: var(--white); margin-top: 1rem; }
.news_content a { text-decoration: underline; color: var(--white); margin-top: 1rem; }
.news_content a:hover { opacity: .5; }




/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ LOGIN ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

.login-wrapper { width: 30rem; margin: 0 auto; background: var(--white); border-radius: 1rem; box-shadow: 0 0 2rem rgb(var(--blue-rgb) / 20%); }
.login-wrapper .h2 { font-size: 2.5rem; color: var(--white); padding: 1rem 1.5rem; background-color: var(--blue); border-radius: 1rem 1rem 0 0; }

.login-container { padding: .5rem 1.5rem 2.5rem 1.5rem; }
.login-container > p { margin-bottom: 2rem; margin-top: .5rem; font-size: 1.25rem; }

#login-form {}
#login-form label { position: absolute; left: 0; top: 0; display: block; transform: translate(1rem, -50%); background-color: var(--white); color: var(--blue); padding: 0 .5rem; }
#login-form input { 
    display: block; width: 100%; padding: 1rem; margin-bottom: 2rem; border: 1px solid var(--blue); border-radius: 5rem; 
    font-size: 1rem; line-height: 1; font-family: var(--main-font); 
}

#login-form button { width: 100%; }
#login-form button .button-text {
    display: inline-block; width: 100%; position: relative; padding: .625em 1.5em; transition: .25s ease;
    background-color: var(--blue); border: 2px solid var(--blue); border-radius: 5rem;
    font: inherit; font-size: 1rem; color: var(--white); text-transform: uppercase; font-weight: 500;
}
#login-form button .button-text:hover { background-color: var(--white); color: var(--blue); }
#login-form button .loading-spinner { width: 16px; height: 16px; border: 3px solid #ccc; border-top: 3px solid #333; border-radius: 50%; animation: spin 0.7s linear infinite; margin-left: 10px; }

#login-message { margin-top: 10px; text-align: center; }
#login-message.success { color: green; }
#login-message.error { color: red; }

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}





/**
 *
 *  ▄▀▀  ▄▀▀▄  █▀▀▄  █▀▀▄  ▄▀▀ 
 *  █    █▀▀█  █▐█▀  █  █   ▀▄ 
 *   ▀▀  ▀  ▀  ▀ ▀▀  ▀▀▀   ▀▀  - CARDS
 *
 * ░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░
 */


/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ CARD ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/




/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ CARD EMPTY ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

.card_empty { padding: 2em 1.5em; }
.card_empty svg { width: 6em; }
.card_empty .text { margin-top: 1em; }




/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ CARD ____ ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/








/**
 *
 *  █  █  ▄▀▀▄  █▄ ▄█  █▀▀
 *  █▀▀█  █  █  █ █ █  █▀▀
 *  ▀  ▀   ▀▀   ▀   ▀  ▀▀▀ - HOMEPAGE
 *
 * ░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░
 */


/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ SECTION 1 ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

/*#s1_home .sec_svg { transform-origin: top center; transform: scale(1.2); }*/

/*
.sec_trigger#auto_s1 #auto { opacity: 0; transform: translateX(40%); transition: 1s cubic-bezier(.76,0,.24,1); }
.sec_trigger.active#auto_s1 #auto { opacity: 1; transform: translateX(0%); }

.sec_trigger#auto_s1 #uomo { transform-origin: bottom center; transform: scale(0.5); opacity: 0; transition: .5s cubic-bezier(.76,0,.24,1); }
.sec_trigger.active#auto_s1 #uomo { opacity: 1; transform: scale(1); }
*/

.anim_svg {  }

#move_3 { animation: move_3 3s infinite forwards ease-in-out; }
#move_2 { animation: move_2 3.25s infinite forwards ease-in-out; }
#move_1 { animation: move_1 2.5s infinite forwards ease-in-out; }

@keyframes move_3 {
    0% { transform: translateY(0); }
    50% { transform: translateY(-.5rem); }
    100% { transform: translateY(0); }
}

@keyframes move_2 {
    0% { transform: translateY(0); }
    50% { transform: translateY(.5rem); }
    100% { transform: translateY(0); }
}

@keyframes move_1 {
    0% { transform: translateY(0); }
    50% { transform: translateY(-.75rem); }
    100% { transform: translateY(0); }
}




/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ SECTION 2 ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

.box_somma { background-color: var(--white); border-radius: 1.5rem; padding: 1rem; box-shadow: 7px 8px 9.8px 0px rgba(0, 0, 0, 0.09); }
.box_somma img { width: 4.5rem; height: 4.5rem; margin-bottom: 1.25rem; object-fit: contain; }
.box_somma p { font-weight: 400; line-height: 1.3; }
.box_somma .tit { text-transform: uppercase; font-size: 125%; color: var(--blue); margin-bottom: 1rem; font-weight: 650; }

.box_somma:last-of-type { background: linear-gradient(var(--gradient)); }
.box_somma:last-of-type p { color: var(--white); }


.operatore { font-size: 5rem; color: var(--blue); font-weight: 300; margin: 1rem 0; }



/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ SECTION 3 ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

.bkg_sky { background-color: var(--sky); }

/* Wrapper gioco */
.mega_wrapper { background-color: var(--white); border-radius: 2rem; box-shadow: 7px 8px 0.5rem 0px rgb(30 30 30 / 15%); overflow: hidden; }
.mega_wrapper .wrapper_steps { transition: .5s ease-out; }

/* Step / Substep */
.wrapper_steps .sub_wrapper { min-width: 100%; }
.wrapper_steps .box_step { padding: var(--c10v) var(--c2o); min-width: 100%; height: 0; opacity: 0; }
.wrapper_steps .box_step.active { height: 100%; opacity: 1; min-height: 60vh; }

/*.wrapper_steps .box_step > .text h3 { }*/


/* Box filtri */
.select_wrp { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 2rem; }
.select_wrp .box_select { background-color: #EDEDED; box-shadow: 7px 8px 0.5rem 0px rgb(30 30 30 / 15%); border-radius: 2rem; padding: 1.5rem; width: 15rem; min-height: 12rem; }
.select_wrp .box_select img { width: auto; height: 4rem; margin-bottom: 1.25rem; }
.select_wrp .box_select p { font-size: 1.125rem; line-height: 1.1; text-transform: uppercase; font-weight: 650; color: var(--blue); }

.select_wrp .box_select:hover { transform: scale(.95); }
.select_wrp .box_select.select { background-color: var(--blue); }
.select_wrp .box_select.select * { filter: brightness(0) invert(1); }

/* Wrapper navigazione */
.mega_wrapper .wrapper_nav { border-top: 1px solid #ccc; padding: 2rem var(--c2o); }

.dots_wrapper { gap: .5rem; }
.nav_num { width: 3rem; height: 3rem; border-radius: 50%; display: flex; align-items: center; justify-content: center; background-color: #D9D9D9; color: #989898; font-weight: 400; font-size: 1.25rem; }
.nav_num.done, .nav_num.current { background: linear-gradient(var(--gradient)); color: var(--white); }

.nav_button .nav_step { gap: .75rem; display: none; }
.nav_button button.disabled { filter: grayscale(.5); cursor: not-allowed; opacity: .5; pointer-events: none; }





/* Step 1 - status iniziale */
.view_slide_1 .wrapper_steps { transform: translateX(0); }
.view_slide_1 .nav_step_1 { display: flex; }


/* Step 2 */
.mega_wrapper.view_slide_2 .wrapper_steps { transform: translateX(-100%); }
.view_slide_2 .nav_step_2 { display: flex; }


/* Step 3 */
.mega_wrapper.view_slide_3 .wrapper_steps { transform: translateX(-200%); }
.view_slide_3 .nav_step_3 { display: flex; }


/* Risultato finale */
.mega_wrapper.view_slide_result_azienda .wrapper_steps { transform: translateX(-300%); }
.mega_wrapper.view_slide_result_privata .wrapper_steps { transform: translateX(-200%); }
.mega_wrapper.view_slide_result .nav_step_finale { display: flex; }


.link_risultato { background: linear-gradient(var(--gradient)); border-radius: 2rem; padding: 0 2rem 2.75rem 2rem; }
.link_risultato .check { width: 4rem; transform: translateY(-50%); }



/* Link pagina finale */
.link_risultato h4 { font-size: 3rem; color: var(--white); }
.link_risultato button { font-size: 1rem; margin-top: 1.25rem; }







/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ SECTION 4 ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

.nuvola_1 { position: absolute; left: -10%; top: 10%; width: 40%; animation: nuvola_1 12s linear forwards infinite; }
.nuvola_2 { position: absolute; left: 0; top: -5%; width: 60%; animation: nuvola_2 14s linear forwards infinite; }

#auto_elettrica { z-index: 1; position: relative; }



@keyframes nuvola_1 {
    0% { opacity: 0; }
    15% { opacity: 1; }
    90% { opacity: 1; }
    100% { opacity: 0; left: 70%; }
}

@keyframes nuvola_2 {
    0% { opacity: 0; }
    15% { opacity: 1; }
    90% { opacity: 1; }
    100% { opacity: 0; left: 50%; }
}




#batt_1 { opacity: 1; }
#batt_2 { animation: batteryAnimation2 4s infinite linear forwards; }
#batt_3 { animation: batteryAnimation3 4s infinite linear forwards; }
#batt_4 { animation: batteryAnimation4 4s infinite linear forwards; }
#batt_5 { animation: batteryAnimation5 4s infinite linear forwards; }

@keyframes batteryAnimation2 {
    0% { opacity: 0; }
    20% { opacity: 0; }
    21% { opacity: 1; }
    100% { opacity: 1; }
}

@keyframes batteryAnimation3 {
    0% { opacity: 0; }
    40% { opacity: 0; }
    41% { opacity: 1; }
    100% { opacity: 1; }
}

@keyframes batteryAnimation4 {
    0% { opacity: 0; }
    60% { opacity: 0; }
    61% { opacity: 1; }
    100% { opacity: 1; }
}

@keyframes batteryAnimation5 {
    0% { opacity: 0; }
    80% { opacity: 0; }
    81% { opacity: 1; }
    100% { opacity: 1; }
}









/**
 *
 *  █▀▀▄  ▄▀▀▄  ▄▀▀▀   █▀▀  ▄▀▀
 *  █  █  █▀▀█  █  ▀▌  █▀▀   ▀▄
 *  █▀▀   ▀  ▀   ▀▀▀   ▀▀▀  ▀▀  - TEMPLATES _ PAGINE
 *
 * ░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░
 */


/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ SECTION 1 ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

#page_page { overflow: visible; }

/* Page content */
.wrapper_page {  }
.page_content { background-color: var(--white); border-radius: 2rem; box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25); }


/* Accordion principale */
.argomenti_di_approfondimento { margin-top: var(--c7v); }
.argomenti_di_approfondimento .card_accordion { margin-bottom: 1.5rem; border: 1px solid var(--blue); border-radius: 1rem; }

.argomenti_di_approfondimento .accordion_head { padding: 1.5rem; cursor: pointer; }
.argomenti_di_approfondimento .accordion_head h3 { font-size: 1.75rem; text-transform: uppercase;  padding-right: 1rem; }
.argomenti_di_approfondimento .accordion_head img { display: block; width: 2rem; }
.argomenti_di_approfondimento .accordion_head.active img { transform: scaleY(-1); }

.argomenti_di_approfondimento .accordion_text { display: none; margin-top: 2rem; padding-bottom: var(--c5v); }
.argomenti_di_approfondimento .accordion_text .contenuto_principale { padding: 0 1.5rem; padding-top: var(--c7v); }
.argomenti_di_approfondimento .accordion_text .contenuto_principale:first-of-type { padding-top: 0; }
.argomenti_di_approfondimento .accordion_text .contenuto_secondario { padding: 0 3rem; padding-top: var(--c5v); }
.argomenti_di_approfondimento .accordion_text .contenuto_terziario {padding: 0 3rem;padding-top: var(--c5v);}


/* Text style */
.page_content .text p { font-weight: 400; text-align: justify; margin-top: 1em;}
.page_content .text h2 {
    font-size: 2rem;
    font-weight: 500;
    -webkit-text-fill-color: var(--black);
    line-height: normal;
}

.page_content .contenuto_secondario h3 {
    font-size: 1.8rem;
    font-weight: 500;
    -webkit-text-fill-color: var(--black);
    line-height: normal;
}

.page_content .contenuto_terziario h4 {
    font-size: 1.5rem;
    font-weight: 500;
    -webkit-text-fill-color: var(--black);
    line-height: normal;
}






/* Sidebar */
#sidebar {
    background: linear-gradient(var(--gradient)); width: calc(100% - 5rem); height: 100%; padding: 2rem 0; border-radius: 2rem 0 0 2rem; 
    position: fixed; top: 0; right: 0; z-index: 4; transform: translateX(100%); transition: .5s ease; 
}
#sidebar h4 { font-size: 2rem; color: var(--white); padding-left: 1.5rem; }

.open_sidebar { position: absolute; left: 0; top: 50%; transform: translate(-100%, -50%); background-color: var(--blue); width: 3rem; padding: 1rem .75rem; border-radius: 1rem 0 0 1rem; }
.open_sidebar path { fill: var(--white); }

#sidebar.opened { transform: translateX(0%); }
#sidebar.opened .open_sidebar svg { transform: scaleX(-1); }

/* Accordion sidebar */
.index_accordion { margin-top: 1rem; }
.index_accordion .main_card_accordion { border-bottom: 1px solid rgb(var(--white-rgb) / 50%); }
.index_accordion .main_card_accordion:last-of-type { border-bottom: 0; }
.index_accordion .main_accordion_head { padding: 1.25rem 1.5rem; cursor: pointer; }
.index_accordion .main_accordion_head h3 { font-size: 1.25rem; text-transform: uppercase; color: var(--white); }
.index_accordion .main_accordion_head img { display: block; width: 1.5rem; filter: brightness(0) invert(1); }
.index_accordion .main_accordion_head.active img { transform: scaleY(-1); }
.index_accordion .main_accordion_text { display: none; padding: 0 1.5rem 1rem 1.5rem; }
.index_accordion .main_accordion_text .main_btn { color: var(--white); opacity: .75; text-align: left; padding: .5rem 0; }

.index_accordion .sub_accordion { padding: .5rem 0; }
.index_accordion .sub_accordion_head .btn_scroll { color: var(--white); opacity: .75; text-align: left; width: calc(100% - 1rem); padding-right: .75rem; }
.index_accordion .sub_accordion_head .open_acc { display: block; width: 1rem; filter: brightness(0) invert(1); }
.index_accordion .sub_accordion_text { display: none; padding: .5rem; padding-left: 0; }
.index_accordion .sub_accordion_text .btn_scroll { width: 100%; color: var(--white); opacity: .75; padding: .125rem; padding-left: 1.25rem; text-align: left; }

.open_acc, .scroll_btn { transition: opacity .25s ease; }
.open_acc:hover, .scroll_btn:hover { opacity: .5 !important; }



/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ SECTION 2 ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

.referenti_progetto .h4 { text-transform: uppercase; font-size: 2rem; margin-bottom: 1rem; }
.referenti_progetto .tel { font-size: 2.5rem; -webkit-text-fill-color: transparent; background: linear-gradient(to right, #2B335C, #008CC9); background-clip: text; margin-top: 2rem; }
.referenti_progetto .tel img { width: 2rem; margin-right: .75rem; }
.referenti_progetto .tel:hover { opacity: .5; }

.referenti_wrp p { padding: .5rem 0; border-bottom: 1px solid #6d6d6d; font-weight: 400; }
.referenti_wrp p:last-of-type { border-bottom: 0; }




/**
 *
 *  █▀▀  ▄▀▀▄  █▀▀▄  █▄ ▄█
 *  █▀▀  █  █  █▐█▀  █ █ █
 *  ▀     ▀▀   ▀ ▀▀  ▀   ▀ - FORM
 *
 * ░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░
 */


/* WP-Form - Custom */
#form { background-color: var(--white); }

#form .wpforms-field label { color: ; }

#form .wpforms-field :where(input, textarea, select) {
	background-color: transparent; border: ; border-radius: ;
	padding: ; font-size: ; color: ;
}
#form .wpforms-field input::placeholder, #form .wpforms-field textarea::placeholder { color: ; opacity: ; }

#form .wpforms-field.wpforms-field-checkbox li input[type="checkbox"] { padding: ; border: ; border-radius: ; }
#form .wpforms-field.wpforms-field-checkbox li input[type="checkbox"]:checked { background: ; }
#form .wpforms-field.wpforms-field-checkbox li label { margin-left: .75em; padding: ; color: ; }
#form .wpforms-field.wpforms-field-checkbox li label a:hover { color: ; }

#form button[type=submit], #form input[type=submit] {
	padding: ; font-size: ; color: ;
	background-color: ;  border: ; border-radius: ;
}
#form button[type=submit]:hover, #form input[type=submit]:hover { background-color: ; border-color: ; color: ; }









/**
 *
 *  █▀▀  █  █  ▀▀█▀▀  █▀▀▄  ▄▀▀▄
 *  █▀▀  ▄▀▀▄    █    █▐█▀  █▀▀█
 *  ▀▀▀  ▀  ▀    ▀    ▀ ▀▀  ▀  ▀ - EXTRA
 *
 * ░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░
 */


/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ PAGE GRAZIE ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

#s1_grazie {}




/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ PAGE 404 ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

#s1_404 { background-color: var(--bkg_color); }

#s1_404 .s1_title h1 { font-size: 2rem; }
#s1_404 .s1_title p { font-size: 1.1rem; }
#s1_404 .s1_title .link { display: inline-block; padding: 0.9rem 1.7rem; border: 2px solid var(--btn_color); border-radius: 0.6rem; font-size: 1rem; color: var(--btn_color); }
#s1_404 .s1_title .link:hover { background-color: var(--btn_color); color: var(--btn_color_hover); transform: scale(1.05); }




/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ CSS EXTRA O MOD ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/












/**
 * ██████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████
 *
 * RESPONSIVE
 *
 * Settare se necessario regole fluid per minmax di elementi specifici basandosi sulle seguenti regole:
 *	=>	ORIGINAL CALC			->	calc( 12px + (24 - 12) * ( (100vw - 360px) / (1920 - 360) ) )
 *	=>	CALC 1920px -> 360px	->	calc( 12px + (24 - 12) * ( (100vw - 360px) / 1560 ) )
 *	=>	CALC 1280px -> 360px	->	calc( 12px + (24 - 12) * ( (100vw - 360px) / 920 ) )
 *	=>	CALC 1024px -> 360px	->	calc( 12px + (24 - 12) * ( (100vw - 360px) / 664 ) )
 *
 * Da creare fluid dinamico con 2 step per i calc iniziali =   1920 -> 1024   1024 -> 360
 *
 * __________________________________________________________________________________________________________________________________________________________________________
 */


#scroll_btn { width: calc( var(--scroll-px) + ( var(--scroll-max) - var(--scroll-min) ) * ( (100vw - 360px) / 1560 ) ); }
#back_top { width: calc( var(--back-top-px) + ( var(--back-top-max) - var(--back-top-min) ) * ( (100vw - 360px) / 1560 ) ); }




/*∞∞∞∞∞∞ HEADER ∞∞∞∞∞∞*/
/* Logo */
/* Head Content */
/* Hamburger */
/* Nav Menu */
/* Darkmode Switch */


/*∞∞∞∞∞∞ ASSETS ∞∞∞∞∞∞*/
/* Buttons */
/* Links */
/* Filters */
/* Sections 1 */
/* Breadcrumbs */
/* Scroll */
/* Components */
/* Cards */
/* Sidebar */
/* ... */


/*∞∞∞∞∞∞ FOOTER ∞∞∞∞∞∞*/
/* Structure */
/* Credits */
/* Back Top */


/*∞∞∞∞∞∞ SECTIONS ∞∞∞∞∞∞*/
/* Section 1 */


/*∞∞∞∞∞∞ CARDS ∞∞∞∞∞∞*/
/* Card */
/* Card Empty */


/*∞∞∞∞∞∞ HOMEPAGE ∞∞∞∞∞∞*/
/* Sec 1 */
/* Sec 2 */
/* Sec [...] */


/*∞∞∞∞∞∞ PAGE ∞∞∞∞∞∞*/
/* Template ... */
/* Template ... */
/* Template ... */


/*∞∞∞∞∞∞ ARCHIVE ∞∞∞∞∞∞*/
/* Sec 1 */
/* Sec 2 */
/* Sec ... */


/*∞∞∞∞∞∞ SINGLE ∞∞∞∞∞∞*/
/* Sec 1 */
/* Sec 2 */
/* Sec ... */


/*∞∞∞∞∞∞ FORM ∞∞∞∞∞∞*/


/*∞∞∞∞∞∞ EXTRA ∞∞∞∞∞∞*/




/**
 *
 *  █▄ ▄█  ▄▀▀▄  █▀▀▄  ▀  █     █▀▀
 *  █ █ █  █  █  █▀▀█  █  █  ▄  █▀▀
 *  ▀   ▀   ▀▀   ▀▀▀   ▀  ▀▀▀▀  ▀▀▀ - MOBILE PORT | 601 -> 767
 * __________________________________________________________________________________________________________________________________________________________________________
 */

@media screen and (min-width: 601px) {

	
	/*∞∞∞∞∞∞ HEADER ∞∞∞∞∞∞*/

	/* Logo */

	/* Head Content */
	.head_wrapper { padding: 1.5em 2.5%; z-index: 2; }

	/* Hamburger */
	/* Nav Menu */


}






/**
 *
 *  ▀▀█▀▀  ▄▀▀▄  █▀▀▄  █     █▀▀  ▀▀█▀▀
 *    █    █▀▀█  █▀▀█  █  ▄  █▀▀    █
 *    ▀    ▀  ▀  ▀▀▀   ▀▀▀▀  ▀▀▀    ▀   - TABLET |  768 x 1024  ->  1023 x 1280
 * __________________________________________________________________________________________________________________________________________________________________________
 */

@media screen and (min-width: 768px) {

    /*∞∞∞∞∞∞ HEADER ∞∞∞∞∞∞*/
    .menu_wrapper { display: flex; align-items: flex-start; justify-content: space-between; }


    /*∞∞∞∞∞∞ CARD NEWS ∞∞∞∞∞∞*/
    #slider_news { padding-bottom: 0; }

    .card_news { display: grid; grid-template-columns: 0.25fr 1fr; text-align: left; }
    .news_date { border-bottom: 0; border-right: 1px solid rgb(var(--white-rgb) / 50%); }


}



/**
 *
 *  █▀▀▄  █▀▀  ▄▀▀  █ ▄▀  ▀▀█▀▀  ▄▀▀▄  █▀▀▄      ▄▀▀  █▄ ▄█  ▄▀▀▄  █    █ 
 *  █  █  █▀▀   ▀▄  █▀▄     █    █  █  █  █       ▀▄  █ █ █  █▀▀█  █ ▄  █ ▄ 
 *  ▀▀▀   ▀▀▀  ▀▀   ▀ ▀▀    ▀     ▀▀   █▀▀       ▀▀   ▀   ▀  ▀  ▀  ▀▀▀  ▀▀▀  - LAPTOP |  1024 x 768  ->  1280 x 720
 * __________________________________________________________________________________________________________________________________________________________________________
 */

@media screen and (min-width: 1024px) {


	/*∞∞∞∞∞∞ HEADER ∞∞∞∞∞∞*/
    .link.link_head { display: inline-block; }
    #hamburger { display: none; }

    .sub_menu { width: 40vw; right: 10%; }
    
    .sub_menu.sub_menu_user { width: 25vw; }
    .sub_menu.sub_menu_user .menu_i { padding: var(--c5v) var(--c2o); }

    .link.link_head { padding: .5em 2.25em .5em 1.25em; }
    .link.link_head::after { display: inline-block; }


	/*∞∞∞∞∞∞ FOOTER ∞∞∞∞∞∞*/
	/* Contents */
    .content_wrapper { grid-template-columns: 1fr 0.75fr 0.75fr; grid-gap: var(--c15v) var(--c5o); }
    .foot_block { height: 100%; }
    .foot_block h4 { margin-bottom: 3rem; }
    .foot_block .txt { font-size: 3.75rem; }
    .foot_block .social_wrp { margin-top: 0; }
    .foot_block .social_wrp .social { justify-content: flex-start; margin-top: 0; }


	/* Credits */
    #credits { margin-top: 0; }
	#credits a:hover, #credits a:active, #credits a:focus { opacity: .5; }
	#credits #credits_studio:hover { color: #e74e0f; opacity: 1; }

	/* Back Top */
	#back_top { opacity: 1; }


    /*∞∞∞∞∞∞ HOME ∞∞∞∞∞∞*/
    /* Sec 1 */
    #s1_home .container { align-items: flex-end; }
    .text.max_par p { width: 80%; }

    #svg_s1 { transform: scale(1.1); transform-origin: top; }


    /* Sec 2 */
    #s2_home .somma_wrapper { display: grid; grid-template-columns: 1fr .125fr 1fr .125fr 1fr .125fr 1fr; grid-gap: 1rem; padding-left: var(--c2o); padding-right: var(--c2o); }
    .box_somma { height: 100%; aspect-ratio: unset; }



    /*∞∞∞∞∞∞ PAGE ∞∞∞∞∞∞*/
    .referenti_progetto { margin-top: 0; }


    /*∞∞∞∞∞∞ SIDEBAR ∞∞∞∞∞∞*/
    #sidebar { position: sticky; top: 5vh; width: calc(30% - var(--c1o)); height: auto; border-radius: 2rem; transform: translateX(0); z-index: 1; }
    .open_sidebar { display: none; }


}






/**
 *
 *  █     ▄▀▀▄  █▀▀▄  ▀█▀  ▄▀▀▄  █▀▀▄
 *  █  ▄  █▀▀█  █  █   █   █  █  █  █
 *  ▀▀▀▀  ▀  ▀  █▀▀    ▀    ▀▀   █▀▀  - LAPTOP |  1281 x 720  ->  1366 x 768
 * __________________________________________________________________________________________________________________________________________________________________________
 */

@media screen and (min-width: 1281px) {
    

    /*∞∞∞∞∞∞ HEADER ∞∞∞∞∞∞*/
    .head_logo img { height: 5.5rem; }

    .menu_i > p { font-size: 3em; }
    .tit_menu > a { padding: 1.25rem 0; font-size: 1.5em; } 
    .tit_menu .sub-menu { padding-bottom: 1.25rem; }
    .tit_menu .sub-menu a { font-size: 1.125em; }




    /*∞∞∞∞∞∞ SEC NEWS ∞∞∞∞∞∞*/
    .card_news { display: grid; grid-template-columns: 0.125fr 1fr; }
    .news_content { padding: 2rem 5rem; }



    /*∞∞∞∞∞∞ SIDEBAR ∞∞∞∞∞∞*/
    #sidebar { width: calc((100% - (var(--c2o) * 3)) / 4); }

}






/**
 *
 *  █▀▀▄  █▀▀  ▄▀▀  █ ▄▀  ▀█▀  ▄▀▀▄  █▀▀▄
 *  █  █  █▀▀   ▀▄  █▀▄    █   █  █  █  █
 *  ▀▀▀   ▀▀▀  ▀▀   ▀ ▀▀   ▀    ▀▀   █▀▀  - LAPTOP |  1367 x 768  ->  1919 x 1080
 * __________________________________________________________________________________________________________________________________________________________________________
 */

@media screen and (min-width: 1367px) {


    /*∞∞∞∞∞∞ HOME ∞∞∞∞∞∞*/
    /* Sec 2 */
    .box_somma { aspect-ratio: 1 / 1; }

}






/**
 *
 *  █  █  █▀▀▄  █▀▀  █▀▀▄
 *  █  █  █▀▀█  █▀▀  █▐█▀
 *   ▀▀   ▀▀▀   ▀▀▀  ▀ ▀▀ - ÜBER | 1921 -> ...
 * __________________________________________________________________________________________________________________________________________________________________________
 */

@media screen and (min-width: 1921px) {}






/**
 *
 *   ▄▀█   █ ▄▀
 *  █▄▄█▄  █▀▄
 *     █   ▀ ▀▀ - DESKTOP 4K & UP | 2561px -> ...
 * __________________________________________________________________________________________________________________________________________________________________________
 */

@media screen and ( min-width: 2561px ) {}