/* Hinkypunk hero a percorsi - layout e comportamento. Testi, colori e font si modificano in Elementor. */
.hk-hero{position:relative !important;overflow:hidden;min-height:max(660px,calc(100svh - 90px));--hk-accent:#E8C547;--hk-dur:7s}
.hk-hero .hk-accent{color:var(--hk-accent)}

/* Foto: sfondo a tutta pagina, dissolvenza e zoom lento sul percorso attivo */
.hk-hero .hk-media{position:absolute !important;inset:0;z-index:0;padding:0 !important;margin:0 !important;--width:100%}
.hk-hero .hk-media::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(10,10,15,.94) 0%,rgba(10,10,15,.82) 38%,rgba(10,10,15,.28) 72%,rgba(10,10,15,.12) 100%),linear-gradient(0deg,rgba(10,10,15,.92) 0%,rgba(10,10,15,0) 26%)}
.hk-hero .hk-img{position:absolute !important;inset:0;margin:0 !important;width:100% !important;height:100%;opacity:0;transition:opacity .9s ease}
.hk-hero .hk-img:first-child{opacity:1}
.hk-hero .hk-img > *,.hk-hero .hk-img a{height:100%;display:block}
.hk-hero .hk-img img{width:100% !important;height:100% !important;max-width:none !important;object-fit:cover;display:block;transform-origin:60% 50%}
.hk-ready.hk-hero .hk-img{opacity:0}
.hk-ready.hk-hero .hk-img.is-on{opacity:1}
.hk-ready.hk-hero .hk-img.is-on img{animation:hk-zoom calc(var(--hk-dur) + 1.5s) linear forwards}
.hk-paused.hk-hero .hk-img.is-on img{animation-play-state:paused}
@keyframes hk-zoom{from{transform:scale(1.08)}to{transform:scale(1)}}

/* Contenuto sopra la foto */
.hk-hero .hk-body,.hk-hero .hk-stats{position:relative;z-index:2}
.hk-hero .hk-body{flex-grow:1}
.hk-hero .hk-body .e-con,.hk-hero .hk-body .e-con-inner{--position:static;position:static}
.hk-hero .hk-panel .elementor-widget-text-editor p:last-child{margin-bottom:0}
.hk-hero .hk-panel .hk-ctas{margin-top:4px}

