/* ---------------------------------------------------------------
   Jaewa menu — regole dell'header condivise da TUTTE le pagine,
   comprese quelle ancora in veste Bricks (Esperienza, form).
   --------------------------------------------------------------- */
/* menu: Chi siamo e Insights leggermente staccati dal blocco dei servizi */
.brxe-nav-menu .bricks-nav-menu > li.menu-gap{ margin-left: 80px; }
@media (max-width: 991px){ .bricks-nav-menu > li.menu-gap{ margin-left: 0; } }
.bricks-nav-menu > li > a .menu-ico{ display: inline-block; font-size: .95em; margin-right: .45em; vertical-align: middle; position: relative; top: 6px; }
/* voce di menu della pagina corrente: grassetto e sottolineata */
.bricks-nav-menu > li.current-menu-item > a,
.bricks-mobile-menu > li.current-menu-item > a{ font-weight: 700; text-decoration: none; box-shadow: inset 0 -2px 0 currentColor; }

/* carattere unico del sito: Lato (le icone a font restano escluse) */
#brx-header, #brx-content, #brx-footer,
#brx-header *:not(i):not([class*="ti-"]):not([class*="ion-"]):not([class*="fa"]),
#brx-content *:not(i):not([class*="ti-"]):not([class*="ion-"]):not([class*="fa"]),
#brx-footer *:not(i):not([class*="ti-"]):not([class*="ion-"]):not([class*="fa"]){
  font-family: "Lato", "Open Sans", -apple-system, "Segoe UI", Helvetica, Arial, sans-serif !important;
}

/* scala globale: tutto il sito usa i rem, quindi alzare la base ingrandisce
   caratteri e spazi insieme (Bricks: 62.5% = 10px; qui 78.125% = 12.5px, +25%) */
html{ font-size: 78.125%; }

/* header: più largo della gabbia delle pagine (1640 contro 1440px) e un filo più grande */
#brx-header > .brxe-section{ padding-block: .6rem; }
#brx-header > .brxe-section > .brxe-container{ width: 100%; max-width: 1640px; padding-inline: clamp(2rem, 4vw, 4rem); align-items: center; }
#brx-header > .brxe-section > .brxe-container > *{ align-self: center; }
#brx-header .brxe-nav-menu{ font-size: 1.35rem; }
#brx-header .bricks-nav-menu > li{ margin-left: 34px; }
#brx-header .bricks-button{ font-size: 1.3rem; padding: 1rem 2.4rem; }
#brx-header .brxe-image{ max-width: 110px; display: flex; align-items: center; }

/* ancore interne: l'header è fisso (96px), quindi lo scroll verso un #id deve fermarsi sotto l'header */
html{ scroll-behavior: smooth; }
[id]{ scroll-margin-top: 100px; }

