/*

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

DESIGN BY © LO STUDIO

CUSTOM.CSS STYLESHEET FOR => " VIS PRODUZIONI VIDEO "

BASE (MOBILE) SIZE

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




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


header { top: 0; left: 0; padding: 1em 1.5em 0 1.5em; z-index: 4; }


/* Rec */
#rec { width: 6em; padding: .5em .75em .75em .5em; border-top: .25em solid var(--white); border-left: .25em solid var(--white); pointer-events: none; }
#rec > img { animation: rec 2s ease-in-out infinite; will-change: opacity; }
@keyframes rec {
	0% { opacity: 1; }
	15% { opacity: 1; }
	50% { opacity: 0; }
	85% { opacity: 1; }
	100% { opacity: 1; }
}


/* Logo */
.head_logo { display: inline-block; width: 10em; }
.head_logo :where(img, svg) { width: 100%; }


/* Head Link */
header .link { position: fixed; bottom: 1em; right: 50%; transform: translateX(50%); width: max-content; max-width: calc(100% - var(--c10o)); }
header .link.deactive { transform: translate(50%, calc(100% + 1.5em)); }








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


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

.link {
	display: block; position: relative; width: fit-content; padding: 1rem 1.5rem;
	border: 0; border-radius: 20em; background-color: var(--green); box-shadow: 0 0 1em rgb(var(--white-rgb) / 75%);
	font: 60 87.5% / 1.25 var(--alt-font); color: var(--white); text-transform: uppercase;
}
.link span { display: inline-block; color: var(--yellow); transition: .25s ease; }
.link:hover, .link:focus, .link:active { background-color: var(--yellow); color: var(--green); }
.link:hover span, .link:focus span, .link:active span { color: var(--green); }




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

.main_filter { background-color: var(--yellow); inset: 0; pointer-events: none; z-index: 0; opacity: 0; transition: none; will-change: opacity; }




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

#scroll_btn { position: relative; display: inline-block; margin: 0 auto; width: 3em; 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 svg path { fill: var(--white); transition: .25s ease; }
#scroll_btn:hover svg { animation-play-state: paused; }
#scroll_btn:hover svg path { fill: var(--yellow); }




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

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

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

.nav_btn.swiper-button-disabled { opacity: .25; }


/* Dots */
.nav_dots { bottom: auto !important; top: auto !important; left: auto !important; gap: .5em; margin-top: 1.5em; }
.nav_dots span { width: .75em; height: .75em; margin: 0 !important; border: 1px solid var(--green); border-radius: 2em; background: transparent; opacity: 1; transition: .25s ease; }
.nav_dots span.swiper-pagination-bullet-active { background: var(--green); }


/* NAV glightbox */
.glightbox-clean .gprev, .glightbox-clean .gnext { top: 45% !important; }



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


.text p em { font-style: unset; color: var(--yellow); }
.text p strong { font-weight: 90; }


.card_num { font: 50 125% / 1 var(--alt-font); pointer-events: none; }
.card_num.abs { top: 1.5em; left: 1em; }


.text.outline h2 { color: var(--green); text-shadow: 1px 0 var(--yellow), -1px 0 var(--yellow), 0 1px var(--yellow), 0 -1px var(--yellow); }
.text.outline.animate h2 { text-shadow: none; will-change: text-shadow; transition: .625s ease-out; }
.text.outline.animate.triggered h2 { text-shadow: 1px 0 var(--yellow), -1px 0 var(--yellow), 0 1px var(--yellow), 0 -1px var(--yellow); }




/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ SIDE SCROLLER ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

#page_scroller { top: 0; left: 0; height: 100dvh; padding: .5em 0; pointer-events: none; z-index: 3; }
#page_scroller > img:not(.arrow) { width: 100%; height: 100%; object-fit: contain; object-position: left; }
#page_scroller .arrow { top: 0; left: .375em; width: .5em; height: auto; transform: translateY(0); transition: transform 0s; }








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


footer { overflow: hidden; }

footer .foot_bkg { background-attachment: fixed; }

footer .blur_filter {
	position: absolute; inset: 0; pointer-events: none; z-index: 2; 
	backdrop-filter: blur(20px); animation: focusLoop 10s ease-in-out infinite; will-change: backdrop-filter, transform, filter;
}
footer .blur_filter::before {
	content: ""; position: absolute; inset: 0; pointer-events: none; 
	background-color: var(--green); opacity: .75; mix-blend-mode: darken;
}
footer .blur_filter::after {
	content: ""; position: absolute; inset: 0; pointer-events: none;
	background: 
		radial-gradient(circle, rgb(var(--black-rgb) / 0%) 55%, rgb(var(--black-rgb) / 35%) 100%), 
		radial-gradient(circle at 50% 50%, rgb(255 0 0 / 0.5%), rgb(0 255 255 / 0.5%));
	mix-blend-mode: overlay; opacity: 0.65;
	animation: vignettePulse 5s ease-in-out infinite, irisPulse 10s ease-in-out infinite; will-change: opacity, transform, filter;
}
@keyframes focusLoop {
	0%   { backdrop-filter: blur(20px) brightness(0.9); transform: scale(1.025); }
	6%   { backdrop-filter: blur(8px) brightness(1); transform: scale(1.015); }
	12%  { backdrop-filter: blur(14px) brightness(0.95); transform: scale(1.02); }
	18%  { backdrop-filter: blur(4px) brightness(1); transform: scale(1.01); }
	24%  { backdrop-filter: blur(9px) brightness(0.97); transform: scale(1.012); }
	30%  { backdrop-filter: blur(0px) brightness(1); transform: scale(1); }
	50%  { backdrop-filter: blur(0px); transform: scale(1.003); }
	60%  { backdrop-filter: blur(0px); transform: scale(1); }
	75%  { backdrop-filter: blur(0px); transform: scale(1.004); }
	100% { backdrop-filter: blur(20px) brightness(0.875); transform: scale(1.03); }
}
@keyframes vignettePulse {
	0%   { opacity: 0.55; transform: scale(1); }
	50%  { opacity: 0.75; transform: scale(1.06); }
	100% { opacity: 0.55; transform: scale(1); }
}
@keyframes irisPulse {
	0%   { filter: brightness(1) saturate(1); }
	50%  { filter: brightness(0.92) saturate(1.05); }
	100% { filter: brightness(1) saturate(1); }
}



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


