/* ============================================================
   SHARE — Header/HERO
   Figma: nodo 241:4216 (pagina 241:4215)
   ============================================================ */
.sh-hero {
  position: relative;
  padding: 96px var(--sp-s) 64px;   /* 700 - 96 - 540 */
  overflow: hidden;
}
/* Gradient+Blur — Figma 241:4217 (x=1480 y=-160, 560 × 560) */
.sh-hero__glow--cyan {
  position: absolute;
  left: 1480px; top: -160px;
  width: 560px; height: 560px;
  border-radius: 280px;
  filter: blur(40px);
  background: radial-gradient(circle at 50% 50%,
              rgba(53, 209, 223, 0.28) 0%, rgba(53, 209, 223, 0) 64%);
  pointer-events: none;
}
/* Gradient+Blur — Figma 241:4218 (x=-120 y=440, 420 × 420) */
.sh-hero__glow--lime {
  position: absolute;
  left: -120px; top: 440px;
  width: 420px; height: 420px;
  border-radius: 210px;
  filter: blur(40px);
  background: radial-gradient(circle at 50% 50%,
              rgba(194, 232, 80, 0.26) 0%, rgba(194, 232, 80, 0) 64%);
  pointer-events: none;
}
.sh-hero__inner {
  position: relative;
  display: grid;
  grid-template-columns: 583.8fr 528.2fr;
  align-items: start;
  gap: var(--sp-xl);
  width: 100%;
  max-width: var(--w-container);
  margin-inline: auto;
  padding-inline: 32px;
}

/* ---------- Colonna testo — Figma 241:4220 ---------- */
.sh-hero__copy { min-width: 0; padding-top: 9.15px; }
.sh-hero__eyebrow { margin-top: 26.9px; }   /* 35.1 - 20 + 11.8 */
/* Heading 1 — Figma 241:4226 (583.8 × 136.59 = 2 righe da 64) */
.sh-hero__title {
  margin-top: 24.5px;              /* 82 - (35.1 + 31.8) + 8.59, meno lo scarto tipografico */
  font-family: var(--f-1);
  font-weight: var(--fw-900);
  font-size: 64px;
  line-height: 64px;
  letter-spacing: -1.408px;        /* -0.022em, come le altre Heading 1 */
  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;
}
.sh-hero__title span { color: var(--c-bunker); }
/* Figma 241:4228 (508 × 122 = 4 righe da 30.5) */
.sh-hero__lead {
  max-width: 527.39px;
  margin-top: 15.1px;              /* 233.69 - (82 + 136.59) */
  font-family: var(--f-2);
  font-weight: var(--fw-400);
  font-size: var(--fs-19);
  line-height: 30.5px;
  color: var(--c-shuttle-gray);
}