/* ===== Esperienza: "Cosa abbiamo già risolto" (sezione autonoma, non dipende da jaewa-ui.css) ===== */
.jx-cases{ width: 100%; padding: 2rem 2rem 5rem; }
.jx-cases-wrap{ max-width: 1280px; margin: 0 auto; }
.jx-cases-title{ font-family: "Lato", sans-serif; font-weight: 700; font-size: clamp(2.4rem, 2.6vw, 3.4rem); line-height: 1.15; color: #1f1f1f; text-align: center; margin: 0 0 .8rem; }
.jx-cases-title span{ color: #FF6900; }
.jx-cases-lede{ font-family: "Lato", sans-serif; font-size: 1.6rem; line-height: 1.5; color: #555; text-align: center; max-width: 70ch; margin: 0 auto 3.2rem; }
.jx-cases-grid{ display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2.4rem; }
.jx-case{ position: relative; background: #fff; border: 1px solid #E4DFD8; border-radius: .6rem; padding: 2.2rem 2.2rem 2.4rem; box-shadow: 0 1px 2px rgba(40,30,20,.04), 0 8px 24px rgba(40,30,20,.05); transition: transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s ease; }
.jx-case::before{ content: ""; position: absolute; left: -1px; top: 2rem; width: 3px; height: 4rem; background: #FF6900; border-radius: 0 2px 2px 0; transition: height .45s cubic-bezier(.2,.7,.2,1); }
.jx-case:hover{ transform: translateY(-4px); box-shadow: 0 2px 4px rgba(40,30,20,.05), 0 18px 40px rgba(40,30,20,.10); }
.jx-case:hover::before{ height: calc(100% - 4rem); }
.jx-case h3{ font-family: "Lato", sans-serif; font-weight: 700; font-size: 1.9rem; line-height: 1.25; color: #1f1f1f; margin: 0 0 1rem; }
.jx-case p{ font-family: "Lato", sans-serif; font-size: 1.45rem; line-height: 1.55; color: #3a3a3a; margin: 0; }
@media (max-width: 1100px){ .jx-cases-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px){ .jx-cases-grid{ grid-template-columns: 1fr; } .jx-cases{ padding: 1rem 1.6rem 2rem; } }
.jx-cases-lede-strong{ font-weight: 700; color: #1f1f1f; max-width: 80ch; }
/* la sezione esperienza dentro la testata: la testata cresce per contenerla */
#brxe-8c3ada{ height: auto !important; min-height: 100vh; row-gap: 3rem; padding-top: 13rem; padding-bottom: 3rem; }
#brxe-lrddfb{ height: auto !important; }
.jx-in-hero{ position: relative; z-index: 2; padding: 0 2rem; }
.jx-in-hero .jx-cases-lede{ margin-bottom: 2.4rem; }
/* Carosello esperienza: 3 schede visibili, le vicine in trasparenza */
.jxc{ --vis: 4; --gap: 20; --peek: 90; position: relative; outline: none; }
.jxc-view{ overflow: hidden; padding: 1rem 0 1.6rem; cursor: grab; touch-action: pan-y; user-select: none; -webkit-user-select: none; }
.jxc-view.is-dragging{ cursor: grabbing; }
.jxc-track{ display: flex; align-items: stretch; will-change: transform; }
.jxc .jx-case{ flex: 0 0 auto; padding: 2rem 1.9rem 2.2rem; opacity: .28; transition: opacity .45s ease, transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s ease; }
.jxc .jx-case.is-on{ opacity: 1; }
.jxc .jx-case:not(.is-on):hover{ transform: none; box-shadow: 0 1px 2px rgba(40,30,20,.04), 0 8px 24px rgba(40,30,20,.05); }
.jxc .jx-case:not(.is-on):hover::before{ height: 4rem; }
.jxc .jx-case h3, .jxc .jx-case p{ pointer-events: none; }
.jxc-arrow{ position: absolute; top: 50%; transform: translateY(-50%); z-index: 3; width: 4rem; height: 4rem; border-radius: 50%; border: 1px solid #E4DFD8; background: #fff; color: #1f1f1f; display: flex; align-items: center; justify-content: center; cursor: pointer; padding: 0; box-shadow: 0 2px 8px rgba(40,30,20,.08); transition: border-color .25s ease, color .25s ease, background .25s ease; }
.jxc-arrow:hover, .jxc-arrow:focus-visible{ border-color: #FF6900; color: #FF6900; outline: none; }
.jxc-arrow svg{ width: 1.6rem; height: 1.6rem; display: block; }
.jxc-prev{ left: 2.4rem; }
.jxc-next{ right: 2.4rem; }
.jx-in-hero .jx-cases-wrap{ max-width: 1400px; }
@media (max-width: 1300px){ .jxc{ --vis: 3; --peek: 80; } }
@media (max-width: 1000px){ .jxc{ --vis: 2; --peek: 70; } }
@media (max-width: 640px){ .jxc{ --vis: 1; --peek: 36; --gap: 16; } .jxc-arrow{ top: auto; bottom: -3.2rem; transform: none; width: 3.6rem; height: 3.6rem; } .jxc-prev{ left: calc(50% - 4.4rem); } .jxc-next{ right: calc(50% - 4.4rem); } .jxc-view{ padding-bottom: 1rem; } .jx-cases{ padding-bottom: 5.5rem; } }
@media (max-width: 991px){ .jx-in-hero{ width: 100vw; max-width: 100vw; margin-left: calc(50% - 50vw); padding: 0 1.2rem; box-sizing: border-box; } }
/* titolo esperienza: nero con la parola in arancione */
#brxe-717e7d, #brxe-zcftas{ color: #1f1f1f !important; }
.jx-acc{ color: #FF6900; }
/* testata esperienza su mobile: meno vuoto, testo allineato a sinistra */
@media (max-width: 991px){
  #brxe-lrddfb{ padding: 9rem 2rem 3rem !important; min-height: 0 !important; row-gap: 2rem; }
  #brxe-kvvkkt{ width: 100%; align-items: flex-start; }
  #brxe-zcftas{ text-align: left !important; align-self: flex-start !important; font-size: clamp(3rem, 8vw, 4.2rem) !important; line-height: 1.15; margin-bottom: 1.2rem; }
  #brxe-pwcbhl p{ text-align: left; line-height: 1.5; font-size: 1.7rem; }
}
/* menu desktop tra 992 e 1180px: voci su una riga, spazi ridotti */
.bricks-nav-menu > li > a{ white-space: nowrap; }
@media (min-width: 992px) and (max-width: 1180px){
  #brx-header .bricks-nav-menu > li{ margin-left: 18px; }
  .brxe-nav-menu .bricks-nav-menu > li.menu-gap{ margin-left: 36px; }
}
/* selettore lingua a tendina: bandiera + sigla, le altre lingue sotto */
.lang-dd{ position: relative; font-family: "Lato", sans-serif; }
.lang-dd summary{ list-style: none; display: flex; align-items: center; gap: .5rem; cursor: pointer; padding: .4rem .2rem; border: 0; border-radius: .5rem; background: transparent; font-size: 1.3rem; font-weight: 700; color: #1f1f1f; line-height: 1; user-select: none; }
.lang-dd summary::-webkit-details-marker{ display: none; }
.lang-dd summary img{ width: 18px !important; height: auto !important; display: block; }
.lang-dd .lang-chev{ width: 1.2rem; height: 1.2rem; color: #8a847c; transition: transform .25s ease; }
.lang-dd[open] .lang-chev{ transform: rotate(180deg); }
.lang-dd summary:hover, .lang-dd[open] summary{ color: #FF6900; }
.lang-dd #brxe-dpezyr{ position: absolute; top: calc(100% + .4rem); right: 0; z-index: 50; flex-direction: column; gap: 0; min-width: 100%; background: #fff; border: 1px solid #E4DFD8; border-radius: .5rem; box-shadow: 0 8px 24px rgba(40,30,20,.10); padding: .3rem 0; margin: 0; }
.lang-dd #brxe-dpezyr li.current-lang{ display: none; }
.lang-dd #brxe-dpezyr li a{ display: flex; align-items: center; gap: .5rem; padding: .5rem .7rem; font-size: 1.3rem; font-weight: 700; color: #1f1f1f; text-decoration: none; white-space: nowrap; }
.lang-dd #brxe-dpezyr li a:hover{ color: #FF6900; }
.lang-dd #brxe-dpezyr img{ width: 18px !important; height: auto !important; }
/* mobile: il selettore lingua sta nel menu verticale, non nella barra */
@media (max-width: 991px){
  .lang-dd{ display: none; }
}
@media (min-width: 992px){
  .lang-mobile{ display: none !important; }
}
#brx-header .bricks-mobile-menu > li.lang-mobile{ padding: 2rem 0 0 0 !important; line-height: 4rem; }
#brx-header .bricks-mobile-menu > li.lang-mobile .lang-dd-m summary{ list-style: none; display: flex; padding: 0 30px !important; align-items: center; gap: .5rem; cursor: pointer; font-size: var(--text-s); font-weight: 700; color: #FF6900; line-height: 4rem; user-select: none; }
#brx-header .bricks-mobile-menu > li.lang-mobile .lang-dd-m summary::-webkit-details-marker{ display: none; }
#brx-header .bricks-mobile-menu > li.lang-mobile .lang-chev{ width: 1.2rem; height: 1.2rem; color: inherit; transition: transform .25s ease; }
#brx-header .bricks-mobile-menu > li.lang-mobile .lang-dd-m[open] .lang-chev{ transform: rotate(180deg); }
#brx-header .bricks-mobile-menu > li.lang-mobile .lang-dd-m-panel a{ display: flex; width: auto; padding: 0 30px !important; align-items: center; gap: .5rem; font-size: var(--text-s); font-weight: 700; color: inherit; text-decoration: none; padding: 0; line-height: 4rem; }
#brx-header .bricks-mobile-menu > li.lang-mobile img{ width: 18px !important; height: auto !important; }
.bricks-mobile-menu > li > a .menu-ico{ display: inline-block; margin-right: .5em; }