/* ============================================================
   CONNECT — Header/HERO
   Figma: nodo 230:1576 (pagina 230:1575)
   ============================================================ */
.cn-hero {
  position: relative;
  padding: 96px var(--sp-s) 128px;
  background: var(--c-bunker);
  overflow: hidden;
}
/* Gradient+Blur — Figma 230:1577 e 230:1578 */
.cn-hero__glow--cyan {
  position: absolute;
  left: 1400px; top: -200px;
  width: 640px; height: 640px;
  border-radius: 320px;
  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;
}
.cn-hero__glow--lime {
  position: absolute;
  left: -140px; top: 484px;
  width: 520px; height: 520px;
  border-radius: 260px;
  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;
}
.cn-hero__inner {
  position: relative;
  display: grid;
  grid-template-columns: 583.8fr 528.2fr;
  align-items: center;
  gap: var(--sp-xl);
  width: 100%;
  max-width: var(--w-container);
  margin-inline: auto;
  padding-inline: 32px;
}
/* Figma 230:1580 */
.cn-hero__copy { min-width: 0; }
.cn-hero__copy .fz-breadcrumb { color: var(--c-regent-gray); }
.cn-hero__copy .fz-breadcrumb a { color: var(--c-regent-gray); }
.cn-hero__copy .fz-breadcrumb a:hover,
.cn-hero__copy .fz-breadcrumb strong { color: var(--c-white); }

.cn-hero__eyebrow { margin-top: 22.9px; }
/* Heading 1 — Figma 230:1587 (583.8 × 150 = 2 righe da 75) */
.cn-hero__title {
  margin-top: 22.9px;
  font-family: var(--f-1);
  font-weight: var(--fw-900);
  font-size: var(--fs-78);
  line-height: 75px;
  letter-spacing: var(--ls--1-72);
  color: var(--c-white);
}
/* Figma 230:1589 (517 × 92 = 3 righe da 30.4) */
.cn-hero__lead {
  max-width: 517px;
  margin-top: 23.1px;
  font-family: var(--f-2);
  font-weight: var(--fw-400);
  font-size: var(--fs-19);
  line-height: var(--lh-30-4);
  color: var(--c-green-spring);
}
/* Figma 230:1590 */
.cn-hero__actions {
  display: flex;
  align-items: center;
  gap: var(--sp-14);
  margin-top: 32px;
}
/* Link — Figma 230:1591 (243.67 × 60, fondo lime) */
.btn-lime {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: var(--sp-9);
  height: 60px;
  padding: 0 15px 0 28px;
  background: var(--c-conifer);
  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: transform .18s ease, box-shadow .18s ease;
}
.btn-lime:hover { transform: translateY(-1px); box-shadow: 0 10px 26px -12px var(--c-conifer); }
.btn-lime__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px; height: 30px;
  border-radius: 15px;
  background: var(--c-bunker);
  flex-shrink: 0;
}
.btn-lime__icon img { width: 9.56667px; height: 8.4px; }
/* Component 4 — Figma 230:1596 (236 × 60, contornato su fondo scuro) */
.btn-outline-dark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 60px;
  padding-inline: 27px;
  border: var(--sw-1) solid var(--c-outer-space);
  border-radius: var(--r-pill);
  font-family: var(--f-1);
  font-weight: var(--fw-700);
  font-size: var(--fs-16);
  line-height: var(--lh-25-6);
  color: var(--c-white);
  white-space: nowrap;
  transition: border-color .18s ease, background-color .18s ease;
}
.btn-outline-dark:hover { border-color: var(--c-white-16); background: var(--c-white-4); }
/* Figma 230:1597 */
.cn-hero__note {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-top: 22.9px;
  font-family: var(--f-2);
  font-weight: var(--fw-400);
  font-size: var(--fs-13);
  line-height: var(--lh-20-8);
  color: var(--c-regent-gray);
}
.cn-hero__note::before {
  content: "";
  width: 8px; height: 8px;
  border-radius: 4px;
  background: var(--c-conifer);
  flex-shrink: 0;
}

