/* ============================================================
   FUNZIONALITÀ — Header/HERO cliccabile
   Figma: nodo 230:1292 (pagina 230:1291)
   ============================================================ */
.fz-hero {
  position: relative;
  padding: 96px var(--sp-s);
  overflow: hidden;
}
/* Gradient+Blur — Figma 230:1293 (x=-84 y=-36, 560 × 560) */
.fz-hero__glow {
  position: absolute;
  left: -84px;
  top: -36px;
  width: 560px;
  height: 560px;
  border-radius: 280px;
  filter: blur(40px);
  background: radial-gradient(circle at 50% 50%,
              rgba(53, 209, 223, 0.30) 0%, rgba(53, 209, 223, 0) 64%);
  pointer-events: none;
}
.fz-hero__inner {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: var(--sp-xl);
  width: 100%;
  max-width: var(--w-container);
  margin-inline: auto;
  padding-inline: 32px;
}
/* Colonna testo — Figma 230:1295 (556 di larghezza, passi di 22.9) */
.fz-hero__copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 22.9px;
  min-width: 0;
}
/* Link → Home — Figma 230:1297 */
.fz-breadcrumb {
  font-family: var(--f-1);
  font-weight: var(--fw-600);
  font-size: var(--fs-12);
  line-height: 20px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--c-regent-gray);
}
.fz-breadcrumb a { color: var(--c-regent-gray); transition: color .18s ease; }
.fz-breadcrumb a:hover { color: var(--c-bunker); }
.fz-breadcrumb strong { font-weight: var(--fw-700); color: var(--c-bunker); }