/* Etichette — Figma 241:4230 (due pillole alte 42) */
.sh-hero__chips {
  display: flex;
  align-items: center;
  gap: 10px;                       /* 193 - 183 */
  margin-top: 32px;                /* 370.79 + 16.9 - (233.69 + 122) */
}
.sh-chip {
  display: inline-flex;
  align-items: center;
  gap: 9px;                        /* 48 - 17 - 22 */
  height: 42px;
  padding: 0 17px;
  background: var(--c-white);
  border-radius: var(--r-pill);
  /* nel Figma il contorno e' interno e non aggiunge altezza */
  box-shadow: inset 0 0 0 var(--sw-1) #e5eaec;
  font-family: var(--f-1);
  font-weight: var(--fw-700);
  font-size: var(--fs-14);
  line-height: 21px;
  color: var(--c-bunker);
  white-space: nowrap;
}
.sh-chip__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 22px; height: 22px;
  border-radius: 8px;
  flex-shrink: 0;
}
.sh-chip__icon--info   { background: #dbf7f9; }
.sh-chip__icon--secure { background: var(--c-bunker); }

.sh-hero__actions {
  display: flex;
  align-items: center;
  gap: var(--sp-14);
  margin-top: 32px;                /* 444.79 + 16.9 - (370.79 + 58.9) */
}
.sh-hero__actions .btn-primary { width: 243.67px; }
.sh-hero__actions .btn-ghost   { width: 218px; justify-content: center; }

/* ---------- Colonna visiva — Figma 241:4252 (528.2 × 540) ---------- */
.sh-stage { position: relative; min-width: 0; aspect-ratio: 528.2 / 540; }
/* Overlay+Shadow — Figma 241:4253 (369.73 × 345.59, in alto a destra) */
.sh-stage__photo {
  position: absolute;
  left: 30.0%; top: 0;
  width: 70.0%;
  height: 63.99%;
  object-fit: cover;
  border-radius: 40px;
  box-shadow: 0 40px 80px -34px rgba(11, 16, 18, 0.4);
}
/* Background+Border — Figma 241:4256 (316.92 × 303.36, in basso a sinistra) */
.sh-panel {
  position: absolute;
  left: 0; top: 44.08%;
  width: 316.92px;
  padding: 11px;
  background: var(--c-white);
  border-radius: 30px;
  box-shadow: 0 34px 70px -30px rgba(11, 16, 18, 0.35);
}
/* Background — Figma 241:4258 (intestazione a gradiente) */
.sh-panel__head {
  padding: 23px 18px 18px;
  border-radius: 22px;
  background: linear-gradient(105deg,
              var(--c-java) 0%, var(--c-scooter) 22%,
              var(--c-green-74) 66%, var(--c-conifer) 100%);
}
.sh-panel__kicker {
  font-family: var(--f-3);
  font-weight: var(--fw-700);
  font-size: var(--fs-11);
  line-height: 15px;
  letter-spacing: 1.1px;
  text-transform: uppercase;
  color: var(--c-teal-26);
}
.sh-panel__name {
  margin-top: 3.59px;
  font-family: var(--f-1);
  font-weight: var(--fw-700);
  font-size: var(--fs-18);
  line-height: 28px;
  color: var(--c-bunker);
}

/* Righe — Figma 241:4262 / 4273 / 4284 */
.sh-panel__row {
  display: flex;
  align-items: center;
  gap: 12px;                       /* 58 - 14 - 32 */
  padding: 16.3px 14px;
}
.sh-panel__list li + li { box-shadow: inset 0 1px 0 #eaeef0; }
.sh-panel__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px; height: 32px;
  border-radius: 10px;
  background: var(--c-aqua-haze);
  flex-shrink: 0;
}
.sh-panel__text { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.sh-panel__title {
  font-family: var(--f-1);
  font-weight: var(--fw-700);
  font-size: var(--fs-14);
  line-height: 21px;
  color: var(--c-regent-gray);
}
.sh-panel__sub {
  margin-top: -1px;
  font-family: var(--f-2);
  font-weight: var(--fw-400);
  font-size: var(--fs-12);
  line-height: 18px;
  color: #99a3a9;
}
.sh-panel__cta {
  font-family: var(--f-3);
  font-weight: var(--fw-700);
  font-size: var(--fs-11);
  line-height: 15px;
  letter-spacing: 0.66px;
  color: var(--c-java);
  flex-shrink: 0;
}

@media (max-width: 1180px) {
  .sh-hero__inner { grid-template-columns: 1fr; gap: 56px; }
  .sh-stage { max-width: 528.2px; width: 100%; margin-inline: auto; }
  .sh-hero__glow--cyan, .sh-hero__glow--lime { display: none; }
}
@media (max-width: 720px) {
  .sh-hero { padding: 72px var(--sp-s) 56px; }
  .sh-hero__inner { padding-inline: 0; }
  .sh-hero__title { font-size: 40px; line-height: 1.04; letter-spacing: -0.9px; }
  .sh-hero__lead { font-size: var(--fs-16); line-height: var(--lh-25-6); }
  .sh-hero__chips { flex-wrap: wrap; }
  .sh-hero__actions { flex-direction: column; align-items: stretch; }
  .sh-hero__actions .btn-primary, .sh-hero__actions .btn-ghost { width: 100%; justify-content: center; }
  .sh-panel { transform: scale(.9); transform-origin: left top; }
}

/* ============================================================
   SHARE — INFO HUB
   Figma: nodo 241:4295 (1920x732, fondo ciano)
   ============================================================ */
.sh-info {
  position: relative;
  background: var(--c-scooter);
  padding: 96px var(--sp-s);
  overflow: hidden;
}
/* Gradient+Blur — Figma 241:4296 (x=614.39 y=-58.55, 520 × 460) */
.sh-info__glow {
  position: absolute;
  left: 614.39px; top: -58.55px;
  width: 520px; height: 460px;
  border-radius: 230px;
  filter: blur(40px);
  background: radial-gradient(ellipse at 50% 50%,
              rgba(255, 255, 255, 0.28) 0%, rgba(255, 255, 255, 0) 68%);
  pointer-events: none;
}
.sh-info__inner {
  position: relative;
  display: grid;
  grid-template-columns: 583.8fr 528.2fr;
  align-items: start;
  gap: var(--sp-xl);
  width: 100%;
  max-width: var(--w-container);
  margin-inline: auto;
  padding-inline: 32px;
}

/* ---------- Colonna testo — Figma 241:4298 ---------- */
.sh-info__copy { min-width: 0; padding-top: 35.06px; }
/* Occhiello con icona invece del trattino — Figma 241:4299 */
.sh-info__eyebrow {
  display: flex;
  align-items: center;
  gap: 10px;                       /* 26 - 16 */
  font-family: var(--f-3);
  font-weight: var(--fw-700);
  font-size: var(--fs-12);
  line-height: 18px;
  letter-spacing: var(--ls-3-36);
  text-transform: uppercase;
  color: var(--c-teal-26);
}
.sh-info__eyebrow img { width: 16px; height: 16px; flex-shrink: 0; }
/* Heading 2 — Figma 241:4304 (2 righe da 45.5) */
.sh-info__title {
  margin-top: 22.4px;              /* 33.59 - 17.59 + 8, meno lo scarto */
  font-family: var(--f-1);
  font-weight: var(--fw-800);
  font-size: var(--fs-44);
  line-height: 45.5px;
  letter-spacing: var(--ls--1-1);
  color: var(--c-bunker);
}
/* Figma 241:4306 (474 × 87 = 3 righe da 29.2) */
.sh-info__lead {
  max-width: 476.92px;
  margin-top: 14.8px;              /* 147.39 - (33.59 + 99) */
  font-family: var(--f-2);
  font-weight: var(--fw-400);
  font-size: var(--fs-18);
  line-height: 29.2px;
  color: var(--c-firefly);
}
/* Figma 241:4308 (3 voci, passo 39) */
.sh-info__checks { margin-top: 32.6px; }
.sh-info__checks li {
  display: flex;
  align-items: center;
  gap: 13px;                       /* 37 - 24 */
  min-height: 26px;
  font-family: var(--f-2);
  font-weight: var(--fw-400);
  font-size: var(--fs-15);
  line-height: 24px;
  color: var(--c-elephant);
}
.sh-info__checks li + li { margin-top: 13px; }
/* Figma 241:4324 (346 × 68 = 3 righe da 22.67) */
.sh-info__note {
  max-width: 388.61px;
  margin-top: 30.7px;              /* 385.785 + 16.09 - (249.785 + 121.2) */
  font-family: var(--f-2);
  font-weight: var(--fw-400);
  font-size: var(--fs-15);
  line-height: 22.67px;
  color: var(--c-elephant);
}
.sh-info__note strong { font-weight: var(--fw-700); }

/* ---------- Colonna visiva — Figma 241:4326 (528.2 × 540) ---------- */
.sh-info__stage { position: relative; min-width: 0; aspect-ratio: 528.2 / 540; }
/* Overlay+Shadow — Figma 241:4327 (464.83 × 475.2, sborda a sinistra) */
.sh-info__photo {
  position: absolute;
  left: -7.16%; top: 0;
  width: 88.0%;
  height: 88.0%;
  object-fit: cover;
  border-radius: 40px;
  box-shadow: 0 40px 80px -34px rgba(11, 16, 18, 0.4);
}
/* Background — Figma 241:4366 (136.89 × 44) */
.sh-info__pill {
  position: absolute;
  left: -3.0%; top: 8.0%;
  display: inline-flex;
  align-items: center;
  gap: 10px;                       /* 45 - 15 - 20 */
  height: 44px;
  padding: 0 15px;
  background: var(--c-white);
  border-radius: var(--r-pill);
  box-shadow: 0 18px 38px -18px rgba(11, 16, 18, 0.35);
  font-family: var(--f-1);
  font-weight: var(--fw-700);
  font-size: var(--fs-14);
  line-height: 20px;
  color: var(--c-bunker);
  white-space: nowrap;
}
.sh-info__pill span {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20px; height: 20px;
  border-radius: 7px;
  background: #dbf7f9;
  flex-shrink: 0;
}
.sh-info__pill span img { width: 12px; height: 12px; }

/* Background+Border — Figma 241:4330 (230 × 440, mockup del telefono).
   Gli elementi sono posizionati in assoluto sulle coordinate del Figma:
   lo schermo e' 210 × 420 e ogni voce ha la sua y esatta. */
.sh-phone {
  position: absolute;
  left: 59.11%; top: 18.52%;
  width: 230px;
  height: 440px;
  padding: 10px;
  background: var(--c-white);
  border-radius: 34px;
  box-shadow: 0 34px 70px -30px rgba(11, 16, 18, 0.35);
}
.sh-phone__screen { position: relative; width: 210px; height: 420px; }
.sh-phone__screen > * { position: absolute; left: 16.8px; margin: 0; }
.sh-phone__kicker {
  top: 24.5px;
  font-family: var(--f-3);
  font-weight: var(--fw-700);
  font-size: 8px;
  line-height: 10px;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  color: var(--c-bunker);
}
.sh-phone__name {
  top: 42px;
  font-family: var(--f-1);
  font-weight: var(--fw-700);
  font-size: var(--fs-14);
  line-height: 18px;
  color: var(--c-bunker);
}
.sh-phone__meta {
  top: 63.7px;
  font-family: var(--f-2);
  font-weight: var(--fw-400);
  font-size: 7.5px;
  line-height: 9px;
  color: var(--c-grey-62);
}
.sh-phone__list { top: 105px; width: 176.4px; }
.sh-phone__row {
  position: relative;
  height: 49px;
  border-radius: 12px;
  background: var(--c-aqua-haze);
}
.sh-phone__list li + li { margin-top: 7px; }
.sh-phone__ic {
  position: absolute;
  left: 11.2px; top: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 23.8px; height: 23.8px;
  border-radius: 8px;
  background: var(--c-white);
}
.sh-phone__ic img { width: 12.6px; height: 12.6px; }
.sh-phone__t, .sh-phone__s, .sh-phone__open { position: absolute; }
.sh-phone__t {
  left: 44.8px; top: 12.6px;
  font-family: var(--f-1);
  font-weight: var(--fw-700);
  font-size: 9.8px;
  line-height: 12px;
  color: var(--c-bunker);
}
.sh-phone__s {
  left: 44.8px; top: 28px;
  font-family: var(--f-2);
  font-weight: var(--fw-400);
  font-size: 7.5px;
  line-height: 9px;
  color: #bec6ca;
}
.sh-phone__open {
  left: 156.8px; top: 22.4px;
  font-family: var(--f-3);
  font-weight: var(--fw-700);
  font-size: 7.5px;
  line-height: 9px;
  letter-spacing: 0.4px;
  color: #88d5dc;
}
.sh-phone__pw {
  top: 287px;
  width: 176.4px;
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 5.6px;
  font-family: var(--f-2);
  font-weight: var(--fw-400);
  font-size: 7.5px;
  line-height: 11.2px;
  color: #a9b0b4;
}
.sh-phone__pw span {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 11.2px; height: 11.2px;
  border-radius: 3.5px;
  background: var(--c-scooter);
  flex-shrink: 0;
}
.sh-phone__pw span img { width: 6px; height: 6px; }
.sh-phone__box {
  top: 316.4px;
  width: 176.4px;
  height: 84px;
  padding: 12.6px 11.2px;
  border-radius: 12px;
  background: var(--c-aqua-haze);
}
.sh-phone__box b {
  display: block;
  font-family: var(--f-1);
  font-weight: var(--fw-700);
  font-size: 8.8px;
  line-height: 11px;
  color: var(--c-bunker);
}
.sh-phone__box em {
  display: block;
  margin-top: 5.1px;
  font-style: normal;
  font-family: var(--f-2);
  font-weight: var(--fw-400);
  font-size: 7.5px;
  line-height: 9px;
  color: var(--c-grey-62);
}

@media (max-width: 1180px) {
  .sh-info__inner { grid-template-columns: 1fr; gap: 56px; }
  .sh-info__stage { max-width: 528.2px; width: 100%; margin-inline: auto; }
  .sh-info__glow { display: none; }
}
@media (max-width: 720px) {
  .sh-info { padding: 72px var(--sp-s); }
  .sh-info__inner { padding-inline: 0; }
  .sh-info__copy { padding-top: 0; }
  .sh-info__title { font-size: 32px; line-height: 1.08; letter-spacing: -0.6px; }
  .sh-info__lead { font-size: var(--fs-16); line-height: var(--lh-25-6); }
  .sh-phone { transform: scale(.85); transform-origin: right top; }
}

/* ============================================================
   SHARE — SECURE DOWNLOAD
   Figma: nodo 241:4374 (1920x732, fondo scuro)
   ============================================================ */
.sh-sec {
  position: relative;
  background: var(--c-bunker);
  padding: 96px var(--sp-s);
  overflow: hidden;
}
/* Gradient+Blur — Figma 241:4375 (x=824 y=-58.55, 520 × 460) */
.sh-sec__glow {
  position: absolute;
  left: 824px; top: -58.55px;
  width: 520px; height: 460px;
  border-radius: 230px;
  filter: blur(40px);
  background: radial-gradient(ellipse at 50% 50%,
              rgba(53, 209, 223, 0.18) 0%, rgba(53, 209, 223, 0) 68%);
  pointer-events: none;
}
.sh-sec__inner {
  position: relative;
  display: grid;
  grid-template-columns: 583.8fr 528.2fr;
  align-items: start;
  gap: var(--sp-xl);
  width: 100%;
  max-width: var(--w-container);
  margin-inline: auto;
  padding-inline: 32px;
}

/* ---------- Colonna testo — Figma 241:4377 ---------- */
.sh-sec__copy { min-width: 0; padding-top: 57.3px; }
.sh-sec__tags { display: flex; align-items: center; gap: 4.5px; }
/* Overlay+Border — Figma 241:4378 (212.69 × 35.59) */
.sh-sec__tag {
  display: inline-flex;
  align-items: center;
  gap: 9px;                        /* 38 - 16 - 13 */
  height: 35.59px;
  padding: 0 16px;
  border-radius: var(--r-pill);
  /* velo verde campionato sul fondo scuro, leggermente sfumato */
  background: linear-gradient(90deg, #2a4634 0%, #263826 100%);
  box-shadow: inset 0 0 0 var(--sw-1) #4e6c39;
  font-family: var(--f-3);
  font-weight: var(--fw-700);
  font-size: var(--fs-12);
  line-height: 18px;
  letter-spacing: var(--ls-1-1);
  text-transform: uppercase;
  color: var(--c-conifer);
  white-space: nowrap;
}
.sh-sec__tag img { width: 13px; height: 13px; }
/* Container — Figma 241:4383 */
.sh-sec__tag2 {
  font-family: var(--f-3);
  font-weight: var(--fw-700);
  font-size: var(--fs-12);
  line-height: 18px;
  letter-spacing: var(--ls-3-36);
  text-transform: uppercase;
  color: var(--c-conifer);
  white-space: nowrap;
}
/* Heading 2 — Figma 241:4385 (2 righe da 45.5) */
.sh-sec__title {
  margin-top: 32px;                /* 67.59 - 35.59 */
  font-family: var(--f-1);
  font-weight: var(--fw-800);
  font-size: var(--fs-44);
  line-height: 45.5px;
  letter-spacing: var(--ls--1-1);
  color: var(--c-white);
}
/* Figma 241:4387 (455 × 116 = 4 righe da 29) */
.sh-sec__lead {
  max-width: 476.92px;
  margin-top: 14.3px;              /* 172.915 - (67.59 + 91) */
  font-family: var(--f-2);
  font-weight: var(--fw-400);
  font-size: var(--fs-18);
  line-height: 29px;
  color: var(--c-green-spring);
}
/* Figma 241:4389 (3 voci, passo 39) */
.sh-sec__checks { margin-top: 32.5px; }
.sh-sec__checks li {
  display: flex;
  align-items: center;
  gap: 13px;
  min-height: 26px;
  font-family: var(--f-2);
  font-weight: var(--fw-400);
  font-size: var(--fs-15);
  line-height: 24px;
  color: var(--c-geyser);
}
.sh-sec__checks li + li { margin-top: 13px; }
.sh-sec__checks .cn-checks__box { background: var(--c-conifer-16); }

/* ---------- Colonna visiva — Figma 241:4405 (583.8 × 540) ---------- */
.sh-sec__stage {
  position: relative;
  min-width: 0;
  order: -1;                       /* nel Figma la visuale sta a sinistra */
  aspect-ratio: 583.8 / 540;
}
/* Overlay+Shadow — Figma 241:4406 (513.75 × 475.2) */
.sh-sec__photo {
  position: absolute;
  left: 0; top: 0;
  width: 88.0%;
  height: 88.0%;
  object-fit: cover;
  border-radius: 40px;
  box-shadow: 0 40px 80px -34px rgba(0, 0, 0, 0.55);
}
/* Background — Figma 241:4438 (107.72 × 44) */
.sh-sec__pill {
  position: absolute;
  left: 84.55%; top: 80.85%;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  height: 44px;
  padding: 0 15px;
  background: var(--c-white);
  border-radius: var(--r-pill);
  box-shadow: 0 18px 38px -18px rgba(0, 0, 0, 0.5);
  font-family: var(--f-1);
  font-weight: var(--fw-700);
  font-size: var(--fs-14);
  line-height: 20px;
  color: var(--c-bunker);
  white-space: nowrap;
}
.sh-sec__pill span {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20px; height: 20px;
  border-radius: 7px;
  background: var(--c-bunker);
  flex-shrink: 0;
}
.sh-sec__pill span img { width: 12px; height: 12px; }

/* Background+Border — Figma 241:4408 (230 × 440, mockup scuro).
   Come per Info Hub, ogni voce e' sulle coordinate esatte del Figma. */
.sh-dl {
  position: absolute;
  left: 60.60%; top: 18.52%;
  width: 230px;
  height: 440px;
  padding: 10px;
  background: var(--c-bunker);
  border-radius: 34px;
  box-shadow: inset 0 0 0 var(--sw-1) #1c2427, 0 34px 70px -30px rgba(0, 0, 0, 0.6);
}
.sh-dl__screen { position: relative; width: 210px; height: 420px; }
.sh-dl__screen > * { position: absolute; margin: 0; }
.sh-dl__kicker {
  left: 16.8px; top: 28.7px;
  font-family: var(--f-3);
  font-weight: var(--fw-700);
  font-size: 8px;
  line-height: 10px;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  color: var(--c-rolling-stone);
}
.sh-dl__badge {
  left: 75.6px; top: 75.6px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 58.8px; height: 58.8px;
  border-radius: 50%;
  background: var(--c-conifer-16);
}
.sh-dl__badge img { width: 18.2px; height: 22.4px; }
.sh-dl__file {
  left: 0; top: 147.7px;
  width: 210px;
  text-align: center;
  font-family: var(--f-1);
  font-weight: var(--fw-700);
  font-size: 11.9px;
  line-height: 15px;
  color: var(--c-white);
}
.sh-dl__note {
  left: 0; top: 167.3px;
  width: 210px;
  text-align: center;
  font-family: var(--f-2);
  font-weight: var(--fw-400);
  font-size: 7.5px;
  line-height: 9px;
  color: var(--c-rolling-stone);
}
.sh-dl__label {
  left: 23.8px; top: 202.3px;
  font-family: var(--f-2);
  font-weight: var(--fw-400);
  font-size: 7.5px;
  line-height: 9px;
  color: #4a5458;
}
.sh-dl__input {
  left: 16.8px; top: 218.4px;
  display: flex;
  align-items: center;
  gap: 5.6px;
  width: 176.4px; height: 36.4px;
  padding: 0 13.3px;
  border-radius: 10px;
  background: #171c1e;
}
.sh-dl__input i {
  display: block;
  width: 7px; height: 7px;
  border-radius: 50%;
  background: var(--c-conifer);
}
.sh-dl__btn {
  left: 16.8px; top: 274.4px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5.6px;
  width: 176.4px; height: 39.2px;
  border-radius: var(--r-pill);
  background: var(--c-conifer);
  font-family: var(--f-1);
  font-weight: var(--fw-700);
  font-size: 10.5px;
  line-height: 13px;
  color: var(--c-bunker);
}
.sh-dl__btn img { width: 8.4px; height: 11.2px; }
.sh-dl__foot {
  left: 16.8px; top: 340.2px;
  display: flex;
  align-items: center;
  gap: 5.6px;
  width: 176.4px;
  white-space: nowrap;
  font-family: var(--f-2);
  font-weight: var(--fw-400);
  font-size: 7.5px;
  line-height: 11.2px;
  color: var(--c-white);
}
.sh-dl__foot span {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 11.2px; height: 11.2px;
  border-radius: 3.5px;
  background: var(--c-scooter);
  flex-shrink: 0;
}
.sh-dl__foot span img { width: 6px; height: 6px; }

@media (max-width: 1180px) {
  .sh-sec__inner { grid-template-columns: 1fr; gap: 56px; }
  .sh-sec__stage { max-width: 583.8px; width: 100%; margin-inline: auto; }
  .sh-sec__glow { display: none; }
}
@media (max-width: 720px) {
  .sh-sec { padding: 72px var(--sp-s); }
  .sh-sec__inner { padding-inline: 0; }
  .sh-sec__copy { padding-top: 0; }
  .sh-sec__tags { flex-wrap: wrap; gap: 10px; }
  .sh-sec__title { font-size: 32px; line-height: 1.08; letter-spacing: -0.6px; }
  .sh-sec__lead { font-size: var(--fs-16); line-height: var(--lh-25-6); }
  .sh-dl { transform: scale(.85); transform-origin: right top; }
}

/* ============================================================
   SHARE — NOTE (striscia a gradiente con due schede)
   Figma: nodo 241:4446 (1920x478.79)
   ============================================================ */
.sh-note {
  padding: 96px var(--sp-s);
  background: linear-gradient(125.0000006419479deg,
              var(--c-java) 0%, var(--c-scooter) 30%,
              var(--c-green-74) 62%, var(--c-conifer) 100%);
}
.sh-note__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sp-xl);
  width: 100%;
  max-width: var(--w-container);
  margin-inline: auto;
  padding-inline: 32px;
}
/* Container — Figma 241:4448 (556 × 175.8, centrato in verticale) */
.sh-note__copy { align-self: center; min-width: 0; }
.sh-note__copy .eyebrow { color: var(--c-teal-26); padding-top: 6.9px; }
.sh-note__copy .eyebrow::before { background: var(--c-teal-26); }
/* Heading 2 — Figma 241:4452 (riga singola alta 41) */
.sh-note__title {
  margin-top: 10.7px;              /* 37.6 - 6.9 - 20 */
  font-family: var(--f-1);
  font-weight: var(--fw-800);
  font-size: var(--fs-38);
  line-height: 41px;
  letter-spacing: -0.836px;
  color: var(--c-bunker);
}
/* Figma 241:4454 (444 × 82 = 3 righe da 27.33) */
.sh-note__lead {
  max-width: 450.42px;
  margin-top: 15.2px;              /* 89.3 + 4.49 - (37.6 + 41) */
  font-family: var(--f-2);
  font-weight: var(--fw-400);
  font-size: 17px;
  line-height: 27.33px;
  color: var(--c-teal-20);
}

/* Schede — Figma 241:4457 / 4463 (556 × 136.39, velo bianco al 50%) */
.sh-note__cards { display: flex; flex-direction: column; gap: 14px; }
.sh-note__card {
  padding: 28px 23px 23px;
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.5);
  /* nel Figma il contorno e' interno e piu' chiaro del riempimento */
  box-shadow: inset 0 0 0 var(--sw-1) rgba(255, 255, 255, 0.8);
}
.sh-note__kicker {
  font-family: var(--f-3);
  font-weight: var(--fw-700);
  font-size: var(--fs-12);
  line-height: 18px;
  letter-spacing: var(--ls-1-1);
  text-transform: uppercase;
  color: var(--c-teal-26);
}
/* Heading 4 — Figma 241:4459 */
.sh-note__h {
  margin-top: 9.59px;              /* 51 + 4.59 - (28 + 18) */
  font-family: var(--f-1);
  font-weight: var(--fw-700);
  font-size: var(--fs-19);
  line-height: 29px;
  letter-spacing: var(--ls--0-28);
  color: var(--c-bunker);
}
/* Figma 241:4461 */
.sh-note__t {
  margin-top: 5.8px;               /* 90.39 - (51 + 34.39) + 1 */
  font-family: var(--f-2);
  font-weight: var(--fw-400);
  font-size: var(--fs-14);
  line-height: 23px;
  color: #2c3a33;
}

