/*
 Theme Name:   mb Child Theme
 Theme URI:    https://mb.it
 Description:  Use this child theme to extend Bricks.
 Author:       TMT DEV TEAM
 Author URI:   https://mb.it
 Template:     bricks
 Version:      1.0
 Text Domain:  tmt
*/
p.reveal b a{
  font-weight: 700 !important;
}
/* COLORI
Viola: color: var(--bricks-color-dzwbsd);
BIANCO: color: var(--bricks-color-dttzqo);
GRIGIO: color: var(--bricks-color-bxzomu);
NERO: color: var(--bricks-color-sttooc);
*/

h1 {
  font-size: clamp(36px, 4.5vw, 72px);
  line-height: 1.05;
  font-weight: 600;
  color: var(--bricks-color-sttooc);
}

h2 {
  font-size: clamp(28px, 3.5vw, 52px);
  line-height: 1.1;
  font-weight: 600;
  color: var(--bricks-color-sttooc);
}

h3 {
  font-size: clamp(20px, 2vw, 29px);
  line-height: 1.2;
  font-weight: 400;
  color: var(--bricks-color-sttooc);
}

p {
    font-size: clamp(18px, 2vw, 21px);
  line-height: 1.3;
  font-weight: 400;
  color: var(--bricks-color-bxzomu);
}

p, ul li, ol li {
    font-size: clamp(18px, 2vw, 21px);
    line-height: 1.3;
    font-weight: 400;
    color: var(--bricks-color-sttooc);
}

.pblack p {
    font-size: clamp(16px, 2vw, 18px);
  line-height: 1.3;
  font-weight: 400;
  color: #0e0e0e;
}

.pwhite p {
    font-size: clamp(16px, 2vw, 18px);
  line-height: 1.3;
  font-weight: 400;
  color: #fff;
}

.pblack p a {
    font-size: clamp(16px, 2vw, 18px);
  line-height: 1.3;
  font-weight: 400;
  color: #0e0e0e !important;
}

.pblack li,
.pblack li a,
.pblack li strong {
  color: #0e0e0e !important;
}

.pblack21 p {
    font-size: clamp(18px, 2vw, 21px);
  line-height: 1.3;
  font-weight: 400;
  color: #0e0e0e;
}

.p12 p {
  font-size: 16px;
  line-height: 1.2;
  font-weight: 400;
  color:#0e0e0e;
}

.p18 p {
  font-size: 18px;
  line-height: 1.2;
  font-weight: 400;
  color: var(--bricks-color-dttzqo);
}
.p18-n p {
  font-size: 18px;
  line-height: 1.2;
  font-weight: 400;
}

.p24 p {
  font-size: clamp(21px, 2vw, 24px);
  line-height: 1.2;
  font-weight: 400;
  color: var(--bricks-color-dttzqo);
}

.p24-black p {
  font-size: clamp(21px, 2vw, 24px);
  line-height: 1.2;
  font-weight: 400;
  color: var(--bricks-color-sttooc);
}

.p24-white p {
  font-size: clamp(21px, 2vw, 24px);
  line-height: 1.2;
  font-weight: 400;
  color: var(--bricks-color-dttzqo);
}


.p31 p {
  font-size: clamp(21px, 2vw, 31px);
  line-height: 1.2;
  font-weight: 500;
}

.p36 p {
  font-size: clamp(24px, 2vw, 36px);
  line-height: 1.2;
  font-weight: 500;
}

.p36-white p {
  font-size: clamp(24px, 2vw, 36px);
  line-height: 1.2;
  font-weight: 500;
  color: #fff;
}


.font-full-width{
  font-size: clamp(8vw, 12vw, 18vw);
  color: var(--bricks-color-dttzqo);
  line-height: 0.95;
  font-weight: 400;
  letter-spacing: -0.02em;
  white-space: nowrap;
}

/* COOKIE POLICY FULL WIDTH + FONT 18px */
#cmplz-document{
  width: 100% !important;
  max-width: 100% !important;
  font-size: clamp(18px, 2vw, 21px) !important;
  line-height: 1.6;
}

/* Se hai un container che lo limita */
#cmplz-document,
#cmplz-document *{
  box-sizing: border-box;
}

