:root{
  --black:#032b3c;
  --white:#fff;
  --max: 1040px;
  --radius: 24px;
  --ease: cubic-bezier(.2,.8,.2,1);
  --shadow: 0 30px 70px rgba(0,0,0,.28);
}

/* breakout full width (tema minima / wrapper centrato) */
.lis-cards{
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  position: relative;
}

/* card sticky */
.lis-card{
  position: sticky;
  top: 0;
  height: 100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding: clamp(28px, 4vw, 88px);
  transform-origin: center center;
  will-change: transform, filter;
  overflow: hidden;
}

/* backgrounds */
.lis-light{ background: var(--white); color: var(--black); }
.lis-dark{ background: radial-gradient(circle,rgba(51, 112, 120, 1) 0%, rgba(3, 43, 60, 1) 100%); color: var(--white); }

/* content layer (sopra shine) */
.lis-card__content, .lis-card__content_bis{
  width: 100%;
  max-width: var(--max);
  position: relative;
  z-index: 2;
}

.lis-card__content:nth-child(1){
    margin-top: 0;
}
/* =========================
   HERO SPLIT (testo + logo)
   ========================= */

.lis-hero--split{
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: clamp(32px, 6vw, 120px);
  align-items: center;
}

/* colonna sinistra */
.lis-hero__left{
  max-width: 60ch;
}

/* colonna destra */
.lis-hero__right{
  display: flex;
  align-items: center;
  justify-content: center;
}

/* logo */
.lis-hero__logo{
  width: min(420px, 34vw);
  max-width: 100%;
  height: auto;
  opacity: 0.06;
  filter: drop-shadow(0 20px 40px rgba(0,0,0,.08));
}

/* micro raffinatezza: non “gridata” */
.lis-hero__logo{
  transform: translateY(-2vh);
}

/* =========================
   MOBILE
   ========================= */

@media (max-width: 980px){
  .lis-hero--split{
    grid-template-columns: 1fr;
    gap: 36px;
  }

  .lis-hero__right{
    justify-content: flex-start;
  }

  .lis-hero__logo{
    width: min(260px, 70vw);
    transform: none;
    opacity: 0.85;
  }
}

/* typography */
.lis-card__content h1,
.lis-card__content h2{
  margin:0 0 18px 0;
  letter-spacing: -0.04em;
  font-weight: 560;
}

.lis-card__content h1{
  font-size: clamp(38px, 5.6vw, 72px);
  line-height: 1.02;
}

.lis-card__content h2{
  font-size: clamp(30px, 4.3vw, 56px);
  line-height: 1.05;
}

.lis-lead{
  margin: 0;
  font-size: clamp(16px, 1.7vw, 22px);
  line-height: 1.45;
  opacity: .86;
  max-width: 48ch;
}

.lis-card__content p{
  margin: 0 0 14px 0;
  font-size: clamp(15px, 1.25vw, 18px);
  line-height: 1.65;
  max-width: 72ch;
}

/* tiles */
.lis-grid{
  list-style:none;
  margin: 26px 0 0 0;
  padding:0;
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}
.lis-grid--4{ grid-template-columns: repeat(4, minmax(0, 1fr)); }

.lis-tile{
  border-radius: var(--radius);
  padding: 18px 18px 16px 18px;
  background: rgba(0,0,0,.06);
  border: 1px solid rgba(0,0,0,.10);
  transition: transform .6s var(--ease), box-shadow .6s var(--ease);
  transform: translateZ(0);
}
.lis-tile:hover{
  transform: translateY(-6px);
  box-shadow: var(--shadow);
}
.lis-tile h3{
  margin: 0 0 8px 0;
  font-size: 14px;
  letter-spacing: .08em;
  text-transform: uppercase;
  font-weight: 700;
}
.lis-tile p{ margin:0; opacity:.86; }

.lis-tile--inverse{
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.14);
}

/* split */
.lis-split{
  display:grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 26px;
  align-items: center;
}
.lis-qr{
  justify-self: end;
  width: min(280px, 70vw);
  text-align: center;
}
.lis-qr img{
  width: 100%;
  height: auto;
  display:block;
  border-radius: 16px;
  background: #fff;
  padding: 12px;
  box-shadow: 0 20px 60px rgba(0,0,0,.25);
}
.lis-note{ margin-top: 10px; font-size: 13px; opacity: .7; }
.lis-footnote{ margin-top: 18px; font-size: 13px; opacity: .75; }

/* shine (non copre il testo) */
.lis-shine{
  position:absolute;
  inset:-20%;
  pointer-events:none;
  z-index:1;
  opacity: 0;
  transform: translate3d(-10%, -10%, 0) rotate(12deg);
  background: linear-gradient(
    90deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,.08) 35%,
    rgba(255,255,255,.16) 50%,
    rgba(255,255,255,.08) 65%,
    rgba(255,255,255,0) 100%
  );
}

/* reveal SOLO con transform, mai opacity (così il testo non sparisce mai) */
[data-anim]{
  transform: translate3d(0, 0, 0);
}
html.lis-js .is-active [data-anim="h"]{
  transform: translate3d(0, -2px, 0);
  transition: transform .9s var(--ease);
}
html.lis-js .is-active [data-anim="p"]{
  transform: translate3d(0, 0, 0);
  transition: transform .9s var(--ease);
}
html.lis-js .is-active [data-anim="g"]{
  transform: translate3d(0, 0, 0);
  transition: transform .9s var(--ease);
}

@media (max-width: 980px){
  .lis-grid, .lis-grid--4{ grid-template-columns: 1fr; }
  .lis-split{ grid-template-columns: 1fr; }
  .lis-qr{ justify-self: start; }
}

@media (prefers-reduced-motion: reduce){
  .lis-tile, .lis-shine, [data-anim]{
    transition: none !important;
  }
}

/* mobile: niente animazioni sul testo */
@media (max-width: 980px){
  [data-anim],
  html.lis-js .is-active [data-anim="h"],
  html.lis-js .is-active [data-anim="p"],
  html.lis-js .is-active [data-anim="g"]{
    transition: none !important;
  }
  html.lis-js .lis-ambiti__item{
    transform: none !important;
    transition: none !important;
  }
  .lis-card.lis-ambiti .lis-ambiti__tile{
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
  .lis-card.lis-ambiti .lis-ambiti__chip{
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

/* HERO: meno vuoto, più “editoriale” */
.lis-hero{
  padding-top: clamp(36px, 8vh, 96px);
  padding-bottom: clamp(26px, 5vh, 60px);
}

/* spostiamo il contenuto della prima card verso l’alto */
.lis-snap .lis-card.lis-light:first-of-type{
  align-items: flex-start;
}

/* micro background premium (quasi invisibile) solo sulla prima card */
.lis-snap .lis-card.lis-light:first-of-type::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  background:
    radial-gradient(1200px 600px at 18% 22%, rgba(0,0,0,.06), rgba(0,0,0,0) 60%),
    radial-gradient(900px 520px at 75% 70%, rgba(0,0,0,.05), rgba(0,0,0,0) 62%),
    linear-gradient(180deg, rgba(0,0,0,.035), rgba(0,0,0,0) 38%);
}

/* content sopra l’overlay */
.lis-hero{ position: relative; z-index: 2; }

.lis-eyebrow{
  margin: 0 0 18px 0;
  font-size: 12px;
  letter-spacing: .18em;
  text-transform: uppercase;
  opacity: .75;
}

.lis-hero-points{
  list-style: none;
  margin: 22px 0 0 0;
  padding: 0;
  display: grid;
  gap: 10px;
  max-width: 56ch;
}
.lis-hero-points li{
  display:flex;
  gap: 10px;
  align-items: baseline;
  font-size: 16px;
  line-height: 1.45;
  opacity: .9;
}
.lis-hero-points li::before{
  content:"";
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: currentColor;
  opacity: .22;
  transform: translateY(2px);
}

/* scroll cue */
.lis-scrollcue{
  margin-top: clamp(26px, 5vh, 60px);
  display: inline-flex;
  align-items: center;
  gap: 12px;
  opacity: .55;
  font-size: 12px;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.lis-scrollcue i{
  width: 54px;
  height: 1px;
  background: currentColor;
  opacity: .5;
}

/* ===== Split big card (2 colonne, super piena) ===== */
.lis-card.lis-splitbig .lis-card__content{
  max-width: none;
  width: 100%;
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: clamp(22px, 4vw, 54px);
  align-items: start;
}

.lis-card.lis-splitbig h2{
  font-size: clamp(56px, 6vw, 96px);
  line-height: 0.98;
  letter-spacing: -0.05em;
  margin: 0;
}

.lis-card.lis-splitbig p{
  max-width: none;
  font-size: clamp(18px, 1.85vw, 28px);
  line-height: 1.42;
  letter-spacing: -0.012em;
  opacity: 0.92;
  margin: 0 0 clamp(16px, 2vh, 22px) 0;
}

/* Mobile: torna a 1 colonna */
@media (max-width: 980px){
  .lis-card.lis-splitbig .lis-card__content{
    grid-template-columns: 1fr;
  }
  .lis-card.lis-splitbig h2{
    margin-bottom: 14px;
  }
}

/* ===== Animated editorial highlight ===== */
.lis-card strong{
  font-weight: 600;
  position: relative;
}

.lis-hl{
  position: relative;
  display: inline-block;
}

.lis-hl::after{
  content:"";
  position:absolute;
  left:-0.05em;
  right:-0.05em;
  bottom:0.12em;
  height:0.32em;
  background: currentColor;
  opacity:0.16;
  border-radius:4px;
  transform: scaleX(0);
  transform-origin:left center;
}

/* ===== Split media card (testo + immagine) ===== */
.lis-split-media .lis-card__content{
  max-width: none;
  width: 100%;
}

.lis-split-media__grid{
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: clamp(22px, 4vw, 56px);
  align-items: center;
}

.lis-split-media__text h2{
  margin-bottom: clamp(12px, 2vh, 18px);
}

.lis-split-media__text p{
  font-size: clamp(18px, 1.55vw, 22px);
  line-height: 1.55;
  max-width: 56ch;
}

/* bullet premium */
.lis-bullets{
  list-style: none;
  padding: 0;
  margin: clamp(16px, 3vh, 26px) 0 0 0;
  display: grid;
  gap: 12px;
  max-width: 58ch;
}
.lis-bullets li{
  position: relative;
  padding-left: 18px;
  font-size: clamp(16px, 1.2vw, 18px);
  line-height: 1.5;
  opacity: .88;
}
.lis-bullets li::before{
  content: "";
  position: absolute;
  left: 0;
  top: 0.6em;
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: currentColor;
  opacity: .22;
}

/* box immagine: crop premium */
.lis-split-media__media{
  justify-self: end;
  width: min(520px, 40vw);
  aspect-ratio: 4 / 5;
  border-radius: 28px;
  overflow: hidden;
  position: relative;
}

/* leggero “glass” sopra l’immagine (molto soft) */
.lis-split-media__media::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity: .55;
}

.lis-split-media__media img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display:block;
  transform: scale(1.02);
}

/* mobile */
@media (max-width: 980px){
  .lis-split-media__grid{
    grid-template-columns: 1fr;
    align-items: start;
  }
  .lis-split-media__media{
    width: 100%;
    max-width: 520px;
    justify-self: start;
    margin-top: 18px;
    aspect-ratio: 16 / 10;
    border-radius: 22px;
  }
  .lis-split-media__text p{
    max-width: none;
  }
}

/* ===== Process map ===== */
.lis-process h2{
  margin-bottom: clamp(28px, 5vh, 52px);
}

.lis-process__grid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(26px, 4vw, 56px);
  position: relative;
}