@media (max-width: 1024px) {
  .sh-note__inner { grid-template-columns: 1fr; gap: 48px; }
}
@media (max-width: 720px) {
  .sh-note { padding: 72px var(--sp-s); }
  .sh-note__inner { padding-inline: 0; }
  .sh-note__title { font-size: 30px; line-height: 1.1; letter-spacing: -0.6px; }
  .sh-note__lead { font-size: var(--fs-16); line-height: var(--lh-25-6); }
  .sh-note__card { padding: 22px 18px; }
}

/* ============================================================
   SHARE — COSA PUOI CONDIVIDERE
   Figma: nodo 241:4469 (1920x990.6, fondo lime)
   ============================================================ */
.sh-cond {
  background: var(--c-conifer);
  padding: 96px var(--sp-s);
}
.sh-cond__inner {
  width: 100%;
  max-width: var(--w-container);
  margin-inline: auto;
  padding-inline: 32px;
}
/* Container — Figma 241:4471 */
.sh-cond__head { max-width: 605.63px; }
.sh-cond__head .eyebrow { color: var(--c-teal-26); padding-top: 6.91px; }
.sh-cond__head .eyebrow::before { background: var(--c-teal-26); }
/* Heading 2 — Figma 241:4475 (riga singola alta 47) */
.sh-cond__title {
  margin-top: 14.69px;             /* 41.6 - 6.91 - 20 */
  font-family: var(--f-1);
  font-weight: var(--fw-800);
  font-size: var(--fs-46);
  line-height: var(--lh-47-84);
  letter-spacing: var(--ls--0-92);
  color: var(--c-bunker);
}