/* opzionale: paragrafi più leggibili */
#cmplz-document p{
  font-size: clamp(18px, 2vw, 21px) !important;
}

/* TEXT ANIMATION */
/* Stato iniziale */
.reveal{
  opacity: 0;
  transform: translateY(24px);
  transition:
    opacity .6s ease,
    transform .6s ease;
  will-change: opacity, transform;
}

/* Stato visibile */
.reveal.is-visible{
  opacity: 1;
  transform: translateY(0);
}

/* Testi grandi leggermente più lenti */
h1.reveal,
h2.reveal{
  transition-duration: .8s;
}

/* Accessibilità */
@media (prefers-reduced-motion: reduce){
  .reveal{
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}
footer .reveal,
footer h1,
footer h2,
footer h3,
footer p{
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
}



/* Footer */
/* MOBILE: 1 col, 1 col, poi 2 col */
@media (max-width: 767px){
  #brxe-jjxbia{
    display:grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px; /* cambia */
  }

  /* 1° e 2° item full width */
  #brxe-jjxbia > :nth-child(1),
  #brxe-jjxbia > :nth-child(2){
    grid-column: 1 / -1; /* span 2 */
  }
}


/* 
  ============================
          MEGA MENU
  ============================
*/





/* ============================
   BASE / GLOBAL
   ============================ */

/* Nascondi voci-menu */
#brxe-emgroh .voci-menu{
  display:none !important;
}

/* Rimuove pseudo-elementi dai menu con figli (sempre) */
.brxe-nav-menu .bricks-nav-menu li.menu-item-has-children::before,
.brxe-nav-menu .bricks-nav-menu li.menu-item-has-children:hover::before,
.brxe-nav-menu .bricks-nav-menu li.menu-item-has-children::after,
.brxe-nav-menu .bricks-nav-menu li.menu-item-has-children:hover::after{
  content:none !important;
  display:none !important;
  height:0 !important;
  width:0 !important;
  border:0 !important;
  position:static !important;
}

/* (ridondante ma lo lasciamo) rimuove il before in hover sui parent */
#megamenu-mb .brx-nav-menu li.menu-item-has-children:hover::before{
  display:none !important;
}

/* stacking */
#megamenu-mb{
  position: relative;
  z-index: 9999;
  isolation: isolate;
}

#megamenu-mb > nav{
  position: relative;
  z-index: 1;
  overflow: visible !important;
}

/* wrapper Bricks non deve tagliare */
.brxe-nav-menu,
.bricks-nav-menu{
  overflow: visible !important;
}

/* tweak vari */
#brxe-slowmb{ width:100vw !important; }

#megamenu-mb .bricks-nav-menu #menu-item-1276 .mm-row button i{
  color:#000;
}

/* Icon color (menu-item-has-children) */
li.menu-item-has-children [aria-expanded] .menu-item-icon{
  color: #000;
  fill:  #000;
}

/* Posizionamento elemento */
#brxe-tiffqo{ right:-12px !important; }
@media (min-width:1441px){
  #brxe-tiffqo{ right:-2px !important; }
}

/* Mobile ultra: regola specifica */
@media (max-width:480px){
  #menu-item-3629 ul{ display:none !important; }
}

/* Close button: default desktop nascosto, mobile visibile */
#brxe-eydznz{ display:none; }
@media (max-width:991px){
  #brxe-eydznz{ display:block; }
}

/* ============================
   DESKTOP (>= 992px)
   ============================ */