/* linea di connessione */
.lis-process__grid::before{
  content:"";
  position:absolute;
  top: 22px;
  left: 0;
  right: 0;
  height: 1px;
  background: rgba(255,255,255,.14);
}

.lis-step{
  position: relative;
  max-width: 28ch;
}

.lis-step__n{
  display:block;
  font-size: 12px;
  letter-spacing: .2em;
  opacity: .45;
  margin-bottom: 14px;
}

.lis-step h3{
  margin: 0 0 10px 0;
  font-size: 15px;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.lis-step p{
  margin: 0;
  font-size: 16px;
  line-height: 1.55;
  opacity: .85;
}

@media (max-width: 980px){
  .lis-process__grid{
    grid-template-columns: 1fr;
  }
  .lis-process__grid::before{
    display:none;
  }
}
.lis-process{
  padding-top: clamp(8vh, 12vh, 16vh);
}

/* === IMAGE ONLY CARD === */
.lis-image-only{
  display: flex;
  align-items: center;
  justify-content: center;
}

.lis-image-wrap{
  width: min(92vw, 1100px);
  max-height: 78vh;
  display: flex;
  align-items: center;
  justify-content: center;
}

.lis-image-wrap img{
  width: 100%;
  height: auto;
  max-height: 78vh;
  object-fit: contain;
  display: block;
}

/* ===== AR card (intro + feature rail) ===== */
.lis-ar .lis-card__content{
  max-width: none;
  width: 100%;
}

.lis-ar__grid{
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: clamp(22px, 4vw, 56px);
  align-items: start;
}

/* Intro */
.lis-ar__intro h2{
  margin-bottom: 14px;
}

.lis-ar__lead{
  margin: 0;
  font-size: clamp(18px, 1.55vw, 22px);
  line-height: 1.55;
  opacity: .85;
  max-width: 44ch;
}

/* Orb / ring (sobrio, “tech museo”) */
.lis-ar__orb{
  margin-top: clamp(22px, 4vh, 44px);
  width: min(420px, 34vw);
  aspect-ratio: 1 / 1;
  border-radius: 999px;
  position: relative;
  overflow: hidden;
  opacity: .9;
  background:
    radial-gradient(circle at 35% 35%, rgba(255,255,255,.14), rgba(255,255,255,0) 55%),
    radial-gradient(circle at 70% 75%, rgba(255,255,255,.10), rgba(255,255,255,0) 60%);
  border: 1px solid rgba(255,255,255,.12);
}

.lis-ar__orb::before{
  content:"";
  position:absolute;
  inset: 8%;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.12);
}

.lis-ar__orb::after{
  content:"";
  position:absolute;
  inset:-20%;
  background: linear-gradient(120deg, rgba(255,255,255,0), rgba(255,255,255,.10), rgba(255,255,255,0));
  transform: rotate(18deg) translateX(-20%);
  opacity: .7;
}

/* Feature rail */
.lis-ar__features{
  display: grid;
  gap: 14px;
}

.lis-ar__feat{
  border-radius: 22px;
  padding: 18px 18px 16px 18px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
}

.lis-ar__k{
  margin: 0 0 10px 0;
  font-size: 12px;
  letter-spacing: .13em;
  text-transform: uppercase;
  opacity: .78;
}

.lis-ar__v{
  margin: 0;
  font-size: clamp(16px, 1.25vw, 13px)!important;
  line-height: 1.55;
  opacity: .9;
}

/* Mobile */
@media (max-width: 980px){
  .lis-ar__grid{
    grid-template-columns: 1fr;
  }
  .lis-ar__orb{
    width: min(520px, 90vw);
  }
}

/* ===== Accessibilità 360 card ===== */
.lis-acc360 .lis-card__content{
  max-width: none;
  width: 100%;
}

.lis-acc360__grid{
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: clamp(22px, 4vw, 56px);
  align-items: start;
}

.lis-acc360__text p{
  font-size: clamp(17px, 1.35vw, 20px);
  line-height: 1.65;
  max-width: 62ch;
  opacity: .88;
}

/* Side column */
.lis-acc360__side{
  justify-self: end;
  width: min(520px, 40vw);
}
/* Centro verticale colonna sinistra */
/* Centro ottico (Apple-style) */
.lis-acc360__text{
  align-self: center;
  transform: translateY(6vh);
}

/* ===== Radar 360° ===== */
.lis-acc360__radar-wrap{
  width: min(520px, 40vw);
}
@media (min-width: 981px){
  .lis-acc360__text{
    transform: translateY(5vh);
  }
}
.lis-acc360__radar{
  position: relative;
  width: 50%;
  aspect-ratio: 1 / 1;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.14);
  margin-bottom: 18px;
  background:
    radial-gradient(circle at center, rgba(255,255,255,.10), rgba(255,255,255,0) 60%);
}

/* griglie */
.lis-acc360__radar::before{
  content:"";
  position:absolute;
  inset: 14%;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.10);
  box-shadow:
    0 0 0 38px rgba(255,255,255,.04),
    0 0 0 76px rgba(255,255,255,.03);
}

.lis-acc360__radar::after{
  content:"";
  position:absolute;
  inset:0;
  opacity:.18;
}

/* DOT */
.lis-acc360__dot{
  position:absolute;
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.85);
  box-shadow: 0 0 0 6px rgba(255,255,255,.12);
  transition: transform .25s ease, box-shadow .25s ease, background .25s ease;
}

/* posizioni */
.lis-acc360__dot[data-key="lis"]{ left:22%; top:28%; }
.lis-acc360__dot[data-key="audio"]{ left:66%; top:22%; }
.lis-acc360__dot[data-key="ipovisione"]{ left:78%; top:54%; }
.lis-acc360__dot[data-key="mediazione"]{ left:58%; top:78%; }
.lis-acc360__dot[data-key="semplificati"]{ left:30%; top:70%; }
.lis-acc360__dot[data-key="multilingua"]{ left:18%; top:52%; }

/* attivo */
.lis-acc360__dot.is-active{
  transform: scale(1.4);
  background: #fff;
  box-shadow: 0 0 0 10px rgba(255,255,255,.18);
}

