/*
Theme Name:   Engitech Child
Theme URI:    http://wpdemo.archiwp.com/engitech/
Description:  Make your modifications to [Parent Theme] in this Engitech child theme.
Author:       OceanThemes
Author URI:   http://oceanthemes.net/
Template:     engitech
Version:      1.1
License:      GNU General Public License v2 or later
License URI:  http://www.gnu.org/licenses/gpl-2.0.html
Tags:         light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
Text Domain:  engitech-child
*/

/* =Theme customization starts here
------------------------------------------------------- */


@font-face {
        font-family: 'Avenir';
        src: url('fonts/avenir_regular-webfont.woff2') format('woff2'),
                url('fonts/avenir_regular-webfont.woff') format('woff');
        font-weight: normal;
        font-style: normal;
}

@font-face {
        font-family: 'Avenir Bold';
        src: url('fonts/avenir_black-webfont.woff2') format('woff2'),
                url('fonts/avenir_black-webfont.woff') format('woff');
        font-weight: normal;
        font-style: normal;
}

@font-face {
        font-family: 'Avenir Semi-Bold';
        src: url('fonts/avenir_heavy-webfont.woff2') format('woff2'),
                url('fonts/avenir_heavy-webfont.woff') format('woff');
        font-weight: normal;
        font-style: normal;
}

html,
body,
body * {
        font-family: 'Avenir', sans-serif;
}

b,
strong {
        font-family: 'Avenir Bold', sans-serif;
}

.fontbold, .fontbold * {
        font-family: 'Avenir Bold', sans-serif;
	line-height: 1.5;
}

.fontsemibold, .fontsemibold * {
         font-family: 'Avenir Semi-Bold', sans-serif;
		line-height: 1.5;
}

.elementor-page .elementor-widget-text-editor {
         font-family: 'Avenir', sans-serif;
}

.elementor-page .elementor-widget-text-editor.fontbold {
         font-family: 'Avenir Bold', sans-serif;
}

.elementor-page .elementor-widget-text-editor.fontsemibold {
         font-family: 'Avenir Semi-Bold', sans-serif;
}

html {
        font-size: 100%;
}

body {
        font-size: 1rem;
        line-height: 1.5;
}

.h1,
.h1 * {
        font-size: 1.875rem;
        line-height: 1.3;
}

.btn-details {
	font-size: 1rem;
}

.ot-heading > span {
	font-size: 1rem;
}


/* 30px */
.h2,
.h2 * {
        font-size: 1.5rem;
        line-height: 1.4;
}

/* 24px */
.h3,
.h3 * {
        font-size: 1.25rem;
        line-height: 1.4;
}

/* 20px */
.h4,
.h4 * {
        font-size: 1.125rem;
        line-height: 1.5;
}

/* 18px */
.h5,
.h5 * {
        font-size: 1rem;
        line-height: 1.5;
}

/* 16px */


@media (min-width: 768px) {

        .h1,
        .h1 * {
                font-size: 2.5rem;
                line-height: 1.2;
        }

        /* 40px */
        .h2,
        .h2 * {
                font-size: 2rem;
                line-height: 1.3;
        }

        /* 32px */
        .h3,
        .h3 * {
                font-size: 1.5rem;
                line-height: 1.4;
        }

        /* 24px */
        .h4,
        .h4 * {
                font-size: 1.25rem;
                line-height: 1.5;
        }

        /* 20px */
        .h5,
        .h5 * {
                font-size: 1.125rem;
                line-height: 1.5;
        }

        /* 18px */
}

@media (min-width: 1200px) {

        .h1,
        .h1 * {
                font-size: 3rem;
                line-height: 1.2;
        }

        /* 48px */
        .h2,
        .h2 * {
                font-size: 2.25rem;
                line-height: 1.3;
        }

        /* 36px */
        .h3,
        .h3 * {
                font-size: 1.75rem;
                line-height: 1.4;
        }

        /* 28px */
        .h4,
        .h4 * {
                font-size: 1.5rem;
                line-height: 1.5;
        }

        /* 24px */
        .h5,
        .h5 * {
                font-size: 1.25rem;
                line-height: 1.5;
        }

        /* 20px */
}


.text-sm,
.text-sm * {
        font-size: 0.875rem;
        line-height: 1.5;
}

/* 14px */
.text-base,
.text-base * {
        font-size: 1rem;
        line-height: 1.5;
}

/* 16px */
.text-lg,
.text-lg * {
        font-size: 1.125rem;
        line-height: 1.5;
}