/* ---------- Colonna destra — Figma 230:1600 (528.2 × 560) ----------
   L'altezza nasce dal telefono, che sta nel flusso: niente aspect-ratio,
   così il calcolo e' identico in ogni motore di rendering. */
.cn-stage {
  position: relative;
  display: flex;
  justify-content: center;
  padding-block: 3.976%;         /* 21 / 528.2 */
  min-width: 0;
}
/* Border — Figma 230:1601 / 230:1602 / 230:1603 (cerchi concentrici).
   height:0 + padding-bottom in % rende il quadrato a partire dalla larghezza. */
.cn-stage__ring {
  position: absolute;
  height: 0;
  border-radius: 50%;
  border: var(--sw-1) solid;
  pointer-events: none;
}
.cn-stage__ring--1 { left: -1.12%; top: 1.79%;  width: 102.23%; padding-bottom: 102.23%; border-color: rgba(53, 209, 223, 0.10); }
.cn-stage__ring--2 { left: 10.24%; top: 12.50%; width: 79.52%;  padding-bottom: 79.52%;  border-color: rgba(53, 209, 223, 0.20); }
.cn-stage__ring--3 { left: 21.60%; top: 23.21%; width: 56.80%;  padding-bottom: 56.80%;  border-color: rgba(53, 209, 223, 0.28); }
/* Background+Border — Figma 230:1604 (270 × 518, cornice del telefono) */
.cn-phone {
  position: relative;
  width: 51.12%;                 /* 270 / 528.2 */
  padding: 4.07%;                /* 11 / 270 */
  background: #0e1519;
  border: var(--sw-1) solid #202a2e;
  border-radius: 36px;
  box-shadow: 0 40px 80px -30px rgba(0, 0, 0, 0.7);
}
.cn-phone img { width: 100%; height: auto; border-radius: 26px; }
/* Background — Figma 230:1608 e 230:1613 (pillole) */
.cn-pill {
  position: absolute;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  height: 44.8px;
  padding-inline: 16px;
  background: #f3f3f3;
  border-radius: var(--r-pill);
  box-shadow: 0 16px 34px -16px rgba(0, 0, 0, 0.55);
  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;
}
.cn-pill::before {
  content: "";
  width: 9px; height: 9px;
  border-radius: 50%;
  flex-shrink: 0;
}
.cn-pill--ring   { left: -2%;     top: 13.99%; }   /* 78.39 / 560 */
.cn-pill--ring::before { background: var(--c-conifer); }
.cn-pill--answer { left: 74.52%;  top: 76.00%; }   /* 425.61 / 560 */
.cn-pill--answer::before { background: var(--c-scooter); }

@media (max-width: 1180px) {
  .cn-hero__inner { grid-template-columns: 1fr; gap: 48px; }
  .cn-stage { max-width: 528.2px; margin-inline: auto; width: 100%; }
  .cn-hero__glow--cyan, .cn-hero__glow--lime { display: none; }
}
@media (max-width: 720px) {
  .cn-hero { padding: 72px var(--sp-s) 88px; }
  .cn-hero__inner { padding-inline: 0; }
  .cn-hero__title { font-size: 44px; line-height: 1.04; letter-spacing: -0.9px; }
  .cn-hero__lead { font-size: var(--fs-16); line-height: var(--lh-25-6); }
  .cn-hero__actions { flex-direction: column; align-items: stretch; }
  .btn-lime, .btn-outline-dark { justify-content: center; }
  .cn-pill { transform: scale(.85); }
}

/* ============================================================
   CONNECT — Section "CLAIM"
   Figma: nodo 230:1618
   ============================================================ */
.cn-claim {
  padding: 96px var(--sp-s);
  background: var(--c-conifer);
  text-align: center;
}
.cn-claim__inner {
  width: 100%;
  max-width: var(--w-container);
  margin-inline: auto;
  padding-inline: 32px;
}
/* Figma 230:1621 (616 × 152 = 2 righe da 76.44) */
.cn-claim__title {
  white-space: nowrap;
  max-width: none;
  margin-inline: auto;
  font-family: var(--f-1);
  font-weight: var(--fw-900);
  font-size: var(--fs-78);
  line-height: var(--lh-76-44);
  letter-spacing: var(--ls--1-72);
  color: var(--c-bunker);
}
/* Le due righe sono interrotte a mano: "Il citofono e' fermo al muro."
   sulla prima, "Tu no." sulla seconda. nowrap impedisce altri a capo. */