footer .container { padding: 1.5em var(--c5o); z-index: 2; }

footer .angle { width: 5em; }
footer .angle.abs { bottom: 1.5rem; }
footer .angle_bl { left: var(--c5o); }
footer .angle_br { right: var(--c5o); }

footer .crosshair { width: 6em; margin: 0 auto; order: 3; }


/* Foot Logo */
#foot_logo { order: 1; }
.foot_logo { display: block; width: 12em; }
.foot_logo :where(img, svg) { width: 100%; }


/* Foot Block */
#foot_info { order: 2; }
.foot_block p a { display: block; width: fit-content; padding: .25em 0; margin: 0 auto; font: 600 87.5% / 1.5 var(--alt-font); }
.foot_block p a + a { margin-top: .5em; }




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

#credits { flex-direction: column; margin-top: var(--c10v); padding-bottom: 5em; gap: 1.5em; z-index: 2; }
#credits p { margin: 0 auto; font: 50 87.5% / 1.75 var(--alt-font); z-index: 1; }
#credits .resp_sep { display: none; }
#credits a { display: inline-block; font: inherit; color: inherit; }




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

#back_top {
	bottom: .5em; left: 50%; transform: translateX(-50%); width: 2.5em; padding: .5em;
	border: 1px solid var(--white); border-radius: 0.5em;
	z-index: 3; cursor: pointer; transition: .25s ease;
}
#back_top :where(img, svg) { width: 100%; }
#back_top svg path { fill: var(--white); transition: .25s ease; }








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


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

#s1_home { overflow: hidden; margin-bottom: -1px; }

.s1 .filter { background-color: rgb(var(--green-rgb) / 57.5%); }
.s1 .filter::after {
	display: inline-block; content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 40%;
	background: linear-gradient(to bottom, rgb(var(--green-rgb) / 0%) 0%, rgb(var(--green-rgb) / 100%) 100%);
}

.s1 .container { gap: 1.5rem; }
.s1_title { transform: scale(.5); opacity: 0; transition: .375s ease-out; }
.s1_title p { font-size: 125%; line-height: 1.5; }
.s1_title h1 { color: var(--yellow); }
.s1_title h1 em { display: block; margin-top: 1.5rem; font: 65 1.25rem / 1.25 var(--main-font); color: var(--white); font-style: unset; text-transform: none; }

.s1.triggered .s1_title { transform: scale(1); opacity: 1; }




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

#icons_bkg { gap: 7.5dvh; opacity: .25; }
#icons_bkg img { width: 7em; transform-origin: bottom; transform: translateY(25%) scale(.25); opacity: 0; transition: transform .25s ease-out, opacity .5s ease-out; }
#icons_bkg img:nth-of-type(2) { transition-delay: .0625s; }
#icons_bkg img:nth-of-type(3) { transition-delay: .125s; }
#icons_bkg img:nth-of-type(4) { transition-delay: .1875s; }
#icons_bkg img:nth-of-type(5) { transition-delay: .25s; }
#icons_bkg.triggered img { transform: translateY(0%) scale(1); opacity: 1; }

.trail-image { position: absolute;width: 10em; height: auto; transform-origin: center; will-change: transform, opacity; }

#s2_home .text.animate { transform: scale(.75); opacity: 0; transition: .5s ease-out; }
#s2_home .text.animate.triggered { transform: scale(1); opacity: 1; }
#s2_home .text p { font-weight: 60; font-size: 125%; line-height: 1.75; }

#s2_home .text .txt_1 { color: var(--white); }
#s2_home .text .txt_2 { color: var(--yellow); position: absolute; top: 0; left: 0; width: 100%; height: 100%; margin: 0; }
#s2_home .text .txt_2 .split-child { clip-path: inset(0% 100% 0% 0%); }


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

#s3_home .text.flex, 
#s4_home .text.flex { gap: 1.5em; }

#s3_home .text + .card_wrapper { margin-top: var(--c12v); }

#s3_home .text.animate, 
#s4_home .text.animate,
#s5_home .text.animate,
#s6_home .text.animate,
#s8_home .text.animate,
#s9_home .text.animate,
#s11_home .text.animate { transform-origin: bottom; transform: scale(.75); opacity: 0; transition: .375s ease-out; }
#s3_home .text.animate.triggered,
#s4_home .text.animate.triggered,
#s5_home .text.animate.triggered,
#s6_home .text.animate.triggered,
#s8_home .text.animate.triggered,
#s9_home .text.animate.triggered,
#s11_home .text.animate.triggered { transform: translateY(0) scale(1); opacity: 1; }