/* Mosaico — Figma 241:4477 (1176 × 662, 6 celle su tre bande) */
.sh-cond__grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  grid-auto-rows: 210px;
  gap: 16px;
  margin-top: 48px;
}
.sh-cond__cell {
  position: relative;
  margin: 0;
  overflow: hidden;
  border-radius: 30px;
}
.sh-cond__cell picture { display: block; height: 100%; }
.sh-cond__cell img { width: 100%; height: 100%; object-fit: cover; }
/* 01 occupa mezza larghezza e due bande */
.sh-cond__cell--big  { grid-column: span 3; grid-row: span 2; }
/* 02 e 03: mezza larghezza, una banda */
.sh-cond__cell--wide { grid-column: span 3; }
/* 04, 05, 06: un terzo ciascuna */
.sh-cond__cell--third { grid-column: span 2; }
/* Container — Figma 241:4480 (numero in alto a sinistra) */
.sh-cond__num {
  position: absolute;
  left: 16px; top: 14px;
  font-family: var(--f-1);
  font-weight: var(--fw-700);
  font-size: var(--fs-14);
  line-height: 21px;
  color: var(--c-white);
}
/* Su 01 e 03 la foto e' chiara e nel Figma il numero e' scuro */
.sh-cond__num--dark { color: var(--c-bunker); }
/* Background+OverlayBlur — Figma 241:4482 (pillola in basso a sinistra) */
.sh-cond__pill {
  position: absolute;
  left: 16px; bottom: 13.79px;
  padding: 7px 14px;
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(10px);
  border-radius: var(--r-pill);
  font-family: var(--f-1);
  font-weight: var(--fw-700);
  font-size: var(--fs-14);
  line-height: 21px;
  color: var(--c-bunker);
  white-space: nowrap;
}