@media (min-width:992px){

  /* megamenu-agrati */
  #megamenu-mb{
    padding-top: 150px;
    width: 520px;
    max-width: 520px;
  }

  /* Wrapper & colonna 1 */
  #megamenu-mb > nav{
    min-height: 420px;
  }

  #megamenu-mb > nav > ul.bricks-nav-menu{
    position: relative;
    z-index: 5;
    padding: 0;
    padding-right: 24px;
    box-sizing: border-box;
  }

  /* Hover riga */
  #megamenu-mb .menu-item:hover{
    border-bottom: 1px solid #ee4c21 !important;
  }

  #megamenu-mb > nav > ul > li:hover > a{
    color: var(--bricks-color-dzwbsd) !important;
  }

  /* Toggle */
  #megamenu-mb .brx-submenu-toggle{
    display: flex;
    flex-direction: row;
  }

  #megamenu-mb .menu-item:hover > .icon-right button i{
    color: var(--bricks-color-dzwbsd) !important;
  }

  #megamenu-mb .bricks-nav-menu .sub-menu .brx-submenu-toggle button{
    padding-right: 0px;
  }

  /* Righe */
  #megamenu-mb .bricks-nav-menu > li.l1,
  #megamenu-mb ul.sub-menu > li{
    border-bottom: 1px solid #c9c9c9;
    white-space: normal;
  overflow-wrap: break-word;
  word-wrap: break-word;
  }

  /* Link */
  #megamenu-mb a{
    line-height: 1.2;
    color: inherit;
    text-decoration: none;
    height: 90.4px;
    display: flex;
    align-items: center;
  }

  #megamenu-mb .bricks-nav-menu > li.l1 > .brx-submenu-toggle > a{
    font-weight: 400;
    width: 100%;
  }

  /* Reset sub-menu Bricks (colonne 2 e 3 chiuse di default) */
  #megamenu-mb ul.sub-menu.brx-submenu-positioned{
    display: block !important;
    position: absolute !important;
    top: 0;
    left: 100%;
    width: 100%;
    height: 100%;
    background: transparent;
    box-sizing: border-box;
    z-index: 10;

    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: none !important;

    /* micro-ponte anti-gap */
    padding-right: 1px;
  }

  /* Colonna 2: visibile in hover sul L1 */
  #megamenu-mb > nav > ul.bricks-nav-menu > li.l1:hover > ul.sub-menu{
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }

  /* Colonna 3: posizionamento */
  #megamenu-mb ul.sub-menu.brx-submenu-positioned > li.l2{
    position: static !important;
  }
  #megamenu-mb ul.sub-menu.brx-submenu-positioned > li.l2 a{
    width: 100% !important;
  }

  /* Colonna 3: visibile in hover sul L2 */
  #megamenu-mb > nav > ul.bricks-nav-menu > li.l1:hover ul.sub-menu li.l2:hover > ul.sub-menu{
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }

  /* Mantieni aperto mentre sei sopra le colonne */
  #megamenu-mb > nav > ul.bricks-nav-menu > li.l1 > ul.sub-menu:hover{
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }

  #megamenu-mb ul.sub-menu.brx-submenu-positioned > li.l2 > ul.sub-menu:hover{
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }

  /* Margini interni */
  .l2{ margin-left: 24px; }
  .l3{ margin-left: 24px; }

  /* disattiva apertura in hover: le aperture vere restano pilotate da .is-open */
  #megamenu-mb > nav > ul.bricks-nav-menu > li.l1:hover > ul.sub-menu,
  #megamenu-mb > nav > ul.bricks-nav-menu > li.l1:hover ul.sub-menu li.l2:hover > ul.sub-menu{
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  /* Apertura a CLICK: .is-open */
  #megamenu-mb > nav > ul.bricks-nav-menu > li.l1.is-open > ul.sub-menu{
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }

  /* Colonna 2 non deve tagliare la 3 */
  #megamenu-mb > nav > ul.bricks-nav-menu > li.l1 > ul.sub-menu{
    overflow: visible !important;
    padding-right: var(--col-gap, 24px) !important;
  }

  /* Base colonna 3 (su .is-open) */
  #megamenu-mb ul.sub-menu.brx-submenu-positioned > li.l2 > ul.sub-menu{
    top: 0 !important;
    left: 100% !important;
    height: auto;
    background: #f5f5f5;
    z-index: 30;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: none !important;
    overflow: hidden !important;
  }

  /* Mostra colonna 3 quando L2 è open */
  #megamenu-mb > nav > ul.bricks-nav-menu > li.l1.is-open > ul.sub-menu > li.l2.is-open > ul.sub-menu{
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }

  /* NEWS: traslazione */
  #menu-gigante{
    display:flex;
    align-items:flex-start;
    gap: var(--col-gap, 24px);
    --news-shift-l2: 500px;
  }

  #megamenu-mb{
    flex: 0 0 var(--l1-width, 500px) !important;
  }

  #news{
    min-width: 0;
    position: relative;
    will-change: transform, opacity;
    transition: transform .20s ease-in-out, opacity .35s ease;
    transform: translate3d(0,0,0);
    backface-visibility: hidden;

    display:flex;
    flex-direction: column;
    justify-content: center;
  }

  #menu-gigante:not(.mm-l2-open):not(.mm-l3-open) #news{
    transform: translate3d(0,0,0);
    opacity: 1;
  }

  #menu-gigante.mm-l2-open #news{
    transform: translate3d(var(--news-shift-l2, 500px),0,0);
    opacity: 1;
  }

  #menu-gigante.mm-l3-open #news{
    transform: translate3d(100vw,0,0);
    opacity: 0;
    pointer-events: none;
  }

  /* Allineamento colonna 2 sempre dall’alto */
  #megamenu-mb .bricks-nav-menu-wrapper{
    display:block !important;
    align-items:flex-start !important;
    align-content:flex-start !important;
  }

  #megamenu-mb > nav{
    display:block !important;
    align-items:flex-start !important;
  }

  #megamenu-mb > nav > ul.bricks-nav-menu{
    position: relative;
  }

  #megamenu-mb > nav > ul.bricks-nav-menu > li.l1{
    position: static;
  }

  #megamenu-mb > nav > ul.bricks-nav-menu > li.l1 > ul.sub-menu{
    position: absolute !important;
    top: 0 !important;
    left: 100% !important;
    transform: none !important;
    margin-top: 0 !important;
  }
}