/* TAG */
.lis-acc360__tags{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.lis-tag{
  appearance:none;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 999px;
  padding: 10px 14px;
  font-size: 12px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #fff;
  opacity: .85;
  cursor: pointer;
  transition: opacity .2s ease, transform .2s ease, background .2s ease;
}

.lis-tag:hover,
.lis-tag:focus-visible,
.lis-tag.is-active{
  opacity: 1;
  background: rgba(255,255,255,.14);
  transform: translateY(-1px);
  outline: none;
}

/* ===== Valore per il museo ===== */
.lis-museum .lis-card__content{
  max-width: none;
  width: 100%;
}

.lis-museum__grid{
  display: grid;
  grid-template-columns: 0.9fr 1.1fr;
  gap: clamp(22px, 4vw, 60px);
  align-items: center; /* porta tutto “a metà” */
}

/* Intro */
.lis-museum__lead{
  margin: 0 0 16px 0;
  font-size: clamp(18px, 1.55vw, 22px);
  line-height: 1.55;
  opacity: .82;
  max-width: 42ch;
}

.lis-museum__note{
  margin: 0;
  font-size: 14px!important;
  letter-spacing: .012em;
  text-transform: uppercase;
  opacity: .7;
}

/* Blocks */
.lis-museum__blocks{
  display: grid;
  gap: 14px;
}

.lis-museum__block{
  display: grid;
  grid-template-columns: 54px 1fr;
  gap: 14px;
  padding: 18px 18px 16px 18px;
  border-radius: 22px;
  background: rgba(0,0,0,.04);
  border: 1px solid rgba(0,0,0,.08);
}

.lis-museum__idx{
  font-size: 12px;
  letter-spacing: .16em;
  text-transform: uppercase;
  opacity: .55;
  align-self: start;
  padding-top: 2px;
}

.lis-museum__k{
  font-size: 12px;
  letter-spacing: .18em;
  text-transform: uppercase;
  font-weight: 700;
  opacity: .7;
  margin-bottom: 8px;
}

.lis-museum__v{
  font-size: clamp(16px, 1.25vw, 18px);
  line-height: 1.55;
  opacity: .9;
}

/* Mobile */
@media (max-width: 980px){
    .lis-acc360__grid{
        margin-top:-50%;
    }
    .lis-acc360__note {
    font-size: 12px;
    margin-top: 10px;
}
    .lis-acc360__text p {
    font-size: clamp(14px, 1.35vw, 20px);
    }
  .lis-museum__grid{
    grid-template-columns: 1fr;
    align-items: start;
    gap:0;
    margin-top:-20%;
  }
  .lis-museum__block{
    grid-template-columns: 46px 1fr;
  }
}

.lis-museum {
    padding-top: 0;
        margin-top: -60px;
}
.lis-museum__v {
    font-size: clamp(12px, 1.25vw, 18px);
}
/* ===== Valore per i visitatori ===== */
.lis-visitors .lis-card__content{
  max-width: none;
  width: 100%;
}

.lis-visitors__grid{
  display: grid;
  grid-template-columns: 0.9fr 1.1fr;
  gap: clamp(22px, 4vw, 60px);
  align-items: center;
}

.lis-visitors__lead{
  margin: 0;
  font-size: clamp(18px, 1.55vw, 22px);
  line-height: 1.55;
  opacity: .82;
  max-width: 44ch;
}

/* 2x2 layout */
.lis-visitors__list{
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

/* item = tile premium */
.lis-visitors__item{
  border-radius: 22px;
  padding: 18px 18px 16px 18px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
  display: grid;
  grid-template-columns: 54px 1fr;
  gap: 14px;
  position: relative;
}

/* linea superiore curata */
.lis-visitors__item::before{
  content:"";
  position:absolute;
  left: 18px;
  right: 18px;
  top: 14px;
  height: 1px;
  background: rgba(255,255,255,.12);
  opacity: .8;
}

.lis-visitors__idx{
  font-size: 12px;
  letter-spacing: .16em;
  text-transform: uppercase;
  opacity: .55;
  padding-top: 18px; /* spinge sotto la linea */
}

.lis-visitors__body h3{
  margin: 0 0 10px 0;
  padding-top: 10px; /* sotto linea */
  font-size: 12px;
  letter-spacing: .18em;
  text-transform: uppercase;
  font-weight: 700;
  opacity: .85;
}

.lis-visitors__body p{
  margin: 0;
  font-size: clamp(16px, 1.25vw, 18px);
  line-height: 1.55;
  opacity: .86;
  max-width: 52ch;
}

/* Mobile */
@media (max-width: 980px){
    .lis-visitors__grid {
    margin-top: -30%;
    grid-template-columns: 1fr;
    align-items: start;
  }
  .lis-visitors__list{
    grid-template-columns: 1fr;
  }
  .lis-visitors__item{
    grid-template-columns: 46px 1fr;
  }

  .lis-visitors__body p{
     font-size: clamp(12px, 1.25vw, 18px);
  }
}

/* =========================
   CARD: Dove è attivabile
   ========================= */

/* alza la composizione e riempi meglio */
.lis-card:has(h2:where(:contains("Dove è attivabile"))) .lis-card__content{
  padding-top: clamp(10px, 3vh, 24px);
}

/* fallback (Safari senza :has) -> usa una classe se preferisci */
.lis-card.lis-where .lis-card__content{
  padding-top: clamp(10px, 3vh, 24px);
}

/* titolo: un filo più “importante” */
.lis-card.lis-where h2{
  margin-bottom: 26px;
}

/* griglia: più vicina al titolo, più “piena” */
.lis-card.lis-where .lis-grid{
  margin-top: 10px;
  gap: 22px;
}

/* tile premium */
.lis-card.lis-where .lis-tile{
  background: rgba(255,255,255,.78);
  border: 1px solid rgba(0,0,0,.10);
  box-shadow:
    0 18px 55px rgba(0,0,0,.08),
    inset 0 1px 0 rgba(255,255,255,.65);
  padding: 22px 22px 20px 22px;
  position: relative;
  overflow: hidden;
}

/* numerino in alto a sinistra (01/02/03) */
.lis-card.lis-where .lis-tile::before{
  content: attr(data-n);
  position: absolute;
  top: 14px;
  left: 16px;
  font-size: 12px;
  letter-spacing: .12em;
  opacity: .35;
}

/* intestazione tile: più compatta e leggibile */
.lis-card.lis-where .lis-tile h3{
  margin-top: 18px; /* lascia spazio al numerino */
  margin-bottom: 10px;
  font-size: 13px;
  letter-spacing: .10em;
}

/* testo tile un pelo più grande */
.lis-card.lis-where .lis-tile p{
  font-size: 16px;
  line-height: 1.55;
  opacity: .86;
}

/* micro highlight diagonale (premium) */
.lis-card.lis-where .lis-tile::after{
  content: "";
  position: absolute;
  inset: -30%;
  background: linear-gradient(
    90deg,
    rgba(0,0,0,0) 0%,
    rgba(0,0,0,.03) 40%,
    rgba(0,0,0,.06) 50%,
    rgba(0,0,0,.03) 60%,
    rgba(0,0,0,0) 100%
  );
  transform: translateX(-35%) rotate(12deg);
  opacity: 0;
  transition: opacity .45s var(--ease), transform .65s var(--ease);
  pointer-events: none;
}

.lis-card.lis-where .lis-tile:hover{
  transform: translateY(-8px);
  box-shadow:
    0 26px 70px rgba(0,0,0,.12),
    inset 0 1px 0 rgba(255,255,255,.70);
}

.lis-card.lis-where .lis-tile:hover::after{
  opacity: 1;
  transform: translateX(10%) rotate(12deg);
}

/* mobile: più “pieno”, meno aria morta */
@media (max-width: 980px){
  .lis-card.lis-where h2{ margin-bottom: 18px; }
  .lis-card.lis-where .lis-grid{ gap: 14px; }
  .lis-card.lis-where .lis-tile{ padding: 18px 18px 16px 18px; }
}
.lis-card.lis-where .lis-card__content{
    margin-top:-30%;
}
.lis-card.lis-where .lis-tile p {
    font-size: 12px;
}
/* =========================
   CARD: Deliverables line
   ========================= */

.lis-card.lis-deliverables .lis-card__content{
  max-width: 1200px;
}

.lis-card.lis-deliverables h2{
  margin-bottom: 28px;
}

/* wrapper steps */
.lis-steps{
  position: relative;
  margin-top: 10px;
  padding-top: 14px;
}

/* linea orizzontale */
.lis-steps__line{
  position: absolute;
  left: 0;
  right: 0;
  top: 34px;                 /* allineata ai dot */
  height: 1px;
  background: rgba(255,255,255,.14);
}

/* layout 3 colonne */
.lis-step{
  position: relative;
  display: grid;
  grid-template-rows: auto 1fr;
  gap: 10px;
}

/* grid responsiva */
.lis-steps{
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: clamp(18px, 3vw, 34px);
  align-items: start;
}
.lis-steps--4{
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: clamp(28px, 5vw, 56px);
}
.lis-steps--4 .lis-step{
  min-width: 0;
  padding-right: clamp(8px, 1.5vw, 20px);
}
.lis-steps--4 .lis-step:last-child{
  padding-right: 0;
}
.lis-steps--4 .lis-step__text{
  max-width: 36ch;
  line-height: 1.72;
  margin-top: 8px;
}

/* Scroll 2+2 fasi (index) */
.lis-deliverables--scroll .lis-steps-scroll{
  display: flex;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  gap: 0;
  margin-top: 20px;
  padding-bottom: 12px;
}
.lis-deliverables--scroll .lis-steps-scroll::-webkit-scrollbar{
  height: 8px;
}
.lis-deliverables--scroll .lis-steps-scroll::-webkit-scrollbar-track{
  background: rgba(255,255,255,.08);
  border-radius: 4px;
}
.lis-deliverables--scroll .lis-steps-scroll::-webkit-scrollbar-thumb{
  background: rgba(255,255,255,.25);
  border-radius: 4px;
}
.lis-steps-scroll__slide{
  flex: 0 0 100%;
  scroll-snap-align: start;
  scroll-snap-stop: always;
  min-width: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(32px, 5vw, 56px);
  padding: 0 clamp(4px, 1vw, 12px) 0 0;
  align-content: start;
}
.lis-deliverables--scroll .lis-steps-scroll .lis-step{
  min-width: 0;
}
.lis-deliverables--scroll .lis-steps-scroll .lis-step__text{
  max-width: 38ch;
  line-height: 1.72;
  margin-top: 8px;
}
.lis-steps-scroll__hint{
  margin: 28px 0 0 0;
  text-align: center;
  transition: opacity .35s ease, transform .35s ease;
}
.lis-steps-scroll__hint.is-hidden{
  opacity: 0;
  pointer-events: none;
  transform: translateY(-6px);
}
.lis-steps-scroll__btn{
  appearance: none;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.25);
  border-radius: 999px;
  padding: 12px 24px;
  font: inherit;
  font-size: 13px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #fff;
  cursor: pointer;
  transition: background .25s ease, transform .25s ease;
}
.lis-steps-scroll__btn:hover{
  background: rgba(255,255,255,.2);
  transform: translateY(-2px);
}
@media (max-width: 980px){
  .lis-steps-scroll__slide{
    grid-template-columns: 1fr;
    gap: 36px;
    align-items: start;
  }
  /* La card non taglia il contenuto: altezza automatica così le due schede restano leggibili */
  .lis-card.lis-deliverables.lis-deliverables--scroll{
    height: auto;
    min-height: 100vh;
    overflow: visible;
    align-items: flex-start;
  }
  /* Ogni scheda (step) ha altezza in base al contenuto, niente 1fr che schiaccia */
  .lis-deliverables--scroll .lis-steps-scroll .lis-step{
    grid-template-rows: auto auto;
    gap: 14px;
    padding-bottom: 8px;
  }
  .lis-deliverables--scroll .lis-steps-scroll .lis-step__text{
    margin-top: 0;
  }
  /* Più aria e testo leggermente più piccolo su mobile */
  .lis-card.lis-deliverables.lis-deliverables--scroll h2{
    margin-bottom: 24px;
  }
  .lis-deliverables--scroll .lis-steps-scroll{
    margin-top: 28px;
    padding-bottom: 16px;
    overflow-x: auto;
    overflow-y: visible;
  }
  .lis-deliverables--scroll .lis-steps-scroll .lis-step__head{
    min-height: 44px;
  }
  .lis-deliverables--scroll .lis-steps-scroll .lis-step__title h3,
  .lis-deliverables--scroll .lis-steps-scroll .lis-step h3{
    font-size: 12px;
    letter-spacing: .12em;
  }
  .lis-deliverables--scroll .lis-steps-scroll .lis-step__text{
    font-size: 14px;
    line-height: 1.65;
    max-width: none;
  }
  .lis-deliverables--scroll .lis-steps-scroll .lis-step__kicker{
    font-size: 12px;
  }
}

/* head */
.lis-step__head{
  display: grid;
  grid-template-columns: 18px 1fr;
  column-gap: 14px;
  align-items: center;
  min-height: 56px;
}

/* dot */
.lis-step__dot{
  width: 12px;
  height: 12px;
  border-radius: 999px;
  background: rgba(255,255,255,.92);
  box-shadow: 0 0 0 6px rgba(255,255,255,.08);
}

/* number label */
.lis-step::before{
  content: attr(data-n);
  position: absolute;
  top: -2px;
  left: 0;
  transform: translateX(-2px);
  font-size: 12px;
  letter-spacing: .18em;
  opacity: .35;
}

/* titles */
.lis-step h3{
  margin: 0 0 2px 0;
  font-size: 13px;
  letter-spacing: .14em;
  text-transform: uppercase;
  font-weight: 800;
}

.lis-step__kicker{
  margin: 0;
  font-size: 13px;
  opacity: .66;
  font-style: italic;
}

/* text */
.lis-step__text{
  margin: 0;
  font-size: clamp(16px, 1.25vw, 18px);
  line-height: 1.65;
  opacity: .90;
  max-width: 44ch;
}

/* note */
p.lis-steps__note{
  margin-top: 42px;
  font-size: 14px;
  opacity: .62;
}

/* mobile */
@media (max-width: 980px){
  .lis-steps{
    grid-template-columns: 1fr;
    gap: 18px;
  }
  .lis-steps__line{
    left: 6px;
    right: auto;
    top: 26px;
    width: 1px;
    height: calc(100% - 26px);
    background: rgba(255,255,255,.14);
  }
  .lis-step__head{
    grid-template-columns: 18px 1fr;
  }
  .lis-step::before{
    top: -6px;
  }
}

/* ===========================
   CARD AR: layout + mobile fix
   =========================== */

.lis-card.lis-ar .lis-card__content{
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: clamp(20px, 4vw, 56px);
  align-items: start;
}

.lis-card.lis-ar .lis-ar__left h2{
  margin-bottom: 14px;
}

.lis-card.lis-ar .lis-ar__left p{
  max-width: 52ch;
}

.lis-card.lis-ar .lis-ar__right{
  display: grid;
  gap: 26px;
  align-content: start;
}

.lis-card.lis-ar .lis-ar__item h3{
  display: inline-block;
  margin: 0 0 10px 0;
  font-size: 14px;
  letter-spacing: .12em;
  text-transform: uppercase;
  font-weight: 750;
  position: relative;
  padding-bottom: 10px;
}

/* underline “premium” sotto i mini-titoli */
.lis-card.lis-ar .lis-ar__item h3::after{
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  height: 7px;
  width: 100%;
  border-radius: 999px;
  background: rgba(0,0,0,.12);
}

/* MOBILE: stack, niente “vuoto” gigante, allineamento top */
@media (max-width: 860px){
.lis-ar__orb{display: none;}
  .lis-card.lis-ar{
    align-items: flex-start;              /* niente centratura verticale */
    padding-top: 64px;                    /* respiro sopra */
    padding-bottom: 56px;
  }

  .lis-card.lis-ar .lis-card__content{
    grid-template-columns: 1fr;
    gap: 28px;
  }

  .lis-card.lis-ar .lis-ar__right{
    gap: 22px;
  }

  .lis-card.lis-ar .lis-ar__item p{
    max-width: 60ch;
  }
}
/* ===========================
   CONTACT + FOOTER (single final card)
   =========================== */

.lis-card.lis-contact{
  background: var(--white);
  color: var(--black);
  overflow: hidden;
}

/* layout generale: due blocchi affiancati */
.lis-card.lis-contact{
  position: sticky;
  top: 0;
}

/* dentro la card: due "content" su griglia */
.lis-card.lis-contact{
  display: flex;
  align-items: center;
  justify-content: center;
  padding: clamp(28px, 6vw, 88px);
}

.lis-card.lis-contact > .lis-contact__content,
.lis-card.lis-contact > .lis-footer__content{
  width: 100%;
  max-width: none;          /* la griglia la gestiamo noi */
}

/* griglia wrapper: usiamo il fatto che hai due .lis-card__content */
.lis-card.lis-contact{
  /* grid interno simulato: mettiamo i due blocchi in una grid con gap */
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  column-gap: clamp(26px, 5vw, 90px);
  align-items: center;
}

/* limita il “corpo” totale per non allargare troppo su schermi enormi */
.lis-card.lis-contact > .lis-contact__content,
.lis-card.lis-contact > .lis-footer__content{
  max-width: 1200px;
}

/* ma siccome sono due colonne, ognuna deve poter restringersi */
.lis-card.lis-contact > .lis-contact__content,
.lis-card.lis-contact > .lis-footer__content{
  min-width: 0;
  justify-self: stretch;
}

/* ---------------------------
   CONTACT side
--------------------------- */

.lis-contact__content{
  position: relative;
  padding: clamp(10px, 1vh, 22px) 0;
}

/* background soft */
.lis-contact__bg{
  position: absolute;
  inset: -55%;
  pointer-events: none;
  z-index: 0;
  background:
    radial-gradient(closest-side at 72% 42%, rgba(0,0,0,.07), rgba(0,0,0,0) 58%),
    radial-gradient(closest-side at 26% 70%, rgba(0,0,0,.05), rgba(0,0,0,0) 60%),
    radial-gradient(closest-side at 55% 115%, rgba(0,0,0,.05), rgba(0,0,0,0) 48%);
}

/* layer sopra bg */
.lis-contact__content > *{
  position: relative;
  z-index: 1;
}

.lis-contact__head{
  max-width: 56ch;
}

.lis-contact__title{
  margin: 0 0 10px 0;
  font-size: clamp(44px, 5.2vw, 82px);
  line-height: 1.02;
  letter-spacing: -0.05em;
  font-weight: 600;
}

.lis-contact__lead{
  margin: 0;
  font-size: clamp(16px, 1.35vw, 18px);
  line-height: 1.65;
  opacity: .82;
  max-width: 52ch;
}

.lis-contact__cta{
  margin-top: clamp(16px, 3vh, 26px);
}

.lis-contact__kicker{
  font-size: 12px;
  letter-spacing: .18em;
  text-transform: uppercase;
  opacity: .6;
  margin-bottom: 12px;
}

/* mail "hero" */
.lis-contact__email,
.lis-contact__email:visited{
  color: var(--black);
}

.lis-contact__email{
  display: inline-block;
  text-decoration: none;
  font-weight: 650;
  letter-spacing: -0.01em;
  font-size: clamp(22px, 3.2vw, 46px);
  line-height: 1.05;
  padding-bottom: 8px;
  background-image: linear-gradient(currentColor, currentColor);
  background-size: 0% 2px;
  background-repeat: no-repeat;
  background-position: 0% 100%;
  transition: background-size .28s ease, transform .2s ease, opacity .2s ease;
}

.lis-contact__email:hover{
  background-size: 100% 2px;
  transform: translateY(-1px);
}

.lis-contact__email:focus-visible{
  outline: none;
  background-size: 100% 2px;
}
/* ===========================
   AR CARD — grid stabile (2 colonne) + gap controllato
   =========================== */

.lis-card.lis-ar .lis-card__content{
  max-width: none !important;
  width: 100% !important;
}
.lis-card__content{
    margin-top:-20%;
}

.lis-card.lis-ar .lis-ar__grid{
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 0fr);
  column-gap: clamp(24px, 3vw, 48px);
  row-gap: clamp(18px, 3vh, 32px);
  align-items: start;
}