/* Heading 1 — Figma 230:1302 (556 × 136 = 2 righe da 68) */
.fz-hero__title {
  font-family: var(--f-1);
  font-weight: var(--fw-900);
  font-size: 70px;
  line-height: 68px;
  letter-spacing: -1.54px;
  /* gradiente ancorato all'intero blocco di testo, come nel Figma */
  background: linear-gradient(125deg,
              var(--c-java) 0%, var(--c-scooter) 30%,
              var(--c-green-74) 62%, var(--c-conifer) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.fz-hero__title span { color: var(--c-bunker); }

/* Figma 230:1304 (2 righe da 30.4) */
.fz-hero__lead {
  max-width: 503.42px;
  font-family: var(--f-2);
  font-weight: var(--fw-400);
  font-size: var(--fs-19);
  line-height: var(--lh-30-4);
  color: var(--c-shuttle-gray);
}
/* Figma 230:1305 */
.fz-hero__actions {
  display: flex;
  align-items: flex-start;
  gap: var(--sp-14);
  padding-top: 9.1px;
}
.fz-hero__actions .btn-dark { width: 182.25px; }
.fz-hero__actions .btn-ghost { width: 142px; justify-content: center; }

/* ---------- Elenco dei cinque servizi — Figma 230:1312 ---------- */
.fz-list {
  min-width: 0;
  padding: 13px;
  background: var(--c-white);
  border-radius: 30px;
  box-shadow: 0 34px 64px -34px rgba(11, 16, 18, 0.28);
}
.fz-list__row {
  display: flex;
  align-items: center;
  height: 94.59px;
  padding-left: 22px;
  padding-right: 25px;
}
.fz-list__row + .fz-list__row { border-top: var(--sw-1) solid #eef2f3; }
.fz-list__num {
  width: 30px;
  flex-shrink: 0;
  font-family: var(--f-1);
  font-weight: var(--fw-600);
  font-size: var(--fs-15);
  line-height: 1;
  color: var(--c-regent-gray);
}
.fz-list__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  margin-left: 14px;
  border-radius: 12px;
  flex-shrink: 0;
}
.fz-list__icon--connect,
.fz-list__icon--notify  { background: linear-gradient(135deg, #0b1012 0%, #0e2a2b 60%, #123c34 100%); }
.fz-list__icon--access  { background: var(--c-scooter); }
.fz-list__icon--lost    { background: var(--c-conifer); }
.fz-list__icon--share   { background: linear-gradient(125deg,
                            var(--c-java) 0%, var(--c-scooter) 30%,
                            var(--c-green-74) 62%, var(--c-conifer) 100%); }
.fz-list__text { margin-left: 17px; }
.fz-list__title {
  font-family: var(--f-1);
  font-weight: var(--fw-700);
  font-size: var(--fs-16);
  line-height: var(--lh-25-6);
  color: var(--c-bunker);
}
.fz-list__sub {
  font-family: var(--f-2);
  font-weight: var(--fw-400);
  font-size: var(--fs-14);
  line-height: var(--lh-22-4);
  color: var(--c-shuttle-gray);
}
.fz-list__arrow { margin-left: auto; flex-shrink: 0; }
.fz-list__arrow img { width: 12px; height: 10.54px; }
.fz-list__row:hover .fz-list__arrow { transform: translateX(3px); }
.fz-list__arrow { transition: transform .18s ease; }

@media (max-width: 1180px) {
  .fz-hero__inner { grid-template-columns: 1fr; gap: 48px; }
  .fz-hero__copy, .fz-list { width: auto; }
}
@media (max-width: 720px) {
  .fz-hero { padding: 72px var(--sp-s); }
  .fz-hero__inner { padding-inline: 0; }
  .fz-hero__title { font-size: 42px; line-height: 1.04; letter-spacing: -0.9px; }
  .fz-hero__lead { font-size: var(--fs-16); line-height: var(--lh-25-6); }
  .fz-hero__actions { flex-direction: column; align-items: stretch; }
  .fz-hero__actions .btn-dark, .fz-hero__actions .btn-ghost { width: 100%; }
  .fz-list { border-radius: 24px; padding: 8px; }
  .fz-list__row { height: auto; padding: 18px 14px; }
  .fz-list__num { display: none; }
}

/* ============================================================
   FUNZIONALITÀ — Section "MAPPA"
   Figma: nodo 230:1319 — riusa il mosaico definito in style.css
   ============================================================ */
.fz-mappa { padding: 97px var(--sp-s) 96px; }
.fz-mappa__inner {
  width: 100%;
  max-width: var(--w-container);
  margin-inline: auto;
  padding-inline: 32px;
}
/* Figma 230:1321 — intestazione centrata (605.63 di larghezza) */
.fz-mappa__intro {
  max-width: 605.63px;
  margin-inline: auto;
  padding-top: 6.9px;
  text-align: center;
}
/* Heading 2 — Figma 230:1326 (468 × 93 = 2 righe da 46.2) */
.fz-mappa__title {
  max-width: 468px;
  margin: 14.8px auto 0;
  font-family: var(--f-1);
  font-weight: var(--fw-800);
  font-size: var(--fs-44);
  line-height: var(--lh-46-2);
  letter-spacing: var(--ls--0-88);
  color: var(--c-bunker);
}
/* Figma 230:1328 (585 × 61.58 = 2 righe da 30.4) */
.fz-mappa__lead {
  max-width: 585px;
  margin: 14.8px auto 0;
  font-family: var(--f-2);
  font-weight: var(--fw-400);
  font-size: var(--fs-19);
  line-height: var(--lh-30-4);
  color: var(--c-shuttle-gray);
}
.fz-mappa .fn-mosaic { margin: 48px auto 0; }

@media (max-width: 720px) {
  .fz-mappa { padding: 72px var(--sp-s); }
  .fz-mappa__inner { padding-inline: 0; }
  .fz-mappa__title { font-size: 32px; line-height: 1.08; letter-spacing: -0.6px; }
  .fz-mappa__lead { font-size: var(--fs-16); line-height: var(--lh-27-2); }
}

/* ============================================================
   FUNZIONALITÀ — Section "CONNECT"
   Figma: nodo 230:1346
   ============================================================ */
.fz-svc {
  padding: 96px var(--sp-s);
  background: var(--c-bunker);
}
.fz-svc__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: var(--sp-xl);
  width: 100%;
  max-width: var(--w-container);
  margin-inline: auto;
  padding-inline: 32px;
}
.fz-svc__copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 13.5px;
  min-width: 0;
}
/* Figma 230:1350 */
.fz-svc__kicker {
  font-family: var(--f-3);
  font-weight: var(--fw-600);
  font-size: var(--fs-11);
  line-height: var(--lh-17-6);
  letter-spacing: var(--ls-1-54);
  text-transform: uppercase;
  color: var(--c-conifer);
}
/* Heading 2 — Figma 230:1352 (556 × 98 = 2 righe da 49) */
.fz-svc__title {
  font-family: var(--f-1);
  font-weight: var(--fw-800);
  font-size: var(--fs-46);
  line-height: 49px;
  letter-spacing: var(--ls--0-92);
  color: var(--c-white);
}
/* Figma 230:1354 (463 × 82 = 3 righe da 27.2) */
.fz-svc__lead {
  max-width: 463px;
  font-family: var(--f-2);
  font-weight: var(--fw-400);
  font-size: 17px;
  line-height: var(--lh-27-2);
  color: var(--c-green-spring);
}
/* Link — Figma 230:1355 */
.fz-svc__link {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding-top: 18px;
  font-family: var(--f-1);
  font-weight: var(--fw-700);
  font-size: var(--fs-15);
  line-height: var(--fs-24);
  color: var(--c-conifer);
  transition: gap .18s ease;
}
.fz-svc__link:hover { gap: 14px; }
.fz-svc__link img { width: 10.25px; height: 9px; }

/* Figma 230:1358 — colonna immagine */
.fz-svc__visual {
  position: relative;
  min-width: 0;
}
.fz-svc__photo {
  width: 100%;
  aspect-ratio: 556 / 583.8;
  object-fit: cover;
  border-radius: 40px;
}
/* Background — Figma 230:1362 (card di notifica, sborda di 33.36 a sinistra) */
.fz-note {
  position: absolute;
  left: -6%;                     /* -33.36 / 556 */
  top: 76.08%;                   /* 444.17 / 583.8 */
  display: flex;
  align-items: center;
  width: 210.86px;
  height: 69.58px;
  padding-left: 18px;
  background: var(--c-white);
  border-radius: 19px;
  box-shadow: 0 24px 50px -22px rgba(0, 0, 0, 0.55);
}
.fz-note__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 8px;
  flex-shrink: 0;
  background: linear-gradient(125deg,
              var(--c-java) 0%, var(--c-scooter) 30%,
              var(--c-green-74) 62%, var(--c-conifer) 100%);
}
.fz-note__icon img { width: 20px; height: 14.87px; }
.fz-note__text { display: flex; flex-direction: column; margin-left: 12px; }
.fz-note__title {
  display: block;
  font-family: var(--f-1);
  font-weight: var(--fw-700);
  font-size: var(--fs-14);
  line-height: var(--lh-22-4);
  color: var(--c-bunker);
}
.fz-note__sub {
  display: block;
  font-family: var(--f-2);
  font-weight: var(--fw-400);
  font-size: var(--fs-13);
  line-height: var(--lh-20-8);
  color: var(--c-shuttle-gray);
}

@media (max-width: 1180px) {
  .fz-svc__inner { grid-template-columns: 1fr; gap: 48px; }
  .fz-svc__copy, .fz-svc__visual { width: auto; }
  .fz-svc__photo { height: auto; aspect-ratio: 556 / 583.8; }
  .fz-note { left: 0; top: auto; bottom: 24px; }
}
@media (max-width: 720px) {
  .fz-svc { padding: 72px var(--sp-s); }
  .fz-svc__inner { padding-inline: 0; }
  .fz-svc__title { font-size: 32px; line-height: 1.08; letter-spacing: -0.6px; }
  .fz-svc__lead { font-size: var(--fs-16); line-height: var(--lh-25-6); }
  .fz-note { transform: scale(.85); transform-origin: left bottom; }
}

/* ============================================================
   FUNZIONALITÀ — Section "ACCESS"
   Figma: nodo 230:1369
   ============================================================ */
.fz-access {
  padding: 95px var(--sp-s) 69.6px;
  background: var(--c-scooter);
}
.fz-access__inner {
  width: 100%;
  max-width: var(--w-container);
  margin-inline: auto;
  padding-inline: 32px;
}
.fz-access__intro { max-width: 605.63px; }
.fz-access__kicker {
  font-family: var(--f-3);
  font-weight: var(--fw-600);
  font-size: var(--fs-11);
  line-height: var(--lh-17-6);
  letter-spacing: var(--ls-1-54);
  text-transform: uppercase;
  color: var(--c-teal-14);
}
/* Heading 2 — Figma 230:1375 (riga singola alta 49) */
.fz-access__title {
  margin-top: 14px;
  font-family: var(--f-1);
  font-weight: var(--fw-800);
  font-size: var(--fs-46);
  line-height: 49px;
  letter-spacing: var(--ls--0-92);
  color: var(--c-bunker);
}
/* Figma 230:1377 (461 × 55 = 2 righe da 27.2) */
.fz-access__lead {
  max-width: 461px;
  margin-top: 14px;
  font-family: var(--f-2);
  font-weight: var(--fw-400);
  font-size: 17px;
  line-height: var(--lh-27-2);
  color: var(--c-teal-20);
}

/* Le due tessere — Figma 230:1379 e 230:1388 */
.fz-access__cards {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 18px;
  align-items: start;
  margin-top: 48px;
}
.fz-two {
  padding: 31px 32px 32px;
  border-radius: 44px;
}
.fz-two--dark  { background: var(--c-bunker); }
.fz-two--light { background: var(--c-white); }
.fz-two__kicker {
  font-family: var(--f-3);
  font-weight: var(--fw-600);
  font-size: var(--fs-11);
  line-height: var(--lh-17-6);
  letter-spacing: var(--ls-1-54);
  text-transform: uppercase;
}
.fz-two--dark  .fz-two__kicker { color: var(--c-conifer); }
.fz-two--light .fz-two__kicker { color: var(--c-teal-14); }

.fz-two__head {
  display: flex;
  align-items: center;
  margin-top: 10px;
}
.fz-two__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 54px;
  border-radius: 16px;
  flex-shrink: 0;
}
.fz-two--dark  .fz-two__icon { background: var(--c-conifer-18); }  /* lime al 18%, non pieno */
.fz-two--light .fz-two__icon { background: var(--c-aqua-haze); }
.fz-two__icon img { width: 24px; height: 24px; }
.fz-two__title {
  font-family: var(--f-1);
  font-weight: var(--fw-800);
  font-size: var(--fs-24);
  line-height: var(--lh-38-4);
}
.fz-two--dark  .fz-two__title { margin-left: 32px; color: var(--c-white); }
.fz-two--light .fz-two__title { margin-left: 24px; color: var(--c-bunker); }