/* Desktop extra wide */
@media (min-width:1600px){
  #megamenu-mb ul.sub-menu.brx-submenu-positioned > li.l2 > ul.sub-menu{
    width: 520px !important;
  }
}
@media (min-width:1920px){
  #megamenu-mb{
    flex: 0 0 580px !important;
  }
}

/* ============================
   MOBILE (<= 991px)
   ============================ */
@media (max-width:991px){

  /* News fuori */
  #news{ display:none !important; }

  #megamenu-mb{
    padding-top: 100px !important;
  }

  .mm-panel.is-active {
  background: #fffbfa !important;
}


  /* colonna 2 sopra */
  #megamenu-mb > nav > ul.bricks-nav-menu > li.l1 > ul.sub-menu{
    position: absolute !important;
    z-index: 10010 !important;
    overflow: visible !important;
  }

  /* colonna 3 sopra ancora */
  #megamenu-mb ul.sub-menu.brx-submenu-positioned > li.l2 > ul.sub-menu{
    position: absolute !important;
    z-index: 10020 !important;
  }

  /* while multistep active: nascondi UL originale e sub */
  #megamenu-mb.mm-mobile-active nav > ul.bricks-nav-menu{
    display:none !important;
  }
  #megamenu-mb.mm-mobile-active nav ul.sub-menu,
  #megamenu-mb.mm-mobile-active nav .brx-submenu-positioned{
    display:none !important;
  }

  /* Backbar */
  #megamenu-mb .mm-backbar{
    position: sticky;
    top: 0;
    z-index: 2;
    height: 56px;
    display:flex;
    align-items:center;
    gap: 8px;
    padding: 0 16px;
    border-bottom: 1px solid #eee;
    background: var(--bricks-border-color);
  }

  #megamenu-mb .mm-backbar > button.mm-back,
  #megamenu-mb .mm-backbar > strong.mm-title{
    color: var(--bricks-color-dzwbsd) !important;
  }

  /* Viewport */
  #megamenu-mb .mm-viewport{
    position: relative;
    overflow: hidden;
    min-height: calc(100dvh - 56px);
    background: red;
  }

  /* Panels */
  #megamenu-mb .mm-panel{
    position:absolute !important;
    inset:0;
    transform: translateX(100%);
    transition: transform .28s ease;
    background: red;
  }

  #megamenu-mb .mm-panel.is-active{ transform: translateX(0); }
  #megamenu-mb .mm-panel.is-prev{ transform: translateX(-100%); }

  /* padding panels */
  #megamenu-mb .mm-viewport .mm-panel,
  #megamenu-mb .mm-viewport .mm-panel .bricks-nav-menu{
    padding: 8px 0px !important;
  }

  /* UL dentro pannelli */
  #megamenu-mb .mm-panel ul{
    margin:0;
    padding: 8px 16px 16px;
  }

  #megamenu-mb .mm-panel a,
  #megamenu-mb .mm-backbar .mm-title{
    width:100%;
  }

  /* nascondi sub-menu specifici dentro i pannelli */
  #megamenu-mb .mm-panel #menu-item-339 ul.sub-menu,
  #megamenu-mb .mm-panel #menu-item-340 ul.sub-menu,
  #megamenu-mb .mm-panel #menu-item-342 ul.sub-menu {
    display:none !important;
  }

  /* colori icone nel mobile */
  #megamenu-mb .mm-viewport .mm-panel > .sub-menu .menu-item .mm-row button i{
    color: black !important;
  }

}