/* assicurati che le due colonne “riempiano” */
.lis-card.lis-ar .lis-ar__intro,
.lis-card.lis-ar .lis-ar__features{
  min-width: 0;
  width: 100%;
  justify-self: stretch;
}

/* tipografia: evita righe troppo lunghe a sinistra */
.lis-card.lis-ar .lis-ar__intro .lis-ar__lead{
  max-width: 46ch;
}

/* MOBILE: stack pulito */
@media (max-width: 860px){
  .lis-card.lis-ar{
    align-items: flex-start;
    padding-top: 64px;
    padding-bottom: 56px;
  }

  .lis-card.lis-ar .lis-ar__grid{
    grid-template-columns: 1fr;
    column-gap: 0;
  }

  .lis-ar__orb{ display: none; }
}
/* ---------------------------
   FOOTER side
--------------------------- */

.lis-footer__content{
  padding: clamp(10px, 1vh, 22px) 0;
}

.lis-footer__top{
  display: grid;
  gap: 18px;
}

/* “pannello” elegante, per differenziare dal lato contatti */
.lis-footer__top{
  border: 1px solid rgba(0,0,0,.10);
  border-radius: 24px;
  background: rgba(0,0,0,.03);
  box-shadow: 0 18px 55px rgba(0,0,0,.06);
  padding: clamp(18px, 2.2vw, 28px);
}