@media (max-width: 1120px) {
  .sh-cond__grid { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 190px; }
  .sh-cond__cell--big { grid-column: span 2; grid-row: span 2; }
  .sh-cond__cell--wide, .sh-cond__cell--third { grid-column: span 1; }
}
@media (max-width: 720px) {
  .sh-cond { padding: 72px var(--sp-s); }
  .sh-cond__inner { padding-inline: 0; }
  .sh-cond__title { font-size: 32px; line-height: 1.08; letter-spacing: -0.6px; }
  .sh-cond__grid { grid-template-columns: 1fr; grid-auto-rows: 200px; gap: 12px; }
  .sh-cond__cell--big { grid-column: span 1; grid-row: span 1; }
  .sh-cond__cell { border-radius: 22px; }
}

/* ============================================================
   SHARE — FAQ
   Figma: nodo 241:4514 (1920x660.2). Le schede riusano .faq-*.
   ============================================================ */
.sh-faq { padding: 96px var(--sp-s); }
.sh-faq__inner {
  width: 100%;
  max-width: var(--w-container);
  margin-inline: auto;
  padding-inline: 32px;
}
.sh-faq__intro { max-width: 605.63px; padding-top: 6.91px; }
/* Heading 2 — Figma 241:4520 (riga singola alta 47) */
.sh-faq__title {
  margin-top: 14.69px;
  font-family: var(--f-1);
  font-weight: var(--fw-800);
  font-size: var(--fs-46);
  line-height: var(--lh-47-84);
  letter-spacing: var(--ls--0-92);
  color: var(--c-bunker);
}
.sh-faq .faq-grid { margin-top: 48px; }