@media (max-width:450px){
  #megamenu-mb .mm-panel{ padding-left:0px; }
  #megamenu-mb .mm-backbar{ padding-left:0px !important; }
}

/* layout wrapper */
#menu-gigante{
  min-height: 100vh;
  display:flex;
  align-items: stretch;
}


/* Cursore grid servizi */
/* Card: deve essere hoverable */
.blocco-grid-servizi{
  position: relative;
}

/* Cursor badge */
/* Nasconde la freccia SOLO durante l'effetto */
body.service-cursor-active { cursor: none; }

.blocco-grid-servizi { cursor: none !important; } /* ok tenerlo */

/* Wrapper: segue il mouse (NO transition qui) */
.service-cursor-badge{
  position: fixed;
  top: 0; left: 0;
  z-index: 99999;
  pointer-events: none;
  transform: translate3d(-9999px, -9999px, 0); /* solo placeholder iniziale */
  will-change: transform;
}

/* Inner: qui animiamo solo l'apparizione */
.service-cursor-badge .badge{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  border-radius: 999px;
  background: rgba(255, 199, 194, 0.18);
  border: 1px solid #fe280e;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  color: #fe280e;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .2px;

  opacity: 0;
  transform: scale(.92);
  transition: opacity .12s ease, transform .12s ease;
}

/* Visibile */
.service-cursor-badge.is-visible .badge{
  opacity: 1;
  transform: scale(1);
}

/* Mobile: off */
@media (max-width: 991px){
  .service-cursor-badge{ display:none !important; }
  body.service-cursor-active { cursor:auto; }
  .blocco-grid-servizi{ cursor:auto; }
}

/* Riduci motion */
@media (prefers-reduced-motion: reduce){
  .service-cursor-badge .badge{ transition:none; }
}

.service-cursor-badge svg{
  width: 18px;
  height: 18px;
  display: block;
}

body.service-cursor-active{
  cursor: none;
}
/* Nasconde il cursore nativo sui blocchi servizi */
.blocco-grid-servizi{
  cursor: none;
}

/* Mobile: disattiva (non ha senso inseguire il dito) */
@media (max-width: 991px){
  .service-cursor-badge{ display:none !important; }
}

/* Accessibilità: riduci motion */
@media (prefers-reduced-motion: reduce){
  .service-cursor-badge{ transition:none; }
}

/* Tag separati */
/* wrapper */
.brxe-ccvxzf{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

/* singolo tag */
.tag-progetti a{
  display: inline-flex;
  align-items: left;
  padding: 6px 12px;
  border-radius: 999px;
  font-size: 13px;
  line-height: 1;
  font-weight: 500;
  text-decoration: none;
  color: #E6E6E6;
  background: #1c1c1c;
  transition: background .2s ease, transform .2s ease;
}

/* hover */
.tag-progetti a:hover{
  transform: translateY(-1px);
}





/* Hover image progetti home e progetti e insight */
/* Soluzione universale per tutti i box con immagini */
.brxe-xfjdjm,
.brxe-abwcio,
.brxe-dqkibv,
.brxe-cgzmiw {
  overflow: hidden;
}

.brxe-itczjv,
.brxe-vwxssa,
.brxe-thdkln,
.brxe-fmpmzg {
  transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
  will-change: transform;
}

.brxe-mtuxjh:hover .brxe-itczjv,
.brxe-bhrofa:hover .brxe-vwxssa,
.brxe-adizyt:hover .brxe-thdkln,
.brxe-gvypyy:hover .brxe-fmpmzg {
  transform: scale(1.1);
}