.lis-footer__kicker{
  font-size: 12px;
  letter-spacing: .18em;
  text-transform: uppercase;
  opacity: .58;
  margin-bottom: 8px;
}

.lis-footer__name{
  font-size: 18px;
  line-height: 1.35;
  letter-spacing: -0.01em;
}

.lis-footer__piva{
  margin-top: 6px;
  font-size: 13px;
  opacity: .7;
}

.lis-footer__cols{
  margin-top: 14px;
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 18px;
}

.lis-footer__label{
  font-size: 12px;
  letter-spacing: .16em;
  text-transform: uppercase;
  opacity: .6;
  margin-bottom: 10px;
}

.lis-footer__text{
  font-size: 15px;
  line-height: 1.6;
  opacity: .88;
}

/* link list */
.lis-footer__links{
  display: grid;
  gap: 10px;
}

.lis-footer__link,
.lis-footer__link:visited{
  color: var(--black);
  text-decoration: none;
  font-size: 15px;
  opacity: .9;
  transition: opacity .2s ease, transform .2s ease;
}

.lis-footer__link:hover{
  opacity: 1;
  transform: translateX(2px);
}

/* bottom */
.lis-footer__bottom{
  margin-top: 14px;
}

.lis-footer__fineprint{
  font-size: 12px;
  opacity: .55;
  line-height: 1.5;
}

/* ---------------------------
   RESPONSIVE
--------------------------- */

@media (max-width: 980px){
  .lis-card.lis-contact{
    grid-template-columns: 1fr;
    row-gap: 22px;
    align-items: start;
  }

  .lis-contact__title{
    font-size: clamp(38px, 9vw, 56px);
  }

  .lis-footer__cols{
    grid-template-columns: 1fr;
  }
}

/* se vuoi che questa sia l’ultima e non “sticky” (opzionale) */
/*
.lis-card.lis-contact{
  position: relative;
  height: auto;
  min-height: 100vh;
}
*/

/* =========================
   CHI SIAMO – sezioni About, Vision, Chi sviluppa, Ambiti
   ========================= */

.lis-section-head {
  margin-bottom: clamp(16px, 2.5vh, 24px);
}

.lis-section-head__icon {
  display: block;
  width: 48px;
  height: 48px;
  margin-bottom: 14px;
  color: var(--black);
  opacity: 0.85;
}

.lis-section-head__icon svg {
  width: 100%;
  height: 100%;
  display: block;
}

.lis-section-head__icon--light {
  color: var(--white);
  opacity: 0.9;
}

.lis-section-head h2 {
  margin: 0 0 4px 0;
}

.lis-section-head__sub {
  margin: 0 0 18px 0;
  font-size: clamp(15px, 1.2vw, 18px);
  font-style: italic;
  opacity: 0.82;
}

/* About: logo visibile a destra */
.lis-about .lis-hero__logo,
.lis-about__logo {
  width: min(320px, 28vw);
  max-width: 100%;
  height: auto;
  opacity: 0.5;
  filter: drop-shadow(0 16px 40px rgba(0,0,0,.1));
}

@media (max-width: 980px) {
  .lis-about .lis-hero__logo,
  .lis-about__logo {
    width: min(220px, 55vw);
    opacity: 0.7;
  }
}

/* Vision: card scura + illustrazione telefono */
.lis-vision .lis-split-media__grid {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: clamp(22px, 4vw, 56px);
  align-items: center;
}

.lis-vision__illus {
  justify-self: end;
  width: min(200px, 22vw);
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  box-shadow: none;
}

.lis-vision__illus::after {
  display: none;
}

.lis-vision__phone {
  width: 100%;
  max-width: 180px;
  height: auto;
  color: rgba(255,255,255,.85);
}

@media (max-width: 980px) {
  .lis-vision .lis-split-media__grid {
    grid-template-columns: 1fr;
  }
  .lis-vision__illus {
    width: min(160px, 50vw);
    justify-self: start;
    margin-top: 18px;
  }
}

/* Chi sviluppa: placeholder banner clienti */
.lis-chisviluppa .lis-split-media__grid {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: clamp(22px, 4vw, 56px);
  align-items: center;
}

.lis-chisviluppa__banner {
  min-height: 220px;
  border-radius: var(--radius);
  background: rgba(0,0,0,.06);
  border: 1px solid rgba(0,0,0,.10);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}

.lis-chisviluppa__placeholder {
  margin: 0;
  font-size: clamp(14px, 1.1vw, 16px);
  opacity: 0.6;
  text-align: center;
}

@media (max-width: 980px) {
  .lis-chisviluppa .lis-split-media__grid {
    grid-template-columns: 1fr;
  }
  .lis-chisviluppa__banner {
    min-height: 160px;
    margin-top: 18px;
  }
}