.fz-two__text {
  margin-top: 10px;
  font-family: var(--f-2);
  font-weight: var(--fw-400);
  font-size: var(--fs-15);
  line-height: var(--fs-24);
}
.fz-two--dark  .fz-two__text { color: var(--c-loblolly); }
.fz-two--light .fz-two__text { color: var(--c-shuttle-gray); }

/* Link — Figma 230:1397 */
.fz-access__link {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin-top: 31.5px;
  font-family: var(--f-1);
  font-weight: var(--fw-700);
  font-size: var(--fs-15);
  line-height: var(--fs-24);
  color: var(--c-teal-14);
  transition: gap .18s ease;
}
.fz-access__link:hover { gap: 14px; }
.fz-access__link img { width: 10.25px; height: 9px; }

@media (max-width: 900px) {
  .fz-access__cards { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .fz-access { padding: 72px var(--sp-s); }
  .fz-access__inner { padding-inline: 0; }
  .fz-access__title { font-size: 32px; line-height: 1.08; letter-spacing: -0.6px; }
  .fz-access__lead { font-size: var(--fs-16); line-height: var(--lh-25-6); }
  .fz-two { padding: 24px; border-radius: 32px; }
  .fz-two__head { flex-wrap: wrap; gap: 14px; }
  .fz-two--dark .fz-two__title, .fz-two--light .fz-two__title { margin-left: 0; font-size: 20px; line-height: 1.3; }
}

/* ============================================================
   FUNZIONALITÀ — Section "LOST"
   Figma: nodo 230:1400 (foto a sinistra, testo a destra)
   ============================================================ */
/* 775 di sezione = 96 sopra + 556 di foto + 123 sotto
   (nel Figma il container e' 592: i 36 in piu' finiscono qui) */
.fz-lost {
  padding: 96px var(--sp-s) 123px;
  background: var(--c-conifer);
}
.fz-lost__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: start;
  gap: var(--sp-xl);
  width: 100%;
  max-width: var(--w-container);
  margin-inline: auto;
  padding-inline: 32px;
}
/* Figma 230:1402 — riquadro 556 × 556 con quattro raggi diversi,
   ricavati per adattamento sulla sagoma del render */
