/* ==========================================================================
   PROGETTI (hub) — Figma 79:528, y=809–2518
   Breadcrumb, kicker + a single wide intro paragraph, then five project
   *category* cards on the shared .grid-3 track (3 + 2, the second row left-
   aligned by the grid's own flow). Same opener rhythm as the Servizi hub —
   64px hero→crumb, 16px kicker→intro, 845px intro measure — so only the
   gaps that genuinely differ are restated here.

   No CTA band: the footer starts at y=2518 and is 540 tall, ending at 3058.
   The frame is 3277, i.e. 219px of unused space below the footer — the CTA
   band's exact height, but no CTA instance is drawn in the frame and the
   node screenshot confirms plain background there, so this follows Chi Siamo
   and the Servizi hub in ending on the footer.
   ========================================================================== */
.progetti-hub {
  padding-top: 64px;      /* measured: hero bottom (809) → crumb top (873) */
  padding-bottom: 161px;  /* measured: card row 2 bottom (2357) → footer top (2518) */
}

.progetti-hub__kicker { margin: 0 0 16px; }   /* kicker bottom (1009) → intro top (1025) */

/* Figma's node box for this paragraph reads 845x87, but that box is stale:
   a screenshot of the text node alone renders 832x111, i.e. four lines, not
   the three 87px would imply. 845 is still the right measure — capped there,
   Chrome's longest line is 832.8 against Figma's 832 — so only the gap below
   is taken from the real four-line bottom (1141) rather than the box's 1112. */
.progetti-hub__intro {
  max-width: 845px;
  margin: 0 0 142px;   /* measured: intro bottom (1141) → card row 1 top (1283) */
  color: var(--c-text);
}

/* --- Category card ---------------------------------------------------------
   Same component as the homepage/Servizi-hub .service-card — image band over
   number/title/description with a bottom-pinned arrow — at this page's larger
   proportions, so it reuses that markup verbatim and only restates what Figma
   actually draws differently. Keeping one markup shape matters for the WP
   port: both stay a single card template part with a modifier class.

   Measured off card 1 (rect 108:1469, x=80 y=1283 411x525; image 108:1466 is
   the same 266px band as .service-card):
     image bottom  1549 → number top 1573   = the shared 24px body padding
     number        18/600/34 red, box 1573–1607
     title top     1608  (t-h3 29/35, as .service-card)
     desc  top     1667  → 23px below the title box, not .service-card's 8
     arrow centre  1775  → 28px of padding below it to the card edge (1808)
   ========================================================================== */
.service-card--category { height: 525px; }

/* Left padding stays on the component's 24px; the right is 31 because Figma
   pins the arrow's right edge at x=460 in a card ending at 491. Asymmetric as
   drawn — the text block and the arrow are not on a common inset here. */
.service-card--category .service-card__body { padding: 24px 31px 28px 24px; }

/* Same 600 weight as .t-micro, one step up in size — the 18/600/34 pairing
   already used for .gc-viewall / .si-viewall / .svi-viewall. */
.service-card--category .service-card__num {
  font-size: 18px;
  line-height: 34px;
  margin: 0;
}
.service-card--category .service-card__title { margin: 0 0 23px; }

/* Figma wraps every description onto exactly two lines by holding them well
   short of the card's full text column (measured longest lines 276–282px in a
   369px column). Without a cap the three shortest would pull up onto one line
   and the arrow row would shift. */
.service-card--category .service-card__desc { max-width: 290px; }

/* The two big gaps above are 1440-design values; left alone they read far too
   loose once the grid collapses. Scaled on the same ~40%/~55% judgement the
   global block rhythm uses (base.css) — Figma has no tablet or mobile frame
   for this page. */
@media (max-width: 1024px) {
  .progetti-hub { padding-bottom: 97px; }
  .progetti-hub__intro { margin-bottom: 85px; }
}
@media (max-width: 768px) {
  .progetti-hub { padding-top: 40px; padding-bottom: 72px; }
  .progetti-hub__intro { margin-bottom: 64px; }
  /* Height has to release once one card owns the full width, same as the base
     component — and this modifier's 525px would otherwise out-specify it. */
  .service-card--category { height: auto; }
}