Piattaforma ITI TECHNOLOGY: monorepo, Medusa, API, sito, area riservata e deploy

Monorepo npm con apps/public (Angular SSR), apps/private (Angular SPA),
apps/api (Fastify), packages/shared e packages/styles; Medusa 2.21 in medusa/;
infrastruttura Docker (Postgres PostGIS+pgvector, Redis, Caddy, backup) e
workflow Gitea Actions per il deploy via SSH a ogni push su master.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018jQyT6dR9czzGwqb7FkG6u

packages/styles/_tokens.scss

@@ -0,0 +1,105 @@
+// Design tokens condivisi da apps/public e apps/private.
+// I valori vivono come custom properties CSS (:root, generate in _base.scss): i componenti usano var(--…).
+// Le mappe SCSS servono per generarle e per i breakpoint (le media query non accettano var()).
+
+// --- Colori ---
+// Palette: blu acqua (brand, coerente con le email: #0b5c7a), verde sostenibilità, ambra energia solare.
+$colors: (
+  // Brand
+  'primary': #0b5c7a,
+  'primary-strong': #08445b,
+  'primary-soft': #e6f2f6,
+  'secondary': #1f7a4d,
+  'secondary-soft': #e8f5ee,
+  'accent': #f2a900,
+  'accent-soft': #fff6dc,
+  // Macro-aree (badge, icone, bordi)
+  'area-acqua': #0e7fa6,
+  'area-energia': #c98a00,
+  'area-comfort': #c2410c,
+  'area-mobilita': #1f7a4d,
+  'area-industria': #475569,
+  // Neutri
+  'ink': #12212b,
+  'ink-muted': #4a5a66,
+  'line': #d9e1e6,
+  'surface': #ffffff,
+  'surface-alt': #f4f7f9,
+  'on-primary': #ffffff,
+  'on-accent': #12212b,
+  // Stati
+  'success': #1f7a4d,
+  'warning': #9a6700,
+  'danger': #b42318,
+  'focus': #f2a900,
+);
+
+// --- Tipografia ---
+// Font di sistema: nessuna richiesta a servizi esterni (GDPR, prestazioni). Si potrà adottare un font self-hosted.
+$font-sans: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif;
+$font-mono: ui-monospace, 'Cascadia Code', 'SFMono-Regular', Menlo, Consolas, monospace;
+
+// Scala tipografica fluida (mobile → desktop)
+$font-sizes: (
+  'xs': 0.8125rem,
+  'sm': 0.875rem,
+  'md': 1rem,
+  'lg': 1.125rem,
+  'xl': clamp(1.25rem, 1.15rem + 0.5vw, 1.5rem),
+  '2xl': clamp(1.5rem, 1.3rem + 1vw, 2rem),
+  '3xl': clamp(1.875rem, 1.5rem + 1.8vw, 2.75rem),
+  '4xl': clamp(2.25rem, 1.7rem + 2.6vw, 3.5rem),
+);
+
+$line-heights: (
+  'tight': 1.2,
+  'snug': 1.35,
+  'normal': 1.6,
+);
+
+$font-weights: (
+  'regular': 400,
+  'medium': 500,
+  'semibold': 600,
+  'bold': 700,
+);
+
+// --- Spaziature (scala 4px) ---
+$spaces: (
+  '0': 0,
+  '1': 0.25rem,
+  '2': 0.5rem,
+  '3': 0.75rem,
+  '4': 1rem,
+  '5': 1.5rem,
+  '6': 2rem,
+  '7': 3rem,
+  '8': 4rem,
+  '9': 6rem,
+);
+
+// --- Forme ed effetti ---
+$radii: (
+  'sm': 4px,
+  'md': 8px,
+  'lg': 16px,
+  'pill': 999px,
+);
+
+$shadows: (
+  'sm': 0 1px 2px rgb(18 33 43 / 8%),
+  'md': 0 4px 12px rgb(18 33 43 / 10%),
+  'lg': 0 12px 32px rgb(18 33 43 / 14%),
+);
+
+// --- Layout ---
+$container-max: 1200px;
+$header-height: 64px;
+
+// Breakpoint mobile-first (min-width)
+$breakpoints: (
+  'sm': 576px,
+  'md': 768px,
+  'lg': 1024px,
+  'xl': 1280px,
+);