#s3_home .card_wrapper { gap: var(--c15v) 0; }

.card_cosa .front_card { border-radius: 0 0 1em 0; overflow: hidden; clip-path: polygon(0 0, 100% 0, 100% 0%, 0 0%); will-change: clip-path; transition: .5s ease-out; }
.card_cosa .front_card::after {
	display: block; content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: var(--yellow);
	clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);  will-change: clip-path; transition: .5s ease-out .375s;
}
.card_cosa .front_card picture img { transform: scale(1.1); will-change: transform; transition: 2s ease-out .25s; }
.card_cosa .front_card .filter_card { top: auto; bottom: -1px; background: linear-gradient(180deg, rgb(var(--black-rgb) / 0%) 0%, var(--black) 100%); }
.card_cosa .front_card .text { bottom: 0; left: 0; padding: 1.5em 1em; }
.card_cosa .front_card .text h3 { line-height: 1.5; text-shadow: 0 0 1.25em rgb(var(--black-rgb) / 50%), 0 0 .25em rgb(var(--black-rgb) / 75%); }
.card_cosa .back_card { padding-top: 1em; transform: translateY(25%); opacity: 0; transition: .5s ease-out; }
.card_cosa .back_card h4 { line-height: 1.75; color: var(--yellow); }
.card_cosa .back_card h4 + p { margin-top: 1em; }
.card_cosa .back_card p { font-weight: 90; }

.card_cosa.triggered .front_card { clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); }
.card_cosa.triggered .front_card::after { clip-path: polygon(0 100%, 100% 100%, 100% 100%, 0% 100%); }
.card_cosa.triggered .front_card picture img { transform: scale(1); }
.card_cosa.triggered .back_card { transform: translateY(0); opacity: 1; }




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

/*#s4_home, #s8_home { background: var(--yellow); }*/

#s4_home { overflow: hidden; }

#s4_home .wrapper { flex-wrap: nowrap; gap: 2px; width: max-content; padding-left: var(--c5o); padding-bottom: var(--c15v); will-change: transform; }

.card_process { width: calc(100vw - var(--c10o)); min-width: calc(100vw - var(--c10o)); border-radius: 0 0 1em 0; background: var(--green); }
.card_process .card_num { color: var(--yellow); }
.card_process .icon { top: 1.5em; right: 1em; width: calc(50% - 1em); height: auto; pointer-events: none; }
.card_process .text { bottom: 0; left: 0; padding: 1.5em 1em; }
.card_process .text h3 + p { margin-top: 1em; }
.card_process .text p { font-size: 87.5%; }




/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ SECTION 5 ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

#s5_home .container { gap: var(--c10v) 0; }

#s5_home .wrapper, 
#s11_home .wrapper { width: calc(100% + var(--c10o)); margin-right: calc(var(--c5o) * -1); margin-left: calc(var(--c5o) * -1); }
#s5_home .swiper-slide { background: var(--yellow); border-radius: 0 0 1em 0; overflow: hidden; }
#s5_home .swiper-slide .text { padding: 1em; }
#s5_home .swiper-slide .text h3 { min-height: 3em; line-height: 1.5; align-content: center; }
#s5_home .swiper-slide .text .card_num { display: none; }




/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ SECTION 6 ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

#s6_home .card_wrapper { gap: 2px; }
.card_mode { 
	padding: 1.5em; background: var(--grey); border-radius: 0 0 1em 0; overflow: hidden; cursor: pointer; 
	transform: translateY(25%) scale(.5); opacity: 0; will-change: transform, opacity; transition: .375s ease-out; 
}
.card_mode::before { 
	content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%;
	background: linear-gradient(180deg, var(--grey) 0%, var(--yellow) 100%); opacity: 0; transition: .25s ease;
}
.card_mode .head { gap: 1em; }
.card_mode .text h3 { text-align: left; line-height: 1.5; }
.card_mode .content { display: none; padding-top: 1em; }
.card_mode .content p { font-weight: 60; font-size: 87.5%; }
.card_mode .ico { padding-top: 1.5em; padding-bottom: 1em; }
.card_mode svg { width: 4em; }
.card_mode svg path { fill: var(--green); transition: .25s ease; }

.card_mode.active::before { opacity: 1; }
.card_mode:hover::before { opacity: 1; }
.card_mode.active svg path.plus { opacity: 0; }

.card_mode.triggered { transform: translateY(0) scale(1); opacity: 1; }




/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ SECTION 7 ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/


#s7_home .text h2 + .video_text_wrap { margin-top: 1em; }
.video_text_wrap { display: block; aspect-ratio: 1204.2 / 364.5; width: 120%; max-width: 1024px; margin: 0 -10%; overflow: visible; }
.video_text_wrap svg { display: block; width: 100%; height: 100%; }
.video_text_wrap #text_video { display: block; width: 100%; height: 100%; object-fit: cover; pointer-events: none; }

#text_video {
	-webkit-mask-image: url(../images/svg/vis_mask.svg);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: 100%;
}


#s7_home .text.animate .video_text_wrap { transform: translateY(25%); opacity: 0; will-change: transform, opacity; transition: .375s ease-out; }
#s7_home .text.animate.triggered .video_text_wrap { transform: translateY(0%); opacity: 1; }

#s7_home .text + .wrapper { margin-top: -5%; }
#s7_home .wrapper { gap: 2px; }