/* Scelta del percorso, con barra di avanzamento sul percorso attivo */
.hk-hero .hk-tab .elementor-button{position:relative;overflow:hidden;transition:background-color .25s,color .25s,border-color .25s}
.hk-hero .hk-tab.is-on .elementor-button{background-color:var(--hk-accent) !important;border-color:var(--hk-accent) !important;color:#0A0A0F !important}
.hk-hero .hk-tab .elementor-button::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:rgba(10,10,15,.45);transform:scaleX(0);transform-origin:left center;pointer-events:none}
.hk-auto.hk-hero .hk-tab.is-on .elementor-button::after{animation:hk-prog var(--hk-dur) linear forwards}
.hk-paused.hk-hero .hk-tab.is-on .elementor-button::after{animation-play-state:paused}
@keyframes hk-prog{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.hk-hero .hk-tab .elementor-button:focus-visible,.hk-hero .hk-panel .elementor-button:focus-visible{outline:2px solid var(--hk-accent);outline-offset:3px}

/* Pannelli: senza JS si leggono tutti in colonna, con JS uno alla volta.
   Il pannello sfuma soltanto (niente transform: il box del lavoro deve restare ancorato alla hero);
   i singoli elementi entrano in sequenza. */
.hk-js .hk-hero .hk-panels{display:grid !important}
.hk-js .hk-hero .hk-panels > .hk-panel{grid-area:1/1;transition:opacity .4s ease,visibility 0s linear 0s}
.hk-js .hk-hero:not(.hk-ready) .hk-panels > .hk-panel:not(:first-child),
.hk-js .hk-hero.hk-ready .hk-panels > .hk-panel:not(.is-on){opacity:0;visibility:hidden;pointer-events:none;transition:opacity .3s ease,visibility 0s linear .3s}
.hk-js .hk-hero.hk-ready .hk-panel > .elementor-element{transition:opacity .5s ease,transform .6s cubic-bezier(.2,.7,.2,1)}
.hk-js .hk-hero.hk-ready .hk-panel:not(.is-on) > .elementor-element{opacity:0;transform:translateY(14px)}
.hk-js .hk-hero.hk-ready .hk-panel.is-on > .elementor-element:nth-child(1){transition-delay:.05s}
.hk-js .hk-hero.hk-ready .hk-panel.is-on > .elementor-element:nth-child(2){transition-delay:.13s}
.hk-js .hk-hero.hk-ready .hk-panel.is-on > .elementor-element:nth-child(3){transition-delay:.21s}
.hk-js .hk-hero.hk-ready .hk-panel.is-on > .elementor-element:nth-child(4){transition-delay:.32s}

/* Box del lavoro: in basso a destra sulla foto */
.hk-hero .hk-body .hk-proof{position:absolute;right:max(24px,calc((100% - 1200px) / 2));bottom:48px;width:340px;--position:absolute;--width:340px}

@media (prefers-reduced-motion:reduce){
 .hk-hero .hk-img,.hk-hero .hk-panel,.hk-hero .hk-panel > .elementor-element{transition:none !important;transform:none !important}
 .hk-hero .hk-img img,.hk-hero .hk-tab .elementor-button::after{animation:none !important}
}

@media (max-width:1100px){
 .hk-hero .hk-body .hk-proof{position:static;width:auto;max-width:420px;margin-top:8px;--width:auto;background-color:#14141C !important}
}
@media (max-width:767px){
 .hk-hero{min-height:0}
 .hk-hero .hk-media{position:relative !important;height:300px;flex:0 0 auto}
 .hk-hero .hk-media::after{background:linear-gradient(0deg,rgba(10,10,15,1) 0%,rgba(10,10,15,.15) 60%,rgba(10,10,15,.3) 100%)}
 .hk-hero .hk-body{margin-top:-48px}
 .hk-hero .hk-tabs{flex-wrap:nowrap !important;overflow-x:auto;margin-left:-24px !important;margin-right:-24px !important;width:calc(100% + 48px) !important;max-width:none !important;--width:calc(100% + 48px);padding:0 24px 4px !important;scrollbar-width:none;scroll-behavior:smooth}
 .hk-hero .hk-tabs::-webkit-scrollbar{display:none}
 .hk-hero .hk-tabs > .hk-tab{flex:0 0 auto !important;width:auto !important}
 .hk-hero .hk-ctas{flex-direction:column !important;align-items:stretch !important}
 .hk-hero .hk-ctas .elementor-button{width:100%;justify-content:center}
}

/* Striscia nomi a scorrimento (Hanno lavorato con noi) */
.hk-hero .hk-mq-wrap{flex:1 1 360px !important;min-width:0;width:auto !important}
.hk-mq{display:flex;align-items:center;gap:24px;min-width:0}
.hk-mq p{margin:0}
.hk-mq-label{flex:0 0 auto;font:400 14px/1 'Sofia Sans',sans-serif;color:#A9A9B8;white-space:nowrap}
.hk-mq-view{flex:1;min-width:0;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.hk-mq-track{display:flex;width:max-content;animation:hk-mq 50s linear infinite}
.hk-mq-view:hover .hk-mq-track{animation-play-state:paused}
.hk-mq-set{display:flex;align-items:center;flex:0 0 auto}
.hk-mq-item{font:600 18px/1 'Sofia Sans Condensed',sans-serif;color:#FAFAF8;white-space:nowrap;padding:0 18px}
.hk-mq-item::after{content:'\00B7';color:#E8C547;margin-left:36px;position:relative;left:-18px}
@keyframes hk-mq{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.hk-mq-track{animation:none}}
@media (max-width:767px){.hk-mq{flex-direction:column;align-items:flex-start;gap:10px}.hk-mq-view{width:100%}}

/* Foto della hero in bianco e nero: togli questa regola per tornare al colore */
.hk-hero .hk-img img{filter:grayscale(1) contrast(1.12) brightness(.92)} /* hk-bn */