.cn-claim__title span { color: var(--c-white); }
/* Figma 230:1623 (500 × 92 = 3 righe da 30.4) */
.cn-claim__lead {
  max-width: 500px;
  margin: 30.89px 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-bunker);
}
@media (max-width: 720px) {
  .cn-claim { padding: 72px var(--sp-s); }
  .cn-claim__inner { padding-inline: 0; }
  .cn-claim__title { font-size: 40px; line-height: 1.06; letter-spacing: -0.9px; white-space: normal; }
  .cn-claim__lead { font-size: var(--fs-16); line-height: var(--lh-25-6); }
}

/* ============================================================
   CONNECT — Section "TI RAGGIUNGE OVUNQUE"
   Figma: nodo 230:1624
   ============================================================ */
.cn-ovunque { padding: 96px var(--sp-s); }
.cn-ovunque__inner {
  width: 100%;
  max-width: var(--w-container);
  margin-inline: auto;
  padding-inline: 32px;
}
.cn-ovunque__intro {
  max-width: 605.63px;
  margin-inline: auto;
  padding-top: 6.91px;
  text-align: center;
}
/* Heading 2 — Figma 230:1631 (564 × 93 = 2 righe da 46.2) */
.cn-ovunque__title {
  max-width: 564px;
  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:1633 (587 × 61.58 = 2 righe da 30.4) */
.cn-ovunque__lead {
  max-width: 587px;
  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);
}
/* Figma 230:1634 (tre tessere 378.66 × 373, passo 398.66) */
.cn-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-top: 48px;
}
.cn-card {
  position: relative;
  background: var(--c-white);
  border-radius: 46px;
  overflow: hidden;
  box-shadow: 0 30px 60px -34px rgba(11, 16, 18, 0.35);
}
.cn-card__photo {
  display: block;
  width: 100%;
  height: 262px;
  object-fit: cover;
}
/* badge "IN ARRIVO" — stessa pastiglia di stato usata altrove */
.cn-badge {
  position: absolute;
  left: 17px;
  top: 18px;
  display: inline-flex;
  align-items: center;
  gap: var(--sp-7);
  height: 32px;
  padding: 7.5px 13px 8.5px;
  background: var(--c-bunker-85);
  border-radius: var(--r-pill);
  -webkit-backdrop-filter: blur(3px);
  backdrop-filter: blur(3px);
  font-family: var(--f-1);
  font-weight: var(--fw-600);
  font-size: var(--fs-10);
  line-height: 16px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--c-white);
  white-space: nowrap;
}
.cn-badge::before {
  content: "";
  width: 6px; height: 6px;
  border-radius: 3px;
  background: var(--c-conifer);
  flex-shrink: 0;
}
.cn-card__body { padding: 26px; }
.cn-card__title {
  font-family: var(--f-1);
  font-weight: var(--fw-700);
  font-size: var(--fs-19);
  line-height: var(--lh-30-4);
  color: var(--c-bunker);
}
.cn-card__text {
  margin-top: 6px;
  font-family: var(--f-2);
  font-weight: var(--fw-400);
  font-size: var(--fs-15);
  line-height: var(--fs-24);
  color: var(--c-shuttle-gray);
}

@media (max-width: 980px) {
  .cn-cards { grid-template-columns: 1fr; }
  .cn-card__photo { height: 220px; }
}
@media (max-width: 720px) {
  .cn-ovunque { padding: 72px var(--sp-s); }
  .cn-ovunque__inner { padding-inline: 0; }
  .cn-ovunque__title { font-size: 32px; line-height: 1.08; letter-spacing: -0.6px; }
  .cn-ovunque__lead { font-size: var(--fs-16); line-height: var(--lh-27-2); }
  .cn-card { border-radius: 32px; }
}