/* 18px */
.text-xl,
.text-xl * {
        font-size: 1.25rem;
        line-height: 1.5;
}

/* 20px */

.uppercase {
        text-transform:  uppercase;
}

/* ==========
   DISPLAY
   ========== */
.d-block {
        display: block;
}

.d-inline {
        display: inline;
}

.d-inline-block {
        display: inline-block;
}

.d-flex {
        display: flex;
}

.d-grid {
        display: grid;
}

.d-none {
        display: none;
}

.justify-center {
	justify-content: center;
}

.justify-start {
	justify-content: start;
}

.text-center {
        text-align: center;
}

/* ==========
   MARGINI
   Scale: 0 / 0.25rem / 0.5rem / 1rem / 1.5rem / 2rem / 3rem
   ========== */
.m-0 {
        margin: 0;
}

.m-1 {
        margin: 0.25rem;
}

.m-2 {
        margin: 0.5rem;
}

.m-3 {
        margin: 1rem;
}

.m-4 {
        margin: 1.5rem;
}

.m-5 {
        margin: 2rem;
}

.m-6 {
        margin: 3rem;
}

.mt-1 {
        margin-top: 0.25rem;
}

.mt-2 {
        margin-top: 0.5rem;
}

.mt-3 {
        margin-top: 1rem;
}

.mt-4 {
        margin-top: 1.5rem;
}

.mt-5 {
        margin-top: 2rem;
}

.mb-1 {
        margin-bottom: 0.25rem;
}

.mb-2 {
        margin-bottom: 0.5rem;
}

.mb-3 {
        margin-bottom: 1rem;
}

.mb-4 {
        margin-bottom: 1.5rem;
}

.mb-5 {
        margin-bottom: 2rem;
}

/* Stesso schema per left/right se ti servono */
.ml-1 {
        margin-left: 0.25rem;
}

.ml-2 {
        margin-left: 0.5rem;
}

.mr-1 {
        margin-right: 0.25rem;
}

.mr-2 {
        margin-right: 0.5rem;
}

/* ==========
   PADDING
   Stessa scala dei margini
   ========== */
.p-0 {
        padding: 0;
}

.p-1 {
        padding: 0.25rem;
}

.p-2 {
        padding: 0.5rem;
}

.p-3 {
        padding: 1rem;
}

.p-4 {
        padding: 1.5rem;
}

.p-5 {
        padding: 2rem;
}

.p-6 {
        padding: 3rem;
}

.pt-1 {
        padding-top: 0.25rem;
}

.pt-2 {
        padding-top: 0.5rem;
}

.pt-3 {
        padding-top: 1rem;
}

.pt-4 {
        padding-top: 1.5rem;
}

.pb-1 {
        padding-bottom: 0.25rem;
}

.pb-2 {
        padding-bottom: 0.5rem;
}

.pb-3 {
        padding-bottom: 1rem;
}

.pb-4 {
        padding-bottom: 1.5rem;
}

.pl-1 {
        padding-left: 0.25rem;
}

.pl-2 {
        padding-left: 0.5rem;
}

.pr-1 {
        padding-right: 0.25rem;
}

.pr-2 {
        padding-right: 0.5rem;
}

/* ==========
   MEDIA QUERY
   Mobile First → sotto i 768px riduco un po’ gli spazi grandi
   ========== */
@media (max-width: 768px) {

        .m-5,
        .m-6 {
                margin: 1.5rem !important;
        }

        .p-5,
        .p-6 {
                padding: 1.5rem !important;
        }
}

/* colori */ 

.white {
        color: #fff;
}

.black {
	color: var(--e-global-color-text);
}

.black:hover {
	color: #141D38;
}

/**
 * ----------------------------------------
 * animation kenburns-right
 * ----------------------------------------
 */


#first-slide.sp-selected .sp-image-container img,
#second-slide.sp-selected .sp-image-container img {
        /*-webkit-animation: kenburns-right 4s ease-in-out both;
        animation: kenburns-right 4s ease-in-out both;*/
}

@-webkit-keyframes kenburns-right {
        0% {
                -webkit-transform: scale(1) translate(0, 0);
                transform: scale(1) translate(0, 0);
                -webkit-transform-origin: 84% 50%;
                transform-origin: 84% 50%;
        }

        100% {
                -webkit-transform: scale(1.15) translateX(20px);
                transform: scale(1.15) translateX(20px);
                -webkit-transform-origin: right;
                transform-origin: right;
        }
}