.fz-lost__visual {
  position: relative;
  min-width: 0;
}
.fz-lost__photo {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  border-radius: 284px 266px 146px 114px;
  /* Overlay+Shadow — Figma 230:1403. Misurata sul render: alpha 0.26 subito
     sotto il bordo, si annulla a ~60px, quasi nulla sui lati. */
  box-shadow: 0 34px 74px -26px rgba(11, 16, 18, 0.5);
}
/* Background — Figma 230:1407 */
.fz-lost__badge {
  position: absolute;
  left: 79.35%;                  /* 441.19 / 556 */
  top: 80.33%;                   /* 446.66 / 556 */
  width: max-content;            /* il box del Figma e' 137.05 ma il testo
                                    lo riempie al pixel: lascio crescere
                                    invece di far uscire la scritta */
  min-width: 137.05px;
  min-height: 75.98px;
  padding: 14px 18px;
  background: var(--c-bunker);
  border-radius: 20px;
  box-shadow: 0 22px 44px -20px rgba(11, 16, 18, 0.55);
}
.fz-lost__badge-name {
  display: block;
  white-space: nowrap;
  font-family: var(--f-1);
  font-weight: var(--fw-700);
  font-size: var(--fs-14);
  line-height: var(--lh-22-4);
  color: var(--c-white);
}
.fz-lost__badge-sub {
  display: block;
  white-space: nowrap;
  margin-top: 3.5px;
  font-family: var(--f-2);
  font-weight: var(--fw-400);
  font-size: var(--fs-13);
  line-height: var(--lh-20-8);
  color: var(--c-hit-gray);     /* pixel piu chiaro misurato: r,g coincidono con #9fb0b6 */
}
/* Figma 230:1412 — colonna testo */
.fz-lost__copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 13.5px;
  min-width: 0;
  margin-top: 136.31px;
}
.fz-lost__kicker {
  font-family: var(--f-3);
  font-weight: var(--fw-600);
  font-size: var(--fs-11);
  line-height: var(--lh-17-6);
  letter-spacing: var(--ls-1-54);
  text-transform: uppercase;
  color: var(--c-teal-14);
}
.fz-lost__title {
  font-family: var(--f-1);
  font-weight: var(--fw-800);
  font-size: var(--fs-46);
  line-height: 49px;
  letter-spacing: var(--ls--0-92);
  color: var(--c-bunker);
}
.fz-lost__lead {
  max-width: 454px;
  font-family: var(--f-2);
  font-weight: var(--fw-400);
  font-size: 17px;
  line-height: var(--lh-27-2);
  color: var(--c-teal-20);
}
.fz-lost__link {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding-top: 18px;
  font-family: var(--f-1);
  font-weight: var(--fw-700);
  font-size: var(--fs-15);
  line-height: var(--fs-24);
  color: var(--c-teal-14);
  transition: gap .18s ease;
}
.fz-lost__link:hover { gap: 14px; }
.fz-lost__link img { width: 10.25px; height: 9px; }