/* ============================================================
   CONNECT — Section "CITOFONO CONDIVISO"
   Figma: nodo 230:1638
   ============================================================ */
.cn-shared {
  position: relative;
  padding: 96px var(--sp-s);
  background: var(--c-scooter);
  overflow: hidden;
}
/* Gradient+Blur — Figma 230:1639 */
.cn-shared__glow {
  position: absolute;
  left: 1513.59px; top: -183.59px;
  width: 560px; height: 560px;
  border-radius: 280px;
  filter: blur(40px);
  background: radial-gradient(circle at 50% 50%,
              rgba(255, 255, 255, 0.32) 0%, rgba(255, 255, 255, 0) 62%);
  pointer-events: none;
}
.cn-shared__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;
}
.cn-shared__copy { min-width: 0; }
.cn-shared__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:1646 (556 × 95.57 = 2 righe da 47.84) */
.cn-shared__title {
  margin-top: 14.8px;
  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);
}
/* Figma 230:1648 (453 × 116.6 = 4 righe da 28.8) */
.cn-shared__lead {
  max-width: 453px;
  margin-top: 14.8px;
  font-family: var(--f-2);
  font-weight: var(--fw-400);
  font-size: var(--fs-18);
  line-height: var(--lh-28-8);
  color: var(--c-elephant);
}
/* Figma 230:1649 — elenco con spunte, passo 35.5 */
.cn-checks { margin-top: 32.4px; }
.cn-checks li {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 24px;
  font-family: var(--f-2);
  font-weight: var(--fw-400);
  font-size: var(--fs-15);
  line-height: var(--fs-24);
  color: var(--c-teal-20);
}
.cn-checks li + li { margin-top: 11.5px; }
.cn-checks__box {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px; height: 24px;
  border-radius: 8px;
  background: var(--c-white);
  flex-shrink: 0;
}
.cn-checks__box img { width: 13px; height: 13px; }

/* ---------- Diagramma — Figma 230:1662 (556 × 420) ---------- */
.cn-net {
  position: relative;
  min-width: 0;
  aspect-ratio: 556 / 420;
}
.cn-net__lines { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; pointer-events: none; }
.cn-net__node {
  position: absolute;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 14.03%;                 /* 78 / 556 */
  aspect-ratio: 1;
  background: var(--c-white);
  border-radius: 22px;
  box-shadow: 0 18px 34px -18px rgba(11, 16, 18, 0.35);
}
.cn-net__node--tl { left: 14.03%; top: 5.93%; }
.cn-net__node--tr { left: 71.94%; top: 5.93%; }
.cn-net__node--bl { left: 14.03%; top: 74.97%; }
.cn-net__node--br { left: 71.94%; top: 74.97%; }
/* gli avatar sono disegnati nell'SVG (vedi connect.php) */
.cn-net__name {
  position: absolute;
  left: 0; right: 0;
  top: 63.72%;                   /* 49.705 / 78 */
  font-family: var(--f-1);
  font-weight: var(--fw-700);
  font-size: var(--fs-12);
  line-height: 18.59px;
  text-align: center;
  color: var(--c-bunker);
}
/* Background — Figma 230:1688 (120 × 120) */
.cn-net__hub {
  position: absolute;
  left: 39.21%; top: 35.71%;     /* 218 / 556 e 150 / 420 */
  width: 21.58%;                 /* 120 / 556 */
  aspect-ratio: 1;
  background: var(--c-bunker);
  border-radius: 30px;
  box-shadow: 0 26px 50px -20px rgba(11, 16, 18, 0.5);
}
.cn-net__hub img {
  position: absolute;
  left: 37.5%; top: 29.17%;      /* 45 / 120 e 35 / 120 */
  width: 25%;                    /* 30 / 120 */
  height: auto;
}
.cn-net__hub span {
  position: absolute;
  left: 0; right: 0;
  top: 58.33%;                   /* 70 / 120 */
  font-family: var(--f-1);
  font-weight: var(--fw-600);
  font-size: var(--fs-10);
  line-height: 15px;
  letter-spacing: 1px;
  text-transform: uppercase;
  text-align: center;
  color: var(--c-white);
}