.card_motivo { 
	padding: 1.5em;
	border-radius: 0 0 1em 0; background: linear-gradient(180deg, rgba(var(--grey-rgb) / 62.5%) 0%, rgba(var(--yellow-rgb) / 75%) 100%); 
	-webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); 
	transform: translateY(25%) scale(.5); opacity: 0; will-change: transform, opacity; transition: .375s ease-out; 
}
.card_motivo .head { gap: 1.5em; }
.card_motivo .head .ico { width: 4em; }
.card_motivo .head + .text { padding-top: 4.5em; }
.card_motivo .text h3 { line-height: 1.25; }
.card_motivo .text h3 + p { margin-top: 1em; }
.card_motivo .text p { line-height: 1.5; }

.card_motivo.triggered { transform: translateY(0) scale(1); opacity: 1; }





/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ SECTION 8 ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

#s8_home .text.flex-t { gap: 1.5em; }
#s8_home .text p + .btn_wrapper { margin-top: 1.5em; }
#s8_home .btn_wrapper { gap: 1em 3em; }
#s8_home .btn_wrapper button { position: relative; width: fit-content; padding: 1rem; font: 100 150% / 1.25 var(--title-font); color: var(--green); text-transform: uppercase; }
#s8_home .btn_wrapper button::before {
	display: inline-block; content: ''; position: absolute; bottom: 1rem; left: 50%; transform: translate(-50%, calc(100% + .5rem)) scale(0); 
	width: calc(100% - 1em); height: 4px; background: var(--green);
	opacity: 0; transition: .25s ease-out; pointer-events: none;
}
#s8_home .btn_wrapper button.active::before { transform: translate(-50%, 100%) scale(1); opacity: 1; }

#s8_home .text + .sliders_wrapper { margin-top: var(--c10v); }
#s8_home .sliders_wrapper { position: relative; width: 100%; overflow: hidden; }
#s8_home .slider {
	position: absolute; top: 0; left: 0; width: 100%;
	opacity: 0; pointer-events: none; transform: translateY(10px); transition: opacity .45s ease, transform .45s ease;
}
#s8_home .slider.active { position: relative; transform: translateY(0); opacity: 1; pointer-events: auto; }

.card_service picture { border: 1px solid var(--green); border-radius: 0 0 1em 0; overflow: hidden; }
.card_service picture img { transition: .25s ease-out; }
.card_service button { width: 6em; }
.card_service button svg { width: 100%; }
.card_service button svg path { fill: var(--white); transition: .25s ease; }
.card_service button svg path.words { transform-origin: center; animation: rotate 12s linear infinite; }
@keyframes rotate {
	0% { transform: rotate(0deg); }
	100% { transform: rotate(-360deg); }
}
.card_service .text { padding: 1em .5em; border-left: 1px solid var(--green); }
.card_service .text p { font-size: 87.5%; }
.card_service .text p strong { font-weight: 100; }
#slider_foto .card_service button { top: 1em; left: auto; right: .5em; transform: none; width: 4em; padding: 0.5em; border: 2px solid var(--white); border-radius: .5em; }

#s8_home .nav_btn { display: none; }




/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ SECTION 9 ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

#s9_home .container { gap: 2px; }
#s9_home .container > .text + .text { margin-top: 1.5rem; }

.card_contact { 
	padding: 2em 1em; border-radius: 0 1em 1em 0; background: var(--yellow); 
	clip-path: polygon(0 0, 0% 0, 0% 100%, 0 100%); will-change: clip-path; transition: .375s ease-out; 
}
.card_contact a { gap: .75em; padding: .25em 0; font: 60 87.5% / 1.25 var(--main-font); color: var(--green); }
.card_contact a + a { margin-top: 2rem; }
.card_contact a svg { width: 1.5em; }
.card_contact a svg path { fill: var(--green); transition: .25s ease; }
.card_contact a span { display: block; width: 100%; }

.card_contact.triggered, .card_contact.triggered#form { clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); }

.card_contact#form { border-radius: 0 0 0 1em; clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%); }




/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ SECTION 10 ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

/*#scrolling_banner { width: 100%; padding: 20px 0; background: transparent; overflow: hidden; }
#scrolling_banner .track { display: flex; align-items: center; white-space: nowrap; }
#scrolling_banner .track_inner { display: inline-flex; align-items: center; gap: 40px; }
#scrolling_banner span {  }
#scrolling_banner img { display: inline-block; width: 60px; height: auto; }*/
#s10_home { overflow: hidden; }
	
	
#scrolling_banner { overflow: hidden; margin-bottom: 1.5rem; }
#scrolling_banner .banner_track { display: flex; align-items: center; width: max-content; will-change: transform; }
#scrolling_banner .banner_set { display: flex; align-items: center; flex: 0 0 auto; }
#scrolling_banner img { display: block; flex: 0 0 auto; width: auto; max-width: none; height: 2.5rem; object-fit: contain; }


#s10_home .text + .wrapper { margin-top: 1em; }

.accordion { 
	border-radius: 0 1em 1em 0; border: 1px solid var(--yellow); text-align: left; 
	transform: translateY(25%) scale(.75); opacity: 0; transition: all .375s ease-out, backgorund .25s ease; 
}
.accordion.triggered { transform: translateY(0) scale(1); opacity: 1; }
.accordion + .accordion { margin-top: 2px; }
.accordion .accordion_head { gap: 1em; padding: 1.5em 1em; text-align: left; }
.accordion .accordion_head h3 { font: 90 87.5% / 1.5 var(--title-font); transition: .25s ease; }
.accordion .accordion_head svg { width: 2.5em; min-width: 2.5em; }
.accordion .accordion_head svg path { fill: var(--white); transition: .25s ease; }
.accordion.active { background: var(--yellow); }
.accordion .accordion_head.active h3 { color: var(--green); }
.accordion .accordion_head.active svg path { fill: var(--green); }
.accordion .accordion_head.active svg path.plus { opacity: 0; }
.accordion .accordion_text { display: none; padding: 0 1em 1.5em 1em; }
.accordion .accordion_text p { font-size: 87.5%; }