@media (max-width: 1180px) {
  .fz-lost__inner { grid-template-columns: 1fr; gap: 40px; }
  .fz-lost__visual, .fz-lost__copy { width: auto; }
  .fz-lost__copy { margin-top: 0; }
  .fz-lost__badge { left: auto; right: 4%; top: auto; bottom: 6%; }
}
@media (max-width: 720px) {
  .fz-lost { padding: 72px var(--sp-s); }
  .fz-lost__inner { padding-inline: 0; }
  .fz-lost__photo { border-radius: 45% 45% 26% 20%; }
  .fz-lost__title { font-size: 32px; line-height: 1.08; letter-spacing: -0.6px; }
  .fz-lost__lead { font-size: var(--fs-16); line-height: var(--lh-25-6); }
  .fz-lost__badge { transform: scale(.85); transform-origin: right bottom; }
}

/* ============================================================
   FUNZIONALITÀ — Section "SHARE"
   Figma: nodo 230:1422
   ============================================================ */
.fz-share {
  padding: 95px var(--sp-s) 96px;
  background: linear-gradient(125deg,
              var(--c-java) 0%, var(--c-scooter) 30%,
              var(--c-green-74) 62%, var(--c-conifer) 100%);
}
.fz-share__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: var(--sp-xl);
  width: 100%;
  max-width: var(--w-container);
  margin-inline: auto;
  padding-inline: 32px;
}
.fz-share__copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 13.5px;
  min-width: 0;
}
.fz-share__kicker {
  font-family: var(--f-3);
  font-weight: var(--fw-600);
  font-size: var(--fs-11);
  line-height: var(--lh-17-6);
  letter-spacing: var(--ls-1-54);
  text-transform: uppercase;
  color: var(--c-teal-14);
}
/* Heading 2 — Figma 230:1428 (556 × 98 = 2 righe da 49) */
.fz-share__title {
  font-family: var(--f-1);
  font-weight: var(--fw-800);
  font-size: var(--fs-46);
  line-height: 49px;
  letter-spacing: var(--ls--0-92);
  color: var(--c-bunker);
}
/* Figma 230:1430 (536 × 82 = 3 righe da 27.2) */
.fz-share__lead {
  max-width: 536px;
  font-family: var(--f-2);
  font-weight: var(--fw-400);
  font-size: 17px;
  line-height: var(--lh-27-2);
  color: var(--c-teal-20);
}
.fz-share__link {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding-top: 18px;
  font-family: var(--f-1);
  font-weight: var(--fw-700);
  font-size: var(--fs-15);
  line-height: var(--fs-24);
  color: var(--c-teal-14);
  transition: gap .18s ease;
}
.fz-share__link:hover { gap: 14px; }
.fz-share__link img { width: 10.25px; height: 9px; }