@media (max-width: 1100px) {
  .cn-shared__inner { grid-template-columns: 1fr; gap: 48px; }
  .cn-net { max-width: 556px; width: 100%; margin-inline: auto; }
  .cn-shared__glow { display: none; }
}
@media (max-width: 720px) {
  .cn-shared { padding: 72px var(--sp-s); }
  .cn-shared__inner { padding-inline: 0; }
  .cn-shared__title { font-size: 32px; line-height: 1.08; letter-spacing: -0.6px; }
  .cn-shared__lead { font-size: var(--fs-16); line-height: var(--lh-25-6); }
}

/* ============================================================
   CONNECT — Section "COME FUNZIONA"
   Figma: nodo 230:1696
   ============================================================ */
.cn-steps {
  position: relative;
  padding: 96px var(--sp-s);
  background: var(--c-bunker);
  overflow: hidden;
}
/* Gradient+Blur — Figma 230:1697 */
.cn-steps__glow {
  position: absolute;
  left: 729.59px; top: 0;
  width: 500px; height: 420px;
  border-radius: 210px;
  filter: blur(40px);
  background: radial-gradient(ellipse at 50% 50%,
              rgba(53, 209, 223, 0.22) 0%, rgba(53, 209, 223, 0) 64%);
  pointer-events: none;
}
.cn-steps__inner {
  position: relative;
  width: 100%;
  max-width: var(--w-container);
  margin-inline: auto;
  padding-inline: 32px;
}
.cn-steps__intro { max-width: 605.63px; padding-top: 6.91px; }
/* Heading 2 — Figma 230:1704 (riga singola alta 47) */
.cn-steps__title {
  margin-top: 14.68px;
  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-white);
}
/* Figma 230:1705 (tre tessere 380 × 248, passo 398) */
.cn-steps__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
  margin-top: 48px;
}
.cn-step {
  min-height: 248px;
  padding: 35px;
  background: var(--c-white-4);
  border: var(--sw-1) solid var(--c-azure-16);
  border-radius: 32px;
}
.cn-step__num {
  display: block;
  font-family: var(--f-1);
  font-weight: var(--fw-900);
  font-size: var(--fs-50);
  line-height: var(--fs-50);
  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;
}
.cn-step__title {
  margin-top: 10px;
  padding-top: var(--sp-xxs);
  font-family: var(--f-1);
  font-weight: var(--fw-700);
  font-size: 20px;
  line-height: var(--lh-32);
  color: var(--c-white);
}
.cn-step__text {
  margin-top: 10px;
  font-family: var(--f-2);
  font-weight: var(--fw-400);
  font-size: var(--fs-15);
  line-height: var(--fs-24);
  color: var(--c-green-spring);
}
@media (max-width: 1024px) {
  .cn-steps__grid { grid-template-columns: 1fr; gap: 16px; }
  .cn-step { min-height: 0; }
  .cn-steps__glow { display: none; }
}
@media (max-width: 720px) {
  .cn-steps { padding: 72px var(--sp-s); }
  .cn-steps__inner { padding-inline: 0; }
  .cn-steps__title { font-size: 32px; line-height: 1.08; letter-spacing: -0.6px; }
  .cn-step { padding: 28px; }
}

/* ============================================================
   CONNECT — Section "NOTE"
   Figma: nodo 230:1727
   ============================================================ */