/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ SECTION 11 ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

#s11_home .text .link { margin-right: auto; margin-left: auto; }

#s11_home .text + .wrapper { max-width: 26em; margin: var(--c10v) auto 0 auto; }

.card_review { padding: 1.5em 1em; border-radius: 0 0 1em 0; background: var(--yellow); overflow: hidden; }
.card_review img { display: block; width: 100%; max-width: 12em; margin: 0 auto 1.5em auto; }
.card_review .text h3 { font-size: 100%; line-height: 1.5; }
.card_review .text p { font-size: 87.5%; }

#s11_home .nav_dots span { border-color: var(--white); }
#s11_home .nav_dots span.swiper-pagination-bullet-active { background: var(--white); }








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


/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ TEMPLATE [...] ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

/* Section 1 */

/* Section 2 */

/* Section 3 */








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


/* WP-Form - Custom */
#form .wpforms-field-row-block { position: relative; width: 100%; padding: 0; }
#form .wpforms-field-row-block + .wpforms-field-row-block { margin-top: 1.5rem; }

#form .wpforms-field:not(.wpforms-field-checkbox) label, 
#form .wpforms-field label.wpforms-field-sublabel {
	position: absolute; top: 0; left: 0; 
	transform: translateY(0.5rem); transform-origin: left; margin: 0;
	font: 70 87.5% / 1.25 var(--main-font); color: var(--green); text-transform: lowercase;
	pointer-events: none; transition: .25s ease; will-change: transform;
}
#form .wpforms-field.focus:not(.wpforms-field-checkbox) label,
#form .wpforms-field.focus label.wpforms-field-sublabel { transform: translateY(-1em) scale(.625); opacity: .5; }
#form .wpforms-field :where(input, textarea, select) {
	padding: .5em 0 0 0; border-radius: 0; border: 0; border-bottom: 1px solid var(--green); background-color: transparent;
	font: 60 87.5% / 1.25 var(--main-font); color: var(--green);
}

#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 { width: 100%; margin: 0; padding: .25em 0; font: 60 75% / 1.25 var(--alt-font); color: var(--green); text-transform: uppercase; }
#form .wpforms-field.wpforms-field-checkbox li label a { text-transform: uppercase; text-decoration: none; }
#form .wpforms-field.wpforms-field-checkbox li label a:hover { text-decoration: underline; }

#form .wpforms-form label.wpforms-error, 
#form .wpforms-form em.wpforms-error { font: 80 75% / 1.25 var(--alt-font); }

#form button[type=submit], 
#form input[type=submit] {
	padding: .75em 1.5em; margin: 0 auto; background: var(--green); border: 2px solid var(--green); border-radius: 20em;
	font: 50 100% / 1 var(--alt-font); color: var(--white); text-transform: uppercase;
}
#form button[type=submit]:hover, 
#form input[type=submit]:hover { background: var(--white); color: var(--green); }