/* =========================
   AMBITI — LEFT + ANIM FX
   ========================= */

   .lis-card.lis-ambiti{
    background: var(--white);
    color: var(--black);
  }
  
  /* fondo soft per evitare bianco piatto */
  .lis-card.lis-ambiti::before{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    z-index:0;
    background:
      radial-gradient(900px 520px at 18% 30%, rgba(3,43,60,.08), rgba(3,43,60,0) 62%),
      radial-gradient(700px 420px at 82% 70%, rgba(3,43,60,.06), rgba(3,43,60,0) 60%),
      linear-gradient(180deg, rgba(3,43,60,.03), rgba(3,43,60,0) 45%);
  }
  
  .lis-card.lis-ambiti .lis-card__content{
    position: relative;
    z-index: 1;
    max-width: 1100px;
    margin-inline: auto;
  
    /* riempie meglio la 100vh sticky */
    padding-top: clamp(26px, 9vh, 110px);
    padding-bottom: clamp(22px, 8vh, 90px);
  }
  
  /* header a sinistra (coerente con le altre) */
  .lis-ambiti__head{
    text-align: left;
    max-width: 62ch;
    margin-bottom: clamp(18px, 4vh, 40px);
  }
  
  .lis-ambiti__title{
    margin: 0 0 10px 0;
    font-size: clamp(44px, 6vw, 86px);
    letter-spacing: -0.05em;
    line-height: 1.02;
  }
  
  .lis-ambiti__sub{
    margin: 0;
    font-size: clamp(15px, 1.25vw, 18px);
    font-style: italic;
    opacity: .78;
  }
  
  /* griglia */
  .lis-card.lis-ambiti .lis-ambiti__grid{
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(12px, 2vw, 18px);
    max-width: 980px;
  }
  
  /* tile: card vere */
  .lis-card.lis-ambiti .lis-ambiti__tile{
    position: relative;
    border-radius: 18px;
    padding: clamp(18px, 2.2vw, 26px);
    background: rgba(3,43,60,.04);
    border: 1px solid rgba(3,43,60,.10);
    box-shadow:
      0 14px 40px rgba(0,0,0,.05),
      inset 0 1px 0 rgba(255,255,255,.92);
    transition: transform .55s var(--ease), box-shadow .55s var(--ease), background .25s ease, border-color .25s ease;
    overflow: hidden;
  }
  
  /* label */
  .lis-ambiti__k{
    display: inline-block;
    font-weight: 700;
    letter-spacing: .01em;
    font-size: clamp(16px, 1.25vw, 18px);
  }
  
  /* micro highlight diagonale */
  .lis-card.lis-ambiti .lis-ambiti__tile::after{
    content:"";
    position:absolute;
    inset:-40%;
    background: linear-gradient(
      90deg,
      rgba(3,43,60,0) 0%,
      rgba(3,43,60,.05) 40%,
      rgba(3,43,60,.10) 50%,
      rgba(3,43,60,.05) 60%,
      rgba(3,43,60,0) 100%
    );
    transform: translateX(-35%) rotate(12deg);
    opacity: 0;
    transition: opacity .45s var(--ease), transform .65s var(--ease);
    pointer-events:none;
  }
  
  /* hover */
  .lis-card.lis-ambiti .lis-ambiti__tile:hover{
    transform: translateY(-8px);
    background: rgba(3,43,60,.06);
    border-color: rgba(3,43,60,.14);
    box-shadow:
      0 26px 70px rgba(0,0,0,.10),
      inset 0 1px 0 rgba(255,255,255,.95);
  }
  .lis-card.lis-ambiti .lis-ambiti__tile:hover::after{
    opacity: 1;
    transform: translateX(10%) rotate(12deg);
  }
  
  /* ===== reveal animation (JS aggiunge .is-inview) ===== */
  .lis-card.lis-ambiti .lis-ambiti__tile{
    opacity: 0;
    transform: translateY(14px);
  }
  .lis-card.lis-ambiti.is-inview .lis-ambiti__tile{
    opacity: 1;
    transform: translateY(0);
    transition:
      transform .9s var(--ease),
      opacity .9s var(--ease),
      box-shadow .55s var(--ease),
      background .25s ease,
      border-color .25s ease;
  }
  .lis-card.lis-ambiti.is-inview .lis-ambiti__tile:nth-child(1){ transition-delay: .02s; }
  .lis-card.lis-ambiti.is-inview .lis-ambiti__tile:nth-child(2){ transition-delay: .06s; }
  .lis-card.lis-ambiti.is-inview .lis-ambiti__tile:nth-child(3){ transition-delay: .10s; }
  .lis-card.lis-ambiti.is-inview .lis-ambiti__tile:nth-child(4){ transition-delay: .14s; }
  .lis-card.lis-ambiti.is-inview .lis-ambiti__tile:nth-child(5){ transition-delay: .18s; }
  .lis-card.lis-ambiti.is-inview .lis-ambiti__tile:nth-child(6){ transition-delay: .22s; }
  
  /* ===== FX overlay ===== */
  .lis-ambiti__fx{
    position:absolute;
    inset:0;
    pointer-events:none;
    z-index:0;
    overflow:hidden;
  }
  
  /* blob che segue il mouse (via CSS vars) */
  .lis-ambiti__blob{
    position:absolute;
    width: 520px;
    height: 520px;
    border-radius: 999px;
    left: calc(var(--fx-x, 55%) - 260px);
    top:  calc(var(--fx-y, 55%) - 260px);
    background:
      radial-gradient(circle at 30% 30%, rgba(3,43,60,.12), rgba(3,43,60,0) 60%),
      radial-gradient(circle at 70% 70%, rgba(3,43,60,.10), rgba(3,43,60,0) 62%);
    filter: blur(18px);
    opacity: .9;
    transform: translate3d(0,0,0);
    transition: left .25s var(--ease), top .25s var(--ease);
  }
  
  /* ring lento, molto soft */
  .lis-ambiti__ring{
    position:absolute;
    width: 640px;
    height: 640px;
    border-radius: 999px;
    left: 60%;
    top: 55%;
    transform: translate(-50%, -50%);
    border: 1px solid rgba(3,43,60,.10);
    box-shadow: 0 0 0 40px rgba(3,43,60,.03);
    opacity: .8;
    animation: ambitiRing 6.5s var(--ease) infinite;
  }
  
  @keyframes ambitiRing{
    0%   { transform: translate(-50%,-50%) scale(1); opacity:.55; }
    50%  { transform: translate(-50%,-50%) scale(1.05); opacity:.85; }
    100% { transform: translate(-50%,-50%) scale(1); opacity:.55; }
  }
  
  /* grana leggerissima */
  .lis-ambiti__grain{
    position:absolute;
    inset:-30%;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.18'/%3E%3C/svg%3E");
    opacity: .06;
    mix-blend-mode: multiply;
    transform: rotate(6deg);
  }
  
  /* mobile */
  @media (max-width: 980px){
    .lis-card.lis-ambiti .lis-ambiti__grid{
      grid-template-columns: 1fr;
    }
    .lis-ambiti__blob{
      width: 420px;
      height: 420px;
      left: calc(var(--fx-x, 55%) - 210px);
      top:  calc(var(--fx-y, 55%) - 210px);
    }
    .lis-ambiti__ring{
      width: 520px;
      height: 520px;
      left: 70%;
      top: 60%;
    }
  }
  
  /* riduzione motion */
  @media (prefers-reduced-motion: reduce){
    .lis-ambiti__ring{ animation: none !important; }
    .lis-ambiti__blob{ transition: none !important; }
    .lis-card.lis-ambiti .lis-ambiti__tile{
      opacity: 1 !important;
      transform: none !important;
      transition: none !important;
    }
  }

  /* Ambiti: assicurati che content stia sopra */
.lis-card.lis-ambiti .lis-card__content{
  position: relative;
  z-index: 2;
}

/* FX overlay a tutta card */
.lis-card.lis-ambiti .lis-ambiti__fx{
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 1;
  overflow: hidden; /* ok: contenuto resta dentro la card */
}

/* blob segue il mouse (via --fx-x/--fx-y) */
.lis-card.lis-ambiti .lis-ambiti__blob{
  position:absolute;
  width: 520px;
  height: 520px;
  border-radius: 999px;
  left: calc(var(--fx-x, 60%) - 260px);
  top:  calc(var(--fx-y, 55%) - 260px);
  background:
    radial-gradient(circle at 30% 30%, rgba(3,43,60,.12), rgba(3,43,60,0) 60%),
    radial-gradient(circle at 70% 70%, rgba(3,43,60,.10), rgba(3,43,60,0) 62%);
  filter: blur(18px);
  opacity: .9;
  transition: left .25s var(--ease), top .25s var(--ease);
}

/* ring morbido (non più tagliato) */
.lis-card.lis-ambiti .lis-ambiti__ring{
  position:absolute;
  width: 720px;
  height: 720px;
  border-radius: 999px;
  left: 68%;
  top: 55%;
  transform: translate(-50%, -50%);
  border: 1px solid rgba(3,43,60,.10);
  box-shadow: 0 0 0 44px rgba(3,43,60,.03);
  opacity: .75;
  animation: ambitiRing 6.5s var(--ease) infinite;
}

@keyframes ambitiRing{
  0%   { transform: translate(-50%,-50%) scale(1); opacity:.55; }
  50%  { transform: translate(-50%,-50%) scale(1.05); opacity:.85; }
  100% { transform: translate(-50%,-50%) scale(1); opacity:.55; }
}

/* grain */
.lis-card.lis-ambiti .lis-ambiti__grain{
  position:absolute;
  inset:-30%;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.18'/%3E%3C/svg%3E");
  opacity: .06;
  mix-blend-mode: multiply;
  transform: rotate(6deg);
}

/* mobile */
@media (max-width: 980px){
  .lis-card.lis-ambiti .lis-ambiti__blob{
    width: 420px;
    height: 420px;
    left: calc(var(--fx-x, 60%) - 210px);
    top:  calc(var(--fx-y, 55%) - 210px);
  }
  .lis-card.lis-ambiti .lis-ambiti__ring{
    width: 560px;
    height: 560px;
    left: 72%;
    top: 60%;
  }
}

/* reduce motion */
@media (prefers-reduced-motion: reduce){
  .lis-card.lis-ambiti .lis-ambiti__ring{ animation: none !important; }
  .lis-card.lis-ambiti .lis-ambiti__blob{ transition: none !important; }
}