/* Background — Figma 230:1434 (556 × 260.5, tre righe) */
.fz-panel {
  min-width: 0;
  padding: 16px;
  background: var(--c-white);
  border-radius: 48px;
  box-shadow: 0 30px 60px -30px rgba(11, 16, 18, 0.35);
}
.fz-panel__row {
  display: flex;
  align-items: center;
  height: 75.5px;
  padding-inline: 18px;
}
.fz-panel__row + .fz-panel__row {
  height: 76.5px;
  border-top: var(--sw-1) solid #edf1f3;
}
.fz-panel__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 12px;
  flex-shrink: 0;
}
.fz-panel__icon--lime { background: var(--c-conifer-26); }
.fz-panel__icon--cyan { background: rgba(53, 209, 223, 0.25); }
.fz-panel__icon--grey { background: rgba(11, 16, 18, 0.10); }
.fz-panel__icon img { width: 20px; height: 20px; }
.fz-panel__text { display: flex; flex-direction: column; margin-left: 14px; }
.fz-panel__title {
  display: block;
  font-family: var(--f-1);
  font-weight: var(--fw-700);
  font-size: var(--fs-15);
  line-height: var(--fs-24);
  color: var(--c-shuttle-gray);
}
.fz-panel__sub {
  display: block;
  font-family: var(--f-2);
  font-weight: var(--fw-400);
  font-size: var(--fs-13);
  line-height: var(--lh-20-8);
  color: var(--c-shuttle-gray);
}
.fz-panel__tag {
  margin-left: auto;
  font-family: var(--f-3);
  font-weight: var(--fw-600);
  font-size: var(--fs-10);
  line-height: 16px;
  letter-spacing: var(--ls-1-1);
  text-transform: uppercase;
  color: var(--c-regent-gray);
  white-space: nowrap;
}

@media (max-width: 1180px) {
  .fz-share__inner { grid-template-columns: 1fr; gap: 40px; }
}
@media (max-width: 720px) {
  .fz-share { padding: 72px var(--sp-s); }
  .fz-share__inner { padding-inline: 0; }
  .fz-share__title { font-size: 32px; line-height: 1.08; letter-spacing: -0.6px; }
  .fz-share__lead { font-size: var(--fs-16); line-height: var(--lh-25-6); }
  .fz-panel { border-radius: 32px; padding: 10px; }
  .fz-panel__row, .fz-panel__row + .fz-panel__row { height: auto; padding: 16px 12px; }
  .fz-panel__tag { display: none; }
}