@keyframes kenburns-right {
        0% {
                -webkit-transform: scale(1) translate(0, 0);
                transform: scale(1) translate(0, 0);
                -webkit-transform-origin: 84% 50%;
                transform-origin: 84% 50%;
        }

        100% {
                -webkit-transform: scale(1.15) translateX(20px);
                transform: scale(1.15) translateX(20px);
                -webkit-transform-origin: right;
                transform-origin: right;
        }
}

#first-slide.sp-selected .jet-slider__title,
#second-slide.sp-selected .jet-slider__title {
        -webkit-animation: slide-in-blurred-right 1s cubic-bezier(0.230, 1.000, 0.320, 1.000) 0.5s both;
        animation: slide-in-blurred-right 1s cubic-bezier(0.230, 1.000, 0.320, 1.000) 0.5s both;
}

#first-slide.sp-selected .jet-slider__subtitle,
#second-slide.sp-selected .jet-slider__subtitle {
        -webkit-animation: slide-in-blurred-right 1s cubic-bezier(0.230, 1.000, 0.320, 1.000) 0.8s both;
        animation: slide-in-blurred-right 1s cubic-bezier(0.230, 1.000, 0.320, 1.000) 0.8s both;
}

#first-slide.sp-selected .jet-slider__desc,
#second-slide.sp-selected .jet-slider__desc {
        -webkit-animation: slide-in-blurred-right 1s cubic-bezier(0.230, 1.000, 0.320, 1.000) 1.3s both;
        animation: slide-in-blurred-right 1s cubic-bezier(0.230, 1.000, 0.320, 1.000) 1.3s both;
}


@-webkit-keyframes slide-in-blurred-right {
        0% {
                -webkit-transform: translateX(1000px) scaleX(1.5) scaleY(0.2);
                transform: translateX(1000px) scaleX(1.5) scaleY(0.2);
                -webkit-transform-origin: 0% 50%;
                transform-origin: 0% 50%;
                -webkit-filter: blur(40px);
                filter: blur(40px);
                opacity: 0;
        }

        100% {
                -webkit-transform: translateX(0) scaleY(1) scaleX(1);
                transform: translateX(0) scaleY(1) scaleX(1);
                -webkit-transform-origin: 50% 50%;
                transform-origin: 50% 50%;
                -webkit-filter: blur(0);
                filter: blur(0);
                opacity: 1;
        }
}

@keyframes slide-in-blurred-right {
        0% {
                -webkit-transform: translateX(1000px) scaleX(1.5) scaleY(0.2);
                transform: translateX(1000px) scaleX(1.5) scaleY(0.2);
                -webkit-transform-origin: 0% 50%;
                transform-origin: 0% 50%;
                -webkit-filter: blur(40px);
                filter: blur(40px);
                opacity: 0;
        }

        100% {
                -webkit-transform: translateX(0) scaleY(1) scaleX(1);
                transform: translateX(0) scaleY(1) scaleX(1);
                -webkit-transform-origin: 50% 50%;
                transform-origin: 50% 50%;
                -webkit-filter: blur(0);
                filter: blur(0);
                opacity: 1;
        }
}

.partners .swiper-slide-image {
        -webkit-filter: none;
    filter: none;
}

.ot-image-box:not(.basic):after {
	background-color: var(--e-global-color-primary);
}

.ot-image-box:hover .overlay {
	background: transparent;
}

.ot-image-box .overlay {
	background: #3030F290;
}

.ot-image-box:not(.basic) img {
	filter: none;
}

 /* header */

.main-navigation ul li ul.sub-menu {
	padding-top: 10px;
	padding-bottom: 10px;
}

.main-navigation ul li li a {
	text-transform: capitalize;
	font-size: 1rem;
}

/* accessibilità */
.main-navigation ul > li > a:focus {
	color: #007fff;
	box-shadow: 0 0 0 4px rgba(0, 120, 212, 0.6);
}

.main-navigation ul > li:focus-within > ul {
    -webkit-transform: translateY(0px);
    -ms-transform: translateY(0px);
    transform: translateY(0px);
    visibility: visible;
    opacity: 1;
}

.main-navigation > ul > li:focus-within::before {
    left: 0;
    right: auto;
    width: 100%;
    transition: all 0.3s ease;
}

.site-footer a:not(.site-footer .elementor-social-icon),
.riquadro-icona a{
        display: inline-block;
}

button,a.octf-btn, .bouncing-focus a, .site-footer a, .riquadro-icona a, .settori-home .tech-box {
        transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
        transition-duration: 0.5s;
        transition-property: transform
}