/* ============================================================
   SHARE — CTA FINALE
   Figma: nodo 241:4547 (1920x549.21)
   ============================================================ */
.sh-cta {
  position: relative;
  padding: 128px var(--sp-s);
  overflow: hidden;
  text-align: center;
}
.sh-cta__glows {
  position: absolute;
  top: 0; bottom: 0;
  left: 50%;
  width: var(--w-container);
  margin-left: -620px;             /* meta' di --w-container */
  pointer-events: none;
}
/* Gradient+Blur — Figma 241:4548 (x=263 y=19.28, 760 × 460, ciano) */
.sh-cta__glow--cyan {
  position: absolute;
  left: -77px; top: 19.28px;
  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%);
}
/* Gradient+Blur — Figma 241:4549 (x=949 y=218.28, 520 × 360, lime) */
.sh-cta__glow--lime {
  position: absolute;
  left: 609px; top: 218.28px;
  width: 520px; height: 360px;
  border-radius: 180px;
  filter: blur(40px);
  background: radial-gradient(ellipse at 50% 50%,
              rgba(194, 232, 80, 0.30) 0%, rgba(194, 232, 80, 0) 64%);
}
.sh-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;
}
/* Container — Figma 241:4551: qui l'occhiello non ha il trattino */
.sh-cta__eyebrow {
  margin-top: 3.5px;
  font-family: var(--f-3);
  font-weight: var(--fw-700);
  font-size: var(--fs-12);
  line-height: 20px;
  letter-spacing: var(--ls-3-36);
  text-transform: uppercase;
  color: var(--c-java);
}
/* Heading 2 — Figma 241:4553 (riga singola alta 57.83) */
.sh-cta__title {
  margin-top: 17.1px;              /* 40.6 - 3.5 - 20 */
  white-space: nowrap;
  font-family: var(--f-1);
  font-weight: var(--fw-800);
  font-size: 58px;
  line-height: 57.83px;
  letter-spacing: -1.05px;
  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;
}
.sh-cta__title span { color: var(--c-bunker); }
/* Figma 241:4555 (487 × 61 = 2 righe da 30.5) */
.sh-cta__lead {
  width: 487px;
  max-width: 100%;
  margin-top: 23.2px;              /* 115.53 + 6.095 - (40.6 + 57.83) */
  font-family: var(--f-2);
  font-weight: var(--fw-400);
  font-size: var(--fs-19);
  line-height: 30.5px;
  color: var(--c-shuttle-gray);
}
/* Figma 241:4557 — i due bottoni */
.sh-cta__actions {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--sp-14);
  margin-top: 48.6px;              /* 200.31 + 30.9 - (115.53 + 67.68) */
}
.sh-cta__actions .btn-gradient { margin-top: 0; width: 263.01px; }
.sh-cta__actions .btn-outline  { width: 218px; }

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