/**
 *
 *  █▀▀  █  █  ▀▀█▀▀  █▀▀▄  ▄▀▀▄
 *  █▀▀  ▄▀▀▄    █    █▐█▀  █▀▀█
 *  ▀▀▀  ▀  ▀    ▀    ▀ ▀▀  ▀  ▀ - 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
 *
 * __________________________________________________________________________________________________________________________________________________________________________
 */




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

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


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


	/*∞∞∞∞∞∞ ASSETS ∞∞∞∞∞∞*/
	/* Links */
	/* Filters */
	/* Swiper Nav */
	/* Components */
	/* Side Scroller */


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


	/*∞∞∞∞∞∞ HOMEPAGE ∞∞∞∞∞∞*/

	/* Sec 1 */

	/* Sec 2 */
	#s2_home .text p { font-size: 150%; }

	/* Sec 3 */

	/* Sec 4 */
	.card_process { width: calc(75vw - var(--c5o)); min-width: calc(75vw - var(--c5o)); }
	.card_process .text p { font-size: 100%; }

	/* Sec 5 */
	#s5_home .wrapper, #s11_home .wrapper { width: 100%; margin-right: 0; margin-left: 0; }

	/* Sec 6 */
	.card_mode .content p { font-size: 100%; }

	/* Sec 7 */
	#s7_home .text + .wrapper { margin-top: -10%; }

	/* Sec 8 */
	/* Sec 9 */
	/* Sec 10 */
	/* Sec 11 */


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


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


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


}






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

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


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


	/*∞∞∞∞∞∞ ASSETS ∞∞∞∞∞∞*/
	/* Links */
	/* Filters */
	/* Swiper Nav */
	/* Components */
	/* Side Scroller */


	/*∞∞∞∞∞∞ FOOTER ∞∞∞∞∞∞*/

	/* Structure */

	/* Credits */
	#credits br { display: none; }
	#credits .resp_sep { display: inline-block; }

	/* Back Top */


	/*∞∞∞∞∞∞ HOMEPAGE ∞∞∞∞∞∞*/

	/* Sec 1 */
	/* Sec 2 */
	/* Sec 3 */

	/* Sec 4 */
	.card_process { width: calc(67.5vw - var(--c5o)); min-width: calc(67.5vw - var(--c5o)); }

	/* Sec 5 */
	#s5_home .swiper-slide .text { padding: 1.5em; text-align: left; justify-content: space-between;  gap: 0.5rem }
	#s5_home .swiper-slide .text .card_num { display: block; line-height: 1; }
	#s5_home .swiper-slide .text h3 { min-height: unset;  max-width: 25ch; }


	/* Sec 6 */
	#s6_home .card_wrapper .card_mode:nth-of-type(1) { margin-left: 0; margin-right: auto; }
	#s6_home .card_wrapper .card_mode:nth-of-type(2) { margin-left: auto; margin-right: 0; border-radius: 1em 0 0 0; }

	/* Sec 7 */
	#s7_home .text + .wrapper { margin-top: -15%; }

	/* Sec 8 */
	/* Sec 9 */
	/* Sec 10 */
	/* Sec 11 */


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


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


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


}



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

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


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

	header.flex-t { align-items: center; padding: 1em 5em; }

	.head_logo { width: 8em; }

	header .spacer { display: inline-block; width: 6rem; }

	header .link { bottom: auto; top: 1.5em; right: 1.5em; transform: translateX(0); padding: .875em 1.5em .75em 1.5em; }
	header .link.deactive { transform: translateY(calc(-100% - 2.5em)); }


	/*∞∞∞∞∞∞ ASSETS ∞∞∞∞∞∞*/

	/* Links */
	/* Filters */
	/* Swiper Nav */

	/* Components */
	#page_scroller { top: .75em; height: calc(100dvh - 1.5em); padding: 0 0 0 .75em; }
	#page_scroller .arrow { left: 2.75em; }
	
	#scroll_btn { position: absolute; bottom: var(--c2v); left: 50%; transform: translateX(-50%); }

	#s3_home .text.animate, 
	#s4_home .text.animate, 
	#s8_home .text.animate, 
	#s9_home .text.animate, 
	#s11_home .text.animate { transform: scale(1); }

	/* Side Scroller */


	/*∞∞∞∞∞∞ FOOTER ∞∞∞∞∞∞*/

	/* Structure */
	footer .container { flex-direction: column; }
	footer .angle { align-self: flex-start; width: 6em; }
	footer .angle.angle_tr { position: absolute; top: 2em; right: var(--c5o); }
	footer .container { padding: 2em var(--c5o); }

	footer .wrapper { flex: 1 1 auto; }
	#foot_logo { width: auto; }
	footer .crosshair { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 10em; }
	#foot_info { width: auto; text-align: right; }
	.foot_block p a { margin: 0 0 0 auto; }
	.foot_block p a:hover { color: var(--yellow); text-decoration: underline; }

	/* Credits */
	#credits { flex-direction: row; align-self: flex-end; margin-top: 2.5em; padding: 0; gap: .25em 1.5em; }
	#credits p { margin: 0; font-size: 75%; }
	#credits a:hover, #credits a:active, #credits a:focus { opacity: 1; color: var(--yellow); text-decoration: underline; }
	#credits #credits_studio:hover { color: #e74e0f; }

	/* Back Top */
	#back_top { bottom: .5em; left: auto; right: .5em; transform: translateX(0%); width: 2.5em; }
	#back_top:hover { background-color: var(--green); }
	#back_top:hover svg path { fill: var(--yellow); }


	/*∞∞∞∞∞∞ HOMEPAGE ∞∞∞∞∞∞*/

	/* Sec 1 */
	.s1 .container { flex-direction: row; align-items: flex-end; }

	/* Sec 2 */
	#s2_home .container { min-height: auto; }
	#icons_bkg { display: none; }
	#s2_home .text { max-width: 52ch; margin: 0 auto; }

	/* Sec 3 */
	#s3_home .text.flex { flex-direction: row-reverse; }
	#s3_home .text.flex .w50l, 
	#s4_home .text.flex .w50l,
	#s8_home .text.flex-t .w50l { width: calc(50% - .75em); }
	#s3_home .text.flex .w50l:not(.title) { text-align: right; }
	#s3_home .text.animate > div, 
	#s9_home .text.animate { transform-origin: right; transform: translateX(-50%) scale(.5); will-change: transform; transition: .375s ease-out; }
	#s3_home .text.animate > .title,
	#s9_home .text.title.animate { transform-origin: left; transform: translateX(50%) scale(.5); }
	#s3_home .text.animate.triggered > div,
	#s9_home .text.animate.triggered { transform: translateX(0) scale(1); }

	#s3_home .card_wrapper { align-items: flex-start; gap: 2px; }

	.card_cosa { perspective: 1500px; }
	.card_cosa.w50l { width: calc(50% - 1px); }
	.card_cosa:nth-of-type(2) .front_card { border-radius: 1em 0 0 0; }

	.card_cosa .card_inner { height: 100%; transform-style: preserve-3d; transition: .75s ease-in-out; }
	.card_cosa .card_inner, .card_cosa .front_card picture { aspect-ratio: 1 / 1; }
	.card_cosa .front_card, 
	.card_cosa .back_card { 
		position: absolute; top: 0; left: 0; width: 100%; height: 100%; 
		-webkit-backface-visibility: hidden; backface-visibility: hidden; 
		background-color: var(--green);
	}

	.card_cosa .back_card, .card_cosa.triggered .back_card { transform: rotateY(180deg); }
	.card_cosa .back_card { 
		display: flex; flex-direction: column; align-items: center; justify-content: center; 
		padding: 1.5em; background-color: rgb(var(--black-rgb) / 50%); text-align: left; 
	}
	.card_cosa .back_card .text { text-align: left; }
	.card_cosa .back_card h4 { font-size: calc(var(--h4-size) * .875); }
	.card_cosa .back_card p { font-size: 87.5%; }
	
	.card_cosa:hover .card_inner { transform: rotateY(-180deg); }

	/* Sec 4 */
	#s4_home .container > .text.animate > div { transform-origin: right; transform: translateX(50%) scale(.5); opacity: 0; transition: .375s ease-out; }
	#s4_home .container > .text.animate > div:not(.title) { transition-delay: .0625s; }
	#s4_home .container > .text.animate.triggered > div { transform: translateX(0) scale(1); opacity: 1; }

	.card_process { width: calc(50vw - var(--c5o)); min-width: calc(50vw - var(--c5o)); aspect-ratio: 4 / 3; }
	.card_process .icon { width: calc(30% - 1em); }
	.card_process .text { padding: 1.5em 1.75em; }

	/* Sec 5 */
	#s5_home .text.w40l { padding-left: var(--c2o); transform: translateX(50%) scale(.5); transform-origin: right; }
	#s5_home .text.w40l.triggered { transform: translateX(0) scale(1); }
	
	#s5_home .wrapper { width: 60%; padding: 4.5em; }
	#s5_home .wrapper .nav_btn { z-index: 2; }
	#s5_home .swiper-slide .text h3 { font-size: calc(var(--h3-size) * 0.75); }
	#s5_home .swiper-slide picture { aspect-ratio: 2 / 1; }

	/* Sec 6 */
	#s6_home .card_wrapper { align-items: flex-start; justify-content: space-between; gap: 2px; }
	.card_mode { width: calc(50% - 1px); }
	.video_text_wrap { width: 75%; margin: 0 auto; }

	/* Sec 7 */
	#s7_home .text.outline h2 { font-size: 5.25vw; }
	#s7_home .text + .wrapper { margin-top: -10%; }
	#s7_home .wrapper { grid-template-columns: 1fr 1fr; padding-bottom: 5.5em; }
	.card_motivo:nth-of-type(even) { transform: translateY(calc(25% + 5.5em)) scale(.5); }
	.card_motivo.triggered:nth-of-type(even) { transform: translateY(5.5em) scale(1); }
	.card_motivo:nth-of-type(2) { border-radius: 1em 0 0 1em; }
	.card_motivo:nth-of-type(3) { border-radius: 0 1em 1em 0; }
	.card_motivo:nth-of-type(4) { border-radius: 1em 0 0 0; }
	.card_motivo:nth-of-type(3), .card_motivo:nth-of-type(4) { background: linear-gradient(180deg, rgb(var(--yellow-rgb) / 75%) 0%, rgb(var(--grey-rgb) / 62.5%) 100%); }

	/* Sec 8 */
	#s8_home .text.animate > div { transform-origin: right; transform: translateX(50%) scale(.5); will-change: transform; transition: .375s ease-out; }
	#s8_home .text.animate > .title { transform-origin: left; transform: translateX(-50%) scale(.5); }
	#s8_home .text.animate.triggered > div { transform: translateX(0) scale(1); }

	#s8_home .btn_wrapper { justify-content: flex-start; }
	#s8_home .btn_wrapper button { padding: .25rem 0 .5rem 0; }
	#s8_home .btn_wrapper button::before { bottom: .5rem; width: 100%; }
	#slider_foto .card_service button, 
	#slider_video .card_service button { transform: translate(-50%, -50%) scale(.5); opacity: 0; will-change: transform; }
	#slider_foto .card_service button { top: 50%; left: 50%; right: auto; }
	#slider_foto .card_service:hover button, 
	#slider_video .card_service:hover button { transform: translate(-50%, -50%) scale(1); opacity: 1; }
	#slider_foto .card_service button:hover { background: var(--green); border-color: var(--yellow); }
	#slider_foto .card_service button:hover svg path,
	#slider_video .card_service button:hover svg path { fill: var(--yellow); }

	.card_service picture { background-color: var(--green); }
	.card_service .text { overflow: hidden; }
	.card_service .text::before {
		display: block; content: ''; position: absolute; top: 0; left: 0; transform: translateX(-100%); width: 100%; height: 100%;
		background: linear-gradient(to right, rgb(var(--white-rgb) / 75%) 0%, rgb(var(--white-rgb) / 0%) 100%); opacity: 0;
		transition: .25s ease-out;
	}
	.card_service:hover picture img { opacity: .5; }
	.card_service:hover .text::before { transform: translateX(0%); opacity: 1; }
	.card_service .text p { position: relative; z-index: 1; }

	/* Sec 9 */
	#s9_home .container { padding-bottom: var(--c20v); grid-template-columns: 1fr 1fr; gap: var(--c10v) 2px; }
	#s9_home .container .title { order: 2; padding-left: 1.5em; }
	#s9_home .container .text_1 { order: 1; text-align: right; }
	#s9_home .container .text_2 { order: 3; text-align: right; align-content: center; padding-right: 1.5em; }
	#s9_home .container .card_contact { padding: 2.5em 2em; }
	#s9_home .container .card_contact.text { order: 5; align-content: center; text-align: right; }
	#s9_home .container #form { order: 4; grid-row: 2 span; }
	#s9_home .container > .text + .text { margin-top: 0; }

	.card_contact a { justify-content: flex-end; }
	.card_contact a + a { margin-top: 2.5rem; }
	.card_contact a span { display: inline-block; width: auto; }

	/* Sec 10 */
	#s10_home .text.outline h2 { font-size: 4.875vw; }
	.accordion:hover, .accordion.active:hover { background: var(--yellow); }
	.accordion:hover .accordion_head h3 { color: var(--green); }
	.accordion:hover .accordion_head svg path { fill: var(--green); }
	.accordion .accordion_head, .accordion .accordion_text { padding-right: 2.5em; padding-left: 2.5em; }
	.accordion .accordion_head h3 { padding-top: .25em; }

	/* Sec 11 */
	#s11_home .container > .text.animate { transform-origin: left; transform: translateX(-50%) scale(.5); }
	#s11_home .container > .text.animate.triggered { transform: translateX(0) scale(1); }
	#s11_home .text .link { margin-left: 0; }
	#s11_home .wrapper { width: calc(45% - var(--c2o)); }
	#s11_home .wrapper > .flex:not(.nav_dots) { gap: 1em; }
	.card_review img { max-width: 10em; margin: 0 auto 1.5em 0; }


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


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


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


}






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

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


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


	/*∞∞∞∞∞∞ ASSETS ∞∞∞∞∞∞*/
	/* Links */
	/* Filters */
	/* Swiper Nav */
	/* Components */
	/* Side Scroller */


	/*∞∞∞∞∞∞ FOOTER ∞∞∞∞∞∞*/

	/* Structure */
	footer .angle { width: 8em; }
	footer .wrapper { margin: var(--c20v) 0; }
	footer .crosshair { width: 14em; }

	/* Credits */
	/* Back Top */


	/*∞∞∞∞∞∞ HOMEPAGE ∞∞∞∞∞∞*/

	/* Sec 1 */
	/* Sec 2 */

	/* Sec 3 */
	.card_cosa .card_inner, .card_cosa .front_card picture { aspect-ratio: 4 / 3; }

	/* Sec 4 */
	.card_process { width: calc(42.5vw - var(--c5o)); min-width: calc(42.5vw - var(--c5o)); border-radius: 0 0 1em 1em; }
	.card_process:first-of-type { border-radius: 0 0 1em 0; }
	.card_process:last-of-type { border-radius: 0 0 0 1em; }

	/* Sec 5 */
	/* #s5_home .swiper-slide picture { aspect-ratio: 3 / 1; } */
	#s5_home .swiper-slide .text h3 { font-size: calc(var(--h3-size) * 1); }
	#s5_home .swiper-slide picture img { object-position: top; }

	/* Sec 6 */
	#s6_home .container { align-items: flex-start; padding-right: var(--c5o); padding-left: var(--c5o); }
	#s6_home .container > .text { text-align: right; }
	#s6_home .card_wrapper .card_mode:nth-of-type(1) { margin-top: 3em; }

	/* Sec 7 */
	.card_motivo .head + .text { padding-top: 3em; }

	/* Sec 8 */
	#s8_home .slider > .flex:not(.nav_dots) { gap: 1.5em; }
	#s8_home .nav_btn { display: block; }
	#s8_home .nav_btn svg path { fill: var(--green); }
	#s8_home .nav_btn:hover svg path { fill: var(--white); }
	#s8_home .nav_dots { margin-top: 3em; }

	/* Sec 9 */
	#s9_home .container .card_contact:not(#form) { padding: 2.5em 3em; margin-bottom: 3em; }
	.card_contact a { font-size: 100%; }

	/* Sec 10 */
	#s10_home .text.outline h2 { font-size: 4.75vw; }

	/* Sec 11 */


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


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


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


}






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

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


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


	/*∞∞∞∞∞∞ ASSETS ∞∞∞∞∞∞*/
	/* Links */
	/* Filters */
	/* Swiper Nav */
	/* Components */
	/* Side Scroller */


	/*∞∞∞∞∞∞ FOOTER ∞∞∞∞∞∞*/

	/* Structure */

	/* Credits */
	#credits p { font-size: 57.25%; }

	/* Back Top */


	/*∞∞∞∞∞∞ HOMEPAGE ∞∞∞∞∞∞*/
	/* Sec 1 */
	/* Sec 2 */
	/* Sec 3 */
	/* Sec 4 */
	/* Sec 5 */
	/* Sec 6 */
	/* Sec 7 */
	/* Sec 8 */
	/* Sec 9 */
	/* Sec 10 */
	/* Sec 11 */


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


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


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


}






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

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


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


	/*∞∞∞∞∞∞ ASSETS ∞∞∞∞∞∞*/
	/* Links */
	/* Filters */
	/* Swiper Nav */
	/* Components */
	/* Side Scroller */


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


	/*∞∞∞∞∞∞ HOMEPAGE ∞∞∞∞∞∞*/

	/* Sec 1 */
	/* Sec 2 */
	/* Sec 3 */
	/* Sec 4 */
	/* Sec 5 */
	/* Sec 6 */

	/* Sec 7 */
	#s7_home .text.outline h2 { font-size: 4.75em; }

	/* Sec 8 */
	/* Sec 9 */

	/* Sec 10 */
	#s10_home .text.outline h2 { font-size: 4.375em; }

	/* Sec 11 */


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


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


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


}






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

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