/* =========================
   AMBITI — NEO CHIPS (innovative)
   ========================= */

   .lis-card.lis-ambiti .lis-card__content{
    position: relative;
    z-index: 2;
  }
  
  /* griglia: più “design” */
  .lis-ambiti__grid--neo{
    --chip-bg: rgba(3,43,60,.035);
    --chip-br: rgba(3,43,60,.14);
    --chip-hi: rgba(3,43,60,.22);
  
    margin-top: clamp(18px, 4vh, 34px);
    max-width: 1040px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: clamp(12px, 2vw, 18px);
  }
  
  /* chip: non pill, ma “label tech” */
  .lis-ambiti__chip{
    position: relative;
    border-radius: 20px;
    padding: 18px 18px 16px 18px;
    background: var(--chip-bg);
    border: 1px solid var(--chip-br);
    box-shadow:
      0 18px 55px rgba(0,0,0,.06),
      inset 0 1px 0 rgba(255,255,255,.85);
    display: grid;
    grid-template-columns: 44px 1fr;
    column-gap: 14px;
    align-items: start;
    overflow: hidden;
    transform: translateZ(0);
    cursor: default;
    transition: transform .6s var(--ease), box-shadow .6s var(--ease), border-color .25s ease, background .25s ease;
  }
  
  /* “circuit border”: doppio bordo interno */
  .lis-ambiti__chip::before{
    content:"";
    position:absolute;
    inset: 10px;
    border-radius: 14px;
    border: 1px solid rgba(3,43,60,.10);
    opacity: .55;
    pointer-events:none;
  }
  
  /* traccia luminosa che corre (solo hover/focus) */
  .lis-ambiti__chip::after{
    content:"";
    position:absolute;
    inset:-50%;
    background: conic-gradient(
      from 180deg,
      rgba(3,43,60,0) 0deg,
      rgba(3,43,60,.10) 40deg,
      rgba(3,43,60,.18) 70deg,
      rgba(3,43,60,0) 120deg,
      rgba(3,43,60,0) 360deg
    );
    opacity: 0;
    transform: translate3d(-20%, -20%, 0) rotate(18deg);
    transition: opacity .35s var(--ease), transform .8s var(--ease);
    pointer-events:none;
  }
  
  /* icona: “stampata” ma elegante */
  .lis-ambiti__icon{
    width: 38px;
    height: 38px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    background: rgba(255,255,255,.55);
    border: 1px solid rgba(3,43,60,.10);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.85);
  }
  
  .lis-ambiti__icon svg{
    width: 20px;
    height: 20px;
    opacity: .85;
  }
  
  /* testo */
  .lis-ambiti__label{
    font-weight: 780;
    letter-spacing: -0.01em;
    font-size: clamp(16px, 1.25vw, 18px);
    line-height: 1.2;
    margin: 2px 0 8px 0;
  }
  
  .lis-ambiti__desc{
    font-size: clamp(13px, 1.05vw, 15px);
    line-height: 1.55;
    opacity: .78;
    max-width: 44ch;
  }
  
  /* hover/focus: “lift” + glow sobrio */
  .lis-ambiti__chip:hover,
  .lis-ambiti__chip:focus-visible{
    transform: translateY(-8px);
    background: rgba(3,43,60,.045);
    border-color: var(--chip-hi);
    box-shadow:
      0 28px 80px rgba(0,0,0,.12),
      inset 0 1px 0 rgba(255,255,255,.92);
    outline: none;
  }
  .lis-ambiti__chip:hover::after,
  .lis-ambiti__chip:focus-visible::after{
    opacity: .85;
    transform: translate3d(10%, 12%, 0) rotate(18deg);
  }
  
  /* micro linea animata sotto la label */
  .lis-ambiti__label{
    position: relative;
    display: inline-block;
  }
  .lis-ambiti__label::after{
    content:"";
    position:absolute;
    left: 0;
    bottom: -8px;
    width: 0%;
    height: 2px;
    border-radius: 999px;
    background: rgba(3,43,60,.22);
    transition: width .6s var(--ease);
  }
  .lis-ambiti__chip:hover .lis-ambiti__label::after,
  .lis-ambiti__chip:focus-visible .lis-ambiti__label::after{
    width: 100%;
  }
  
  /* reveal on view */
  .lis-ambiti__chip{
    opacity: 0;
    transform: translateY(18px);
  }
  .lis-card.lis-ambiti.is-inview .lis-ambiti__chip{
    opacity: 1;
    transform: translateY(0);
    transition:
      transform .95s var(--ease),
      opacity .95s var(--ease),
      box-shadow .6s var(--ease),
      border-color .25s ease,
      background .25s ease;
  }
  .lis-card.lis-ambiti.is-inview .lis-ambiti__chip:nth-child(1){ transition-delay: .03s; }
  .lis-card.lis-ambiti.is-inview .lis-ambiti__chip:nth-child(2){ transition-delay: .07s; }
  .lis-card.lis-ambiti.is-inview .lis-ambiti__chip:nth-child(3){ transition-delay: .11s; }
  .lis-card.lis-ambiti.is-inview .lis-ambiti__chip:nth-child(4){ transition-delay: .15s; }
  .lis-card.lis-ambiti.is-inview .lis-ambiti__chip:nth-child(5){ transition-delay: .19s; }
  .lis-card.lis-ambiti.is-inview .lis-ambiti__chip:nth-child(6){ transition-delay: .23s; }
  
  /* scanner line dietro la griglia */
  .lis-ambiti__scanner{
    position:absolute;
    left: -10%;
    right: -10%;
    top: calc(50% + 40px);
    height: 1px;
    background: linear-gradient(90deg, rgba(3,43,60,0), rgba(3,43,60,.18), rgba(3,43,60,0));
    opacity: .35;
    filter: blur(.2px);
    transform: translateY(0);
    animation: ambitiScan 7.5s var(--ease) infinite;
    z-index: 1;
    pointer-events:none;
  }
  
  @keyframes ambitiScan{
    0%   { transform: translateY(-120px); opacity: .12; }
    45%  { opacity: .38; }
    100% { transform: translateY(140px); opacity: .12; }
  }
  
  /* responsive */
  @media (max-width: 980px){
    .lis-ambiti__grid--neo{ grid-template-columns: 1fr; }
    .lis-ambiti__scanner{ display:none; }
  }
  
  /* reduced motion */
  @media (prefers-reduced-motion: reduce){
    .lis-ambiti__scanner{ animation: none !important; }
    .lis-ambiti__chip,
    .lis-ambiti__chip *{ transition: none !important; }
    .lis-ambiti__chip{ opacity: 1 !important; transform: none !important; }
  }

/* ==== TDST === */
/* =========================
   VISION — 3D MODEL VIEWER
   ========================= */

   .lis-vision__media3d{
    justify-self: end;
    width: min(520px, 40vw);
    aspect-ratio: 4 / 5;
    border-radius: 28px;
    overflow: hidden;
    position: relative;   
  }
  
  /* Il canvas 3D */
  .lis-model3d{
    width: 100%;
    height: 100%;
    display: block;
    background: transparent;
  }
  
  /* Glass overlay super soft */
  .lis-model3d__glass{
    position: absolute;
    inset: -30%;
    pointer-events: none;
    transform: translateX(-26%) rotate(16deg);
    opacity: .6;
  }
  
  /* Mobile: diventa 16:10 e non taglia */
  @media (max-width: 980px){
    .lis-vision__media3d{
      width: 100%;
      max-width: 520px;
      justify-self: start;
      margin-top: 18px;
      aspect-ratio: 16 / 10;
      border-radius: 22px;
    }
  }
.lis-ambiti .lis-card__content{ margin-top: -8%; }

/* =========================
   AMBITI – manifesto
========================= */

.lis-ambiti .lis-card__content{
  max-width: 1100px;
}

.lis-ambiti__list{
  list-style: none;
  margin: clamp(28px, 6vh, 64px) 0 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(24px, 4vw, 56px);
}

.lis-ambiti__item{
  position: relative;
  padding-top: 28px;
}

.lis-ambiti__n{
  position: absolute;
  top: 0;
  left: 0;
  font-size: 12px;
  letter-spacing: .22em;
  opacity: .35;
}

.lis-ambiti__item h3{
  margin: 0 0 14px 0;
  font-size: clamp(26px, 3vw, 40px);
  line-height: 1.05;
  letter-spacing: -0.03em;
  font-weight: 600;
}

.lis-ambiti__item p{
  margin: 0;
  font-size: clamp(16px, 1.35vw, 18px);
  line-height: 1.6;
  max-width: 38ch;
  opacity: .85;
}

/* micro movimento elegante */
html.lis-js .lis-ambiti__item{
  transform: translateY(12px);
  transition: transform .9s var(--ease);
}

html.lis-js .lis-card.is-active .lis-ambiti__item{
  transform: translateY(0);
}

/* mobile */
@media (max-width: 980px){
  .lis-ambiti__list{
    grid-template-columns: 1fr;
    gap: 32px;
  }

  .lis-ambiti__item p{
    max-width: none;
  }
}

/* =========================
   INDEX (homepage)
   ========================= */

.lis-cta-link {
  display: inline-block;
  color: var(--black);
  text-decoration: none;
  font-size: 12px;
  letter-spacing: .16em;
  text-transform: uppercase;
  opacity: .8;
  transition: opacity .2s ease;
}
.lis-cta-link:hover {
  opacity: 1;
}

.lis-index-qr {
  width: min(280px, 32vw);
  aspect-ratio: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--white);
  border-radius: 20px;
  padding: 16px;
  box-shadow: 0 24px 60px rgba(0,0,0,.12);
}
.lis-index-qr__img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

@media (max-width: 980px) {
  .lis-index-qr {
    width: min(220px, 55vw);
  }
}

.lis-index-intro {
  max-width: 72ch;
}
.lis-index-highlight {
  margin: clamp(20px, 3vh, 32px) 0 0 0;
  padding: 18px 20px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.14);
  border-radius: var(--radius);
  font-size: clamp(15px, 1.2vw, 17px);
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 14px;
}
.lis-index-highlight__n {
  font-size: 12px;
  letter-spacing: .18em;
  opacity: .7;
  flex-shrink: 0;
}

.lis-index-placeholder {
  width: 100%;
  min-height: 280px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 22px;
}

/* Palla bianca fluttuante (sezione browser-based) */
.lis-index-ball-wrap {
  background: none !important;
  border: none !important;
  border-radius: 0;
  box-shadow: none;
  aspect-ratio: auto;
  min-height: 200px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.lis-index-ball-wrap::after {
  display: none;
}
.lis-index-ball-wrap img.lis-index-ball {
  width: min(200px, 22vw) !important;
  height: auto !important;
  max-height: 280px;
  object-fit: contain !important;
  display: block;
  animation: lis-ball-float 3.5s ease-in-out infinite;
}
@keyframes lis-ball-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-18px); }
}
@media (prefers-reduced-motion: reduce) {
  .lis-index-ball {
    animation: none;
  }
}

/* =========================
   PAGINA CONTATTI
   ========================= */

/* Full width: niente bande laterali (body è #0d0d0d) */
.lis-contact-page {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  min-height: 100vh;
  background: var(--white);
  box-sizing: border-box;
}

.lis-contact-page .lis-card.lis-contact {
  min-height: 100vh;
  align-items: flex-start;
  justify-content: flex-start;
  width: 100%;
  box-sizing: border-box;
  padding: clamp(72px, 14vh, 140px) clamp(24px, 5vw, 64px) clamp(40px, 8vh, 72px);
}