.cn-note-sec {
  padding: 96px var(--sp-s);
  background: linear-gradient(125deg,
              var(--c-java) 0%, var(--c-scooter) 30%,
              var(--c-green-74) 62%, var(--c-conifer) 100%);
}
.cn-note-sec__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;
}
.cn-note-sec__copy { min-width: 0; padding-top: 6.91px; }
.cn-note-sec__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:1734 (riga singola alta 41) */
.cn-note-sec__title {
  margin-top: 10.7px;
  font-family: var(--f-1);
  font-weight: var(--fw-800);
  font-size: 40px;
  line-height: 41px;
  letter-spacing: var(--ls--0-84);
  color: var(--c-bunker);
}
/* Figma 230:1736 (381 × 55 = 2 righe da 27.2) */
.cn-note-sec__lead {
  max-width: 381px;
  margin-top: 15.1px;
  font-family: var(--f-2);
  font-weight: var(--fw-400);
  font-size: 17px;
  line-height: var(--lh-27-2);
  color: var(--c-teal-20);
}
/* Overlay+Border — Figma 230:1738 e 230:1744 */
.cn-note-sec__cards {
  display: flex;
  flex-direction: column;
  gap: 14px;
  min-width: 0;
}
.cn-note-card {
  padding: 28px 23px;
  background: rgba(255, 255, 255, 0.55);
  border: var(--sw-1) solid rgba(255, 255, 255, 0.65);
  border-radius: 16px;
}
.cn-note-card__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);
}
.cn-note-card__title {
  margin-top: 5px;
  font-family: var(--f-1);
  font-weight: var(--fw-700);
  font-size: var(--fs-18);
  line-height: var(--lh-28-8);
  color: var(--c-bunker);
}
.cn-note-card__text {
  margin-top: 10.6px;
  font-family: var(--f-2);
  font-weight: var(--fw-400);
  font-size: var(--fs-14);
  line-height: 22.8px;
  color: var(--c-teal-20);
}
@media (max-width: 1100px) {
  .cn-note-sec__inner { grid-template-columns: 1fr; gap: 40px; }
}
@media (max-width: 720px) {
  .cn-note-sec { padding: 72px var(--sp-s); }
  .cn-note-sec__inner { padding-inline: 0; }
  .cn-note-sec__title { font-size: 30px; line-height: 1.1; }
  .cn-note-sec__lead { font-size: var(--fs-16); line-height: var(--lh-25-6); }
}

/* ============================================================
   CONNECT — Section "FAQ" e "CTA FINALE"
   Figma: nodi 230:1750 e 230:1783
   ============================================================ */
.cn-faq { padding: 96px var(--sp-s); }
.cn-faq__inner {
  width: 100%;
  max-width: var(--w-container);
  margin-inline: auto;
  padding-inline: 32px;
}
.cn-faq__intro { max-width: 605.63px; padding-top: 6.91px; }
/* Heading 2 — Figma 230:1757 (riga singola alta 47) */
.cn-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);
}
.cn-faq .faq-grid { margin-top: 48px; }

/* ---------- CTA FINALE — Figma 230:1783 ---------- */
.cn-cta {
  position: relative;
  padding: 128px var(--sp-s);
  overflow: hidden;
  text-align: center;
}
.cn-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;
}
/* Gradient+Blur — Figma 230:1784 (x=665 y=-3.22, 720 × 440) */
.cn-cta__glow--cyan {
  position: absolute;
  left: 325px; top: -3.22px;
  width: 720px; height: 440px;
  border-radius: 220px;
  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 230:1785 (x=501 y=295.78, 500 × 340) */
.cn-cta__glow--lime {
  position: absolute;
  left: 161px; top: 295.78px;
  width: 500px; height: 340px;
  border-radius: 170px;
  filter: blur(40px);
  background: radial-gradient(ellipse at 50% 50%,
              rgba(194, 232, 80, 0.26) 0%, rgba(194, 232, 80, 0) 64%);
}
.cn-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;
}
.cn-cta .eyebrow { padding-top: 6.91px; }
/* Heading 2 — Figma 230:1791 (387 × 118 = 2 righe da 59) */
.cn-cta__title {
  max-width: 387px;
  margin-top: 15.1px;
  font-family: var(--f-1);
  font-weight: var(--fw-800);
  font-size: var(--fs-46);
  line-height: 59px;
  letter-spacing: var(--ls--0-92);
  color: var(--c-bunker);
}
/* Figma 230:1793 (524 × 61 = 2 righe da 30.4) */
.cn-cta__lead {
  max-width: 524px;
  margin-top: 15.1px;
  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);
}
.cn-cta__actions {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--sp-14);
  margin-top: 32.9px;
}
.cn-cta__actions .btn-outline { width: 236px; }

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