/* ============================================================
   FUNZIONALITÀ — Section "NOTIFY"
   Figma: nodo 230:1465
   ============================================================ */
.fz-notify {
  padding: 95px var(--sp-s) 96px;
  background: var(--c-bunker);
}
.fz-notify__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: var(--sp-xl);
  width: 100%;
  max-width: var(--w-container);
  margin-inline: auto;
  padding-inline: 32px;
}
.fz-notify__copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 13.5px;
  min-width: 0;
}
.fz-notify__kicker {
  font-family: var(--f-3);
  font-weight: var(--fw-600);
  font-size: var(--fs-11);
  line-height: var(--lh-17-6);
  letter-spacing: var(--ls-1-54);
  text-transform: uppercase;
  color: var(--c-conifer);
}
/* Heading 2 — Figma 230:1471 (556 × 98 = 2 righe da 49) */
.fz-notify__title {
  font-family: var(--f-1);
  font-weight: var(--fw-800);
  font-size: var(--fs-46);
  line-height: 49px;
  letter-spacing: var(--ls--0-92);
  color: var(--c-white);
}
/* Figma 230:1473 (467 × 82 = 3 righe da 27.2) */
.fz-notify__lead {
  max-width: 467px;
  font-family: var(--f-2);
  font-weight: var(--fw-400);
  font-size: 17px;
  line-height: var(--lh-27-2);
  color: var(--c-green-spring);
}
.fz-notify__link {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding-top: 18px;
  font-family: var(--f-1);
  font-weight: var(--fw-700);
  font-size: var(--fs-15);
  line-height: var(--fs-24);
  color: var(--c-conifer);
  transition: gap .18s ease;
}
.fz-notify__link:hover { gap: 14px; }
.fz-notify__link img { width: 10.25px; height: 9px; }

/* Figma 230:1477 — tre avvisi a scaletta (rientri 0 / 44 / 88) */
.fz-notify__stack { position: relative; min-width: 0; }
.fz-alert {
  position: relative;
  display: flex;
  align-items: center;
  height: 81.5px;
  padding-left: 21px;
  background: rgba(255, 255, 255, 0.05);
  border-radius: 26px;
}
.fz-alert--2 { margin: 16px 0 0 44px; }
.fz-alert--3 { margin: 16px 0 0 88px; }
/* Vertical Divider — Figma 230:1493 (2 × 32, a −23 dal bordo della tessera) */
.fz-alert--2::before,
.fz-alert--3::before {
  content: "";
  position: absolute;
  left: -23px;
  top: -15px;
  width: 2px;
  height: 32px;
  border-radius: 1px;
  background: var(--c-spring-green);
}
.fz-alert__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 12px;
  flex-shrink: 0;
}
.fz-alert__icon--red  { background: rgba(255, 155, 155, 0.20); }
.fz-alert__icon--lime { background: rgba(194, 232, 80, 0.20); }
.fz-alert__icon--cyan { background: rgba(53, 209, 223, 0.20); }
.fz-alert__icon img { width: 20px; height: 20px; }
.fz-alert__text { display: flex; flex-direction: column; margin-left: 14px; }
.fz-alert__title {
  font-family: var(--f-1);
  font-weight: var(--fw-700);
  font-size: var(--fs-15);
  line-height: var(--fs-24);
  color: var(--c-white);
}
.fz-alert__sub {
  font-family: var(--f-2);
  font-weight: var(--fw-400);
  font-size: var(--fs-13);
  line-height: var(--lh-20-8);
  color: var(--c-hit-gray);
}

@media (max-width: 1180px) {
  .fz-notify__inner { grid-template-columns: 1fr; gap: 40px; }
}
@media (max-width: 720px) {
  .fz-notify { padding: 72px var(--sp-s); }
  .fz-notify__inner { padding-inline: 0; }
  .fz-notify__title { font-size: 32px; line-height: 1.08; letter-spacing: -0.6px; }
  .fz-notify__lead { font-size: var(--fs-16); line-height: var(--lh-25-6); }
  .fz-alert--2, .fz-alert--3 { margin-left: 0; }
  .fz-alert--2::before, .fz-alert--3::before { display: none; }
  .fz-alert { height: auto; padding: 16px 16px 16px 16px; border-radius: 20px; }
}