button:focus, a.octf-btn:focus, .bouncing-focus a:focus, .settori-home .tech-box:focus,
button:focus, a.octf-btn:hover, .bouncing-focus a:hover {
        background-color: var( --e-global-color-secondary );
        transform: scale3d(1.1, 1.1, 1.1);
		box-shadow: 0 0 0 4px rgba(0, 120, 212, 0.6);
}

.site-footer a:focus:not(.site-footer .elementor-social-icon), 
.riquadro-icona a:focus{
        transform: scale3d(1.1, 1.1, 1.1);
		box-shadow: 0 0 0 4px rgba(0, 120, 212, 0.6);
}

.settori-home .tech-box:focus {
	transform: scale3d(1.1, 1.1, 1.1);
	box-shadow: 0 0 0 4px rgba(173, 140, 54, 0.6);
}

.btn-details:focus i {
        margin-right: 3px;
}
.btn-details:focus{
        text-decoration: underline;
}


/*  */

.email-topbar-box {
	flex-direction: row;
	align-items:center;
	gap: 15px;
}

.email-topbar-box  img {
	width: 20px;
}

.email-topbar-box a {
	color: #fff;
}


/* home */ 

.video-container.video-home .video-slider{
	width: 100%;
    height: 100%;
    position: absolute;
    object-fit: cover; 
}

.slider-container #slider-home .sp-slides-container .jet-slider__items .jet-slider__item {
        background-color: transparent;
}

@media(max-width: 768px){
        .video-container.video-home .video-slider .e-hosted-video {
                height: 100%;
                aspect-ratio: 1.1;
        }
}

   

.mobile-slider-tecnologies .slick-track .jet-carousel__item-inner .jet-carousel__content{
        text-align: center !important;
}


.col-settori-competenza svg {
	min-height: 40px;
}

.col-settori-competenza .col-settore > div	{
	flex: 1;
}

/* advanced box */

.advanced-box .jet-carousel-wrap .jet-carousel .elementor-slick-slider .jet-carousel__item .jet-banner__content .jet-banner__text{
animation: none;
    transition: none;
    opacity: 1;
    transform: none;
    padding-bottom: 0;
    padding-top: 0.5rem;
}

.advanced-box .jet-carousel-wrap .jet-carousel .elementor-slick-slider .jet-carousel__item .jet-banner__content .jet-banner__text .big-number{
position: absolute;
    right: -16px;
    font-size: 4.5rem;
    font-weight: bold;
    font-family: "Montserrat", sans-serif;
    line-height: 3.5rem;
    color: #f2f2f2;
    z-index: -2;
    bottom: 0;
}

@media(max-width: 768px){
        .advanced-box .jet-carousel-wrap .jet-carousel .elementor-slick-slider .jet-carousel__item .jet-banner__content .jet-banner__text .big-number{
               
                right: -16px;
        }
}

.advanced-box .jet-carousel-wrap .jet-carousel .elementor-slick-slider .jet-carousel__item .jet-banner__content .jet-banner__text p {
        margin-bottom: 25px;
}

.advanced-box .jet-carousel-wrap .jet-carousel .elementor-slick-slider .jet-carousel__item .jet-banner__content {
        position: relative;
        padding: 0 0 0 1.4rem;
}

.advanced-box .jet-carousel-wrap .jet-carousel .elementor-slick-slider .jet-carousel__item  .jet-banner {
        border: 1px solid #e7e7e7;
        padding: 25px 16px 0 16px;
        transition: all 0.3s ease-in-out;
}

.advanced-box .jet-carousel-wrap .jet-carousel .elementor-slick-slider .jet-carousel__item  .jet-banner img {
        width: 35px;
        left: 20px;
        position: absolute;
        top: 25px;
        margin: 0;
        top: 30px;
}

.advanced-box .jet-carousel-wrap .jet-carousel .elementor-slick-slider .jet-carousel__item .jet-banner__content .jet-banner__content-wrap {
       padding-left: 2rem;
}


.advanced-box .jet-carousel-wrap .jet-carousel .elementor-slick-slider .jet-carousel__item  .jet-banner:hover .jet-banner__overlay {
        box-shadow: 15px 15px 38px 0 rgba(0, 0, 0, 0.1);
        -webkit-box-shadow: 15px 15px 38px 0 rgba(0, 0, 0, 0.1);
        -moz-box-shadow: 15px 15px 38px 0 rgba(0, 0, 0, 0.1);
        border-color: transparent;
        background: transparent;
        opacity: 0;
}