@media (max-width: 980px) {
  .lis-contact-page .lis-card.lis-contact {
    padding-left: clamp(24px, 7vw, 40px);
    padding-right: clamp(24px, 7vw, 40px);
  }
}

.lis-contact--page {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  grid-template-rows: auto auto auto;
  row-gap: clamp(40px, 6vw, 56px);
  column-gap: clamp(28px, 4vw, 48px);
  align-items: start;
  width: 100%;
  min-width: 0;
  max-width: none;
}

.lis-contact--page > .lis-contact__content { grid-column: 1; grid-row: 1; min-width: 0; }
.lis-contact--page > .lis-contact__form-wrap { grid-column: 2; grid-row: 1; min-width: 0; }
.lis-contact--page > .lis-footer__content { grid-column: 1 / -1; grid-row: 2; margin-top: 4px; }
.lis-contact--page > .lis-footer__bottom-wrap { grid-column: 1 / -1; grid-row: 3; padding-top: 20px; }

/* Email meno dominante in pagina contatti */
.lis-contact--page .lis-contact__email {
  font-size: clamp(18px, 2.2vw, 26px);
}

.lis-contact__form-intro {
  margin: 18px 0 0 0;
  font-size: 15px;
  opacity: .75;
}

/* Form contatti */
.lis-contact--page > .lis-contact__form-wrap {
  padding-bottom: 8px;
}

.lis-contact-form {
  display: flex;
  flex-direction: column;
  gap: 18px;
  min-width: 0;
}

.lis-contact-form__label {
  display: block;
  font-size: 12px;
  letter-spacing: .12em;
  text-transform: uppercase;
  opacity: .7;
  margin-bottom: 6px;
}

.lis-contact-form__input,
.lis-contact-form__textarea {
  width: 100%;
  padding: 14px 16px;
  font: inherit;
  font-size: 16px;
  color: var(--black);
  background: var(--white);
  border: 1px solid rgba(0,0,0,.15);
  border-radius: 12px;
  transition: border-color .2s ease, box-shadow .2s ease;
  box-sizing: border-box;
}

.lis-contact-form__input::placeholder,
.lis-contact-form__textarea::placeholder {
  opacity: .5;
}

.lis-contact-form__input:focus,
.lis-contact-form__textarea:focus {
  outline: none;
  border-color: var(--black);
  box-shadow: 0 0 0 3px rgba(3, 43, 60, .08);
}

.lis-contact-form__textarea {
  resize: vertical;
  min-height: 120px;
}

.lis-contact-form__row--submit {
  margin-top: 12px;
}

.lis-contact-form__submit {
  appearance: none;
  padding: 14px 28px;
  font: inherit;
  font-size: 13px;
  letter-spacing: .14em;
  text-transform: uppercase;
  font-weight: 600;
  color: var(--white);
  background: var(--black);
  border: none;
  border-radius: 12px;
  cursor: pointer;
  transition: opacity .2s ease, transform .2s ease;
}

.lis-contact-form__submit:hover {
  opacity: .9;
  transform: translateY(-1px);
}

@media (max-width: 980px) {
  .lis-contact--page {
    grid-template-columns: 1fr;
    grid-template-rows: auto auto auto auto;
  }
  .lis-contact--page > .lis-contact__content { grid-column: 1; grid-row: 1; }
  .lis-contact--page > .lis-contact__form-wrap { grid-column: 1; grid-row: 2; }
  .lis-contact--page > .lis-footer__content { grid-column: 1; grid-row: 3; }
  .lis-contact--page > .lis-footer__bottom-wrap { grid-column: 1; grid-row: 4; }
}

/* =========================
   LX FLOW — 2 step per volta, scroll -> altre 2
   ========================= */

   .lis-card.lx-flow{
    overflow: visible; /* IMPORTANT: non tagliare testo/slide */
  }
  
  .lx-flow__content{
    max-width: 1200px;
  }
  
  .lx-flow__title{
    margin: 0 0 22px 0;
  }
  
  /* rail scroll */
  .lx-flow__rail{
    display: flex;
    gap: 18px;
    overflow-x: auto;
    overflow-y: visible;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
  
    padding: 8px 6px 16px;
    margin-top: 18px;
  
    /* evita “tagli” e glitch */
    isolation: isolate;
    contain: layout paint;
  }
  
  .lx-flow__rail::-webkit-scrollbar{ height: 8px; }
  .lx-flow__rail::-webkit-scrollbar-track{
    background: rgba(255,255,255,.08);
    border-radius: 4px;
  }
  .lx-flow__rail::-webkit-scrollbar-thumb{
    background: rgba(255,255,255,.25);
    border-radius: 4px;
  }
  
  /* ogni pagina = viewport dello scroller */
  .lx-flow__page{
    flex: 0 0 100%;
    min-width: 100%;
    scroll-snap-align: start;
    scroll-snap-stop: always;
  
    overflow: visible;
    contain: layout paint;
    transform: translateZ(0);
  }
  
  /* griglia interna: 2 colonne = 2 step visibili */
  .lx-flow__grid{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: clamp(22px, 4vw, 56px);
    align-items: start;
  }
  
  /* step card (pulita, senza “pill brutte”) */
  .lx-step{
    position: relative;
    min-width: 0;
  }
  
  .lx-step::before{
    content: attr(data-n);
    position: absolute;
    top: -2px;
    left: 0;
    font-size: 12px;
    letter-spacing: .18em;
    opacity: .35;
  }
  
  /* head */
  .lx-step__head{
    display: grid;
    grid-template-columns: 18px 1fr;
    gap: 14px;
    align-items: center;
    min-height: 56px;
    padding-top: 18px; /* spazio “ottico” sotto al numerino */
  }
  
  .lx-step__dot{
    width: 12px;
    height: 12px;
    border-radius: 999px;
    background: rgba(255,255,255,.92);
    box-shadow: 0 0 0 6px rgba(255,255,255,.08);
  }
  
  .lx-step__meta{ min-width: 0; }
  
  .lx-step__h{
    margin: 0 0 2px 0;
    font-size: 13px;
    letter-spacing: .14em;
    text-transform: uppercase;
    font-weight: 800;
    line-height: 1.25;
    max-width: 100%;
    overflow-wrap: anywhere; /* niente tagli */
  }
  
  .lx-step__kicker{
    margin: 0;
    font-size: 13px;
    opacity: .66;
    font-style: italic;
  }
  
  /* testo */
  .lx-step__text{
    margin: 10px 0 0 0;
    font-size: clamp(16px, 1.25vw, 18px);
    line-height: 1.72;
    opacity: .90;
    max-width: 44ch;
    overflow-wrap: anywhere; /* niente “colonne” strane */
  }
  
  /* controls */
  .lx-flow__controls{
    margin-top: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    flex-wrap: wrap;
  }
  
  .lx-flow__btn{
    appearance: none;
    background: rgba(255,255,255,.12);
    border: 1px solid rgba(255,255,255,.25);
    border-radius: 999px;
    padding: 12px 22px;
    font: inherit;
    font-size: 13px;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: #fff;
    cursor: pointer;
    transition: background .25s ease, transform .25s ease, opacity .25s ease;
  }
  .lx-flow__btn:hover{
    background: rgba(255,255,255,.20);
    transform: translateY(-2px);
  }
  
  /* dots */
  .lx-flow__dots{
    display: inline-flex;
    gap: 8px;
    align-items: center;
  }
  .lx-flow__dot{
    width: 7px;
    height: 7px;
    border-radius: 999px;
    background: rgba(255,255,255,.28);
  }
  .lx-flow__dot.is-active{
    background: rgba(255,255,255,.75);
  }
  /* --- FIX: titolo step non deve MAI tagliarsi --- */

/* assicura che la colonna testo possa restringersi e andare a capo */
.lx-step__head{
  grid-template-columns: 18px minmax(0, 1fr);
}

/* spesso il taglio è causato da white-space:nowrap ereditato */
.lx-step__meta,
.lx-step__h,
.lx-step__h strong{
  min-width: 0;
  max-width: 100%;
  white-space: normal !important;
}

/* wrap “forte” e niente ellissi */
.lx-step__h{
  display: block;
  overflow: visible !important;
  text-overflow: clip !important;
  word-break: normal;
  overflow-wrap: anywhere;
  hyphens: auto; /* opzionale: spezza meglio in italiano */
}

/* a volte strong viene reso inline-block e impedisce il wrap */
.lx-step__h strong{
  display: inline;
}
  /* mobile: 1 step per volta (più leggibile) */
  @media (max-width: 980px){
    .lx-flow__grid{
      grid-template-columns: 1fr;
      gap: 28px;
    }
    .lx-step__text{
      max-width: none;
      font-size: 14px;
      line-height: 1.65;
    }
    .lx-step__h{
      font-size: 12px;
      letter-spacing: .12em;
    }
  }

  /* =========================
   iOS Safari: viewport stabile
   ========================= */

:root{
  --vh: 1vh; /* fallback: verrà sovrascritta da JS */
}

/* Tutte le sezioni “a schermo intero” devono usare la vh stabile */
.lis-snap,
.lis-card{
  min-height: calc(var(--vh) * 100);
}

/* Se hai wrapper che forzano altezza */
.lis-snapWrap,
.lis-main,
.lis-page{
  min-height: calc(var(--vh) * 100);
}

/* Evita “scatti” dovuti a 100vh su elementi con overflow */
.lis-card{
  height: auto;
}