/* ============================================================
   FUNZIONALITÀ — Section "CTA FINALE"
   Figma: nodo 230:1503
   ============================================================ */
.fz-cta {
  position: relative;
  padding: 128px var(--sp-s) 128px;
  overflow: hidden;
  text-align: center;
}
/* Gradient+Blur — Figma 230:1504 e 230:1505, ancorati al container */
.fz-cta__glows {
  position: absolute;
  top: 0; right: 0; bottom: 0; left: 0;
  left: 50%;
  width: var(--w-container);
  margin-left: calc(var(--w-container) / -2);
  pointer-events: none;
}
.fz-cta__glow--cyan {
  position: absolute;
  left: 32px; top: 19.5px;
  width: 760px; height: 460px;
  border-radius: 230px;
  filter: blur(40px);
  background: radial-gradient(ellipse at 50% 50%,
              rgba(53, 209, 223, 0.28) 0%, rgba(53, 209, 223, 0) 64%);
}
.fz-cta__glow--lime {
  position: absolute;
  left: 656px; top: 180.5px;
  width: 520px; height: 360px;
  border-radius: 180px;
  filter: blur(40px);
  background: radial-gradient(ellipse at 50% 50%,
              rgba(194, 232, 80, 0.26) 0%, rgba(194, 232, 80, 0) 64%);
}
.fz-cta__inner {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  max-width: var(--w-container);
  margin-inline: auto;
  padding-inline: 32px;
}
.fz-cta .eyebrow { padding-top: 6.91px; }
/* Heading 2 — Figma 230:1511 (343 × 114 = 2 righe da 57) */
.fz-cta__title {
  max-width: 343px;
  margin-top: 14.6px;
  font-family: var(--f-1);
  font-weight: var(--fw-800);
  font-size: var(--fs-44);
  line-height: 57px;
  letter-spacing: var(--ls--0-88);
  /* gradiente ancorato all'intero blocco di testo, come nel Figma */
  background: linear-gradient(125deg,
              var(--c-java) 0%, var(--c-scooter) 30%,
              var(--c-green-74) 62%, var(--c-conifer) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.fz-cta__title span { color: var(--c-bunker); }
/* Figma 230:1513 (510 × 61 = 2 righe da 30.4) */
.fz-cta__lead {
  max-width: 510px;
  margin-top: 14.6px;
  font-family: var(--f-2);
  font-weight: var(--fw-400);
  font-size: var(--fs-19);
  line-height: var(--lh-30-4);
  color: var(--c-shuttle-gray);
}
/* Figma 230:1514 — i due bottoni */
.fz-cta__actions {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--sp-14);
  margin-top: 33.4px;
}
.fz-cta__actions .btn-gradient { margin-top: 0; width: 263px; }
/* Link — Figma 230:1520 (178 × 62, bordo #e1e7e9) */
.btn-outline {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 178px;
  height: 62px;
  border: var(--sw-1) solid #e1e7e9;
  border-radius: var(--r-pill);
  font-family: var(--f-1);
  font-weight: var(--fw-700);
  font-size: var(--fs-16);
  line-height: 26px;
  color: var(--c-bunker);
  white-space: nowrap;
  transition: border-color .18s ease, background-color .18s ease;
}
.btn-outline:hover { border-color: var(--c-bunker); background: var(--c-white); }

@media (max-width: 1024px) {
  .fz-cta { padding: 96px var(--sp-s); }
  .fz-cta__glows { display: none; }
}
@media (max-width: 720px) {
  .fz-cta__inner { padding-inline: 0; }
  .fz-cta__title { font-size: 32px; line-height: 1.15; letter-spacing: -0.6px; max-width: none; }
  .fz-cta__lead { font-size: var(--fs-16); line-height: var(--lh-25-6); }
  .fz-cta__actions { flex-direction: column; align-items: stretch; }
  .fz-cta__actions .btn-gradient, .btn-outline { width: 100%; justify-content: center; }
}