.advanced-box .jet-carousel-wrap .jet-carousel .elementor-slick-slider .jet-carousel__item .jet-banner:hover {
        box-shadow: 15px 15px 38px 0 rgba(0, 0, 0, 0.1);
        -webkit-box-shadow: 15px 15px 38px 0 rgba(0, 0, 0, 0.1);
        -moz-box-shadow: 15px 15px 38px 0 rgba(0, 0, 0, 0.1);
        border-color: transparent;
}

/* img box */ 

.img-box .overlay *{
        padding-left: 5%;
        padding-right: 5%;
}     

.img-box a:focus .overlay {
        background-color: transparent;
    
}

.img-box a:focus {
        transform: scale(1.06);
		box-shadow: 0 0 0 4px rgba(173, 140, 54, 0.6);
}

@media(max-width:768px){
	.img-box .ot-image-box img {
		height: 200px;
		object-fit: cover;
		width: 100%;
	}
}


/* settori di competenza */ 

/* contatti */

.form-contatti .wpcf7 .main-form {
	background-image: linear-gradient(90deg, #007fff 0%, #3A61EF 100%);
	padding: 25px;
}

.col-acceptance label {
	display: flex;
}

.col-acceptance label input {
	flex: 0;
	margin-right:1rem;
	min-width: 1.2rem;
    min-height: 1.2rem;
}

.col-acceptance label input:checked {
	background: var(--e-global-color-text);
}

.col-acceptance label span {
	flex: 1 1 auto;
}

.form-contatti .wpcf7 .wpcf7-response-output {
	margin-bottom: 1rem;
	border: none;
	font-family: 'Avenir Bold';
}

.form-contatti .wpcf7-list-item-label a{
        text-decoration: underline;
}

/* flipbox */

.flip {
  position: relative;
}
.front1  {
        background-image: url("/wp-content/uploads/2025/08/Screenshot-2025-08-29-163544.webp");
}
.front2 {
        background-image: url("/wp-content/uploads/2025/09/Progetto-senza-titolo-20.webp");
}
.front3 {
        background-image: url("https://algol.ipercom.net/wp-content/uploads/2025/07/QD-COPERTINA-TEMPLATE-PRESENTAZIONE.png");
}
.flip > .front,
.flip > .back {
  display: block;
  align-content: center;
  transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
  transition-duration: 0.5s;
  transition-property: transform, opacity;
}
.flip > .front {
  transform: rotateY(0deg);
}
.flip > .back {
  position: absolute;
  opacity: 0;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  transform: rotateY(-180deg);
  background: #313131; 
}
.flip:hover > .front,
.flip:focus > .front {
  transform: rotateY(180deg);
}
.flip:hover > .back,
.flip:focus > .back {
  opacity: 1;
  transform: rotateY(0deg);
}

.flip {
  position: relative;
  display: inline-block;
  margin-right: 2px;
  margin-bottom: 1em;
  width: 100%;
}
.flip > .front,
.flip > .back {
  display: block;
  color: white;
  width: inherit;
  background-size: cover !important;
  background-position: center !important;
  height: 220px;
  padding: 1em 2em;
  
  border-radius: 10px;
}

.flipbox-service > .elementor-widget-html {
        width: 100%;
}

/* animazione box servizi */ 

.elementor-element .box-service-single {
        overflow: hidden;
        transition: all 0.5s ease;
      
}

.elementor-element .box-service-single::before {
        content: '';
        position: absolute;
        top: -50%;
        left: -50%;
        width: 200%;
        height: 200%;
        background: linear-gradient(
        0deg, 
        transparent, 
        transparent 30%, 
        rgba(48, 48, 242,0.3)
        );
        transform: rotate(-45deg);
        transition: all 0.5s ease;
        opacity: 0;
}

.elementor-element .box-service-single::after {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 0;
        height: 0;
        border-left: 0.3px solid rgb(48, 48, 242);
        border-bottom: 0.3px solid rgb(48, 48, 242);
}

.elementor-element .box-service-single:hover,
.elementor-element .box-service-single:focus  {
  transform: scale(1.05);
  /*box-shadow: 0 0 3px rgba(48, 48, 242,0.5); */
}

.elementor-element .box-service-single:hover::before,
.elementor-element .box-service-single:focus::before  {
  opacity: 1;
  transform: rotate(-45deg) translateY(100%);
}

.elementor-element .box-service-single:hover::after,
.elementor-element .box-service-single:focus::after {
        animation: drawBorder 0.4s linear forwards;
}

@keyframes drawBorder {
  0%   { width: 0; height: 0; }
  50%  { width: 0; height: 100%; }
  100% { width: 100%; height: 100%; }
}