Merge pull request 'dev' (#6) from dev into int

Reviewed-on: #6

.gitea/workflows/cicd.yaml

@@ -2,136 +2,127 @@ name: Build, Test and Deploy
 
 on:
   push:
-    branches:
-      - main
-      - int
-      - dev
+    branches: [main, int, dev]
+
+concurrency:
+  group: print-calculator-${{ gitea.ref }}
+  cancel-in-progress: true
 
 jobs:
   test-backend:
     runs-on: ubuntu-latest
     steps:
-      - name: Checkout code
-        uses: actions/checkout@v3
+      - name: Checkout
+        uses: actions/checkout@v4
 
-      - name: Set up Python
-        uses: actions/setup-python@v4
+      - name: Set up JDK 21
+        uses: actions/setup-java@v4
         with:
-          python-version: '3.10'
+          java-version: '21'
+          distribution: 'temurin'
 
-      - name: Install dependencies
+      - name: Run Tests with Gradle
         run: |
-          pip install -r backend/requirements.txt
-          pip install pytest httpx
-
-      - name: Run Backend Tests
-        run: |
-          export PYTHONPATH=$PYTHONPATH:$(pwd)/backend
-          pytest backend/tests
+          cd backend
+          chmod +x gradlew
+          ./gradlew test
 
   build-and-push:
     needs: test-backend
     runs-on: ubuntu-latest
     steps:
-      - name: Checkout code
-        uses: actions/checkout@v3
+      - name: Checkout
+        uses: actions/checkout@v4
 
-      - name: Set Environment Variables
+      - name: Set TAG + OWNER lowercase
+        shell: bash
         run: |
           if [[ "${{ gitea.ref }}" == "refs/heads/main" ]]; then
-            echo "TAG=prod" >> $GITHUB_ENV
+            echo "TAG=prod" >> "$GITHUB_ENV"
           elif [[ "${{ gitea.ref }}" == "refs/heads/int" ]]; then
-            echo "TAG=int" >> $GITHUB_ENV
+            echo "TAG=int" >> "$GITHUB_ENV"
           else
-            echo "TAG=dev" >> $GITHUB_ENV
+            echo "TAG=dev" >> "$GITHUB_ENV"
           fi
 
+          echo "OWNER_LOWER=$(echo '${{ gitea.repository_owner }}' | tr '[:upper:]' '[:lower:]')" >> "$GITHUB_ENV"
+
+      - name: Ensure docker CLI exists
+        shell: bash
+        run: |
+          if ! command -v docker >/dev/null 2>&1; then
+            apt-get update
+            apt-get install -y --no-install-recommends docker.io
+          fi
+          docker version
+
       - name: Login to Gitea Registry
-        uses: docker/login-action@v2
-        with:
-          registry: ${{ secrets.REGISTRY_URL }}
-          username: ${{ secrets.GITEA_USER }}
-          password: ${{ secrets.GITEA_TOKEN }}
+        shell: bash
+        run: |
+          set -euo pipefail
+          printf '%s' "${{ secrets.REGISTRY_TOKEN }}" | docker login "${{ secrets.REGISTRY_URL }}" \
+            -u "${{ secrets.REGISTRY_USER }}" --password-stdin
 
-      - name: Build and Push Backend
-        uses: docker/build-push-action@v4
-        with:
-          context: ./backend
-          push: true
-          tags: ${{ secrets.REGISTRY_URL }}/${{ gitea.repository_owner }}/print-calculator-backend:${{ env.TAG }}
+      - name: Build & Push Backend
+        shell: bash
+        run: |
+          BACKEND_IMAGE="${{ secrets.REGISTRY_URL }}/${{ env.OWNER_LOWER }}/print-calculator-backend:${{ env.TAG }}"
+          docker build -t "$BACKEND_IMAGE" ./backend
+          docker push "$BACKEND_IMAGE"
 
-      - name: Build and Push Frontend
-        uses: docker/build-push-action@v4
-        with:
-          context: ./frontend
-          push: true
-          tags: ${{ secrets.REGISTRY_URL }}/${{ gitea.repository_owner }}/print-calculator-frontend:${{ env.TAG }}
+      - name: Build & Push Frontend
+        shell: bash
+        run: |
+          FRONTEND_IMAGE="${{ secrets.REGISTRY_URL }}/${{ env.OWNER_LOWER }}/print-calculator-frontend:${{ env.TAG }}"
+          docker build -t "$FRONTEND_IMAGE" ./frontend
+          docker push "$FRONTEND_IMAGE"
 
   deploy:
     needs: build-and-push
     runs-on: ubuntu-latest
     steps:
-      - name: Checkout code
-        uses: actions/checkout@v3
-
-      - name: Set Deployment Vars
+      - name: Set ENV
+        shell: bash
         run: |
           if [[ "${{ gitea.ref }}" == "refs/heads/main" ]]; then
-            echo "ENV=prod" >> $GITHUB_ENV
-            echo "TAG=prod" >> $GITHUB_ENV
+            echo "ENV=prod" >> "$GITHUB_ENV"
           elif [[ "${{ gitea.ref }}" == "refs/heads/int" ]]; then
-            echo "ENV=int" >> $GITHUB_ENV
-            echo "TAG=int" >> $GITHUB_ENV
+            echo "ENV=int" >> "$GITHUB_ENV"
           else
-            echo "ENV=dev" >> $GITHUB_ENV
-            echo "TAG=dev" >> $GITHUB_ENV
+            echo "ENV=dev" >> "$GITHUB_ENV"
           fi
 
-      - name: Create Remote Directory
-        uses: appleboy/ssh-action@v0.1.10
-        with:
-          host: ${{ secrets.SERVER_HOST }}
-          username: ${{ secrets.SERVER_USER }}
-          key: ${{ secrets.SSH_PRIVATE_KEY }}
-          script: mkdir -p /mnt/user/appdata/print-calculator/${{ env.ENV }}/
+      - name: Trigger deploy on Unraid (forced command key)
+        shell: bash
+        run: |
+          set -euo pipefail
 
-      - name: Copy Compose File to Server
-        uses: appleboy/scp-action@v0.1.4
-        with:
-          host: ${{ secrets.SERVER_HOST }}
-          username: ${{ secrets.SERVER_USER }}
-          key: ${{ secrets.SSH_PRIVATE_KEY }}
-          source: "docker-compose.deploy.yml"
-          target: "/mnt/user/appdata/print-calculator/${{ env.ENV }}/"
+          apt-get update
+          apt-get install -y --no-install-recommends openssh-client
 
-      - name: Copy Env File to Server
-        uses: appleboy/scp-action@v0.1.4
-        with:
-          host: ${{ secrets.SERVER_HOST }}
-          username: ${{ secrets.SERVER_USER }}
-          key: ${{ secrets.SSH_PRIVATE_KEY }}
-          source: "deploy/envs/${{ env.ENV }}.env"
-          target: "/mnt/user/appdata/print-calculator/${{ env.ENV }}/.env"
+          mkdir -p ~/.ssh
+          chmod 700 ~/.ssh
 
-      - name: Execute Remote Deployment
-        uses: appleboy/ssh-action@v0.1.10
-        with:
-          host: ${{ secrets.SERVER_HOST }}
-          username: ${{ secrets.SERVER_USER }}
-          key: ${{ secrets.SSH_PRIVATE_KEY }}
-          script: |
-            cd /mnt/user/appdata/print-calculator/${{ env.ENV }}/
-            
-            # Rename the copied env file to strictly '.env' so docker compose picks it up automatically
-            mv ${{ env.ENV }}.env .env
-            
-            # Login to registry
-            echo ${{ secrets.GITEA_TOKEN }} | docker login ${{ secrets.REGISTRY_URL }} -u ${{ secrets.GITEA_USER }} --password-stdin
-            
-            # Pull new images
-            # We force reading from .env just to be safe, though default behavior does it too.
-            docker compose --env-file .env -f docker-compose.deploy.yml pull
-            
-            # Start/Update services
-            # TAG is inside .env now, so we don't even need to pass it explicitly!
-            docker compose --env-file .env -f docker-compose.deploy.yml up -d --remove-orphans
+          # 1) Prende il secret base64 e rimuove spazi/newline/CR
+          printf '%s' "${{ secrets.SSH_PRIVATE_KEY_B64 }}" | tr -d '\r\n\t ' > /tmp/key.b64
+
+          # 2) (debug sicuro) stampa solo la lunghezza della base64
+          echo "b64_len=$(wc -c < /tmp/key.b64)"
+
+          # 3) Decodifica in chiave privata
+          base64 -d /tmp/key.b64 > ~/.ssh/id_ed25519
+
+          # 4) Rimuove eventuali CRLF dentro la chiave (se proviene da Windows)
+          tr -d '\r' < ~/.ssh/id_ed25519 > ~/.ssh/id_ed25519.clean
+          mv ~/.ssh/id_ed25519.clean ~/.ssh/id_ed25519
+          chmod 600 ~/.ssh/id_ed25519
+
+          # 5) Validazione: se fallisce qui, la chiave NON è valida/corrotta
+          ssh-keygen -y -f ~/.ssh/id_ed25519 >/dev/null
+
+          # ... (resto del codice uguale)
+          ssh-keyscan -H "${{ secrets.SERVER_HOST }}" >> ~/.ssh/known_hosts 2>/dev/null
+
+          # Aggiungiamo le opzioni di verbosità se dovesse fallire ancora, 
+          # e assicuriamoci che l'input sia pulito
+          ssh -i ~/.ssh/id_ed25519 -o BatchMode=yes "${{ secrets.SERVER_USER }}@${{ secrets.SERVER_HOST }}" "${{ env.ENV }}"

.gitignore

@@ -35,3 +35,9 @@ replay_pid*
 .classpath
 .settings/
 .DS_Store
+
+# Build Results
+target/
+build/
+.gradle/
+.mvn/

GEMINI.md

@@ -36,3 +36,7 @@ Questo file serve a dare contesto all'AI (Antigravity/Gemini) sulla struttura e
 - Per eseguire il backend serve `uvicorn`.
 - Il frontend richiede `npm install` al primo avvio.
 - Le configurazioni di stampa (layer height, wall thickness, infill) sono attualmente hardcoded o con valori di default nel backend, ma potrebbero essere esposte come parametri API in futuro.
+
+## AI Agent Rules
+- **No Inline Code**: Tutti i componenti Angular DEVONO usare file separati per HTML (`templateUrl`) e SCSS (`styleUrl`). È vietato usare `template` o `styles` inline nel decoratore `@Component`.
+

backend/.gitignore

@@ -0,0 +1,54 @@
+/target/
+!.mvn/wrapper/maven-wrapper.jar
+!**/src/main/**/target/
+!**/src/test/**/target/
+target
+
+### STS ###
+.apt_generated
+.classpath
+.factorypath
+.project
+.settings
+.springBeans
+.sts4-cache
+
+### IntelliJ IDEA ###
+.idea
+*.iws
+*.iml
+*.ipr
+
+### NetBeans ###
+/nbproject/private/
+/nbproject/public/
+/nbproject/project.properties
+/nbproject/project.xml
+
+### VS Code ###
+.vscode/
+
+### Gradle ###
+.gradle
+build/
+!gradle/wrapper/gradle-wrapper.jar
+!**/src/main/**/build/
+!**/src/test/**/build/
+
+### Java ###
+*.class
+*.log
+*.ctxt
+.mtj.tmp/
+*.jar
+*.war
+*.nar
+*.ear
+*.zip
+*.tar.gz
+*.rar
+
+### Spring Boot ###
+HELP.md
+
+!gradle/wrapper/gradle-wrapper.jar

backend/Dockerfile

@@ -1,6 +1,17 @@
-FROM --platform=linux/amd64 python:3.10-slim-bookworm
+# Stage 1: Build Java JAR
+FROM eclipse-temurin:21-jdk-jammy AS build
+WORKDIR /app
+COPY gradle gradle
+COPY gradlew build.gradle settings.gradle ./
+# Download dependencies first to cache them
+RUN ./gradlew dependencies --no-daemon
+COPY src ./src
+RUN ./gradlew bootJar -x test --no-daemon
 
-# Install system dependencies for OrcaSlicer (AppImage)
+# Stage 2: Runtime Environment
+FROM eclipse-temurin:21-jre-jammy
+
+# Install system dependencies for OrcaSlicer (same as before)
 RUN apt-get update && apt-get install -y \
     wget \
     p7zip-full \
@@ -8,36 +19,26 @@ RUN apt-get update && apt-get install -y \
     libglib2.0-0 \
     libgtk-3-0 \
     libdbus-1-3 \
-    libwebkit2gtk-4.1-0 \
     libwebkit2gtk-4.0-37 \
     && rm -rf /var/lib/apt/lists/*
 
-# Set working directory
-WORKDIR /app
-
-# Download and extract OrcaSlicer
-# Using v2.2.0 as a stable recent release
-# We extract the AppImage to run it without FUSE
+# Install OrcaSlicer
+WORKDIR /opt
 RUN wget -q https://github.com/SoftFever/OrcaSlicer/releases/download/v2.2.0/OrcaSlicer_Linux_V2.2.0.AppImage -O OrcaSlicer.AppImage \
     && 7z x OrcaSlicer.AppImage -o/opt/orcaslicer \
     && chmod -R +x /opt/orcaslicer \
     && rm OrcaSlicer.AppImage
 
-# Add OrcaSlicer to PATH
 ENV PATH="/opt/orcaslicer/usr/bin:${PATH}"
+# Set Slicer Path env variable for Java app
+ENV SLICER_PATH="/opt/orcaslicer/AppRun"
 
-# Install Python dependencies
-COPY requirements.txt .
-RUN pip install --no-cache-dir -r requirements.txt
+WORKDIR /app
+# Copy JAR from build stage
+COPY --from=build /app/build/libs/*.jar app.jar
+# Copy profiles
+COPY profiles ./profiles
 
-# Create directories for app and temp files
-RUN mkdir -p /app/temp /app/profiles
+EXPOSE 8080
 
-# Copy application code
-COPY . .
-
-# Expose port
-EXPOSE 8000
-
-# Run the application
-CMD ["uvicorn", "main:app", "--host", "0.0.0.0", "--port", "8000"]
+CMD ["java", "-jar", "app.jar"]

backend/api/routes.py

@@ -1,137 +0,0 @@
-from fastapi import APIRouter, UploadFile, File, HTTPException, Form
-from models.quote_request import QuoteRequest, QuoteResponse
-from slicer import slicer_service
-from calculator import GCodeParser, QuoteCalculator
-from config import settings
-from profile_manager import ProfileManager
-import os
-import shutil
-import uuid
-import logging
-import json
-
-router = APIRouter()
-logger = logging.getLogger("api")
-profile_manager = ProfileManager()
-
-def cleanup_files(files: list):
-    for f in files:
-        try:
-            if os.path.exists(f):
-                os.remove(f)
-        except Exception as e:
-            logger.warning(f"Failed to delete temp file {f}: {e}")
-
-def format_time(seconds: int) -> str:
-    m, s = divmod(seconds, 60)
-    h, m = divmod(m, 60)
-    if h > 0:
-        return f"{int(h)}h {int(m)}m"
-    return f"{int(m)}m {int(s)}s"
-
-@router.post("/quote", response_model=QuoteResponse)
-async def calculate_quote(
-    file: UploadFile = File(...),
-    # Compatible with form data if we parse manually or use specific dependencies.
-    # FastAPI handling of mixed File + JSON/Form is tricky.
-    # Easiest is to use Form(...) for fields.
-    machine: str = Form("bambu_a1"),
-    filament: str = Form("pla_basic"),
-    quality: str = Form("standard"),
-    layer_height: str = Form(None), # Form data comes as strings usually
-    infill_density: int = Form(None),
-    infill_pattern: str = Form(None),
-    support_enabled: bool = Form(False),
-    print_speed: int = Form(None)
-):
-    """
-    Endpoint for calculating print quote.
-    Accepts Multipart Form Data:
-    - file: The STL file
-    - machine, filament, quality: strings
-    - other overrides
-    """
-    if not file.filename.lower().endswith(".stl"):
-        raise HTTPException(status_code=400, detail="Only .stl files are supported.")
-    if machine != "bambu_a1":
-        raise HTTPException(status_code=400, detail="Unsupported machine.")
-
-    req_id = str(uuid.uuid4())
-    input_filename = f"{req_id}.stl"
-    output_filename = f"{req_id}.gcode"
-    
-    input_path = os.path.join(settings.TEMP_DIR, input_filename)
-    output_path = os.path.join(settings.TEMP_DIR, output_filename)
-
-    try:
-        # 1. Save File
-        with open(input_path, "wb") as buffer:
-            shutil.copyfileobj(file.file, buffer)
-            
-        # 2. Build Overrides
-        overrides = {}
-        if layer_height is not None and layer_height != "":
-            overrides["layer_height"] = layer_height
-        if infill_density is not None:
-            overrides["sparse_infill_density"] = f"{infill_density}%"
-        if infill_pattern:
-            overrides["sparse_infill_pattern"] = infill_pattern
-        if support_enabled: overrides["enable_support"] = "1"
-        if print_speed is not None:
-            overrides["default_print_speed"] = str(print_speed)
-
-        # 3. Slice
-        # Pass parameters to slicer service
-        slicer_service.slice_stl(
-            input_stl_path=input_path,
-            output_gcode_path=output_path,
-            machine=machine,
-            filament=filament,
-            quality=quality,
-            overrides=overrides
-        )
-        
-        # 4. Parse
-        stats = GCodeParser.parse_metadata(output_path)
-        if stats["print_time_seconds"] == 0 and stats["filament_weight_g"] == 0:
-             raise HTTPException(status_code=500, detail="Slicing returned empty stats.")
-
-        # 5. Calculate
-        # We could allow filament cost override here too if passed in params
-        quote = QuoteCalculator.calculate(stats)
-        
-        return QuoteResponse(
-            success=True,
-            data={
-                "print_time_seconds": stats["print_time_seconds"],
-                "print_time_formatted": format_time(stats["print_time_seconds"]),
-                "material_grams": stats["filament_weight_g"],
-                "cost": {
-                    "material": quote["breakdown"]["material_cost"],
-                    "machine": quote["breakdown"]["machine_cost"],
-                    "energy": quote["breakdown"]["energy_cost"],
-                    "markup": quote["breakdown"]["markup_amount"],
-                    "total": quote["total_price"]
-                },
-                "parameters": {
-                    "machine": machine,
-                    "filament": filament,
-                    "quality": quality
-                }
-            }
-        )
-
-    except Exception as e:
-        logger.error(f"Quote error: {e}", exc_info=True)
-        return QuoteResponse(success=False, error=str(e))
-    
-    finally:
-        cleanup_files([input_path, output_path])
-
-@router.get("/profiles/available")
-def get_profiles():
-    return {
-        "machines": profile_manager.list_machines(),
-        "filaments": profile_manager.list_filaments(),
-        "processes": profile_manager.list_processes()
-    }

backend/build.gradle

@@ -0,0 +1,44 @@
+plugins {
+	id 'java'
+	id 'application'
+	id 'org.springframework.boot' version '3.4.1'
+	id 'io.spring.dependency-management' version '1.1.7'
+}
+
+group = 'com.printcalculator'
+version = '0.0.1-SNAPSHOT'
+
+java {
+	toolchain {
+		languageVersion = JavaLanguageVersion.of(21)
+	}
+}
+
+application {
+	mainClass = 'com.printcalculator.BackendApplication'
+}
+
+repositories {
+	mavenCentral()
+}
+
+dependencies {
+	implementation 'org.springframework.boot:spring-boot-starter-web'
+	implementation 'org.springframework.boot:spring-boot-starter-data-jpa'
+	runtimeOnly 'org.postgresql:postgresql'
+	developmentOnly 'org.springframework.boot:spring-boot-devtools'
+	testImplementation 'org.springframework.boot:spring-boot-starter-test'
+	testRuntimeOnly 'org.junit.platform:junit-platform-launcher'
+}
+
+tasks.named('test') {
+	useJUnitPlatform()
+}
+
+tasks.named('bootRun') {
+	args = ["--spring.profiles.active=local"]
+}
+
+application {
+	applicationDefaultJvmArgs = ["-Dspring.profiles.active=local"]
+}

backend/calculator.py

@@ -1,174 +0,0 @@
-import re
-import os
-import logging
-from typing import Dict, Any, Optional
-from config import settings
-
-logger = logging.getLogger(__name__)
-
-class GCodeParser:
-    @staticmethod
-    def parse_metadata(gcode_path: str) -> Dict[str, Any]:
-        """
-        Parses the G-code to extract estimated time and material usage.
-        Scans both the beginning (header) and end (footer) of the file.
-        """
-        stats = {
-            "print_time_seconds": 0,
-            "filament_length_mm": 0,
-            "filament_volume_mm3": 0,
-            "filament_weight_g": 0,
-            "slicer_estimated_cost": 0
-        }
-
-        if not os.path.exists(gcode_path):
-            logger.warning(f"GCode file not found for parsing: {gcode_path}")
-            return stats
-
-        try:
-            with open(gcode_path, 'r', encoding='utf-8', errors='ignore') as f:
-                # Read header (first 500 lines)
-                header_lines = [f.readline().strip() for _ in range(500) if f]
-
-                # Read footer (last 20KB)
-                f.seek(0, 2)
-                file_size = f.tell()
-                read_len = min(file_size, 20480)
-                f.seek(file_size - read_len)
-                footer_lines = f.read().splitlines()
-
-                all_lines = header_lines + footer_lines
-
-                for line in all_lines:
-                    line = line.strip()
-                    if not line.startswith(";"): 
-                        continue
-                    
-                    GCodeParser._parse_line(line, stats)
-
-                # Fallback calculation
-                if stats["filament_weight_g"] == 0 and stats["filament_length_mm"] > 0:
-                    GCodeParser._calculate_weight_fallback(stats)
-                    
-        except Exception as e:
-            logger.error(f"Error parsing G-code: {e}")
-
-        return stats
-
-    @staticmethod
-    def _parse_line(line: str, stats: Dict[str, Any]):
-        # Parse Time
-        if "estimated printing time =" in line: # Header
-            time_str = line.split("=")[1].strip()
-            logger.info(f"Parsing time string (Header): '{time_str}'")
-            stats["print_time_seconds"] = GCodeParser._parse_time_string(time_str)
-        elif "total estimated time:" in line: # Footer
-            parts = line.split("total estimated time:")
-            if len(parts) > 1:
-                time_str = parts[1].strip()
-                logger.info(f"Parsing time string (Footer): '{time_str}'")
-                stats["print_time_seconds"] = GCodeParser._parse_time_string(time_str)
-
-        # Parse Filament info
-        if "filament used [g] =" in line:
-            try:
-                stats["filament_weight_g"] = float(line.split("=")[1].strip())
-            except ValueError: pass
-        
-        if "filament used [mm] =" in line:
-            try:
-                stats["filament_length_mm"] = float(line.split("=")[1].strip())
-            except ValueError: pass
-
-        if "filament used [cm3] =" in line:
-            try:
-                 # cm3 to mm3
-                stats["filament_volume_mm3"] = float(line.split("=")[1].strip()) * 1000
-            except ValueError: pass
-
-    @staticmethod
-    def _calculate_weight_fallback(stats: Dict[str, Any]):
-        # Assumes 1.75mm diameter and PLA density 1.24
-        radius = 1.75 / 2
-        volume_mm3 = 3.14159 * (radius ** 2) * stats["filament_length_mm"]
-        volume_cm3 = volume_mm3 / 1000.0
-        stats["filament_weight_g"] = volume_cm3 * 1.24
-
-    @staticmethod
-    def _parse_time_string(time_str: str) -> int:
-        """
-        Converts '1d 2h 3m 4s' or 'HH:MM:SS' to seconds.
-        """
-        total_seconds = 0
-        
-        # Try HH:MM:SS or MM:SS format
-        if ':' in time_str:
-            parts = time_str.split(':')
-            parts = [int(p) for p in parts]
-            if len(parts) == 3: # HH:MM:SS
-                total_seconds = parts[0] * 3600 + parts[1] * 60 + parts[2]
-            elif len(parts) == 2: # MM:SS
-                total_seconds = parts[0] * 60 + parts[1]
-            return total_seconds
-
-        # Original regex parsing for "1h 2m 3s"
-        days = re.search(r'(\d+)d', time_str)
-        hours = re.search(r'(\d+)h', time_str)
-        mins = re.search(r'(\d+)m', time_str)
-        secs = re.search(r'(\d+)s', time_str)
-
-        if days: total_seconds += int(days.group(1)) * 86400
-        if hours: total_seconds += int(hours.group(1)) * 3600
-        if mins: total_seconds += int(mins.group(1)) * 60
-        if secs: total_seconds += int(secs.group(1))
-        
-        return total_seconds
-
-
-class QuoteCalculator:
-    @staticmethod
-    def calculate(stats: Dict[str, Any]) -> Dict[str, Any]:
-        """
-        Calculates the final quote based on parsed stats and settings.
-        """
-        # 1. Material Cost
-        # Cost per gram = (Cost per kg / 1000)
-        material_cost = (stats["filament_weight_g"] / 1000.0) * settings.FILAMENT_COST_PER_KG
-
-        # 2. Machine Time Cost
-        # Cost per second = (Cost per hour / 3600)
-        print("ciaooo")
-        print(stats["print_time_seconds"])
-        print_time_hours = stats["print_time_seconds"] / 3600.0
-        machine_cost = print_time_hours * settings.MACHINE_COST_PER_HOUR
-
-        # 3. Energy Cost
-        # kWh = (Watts / 1000) * hours
-        kwh_used = (settings.PRINTER_POWER_WATTS / 1000.0) * print_time_hours
-        energy_cost = kwh_used * settings.ENERGY_COST_PER_KWH
-
-        # Subtotal
-        subtotal = material_cost + machine_cost + energy_cost
-
-        # 4. Markup
-        markup_factor = 1.0 + (settings.MARKUP_PERCENT / 100.0)
-        total_price = subtotal * markup_factor
-
-        logger.info("Cost Calculation:")
-        logger.info(f"  - Use: {stats['filament_weight_g']:.2f}g @ {settings.FILAMENT_COST_PER_KG}€/kg = {material_cost:.2f}€")
-        logger.info(f"  - Time: {print_time_hours:.4f}h @ {settings.MACHINE_COST_PER_HOUR}€/h = {machine_cost:.2f}€")
-        logger.info(f"  - Power: {kwh_used:.4f}kWh @ {settings.ENERGY_COST_PER_KWH}€/kWh = {energy_cost:.2f}€")
-        logger.info(f"  - Subtotal: {subtotal:.2f}€")
-        logger.info(f"  - Total (Markup {settings.MARKUP_PERCENT}%): {total_price:.2f}€")
-
-        return {
-            "breakdown": {
-                "material_cost": round(material_cost, 2),
-                "machine_cost": round(machine_cost, 2),
-                "energy_cost": round(energy_cost, 2),
-                "subtotal": round(subtotal, 2),
-                "markup_amount": round(total_price - subtotal, 2)
-            },
-            "total_price": round(total_price, 2),
-            "currency": "EUR"
-        }

backend/config.py

@@ -1,31 +0,0 @@
-import os
-import sys
-
-class Settings:
-    # Directories
-    BASE_DIR = os.path.dirname(os.path.abspath(__file__))
-    TEMP_DIR = os.environ.get("TEMP_DIR", os.path.join(BASE_DIR, "temp"))
-    PROFILES_DIR = os.environ.get("PROFILES_DIR", os.path.join(BASE_DIR, "profiles"))
-
-    # Slicer Paths
-    if sys.platform == "darwin":
-        _DEFAULT_SLICER_PATH = "/Applications/OrcaSlicer.app/Contents/MacOS/OrcaSlicer"
-    else:
-        _DEFAULT_SLICER_PATH = "/opt/orcaslicer/AppRun"
-
-    SLICER_PATH = os.environ.get("SLICER_PATH", _DEFAULT_SLICER_PATH)
-    ORCA_HOME = os.environ.get("ORCA_HOME", "/opt/orcaslicer")
-    
-    # Defaults Profiles (Bambu A1)
-    MACHINE_PROFILE = os.path.join(PROFILES_DIR, "Bambu_Lab_A1_machine.json")
-    PROCESS_PROFILE = os.path.join(PROFILES_DIR, "Bambu_Process_0.20_Standard.json")
-    FILAMENT_PROFILE = os.path.join(PROFILES_DIR, "Bambu_PLA_Basic.json")
-
-    # Pricing
-    FILAMENT_COST_PER_KG = float(os.environ.get("FILAMENT_COST_PER_KG", 25.0))
-    MACHINE_COST_PER_HOUR = float(os.environ.get("MACHINE_COST_PER_HOUR", 2.0))
-    ENERGY_COST_PER_KWH = float(os.environ.get("ENERGY_COST_PER_KWH", 0.30))
-    PRINTER_POWER_WATTS = float(os.environ.get("PRINTER_POWER_WATTS", 150.0))
-    MARKUP_PERCENT = float(os.environ.get("MARKUP_PERCENT", 20.0))
-
-settings = Settings()

backend/gradle/wrapper/gradle-wrapper.properties

@@ -0,0 +1,7 @@
+distributionBase=GRADLE_USER_HOME
+distributionPath=wrapper/dists
+distributionUrl=https\://services.gradle.org/distributions/gradle-9.1.0-bin.zip
+networkTimeout=10000
+validateDistributionUrl=true
+zipStoreBase=GRADLE_USER_HOME
+zipStorePath=wrapper/dists

backend/gradlew

@@ -0,0 +1,248 @@
+#!/bin/sh
+
+#
+# Copyright © 2015 the original authors.
+#
+# Licensed under the Apache License, Version 2.0 (the "License");
+# you may not use this file except in compliance with the License.
+# You may obtain a copy of the License at
+#
+#      https://www.apache.org/licenses/LICENSE-2.0
+#
+# Unless required by applicable law or agreed to in writing, software
+# distributed under the License is distributed on an "AS IS" BASIS,
+# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+# See the License for the specific language governing permissions and
+# limitations under the License.
+#
+# SPDX-License-Identifier: Apache-2.0
+#
+
+##############################################################################
+#
+#   Gradle start up script for POSIX generated by Gradle.
+#
+#   Important for running:
+#
+#   (1) You need a POSIX-compliant shell to run this script. If your /bin/sh is
+#       noncompliant, but you have some other compliant shell such as ksh or
+#       bash, then to run this script, type that shell name before the whole
+#       command line, like:
+#
+#           ksh Gradle
+#
+#       Busybox and similar reduced shells will NOT work, because this script
+#       requires all of these POSIX shell features:
+#         * functions;
+#         * expansions «$var», «${var}», «${var:-default}», «${var+SET}»,
+#           «${var#prefix}», «${var%suffix}», and «$( cmd )»;
+#         * compound commands having a testable exit status, especially «case»;
+#         * various built-in commands including «command», «set», and «ulimit».
+#
+#   Important for patching:
+#
+#   (2) This script targets any POSIX shell, so it avoids extensions provided
+#       by Bash, Ksh, etc; in particular arrays are avoided.
+#
+#       The "traditional" practice of packing multiple parameters into a
+#       space-separated string is a well documented source of bugs and security
+#       problems, so this is (mostly) avoided, by progressively accumulating
+#       options in "$@", and eventually passing that to Java.
+#
+#       Where the inherited environment variables (DEFAULT_JVM_OPTS, JAVA_OPTS,
+#       and GRADLE_OPTS) rely on word-splitting, this is performed explicitly;
+#       see the in-line comments for details.
+#
+#       There are tweaks for specific operating systems such as AIX, CygWin,
+#       Darwin, MinGW, and NonStop.
+#
+#   (3) This script is generated from the Groovy template
+#       https://github.com/gradle/gradle/blob/HEAD/platforms/jvm/plugins-application/src/main/resources/org/gradle/api/internal/plugins/unixStartScript.txt
+#       within the Gradle project.
+#
+#       You can find Gradle at https://github.com/gradle/gradle/.
+#
+##############################################################################
+
+# Attempt to set APP_HOME
+
+# Resolve links: $0 may be a link
+app_path=$0
+
+# Need this for daisy-chained symlinks.
+while
+    APP_HOME=${app_path%"${app_path##*/}"}  # leaves a trailing /; empty if no leading path
+    [ -h "$app_path" ]
+do
+    ls=$( ls -ld "$app_path" )
+    link=${ls#*' -> '}
+    case $link in             #(
+      /*)   app_path=$link ;; #(
+      *)    app_path=$APP_HOME$link ;;
+    esac
+done
+
+# This is normally unused
+# shellcheck disable=SC2034
+APP_BASE_NAME=${0##*/}
+# Discard cd standard output in case $CDPATH is set (https://github.com/gradle/gradle/issues/25036)
+APP_HOME=$( cd -P "${APP_HOME:-./}" > /dev/null && printf '%s\n' "$PWD" ) || exit
+
+# Use the maximum available, or set MAX_FD != -1 to use that value.
+MAX_FD=maximum
+
+warn () {
+    echo "$*"
+} >&2
+
+die () {
+    echo
+    echo "$*"
+    echo
+    exit 1
+} >&2
+
+# OS specific support (must be 'true' or 'false').
+cygwin=false
+msys=false
+darwin=false
+nonstop=false
+case "$( uname )" in                #(
+  CYGWIN* )         cygwin=true  ;; #(
+  Darwin* )         darwin=true  ;; #(
+  MSYS* | MINGW* )  msys=true    ;; #(
+  NONSTOP* )        nonstop=true ;;
+esac
+
+
+
+# Determine the Java command to use to start the JVM.
+if [ -n "$JAVA_HOME" ] ; then
+    if [ -x "$JAVA_HOME/jre/sh/java" ] ; then
+        # IBM's JDK on AIX uses strange locations for the executables
+        JAVACMD=$JAVA_HOME/jre/sh/java
+    else
+        JAVACMD=$JAVA_HOME/bin/java
+    fi
+    if [ ! -x "$JAVACMD" ] ; then
+        die "ERROR: JAVA_HOME is set to an invalid directory: $JAVA_HOME
+
+Please set the JAVA_HOME variable in your environment to match the
+location of your Java installation."
+    fi
+else
+    JAVACMD=java
+    if ! command -v java >/dev/null 2>&1
+    then
+        die "ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH.
+
+Please set the JAVA_HOME variable in your environment to match the
+location of your Java installation."
+    fi
+fi
+
+# Increase the maximum file descriptors if we can.
+if ! "$cygwin" && ! "$darwin" && ! "$nonstop" ; then
+    case $MAX_FD in #(
+      max*)
+        # In POSIX sh, ulimit -H is undefined. That's why the result is checked to see if it worked.
+        # shellcheck disable=SC2039,SC3045
+        MAX_FD=$( ulimit -H -n ) ||
+            warn "Could not query maximum file descriptor limit"
+    esac
+    case $MAX_FD in  #(
+      '' | soft) :;; #(
+      *)
+        # In POSIX sh, ulimit -n is undefined. That's why the result is checked to see if it worked.
+        # shellcheck disable=SC2039,SC3045
+        ulimit -n "$MAX_FD" ||
+            warn "Could not set maximum file descriptor limit to $MAX_FD"
+    esac
+fi
+
+# Collect all arguments for the java command, stacking in reverse order:
+#   * args from the command line
+#   * the main class name
+#   * -classpath
+#   * -D...appname settings
+#   * --module-path (only if needed)
+#   * DEFAULT_JVM_OPTS, JAVA_OPTS, and GRADLE_OPTS environment variables.
+
+# For Cygwin or MSYS, switch paths to Windows format before running java
+if "$cygwin" || "$msys" ; then
+    APP_HOME=$( cygpath --path --mixed "$APP_HOME" )
+
+    JAVACMD=$( cygpath --unix "$JAVACMD" )
+
+    # Now convert the arguments - kludge to limit ourselves to /bin/sh
+    for arg do
+        if
+            case $arg in                                #(
+              -*)   false ;;                            # don't mess with options #(
+              /?*)  t=${arg#/} t=/${t%%/*}              # looks like a POSIX filepath
+                    [ -e "$t" ] ;;                      #(
+              *)    false ;;
+            esac
+        then
+            arg=$( cygpath --path --ignore --mixed "$arg" )
+        fi
+        # Roll the args list around exactly as many times as the number of
+        # args, so each arg winds up back in the position where it started, but
+        # possibly modified.
+        #
+        # NB: a `for` loop captures its iteration list before it begins, so
+        # changing the positional parameters here affects neither the number of
+        # iterations, nor the values presented in `arg`.
+        shift                   # remove old arg
+        set -- "$@" "$arg"      # push replacement arg
+    done
+fi
+
+
+# Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script.
+DEFAULT_JVM_OPTS='"-Xmx64m" "-Xms64m"'
+
+# Collect all arguments for the java command:
+#   * DEFAULT_JVM_OPTS, JAVA_OPTS, and optsEnvironmentVar are not allowed to contain shell fragments,
+#     and any embedded shellness will be escaped.
+#   * For example: A user cannot expect ${Hostname} to be expanded, as it is an environment variable and will be
+#     treated as '${Hostname}' itself on the command line.
+
+set -- \
+        "-Dorg.gradle.appname=$APP_BASE_NAME" \
+        -jar "$APP_HOME/gradle/wrapper/gradle-wrapper.jar" \
+        "$@"
+
+# Stop when "xargs" is not available.
+if ! command -v xargs >/dev/null 2>&1
+then
+    die "xargs is not available"
+fi
+
+# Use "xargs" to parse quoted args.
+#
+# With -n1 it outputs one arg per line, with the quotes and backslashes removed.
+#
+# In Bash we could simply go:
+#
+#   readarray ARGS < <( xargs -n1 <<<"$var" ) &&
+#   set -- "${ARGS[@]}" "$@"
+#
+# but POSIX shell has neither arrays nor command substitution, so instead we
+# post-process each arg (as a line of input to sed) to backslash-escape any
+# character that might be a shell metacharacter, then use eval to reverse
+# that process (while maintaining the separation between arguments), and wrap
+# the whole thing up as a single "set" statement.
+#
+# This will of course break if any of these variables contains a newline or
+# an unmatched quote.
+#
+
+eval "set -- $(
+        printf '%s\n' "$DEFAULT_JVM_OPTS $JAVA_OPTS $GRADLE_OPTS" |
+        xargs -n1 |
+        sed ' s~[^-[:alnum:]+,./:=@_]~\\&~g; ' |
+        tr '\n' ' '
+    )" '"$@"'
+
+exec "$JAVACMD" "$@"

backend/gradlew.bat

@@ -0,0 +1,93 @@
+@rem
+@rem Copyright 2015 the original author or authors.
+@rem
+@rem Licensed under the Apache License, Version 2.0 (the "License");
+@rem you may not use this file except in compliance with the License.
+@rem You may obtain a copy of the License at
+@rem
+@rem      https://www.apache.org/licenses/LICENSE-2.0
+@rem
+@rem Unless required by applicable law or agreed to in writing, software
+@rem distributed under the License is distributed on an "AS IS" BASIS,
+@rem WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+@rem See the License for the specific language governing permissions and
+@rem limitations under the License.
+@rem
+@rem SPDX-License-Identifier: Apache-2.0
+@rem
+
+@if "%DEBUG%"=="" @echo off
+@rem ##########################################################################
+@rem
+@rem  Gradle startup script for Windows
+@rem
+@rem ##########################################################################
+
+@rem Set local scope for the variables with windows NT shell
+if "%OS%"=="Windows_NT" setlocal
+
+set DIRNAME=%~dp0
+if "%DIRNAME%"=="" set DIRNAME=.
+@rem This is normally unused
+set APP_BASE_NAME=%~n0
+set APP_HOME=%DIRNAME%
+
+@rem Resolve any "." and ".." in APP_HOME to make it shorter.
+for %%i in ("%APP_HOME%") do set APP_HOME=%%~fi
+
+@rem Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script.
+set DEFAULT_JVM_OPTS="-Xmx64m" "-Xms64m"
+
+@rem Find java.exe
+if defined JAVA_HOME goto findJavaFromJavaHome
+
+set JAVA_EXE=java.exe
+%JAVA_EXE% -version >NUL 2>&1
+if %ERRORLEVEL% equ 0 goto execute
+
+echo. 1>&2
+echo ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH. 1>&2
+echo. 1>&2
+echo Please set the JAVA_HOME variable in your environment to match the 1>&2
+echo location of your Java installation. 1>&2
+
+goto fail
+
+:findJavaFromJavaHome
+set JAVA_HOME=%JAVA_HOME:"=%
+set JAVA_EXE=%JAVA_HOME%/bin/java.exe
+
+if exist "%JAVA_EXE%" goto execute
+
+echo. 1>&2
+echo ERROR: JAVA_HOME is set to an invalid directory: %JAVA_HOME% 1>&2
+echo. 1>&2
+echo Please set the JAVA_HOME variable in your environment to match the 1>&2
+echo location of your Java installation. 1>&2
+
+goto fail
+
+:execute
+@rem Setup the command line
+
+
+
+@rem Execute Gradle
+"%JAVA_EXE%" %DEFAULT_JVM_OPTS% %JAVA_OPTS% %GRADLE_OPTS% "-Dorg.gradle.appname=%APP_BASE_NAME%" -jar "%APP_HOME%\gradle\wrapper\gradle-wrapper.jar" %*
+
+:end
+@rem End local scope for the variables with windows NT shell
+if %ERRORLEVEL% equ 0 goto mainEnd
+
+:fail
+rem Set variable GRADLE_EXIT_CONSOLE if you need the _script_ return code instead of
+rem the _cmd.exe /c_ return code!
+set EXIT_CODE=%ERRORLEVEL%
+if %EXIT_CODE% equ 0 set EXIT_CODE=1
+if not ""=="%GRADLE_EXIT_CONSOLE%" exit %EXIT_CODE%
+exit /b %EXIT_CODE%
+
+:mainEnd
+if "%OS%"=="Windows_NT" endlocal
+
+:omega

backend/main.py

@@ -1,74 +0,0 @@
-import logging
-import os
-from fastapi import FastAPI
-from fastapi.middleware.cors import CORSMiddleware
-from config import settings
-from api.routes import router as api_router
-
-# Configure logging
-logging.basicConfig(level=logging.INFO)
-logger = logging.getLogger("main")
-
-app = FastAPI(title="Print Calculator API")
-
-# CORS Setup
-app.add_middleware(
-    CORSMiddleware,
-    allow_origins=["*"],
-    allow_credentials=True,
-    allow_methods=["*"],
-    allow_headers=["*"],
-)
-
-# Ensure directories exist
-os.makedirs(settings.TEMP_DIR, exist_ok=True)
-
-# Include Router
-app.include_router(api_router, prefix="/api")
-
-# Legacy endpoint redirect or basic handler if needed for backward compatibility
-# The frontend likely calls /calculate/stl.
-# We should probably keep the old route or instruct user to update frontend.
-# But for this task, let's remap the old route to the new logic if possible, 
-# or just expose the new route.
-# The user request said: "Creare api/routes.py ... @app.post('/api/quote')"
-# So we are creating a new endpoint.
-# Existing frontend might break? 
-# The context says: "Currently uses hardcoded... Objective is to render system flexible... Frontend: Angular 19"
-# The user didn't explicitly ask to update the frontend, but the new API is at /api/quote.
-# I will keep the old "/calculate/stl" endpoint support by forwarding it or duplicating logic if critical,
-# OR I'll assume the user will handle frontend updates. 
-# Better: I will alias the old route to the new one if parameters allow, 
-# but the new one expects Form data with different names maybe?
-# Old: `/calculate/stl` just expected a file.
-# I'll enable a simplified version on the old route for backward compat using defaults.
-
-from fastapi import UploadFile, File
-from api.routes import calculate_quote
-
-@app.post("/calculate/stl")
-async def legacy_calculate(file: UploadFile = File(...)):
-    """Legacy endpoint compatibility"""
-    # Call the new logic with defaults
-    resp = await calculate_quote(file=file)
-    if not resp.success:
-         from fastapi import HTTPException
-         raise HTTPException(status_code=500, detail=resp.error)
-    
-    # Map Check response to old format
-    data = resp.data
-    return {
-        "print_time_seconds": data.get("print_time_seconds", 0),
-        "print_time_formatted": data.get("print_time_formatted", ""),
-        "material_grams": data.get("material_grams", 0.0),
-        "cost": data.get("cost", {}),
-        "notes": ["Generated via Dynamic Slicer (Legacy Endpoint)"]
-    }
-
-@app.get("/health")
-def health_check():
-    return {"status": "ok", "slicer": settings.SLICER_PATH}
-
-if __name__ == "__main__":
-    import uvicorn
-    uvicorn.run(app, host="0.0.0.0", port=8000)

backend/models/quote_request.py

@@ -1,37 +0,0 @@
-from pydantic import BaseModel, Field, validator
-from typing import Optional, Literal, Dict, Any
-
-class QuoteRequest(BaseModel):
-    # File STL (base64 or path)
-    file_path: Optional[str] = None
-    file_base64: Optional[str] = None
-    
-    # Parametri slicing
-    machine: str = Field(default="bambu_a1", description="Machine type")
-    filament: str = Field(default="pla_basic", description="Filament type")
-    quality: Literal["draft", "standard", "fine"] = Field(default="standard")
-    
-    # Parametri opzionali
-    layer_height: Optional[float] = Field(None, ge=0.08, le=0.32)
-    infill_density: Optional[int] = Field(None, ge=0, le=100)
-    support_enabled: Optional[bool] = None
-    print_speed: Optional[int] = Field(None, ge=20, le=300)
-    
-    # Pricing overrides
-    filament_cost_override: Optional[float] = None
-    
-    @validator('machine')
-    def validate_machine(cls, v):
-        # This list should ideally be dynamic, but for validation purposes we start with known ones.
-        # Logic in ProfileManager can be looser or strict.
-        # For now, we allow the string through and let ProfileManager validate availability.
-        return v
-    
-    @validator('filament')
-    def validate_filament(cls, v):
-        return v
-
-class QuoteResponse(BaseModel):
-    success: bool
-    data: Optional[Dict[str, Any]] = None
-    error: Optional[str] = None

backend/profile_cache.py

@@ -1,15 +0,0 @@
-from functools import lru_cache
-import hashlib
-from typing import Dict, Tuple
-
-# We can't cache the profile manager instance itself easily if it's not a singleton,
-# but we can cache the result of a merge function if we pass simple types.
-# However, to avoid circular imports or complex dependency injection, 
-# we will just provide a helper to generate cache keys and a holder for logic if needed.
-# For now, the ProfileManager will strictly determine *what* to merge.
-# Validating the cache strategy: since file I/O is the bottleneck, we want to cache the *content*.
-
-def get_cache_key(machine: str, filament: str, process: str) -> str:
-    """Helper to create a unique cache key"""
-    data = f"{machine}|{filament}|{process}"
-    return hashlib.md5(data.encode()).hexdigest()

backend/profile_manager.py

@@ -1,193 +0,0 @@
-import os
-import json
-import logging
-from typing import Dict, List, Tuple, Optional
-from profile_cache import get_cache_key
-
-
-logger = logging.getLogger(__name__)
-
-class ProfileManager:
-    def __init__(self, profiles_root: str = "profiles"):
-        # Assuming profiles_root is relative to backend or absolute
-        if not os.path.isabs(profiles_root):
-            base_dir = os.path.dirname(os.path.abspath(__file__))
-            self.profiles_root = os.path.join(base_dir, profiles_root)
-        else:
-            self.profiles_root = profiles_root
-            
-        if not os.path.exists(self.profiles_root):
-            logger.warning(f"Profiles root not found: {self.profiles_root}")
-
-    def get_profiles(self, machine: str, filament: str, process: str) -> Tuple[Dict, Dict, Dict]:
-        """
-        Main entry point to get merged profiles.
-        Args:
-            machine: e.g. "Bambu Lab A1 0.4 nozzle"
-            filament: e.g. "Bambu PLA Basic @BBL A1"
-            process: e.g. "0.20mm Standard @BBL A1"
-        """
-        # Try cache first (although specific logic is needed if we cache the *result* or the *files*)
-        # Since we implemented a simple external cache helper, let's use it if we want, 
-        # but for now we will rely on internal logic or the lru_cache decorator on a helper method.
-        # But wait, the `get_cached_profiles` in profile_cache.py calls `build_merged_profiles` which is logic WE need to implement.
-        # So we should probably move the implementation here and have the cache wrapper call it, 
-        # OR just implement it here and wrap it.
-        
-        return self._build_merged_profiles(machine, filament, process)
-
-    def _build_merged_profiles(self, machine_name: str, filament_name: str, process_name: str) -> Tuple[Dict, Dict, Dict]:
-        # We need to find the files. 
-        # The naming convention in OrcaSlicer profiles usually involves the Vendor (e.g. BBL).
-        # We might need a mapping or search.
-        # For this implementation, we will assume we know the relative paths or search for them.
-        
-        # Strategy: Search in all vendor subdirs for the specific JSON files.
-        # Because names are usually unique enough or we can specify the expected vendor.
-        # However, to be fast, we can map "machine_name" to a file path.
-        
-        machine_file = self._find_profile_file(machine_name, "machine")
-        filament_file = self._find_profile_file(filament_name, "filament")
-        process_file = self._find_profile_file(process_name, "process")
-        
-        if not machine_file:
-            raise FileNotFoundError(f"Machine profile not found: {machine_name}")
-        if not filament_file:
-            raise FileNotFoundError(f"Filament profile not found: {filament_name}")
-        if not process_file:
-            raise FileNotFoundError(f"Process profile not found: {process_name}")
-            
-        machine_profile = self._merge_chain(machine_file)
-        filament_profile = self._merge_chain(filament_file)
-        process_profile = self._merge_chain(process_file)
-        
-        # Apply patches
-        machine_profile = self._apply_patches(machine_profile, "machine")
-        process_profile = self._apply_patches(process_profile, "process")
-        
-        return machine_profile, process_profile, filament_profile
-
-    def _find_profile_file(self, profile_name: str, profile_type: str) -> Optional[str]:
-        """
-        Searches for a profile file by name in the profiles directory.
-        The name should match the filename (without .json possibly) or be a precise match.
-        """
-        # Add .json if missing
-        filename = profile_name if profile_name.endswith(".json") else f"{profile_name}.json"
-        
-        for root, dirs, files in os.walk(self.profiles_root):
-            if filename in files:
-                # Check if it is in the correct type folder (machine, filament, process)
-                # OrcaSlicer structure: Vendor/process/file.json
-                # We optionally verify parent dir
-                if os.path.basename(root) == profile_type or profile_type in root:
-                    return os.path.join(root, filename)
-                
-                # Fallback: if we simply found it, maybe just return it? 
-                # Some common files might be in root or other places.
-                # Let's return it if we are fairly sure.
-                return os.path.join(root, filename)
-        
-        return None
-
-    def _merge_chain(self, final_file_path: str) -> Dict:
-        """
-        Resolves inheritance and merges.
-        """
-        chain = []
-        current_path = final_file_path
-        
-        # 1. Build chain
-        while current_path:
-            chain.insert(0, current_path) # Prepend
-            
-            with open(current_path, 'r', encoding='utf-8') as f:
-                try:
-                    data = json.load(f)
-                except json.JSONDecodeError as e:
-                    logger.error(f"Failed to decode JSON: {current_path}")
-                    raise e
-            
-            inherits = data.get("inherits")
-            if inherits:
-                # Resolve inherited file
-                # It is usually in the same directory or relative.
-                # OrcaSlicer logic: checks same dir, then parent, etc.
-                # Usually it's in the same directory.
-                parent_dir = os.path.dirname(current_path)
-                inherited_path = os.path.join(parent_dir, inherits)
-                
-                # Special case: if not found, it might be in a common folder? 
-                # But OrcaSlicer usually keeps them local or in specific common dirs.
-                if not os.path.exists(inherited_path) and not inherits.endswith(".json"):
-                     inherited_path += ".json"
-                
-                if os.path.exists(inherited_path):
-                    current_path = inherited_path
-                else:
-                    # Could be a system common file not in the same dir?
-                    # For simplicty, try to look up in the same generic type folder across the vendor?
-                    # Or just fail for now. 
-                    # Often "fdm_machine_common.json" is at the Vendor root or similar?
-                    # Let's try searching recursively if not found in place.
-                    found = self._find_profile_file(inherits, "any") # "any" type
-                    if found:
-                        current_path = found
-                    else:
-                        logger.warning(f"Inherited profile '{inherits}' not found for '{current_path}' (Root: {self.profiles_root})")
-                        current_path = None
-            else:
-                current_path = None
-
-        # 2. Merge
-        merged = {}
-        for path in chain:
-            with open(path, 'r', encoding='utf-8') as f:
-                data = json.load(f)
-                # Shallow update
-                merged.update(data)
-                
-        # Remove metadata
-        merged.pop("inherits", None)
-        
-        return merged
-
-    def _apply_patches(self, profile: Dict, profile_type: str) -> Dict:
-        if profile_type == "machine":
-            # Patch: G92 E0 to ensure extrusion reference text matches
-            lcg = profile.get("layer_change_gcode", "")
-            if "G92 E0" not in lcg:
-                # Append neatly
-                if lcg and not lcg.endswith("\n"):
-                    lcg += "\n"
-                lcg += "G92 E0"
-                profile["layer_change_gcode"] = lcg
-            
-            # Patch: ensure printable height is sufficient? 
-            # Only if necessary. For now, trust the profile.
-
-        elif profile_type == "process":
-            # Optional: Disable skirt/brim if we want a "clean" print estimation?
-            # Actually, for accurate cost, we SHOULD include skirt/brim if the profile has it.
-            pass
-            
-        return profile
-    
-    def list_machines(self) -> List[str]:
-        # Simple helper to list available machine JSONs
-        return self._list_profiles_by_type("machine")
-        
-    def list_filaments(self) -> List[str]:
-        return self._list_profiles_by_type("filament")
-
-    def list_processes(self) -> List[str]:
-        return self._list_profiles_by_type("process")
-
-    def _list_profiles_by_type(self, ptype: str) -> List[str]:
-        results = []
-        for root, dirs, files in os.walk(self.profiles_root):
-            if os.path.basename(root) == ptype:
-                for f in files:
-                    if f.endswith(".json") and "common" not in f:
-                         results.append(f.replace(".json", ""))
-        return sorted(results)

backend/profile_mappings.json

@@ -1,24 +0,0 @@
-{
-  "quality_to_process": {
-    "draft": "0.28mm Extra Draft @BBL A1",
-    "standard": "0.20mm Standard @BBL A1",
-    "fine": "0.12mm Fine @BBL A1"
-  },
-  "filament_costs": {
-    "pla_basic": 20.0,
-    "petg_basic": 25.0,
-    "abs_basic": 22.0,
-    "tpu_95a": 35.0
-  },
-  "filament_to_profile": {
-    "pla_basic": "Bambu PLA Basic @BBL A1",
-    "petg_basic": "Bambu PETG Basic @BBL A1",
-    "abs_basic": "Bambu ABS @BBL A1",
-    "tpu_95a": "Bambu TPU 95A @BBL A1"
-  },
-  "machine_to_profile": {
-    "bambu_a1": "Bambu Lab A1 0.4 nozzle",
-    "bambu_x1": "Bambu Lab X1 Carbon 0.4 nozzle",
-    "bambu_p1s": "Bambu Lab P1S 0.4 nozzle"
-  }
-}

backend/requirements.txt

@@ -1,4 +0,0 @@
-fastapi==0.109.0
-uvicorn==0.27.0
-python-multipart==0.0.6
-requests==2.31.0

backend/settings.gradle

@@ -0,0 +1 @@
+rootProject.name = 'print-calculator-backend'

backend/slicer.py

@@ -1,154 +0,0 @@
-import subprocess
-import os
-import json
-import logging
-import shutil
-import tempfile
-from typing import Optional, Dict
-from config import settings
-from profile_manager import ProfileManager
-
-logger = logging.getLogger(__name__)
-
-class SlicerService:
-    def __init__(self):
-        self.profile_manager = ProfileManager()
-    
-    def slice_stl(
-        self,
-        input_stl_path: str,
-        output_gcode_path: str,
-        machine: str = "bambu_a1",
-        filament: str = "pla_basic",
-        quality: str = "standard",
-        overrides: Optional[Dict] = None
-    ) -> bool:
-        """
-        Runs OrcaSlicer in headless mode with dynamic profiles.
-        """
-        if not os.path.exists(settings.SLICER_PATH):
-             raise RuntimeError(f"Slicer executable not found at: {settings.SLICER_PATH}")
-
-        if not os.path.exists(input_stl_path):
-            raise FileNotFoundError(f"STL file not found: {input_stl_path}")
-
-        # 1. Get Merged Profiles
-        # Use simple mapping if the input is short code (bambu_a1) vs full name
-        # For now, we assume the caller solves the mapping or passes full names?
-        # Actually, the user wants "Bambu A1" from API to map to "Bambu Lab A1 0.4 nozzle"
-        # We should use the mapping logic here or in the caller?
-        # The implementation plan said "profile_mappings.json" maps keys.
-        # It's better to handle mapping in the Service layer or Manager.
-        # Let's load the mapping in the service for now, or use a helper.
-        
-        # We'll use a helper method to resolve names to full profile names using the loaded mapping.
-        machine_p, filament_p, quality_p = self._resolve_profile_names(machine, filament, quality)
-        
-        try:
-            m_profile, p_profile, f_profile = self.profile_manager.get_profiles(machine_p, filament_p, quality_p)
-        except FileNotFoundError as e:
-            logger.error(f"Profile error: {e}")
-            raise RuntimeError(f"Profile generation failed: {e}")
-
-        # 2. Apply Overrides
-        if overrides:
-            p_profile = self._apply_overrides(p_profile, overrides)
-            # Some overrides might apply to machine or filament, but mostly process.
-            # E.g. layer_height is in process.
-
-        # 3. Write Temp Profiles
-        # We create a temp dir for this slice job
-        output_dir = os.path.dirname(output_gcode_path)
-        # We keep temp profiles in a hidden folder or just temp
-        # Using a context manager for temp dir might be safer but we need it for the subprocess duration
-        
-        with tempfile.TemporaryDirectory() as temp_dir:
-            m_path = os.path.join(temp_dir, "machine.json")
-            p_path = os.path.join(temp_dir, "process.json")
-            f_path = os.path.join(temp_dir, "filament.json")
-            
-            with open(m_path, 'w') as f: json.dump(m_profile, f)
-            with open(p_path, 'w') as f: json.dump(p_profile, f)
-            with open(f_path, 'w') as f: json.dump(f_profile, f)
-            
-            # 4. Build Command
-            command = self._build_slicer_command(input_stl_path, output_dir, m_path, p_path, f_path)
-            
-            logger.info(f"Starting slicing for {input_stl_path} [M:{machine_p} F:{filament_p} Q:{quality_p}]")
-            try:
-                self._run_command(command)
-                self._finalize_output(output_dir, input_stl_path, output_gcode_path)
-                logger.info("Slicing completed successfully.")
-                return True
-            except subprocess.CalledProcessError as e:
-                # Cleanup is automatic via tempfile, but we might want to preserve invalid gcode?
-                raise RuntimeError(f"Slicing failed: {e.stderr if e.stderr else e.stdout}")
-
-    def _resolve_profile_names(self, m: str, f: str, q: str) -> tuple[str, str, str]:
-        # Load mappings
-        # Allow passing full names if they don't exist in mapping
-        mapping_path = os.path.join(os.path.dirname(__file__), "profile_mappings.json")
-        try:
-            with open(mapping_path, 'r') as fp:
-                mappings = json.load(fp)
-        except Exception:
-            logger.warning("Could not load profile_mappings.json, using inputs as raw names.")
-            return m, f, q
-            
-        m_real = mappings.get("machine_to_profile", {}).get(m, m)
-        f_real = mappings.get("filament_to_profile", {}).get(f, f)
-        q_real = mappings.get("quality_to_process", {}).get(q, q)
-        
-        return m_real, f_real, q_real
-
-    def _apply_overrides(self, profile: Dict, overrides: Dict) -> Dict:
-        for k, v in overrides.items():
-            # OrcaSlicer values are often strings
-            profile[k] = str(v)
-        return profile
-
-    def _build_slicer_command(self, input_path: str, output_dir: str, m_path: str, p_path: str, f_path: str) -> list:
-        # Settings format: "machine_file;process_file" (filament separate)
-        settings_arg = f"{m_path};{p_path}"
-        
-        return [
-            settings.SLICER_PATH,
-            "--load-settings", settings_arg,
-            "--load-filaments", f_path,
-            "--ensure-on-bed",
-            "--arrange", "1",
-            "--slice", "0",
-            "--outputdir", output_dir,
-            input_path
-        ]
-
-    def _run_command(self, command: list):
-        # logging and running logic similar to before
-        logger.debug(f"Exec: {' '.join(command)}")
-        result = subprocess.run(
-            command,
-            check=False,
-            stdout=subprocess.PIPE,
-            stderr=subprocess.PIPE,
-            text=True
-        )
-        if result.returncode != 0:
-            logger.error(f"Slicer Error: {result.stderr}")
-            raise subprocess.CalledProcessError(
-                result.returncode, command, output=result.stdout, stderr=result.stderr
-            )
-
-    def _finalize_output(self, output_dir: str, input_path: str, target_path: str):
-        input_basename = os.path.basename(input_path)
-        expected_name = os.path.splitext(input_basename)[0] + ".gcode"
-        generated_path = os.path.join(output_dir, expected_name)
-
-        if not os.path.exists(generated_path):
-            alt_path = os.path.join(output_dir, "plate_1.gcode")
-            if os.path.exists(alt_path):
-                generated_path = alt_path
-
-        if os.path.exists(generated_path) and generated_path != target_path:
-            shutil.move(generated_path, target_path)
-
-slicer_service = SlicerService()

backend/src/main/java/com/printcalculator/BackendApplication.java

@@ -0,0 +1,13 @@
+package com.printcalculator;
+
+import org.springframework.boot.SpringApplication;
+import org.springframework.boot.autoconfigure.SpringBootApplication;
+
+@SpringBootApplication
+public class BackendApplication {
+
+	public static void main(String[] args) {
+		SpringApplication.run(BackendApplication.class, args);
+	}
+
+}

backend/src/main/java/com/printcalculator/config/AppProperties.java

@@ -0,0 +1,43 @@
+package com.printcalculator.config;
+
+import org.springframework.boot.context.properties.ConfigurationProperties;
+import org.springframework.context.annotation.Configuration;
+
+@Configuration
+@ConfigurationProperties(prefix = "pricing")
+public class AppProperties {
+
+    private double filamentCostPerKg;
+    private double machineCostPerHour;
+    private double energyCostPerKwh;
+    private double printerPowerWatts;
+    private double markupPercent;
+
+    private String slicerPath;
+    private String profilesRoot;
+
+    // Getters and Setters needed for Spring binding
+    
+    public double getFilamentCostPerKg() { return filamentCostPerKg; }
+    public void setFilamentCostPerKg(double filamentCostPerKg) { this.filamentCostPerKg = filamentCostPerKg; }
+
+    public double getMachineCostPerHour() { return machineCostPerHour; }
+    public void setMachineCostPerHour(double machineCostPerHour) { this.machineCostPerHour = machineCostPerHour; }
+
+    public double getEnergyCostPerKwh() { return energyCostPerKwh; }
+    public void setEnergyCostPerKwh(double energyCostPerKwh) { this.energyCostPerKwh = energyCostPerKwh; }
+
+    public double getPrinterPowerWatts() { return printerPowerWatts; }
+    public void setPrinterPowerWatts(double printerPowerWatts) { this.printerPowerWatts = printerPowerWatts; }
+
+    public double getMarkupPercent() { return markupPercent; }
+    public void setMarkupPercent(double markupPercent) { this.markupPercent = markupPercent; }
+
+    // Slicer props are not under "pricing" prefix in properties file?
+    // Wait, in application.properties I put them at root level/custom. 
+    // Let's fix this class to map correctly or change prefix.
+    // I'll make a separate section or just bind manually. 
+    // Actually, I'll just add @Value in services for simplicity or fix the prefix structure.
+    // Let's stick to standard @Value for simple paths if this is messy. 
+    // Or better, creating a dedicated SlicerProperties.
+}

backend/src/main/java/com/printcalculator/config/CorsConfig.java

@@ -0,0 +1,20 @@
+package com.printcalculator.config;
+
+import org.springframework.context.annotation.Configuration;
+import org.springframework.context.annotation.Profile;
+import org.springframework.web.servlet.config.annotation.CorsRegistry;
+import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;
+
+@Configuration
+@Profile("local")
+public class CorsConfig implements WebMvcConfigurer {
+
+    @Override
+    public void addCorsMappings(CorsRegistry registry) {
+        registry.addMapping("/**")
+                .allowedOrigins("*")
+                .allowedMethods("GET", "POST", "PUT", "DELETE", "OPTIONS")
+                .allowedHeaders("*")
+                .allowCredentials(false);
+    }
+}

backend/src/main/java/com/printcalculator/config/SlicerConfig.java

@@ -0,0 +1,13 @@
+package com.printcalculator.config;
+
+import org.springframework.boot.context.properties.ConfigurationProperties;
+import org.springframework.context.annotation.Configuration;
+
+@Configuration
+@ConfigurationProperties(prefix = "") 
+// Hack: standard prefix is usually required. I'll use @Value in service or correct this.
+// Better: make SlicerConfig class.
+public class SlicerConfig {
+    // Intentionally empty, will use @Value in service for simplicity 
+    // or fix in next step.
+}

backend/src/main/java/com/printcalculator/controller/QuoteController.java

@@ -0,0 +1,87 @@
+package com.printcalculator.controller;
+
+import com.printcalculator.model.PrintStats;
+import com.printcalculator.model.QuoteResult;
+import com.printcalculator.service.QuoteCalculator;
+import com.printcalculator.service.SlicerService;
+import org.springframework.http.ResponseEntity;
+import org.springframework.web.bind.annotation.*;
+import org.springframework.web.multipart.MultipartFile;
+
+import java.io.IOException;
+import java.nio.file.Files;
+import java.nio.file.Path;
+
+@RestController
+public class QuoteController {
+
+    private final SlicerService slicerService;
+    private final QuoteCalculator quoteCalculator;
+
+    // Defaults (using aliases defined in ProfileManager)
+    private static final String DEFAULT_MACHINE = "bambu_a1";
+    private static final String DEFAULT_FILAMENT = "pla_basic";
+    private static final String DEFAULT_PROCESS = "standard";
+
+    public QuoteController(SlicerService slicerService, QuoteCalculator quoteCalculator) {
+        this.slicerService = slicerService;
+        this.quoteCalculator = quoteCalculator;
+    }
+
+    @PostMapping("/api/quote")
+    public ResponseEntity<QuoteResult> calculateQuote(
+            @RequestParam("file") MultipartFile file,
+            @RequestParam(value = "machine", required = false, defaultValue = DEFAULT_MACHINE) String machine,
+            @RequestParam(value = "filament", required = false, defaultValue = DEFAULT_FILAMENT) String filament,
+            @RequestParam(value = "process", required = false) String process,
+            @RequestParam(value = "quality", required = false) String quality
+            ) throws IOException {
+
+        // Frontend sends 'quality', backend expects 'process'.
+        // If process is missing, try quality. If both missing, use default.
+        String actualProcess = process;
+        if (actualProcess == null || actualProcess.isEmpty()) {
+            if (quality != null && !quality.isEmpty()) {
+                actualProcess = quality;
+            } else {
+                actualProcess = DEFAULT_PROCESS;
+            }
+        }
+
+        return processRequest(file, machine, filament, actualProcess);
+    }
+
+    @PostMapping("/calculate/stl")
+    public ResponseEntity<QuoteResult> legacyCalculate(
+            @RequestParam("file") MultipartFile file
+    ) throws IOException {
+        // Legacy endpoint uses defaults
+        return processRequest(file, DEFAULT_MACHINE, DEFAULT_FILAMENT, DEFAULT_PROCESS);
+    }
+
+    private ResponseEntity<QuoteResult> processRequest(MultipartFile file, String machine, String filament, String process) throws IOException {
+        if (file.isEmpty()) {
+            return ResponseEntity.badRequest().build();
+        }
+
+        // Save uploaded file temporarily
+        Path tempInput = Files.createTempFile("upload_", "_" + file.getOriginalFilename());
+        try {
+            file.transferTo(tempInput.toFile());
+
+            // Slice
+            PrintStats stats = slicerService.slice(tempInput.toFile(), machine, filament, process);
+            
+            // Calculate Quote
+            QuoteResult result = quoteCalculator.calculate(stats);
+            
+            return ResponseEntity.ok(result);
+
+        } catch (Exception e) {
+            e.printStackTrace();
+            return ResponseEntity.internalServerError().build(); // Simplify error handling for now
+        } finally {
+            Files.deleteIfExists(tempInput);
+        }
+    }
+}

backend/src/main/java/com/printcalculator/model/CostBreakdown.java

@@ -0,0 +1,11 @@
+package com.printcalculator.model;
+
+import java.math.BigDecimal;
+
+public record CostBreakdown(
+    BigDecimal materialCost,
+    BigDecimal machineCost,
+    BigDecimal energyCost,
+    BigDecimal subtotal,
+    BigDecimal markupAmount
+) {}

backend/src/main/java/com/printcalculator/model/PrintStats.java

@@ -0,0 +1,8 @@
+package com.printcalculator.model;
+
+public record PrintStats(
+    long printTimeSeconds,
+    String printTimeFormatted,
+    double filamentWeightGrams,
+    double filamentLengthMm
+) {}

backend/src/main/java/com/printcalculator/model/QuoteResult.java

@@ -0,0 +1,12 @@
+package com.printcalculator.model;
+
+import java.math.BigDecimal;
+import java.util.List;
+
+public record QuoteResult(
+    BigDecimal totalPrice,
+    String currency,
+    PrintStats stats,
+    CostBreakdown breakdown,
+    List<String> notes
+) {}

backend/src/main/java/com/printcalculator/service/GCodeParser.java

@@ -0,0 +1,85 @@
+package com.printcalculator.service;
+
+import com.printcalculator.model.PrintStats;
+import org.springframework.stereotype.Service;
+
+import java.io.BufferedReader;
+import java.io.File;
+import java.io.FileReader;
+import java.io.IOException;
+import java.util.regex.Matcher;
+import java.util.regex.Pattern;
+
+@Service
+public class GCodeParser {
+
+    // OrcaSlicer/BambuStudio format
+    // ; estimated printing time = 1h 2m 3s
+    // ; filament used [g] = 12.34
+    // ; filament used [mm] = 1234.56
+    private static final Pattern TIME_PATTERN = Pattern.compile(";\\s*estimated printing time\\s*=\\s*(.*)");
+    private static final Pattern FILAMENT_G_PATTERN = Pattern.compile(";\\s*filament used \\[g\\]\\s*=\\s*(.*)");
+    private static final Pattern FILAMENT_MM_PATTERN = Pattern.compile(";\\s*filament used \\[mm\\]\\s*=\\s*(.*)");
+
+    public PrintStats parse(File gcodeFile) throws IOException {
+        long seconds = 0;
+        double weightG = 0;
+        double lengthMm = 0;
+        String timeFormatted = "";
+
+        try (BufferedReader reader = new BufferedReader(new FileReader(gcodeFile))) {
+            String line;
+            // Scan first 5000 lines for efficiency (metadata might be further down)
+            int count = 0;
+            while ((line = reader.readLine()) != null && count < 5000) {
+                line = line.trim();
+                if (!line.startsWith(";")) {
+                    count++;
+                    continue;
+                }
+
+                Matcher timeMatcher = TIME_PATTERN.matcher(line);
+                if (timeMatcher.find()) {
+                    timeFormatted = timeMatcher.group(1).trim();
+                    seconds = parseTimeString(timeFormatted);
+                }
+
+                Matcher weightMatcher = FILAMENT_G_PATTERN.matcher(line);
+                if (weightMatcher.find()) {
+                    try {
+                        weightG = Double.parseDouble(weightMatcher.group(1).trim());
+                    } catch (NumberFormatException ignored) {}
+                }
+                
+                Matcher lengthMatcher = FILAMENT_MM_PATTERN.matcher(line);
+                if (lengthMatcher.find()) {
+                    try {
+                        lengthMm = Double.parseDouble(lengthMatcher.group(1).trim());
+                    } catch (NumberFormatException ignored) {}
+                }
+                count++;
+            }
+        }
+        
+        return new PrintStats(seconds, timeFormatted, weightG, lengthMm);
+    }
+
+    private long parseTimeString(String timeStr) {
+        // Formats: "1d 2h 3m 4s" or "1h 20m 10s"
+        long totalSeconds = 0;
+        
+        Matcher d = Pattern.compile("(\\d+)d").matcher(timeStr);
+        if (d.find()) totalSeconds += Long.parseLong(d.group(1)) * 86400;
+
+        Matcher h = Pattern.compile("(\\d+)h").matcher(timeStr);
+        if (h.find()) totalSeconds += Long.parseLong(h.group(1)) * 3600;
+
+        Matcher m = Pattern.compile("(\\d+)m").matcher(timeStr);
+        if (m.find()) totalSeconds += Long.parseLong(m.group(1)) * 60;
+
+        Matcher s = Pattern.compile("(\\d+)s").matcher(timeStr);
+        if (s.find()) totalSeconds += Long.parseLong(s.group(1));
+
+        return totalSeconds;
+    }
+}

backend/src/main/java/com/printcalculator/service/ProfileManager.java

@@ -0,0 +1,126 @@
+package com.printcalculator.service;
+
+import com.fasterxml.jackson.databind.JsonNode;
+import com.fasterxml.jackson.databind.ObjectMapper;
+import com.fasterxml.jackson.databind.node.ObjectNode;
+import org.springframework.beans.factory.annotation.Value;
+import org.springframework.stereotype.Service;
+
+import java.io.IOException;
+import java.nio.file.Files;
+import java.nio.file.Path;
+import java.nio.file.Paths;
+import java.util.Iterator;
+import java.util.Optional;
+import java.util.logging.Logger;
+import java.util.stream.Stream;
+import java.util.Map;
+import java.util.HashMap;
+
+@Service
+public class ProfileManager {
+
+    private static final Logger logger = Logger.getLogger(ProfileManager.class.getName());
+    private final String profilesRoot;
+    private final ObjectMapper mapper;
+
+    private final Map<String, String> profileAliases;
+
+    public ProfileManager(@Value("${profiles.root:profiles}") String profilesRoot, ObjectMapper mapper) {
+        this.profilesRoot = profilesRoot;
+        this.mapper = mapper;
+        this.profileAliases = new HashMap<>();
+        initializeAliases();
+    }
+
+    private void initializeAliases() {
+        // Machine Aliases
+        profileAliases.put("bambu_a1", "Bambu Lab A1 0.4 nozzle");
+        
+        // Material Aliases
+        profileAliases.put("pla_basic", "Bambu PLA Basic @BBL A1");
+        profileAliases.put("petg_basic", "Bambu PETG Basic @BBL A1");
+        profileAliases.put("tpu_95a", "Bambu TPU 95A @BBL A1");
+        
+        // Quality/Process Aliases
+        profileAliases.put("draft", "0.24mm Draft @BBL A1");
+        profileAliases.put("standard", "0.20mm Standard @BBL A1"); // or 0.20mm Standard @BBL A1
+        profileAliases.put("extra_fine", "0.08mm High Quality @BBL A1");
+        
+        // Additional aliases from error logs
+        profileAliases.put("Bambu_Process_0.20_Standard", "0.20mm Standard @BBL A1");
+    }
+
+    public ObjectNode getMergedProfile(String profileName, String type) throws IOException {
+        Path profilePath = findProfileFile(profileName, type);
+        if (profilePath == null) {
+            throw new IOException("Profile not found: " + profileName);
+        }
+        return resolveInheritance(profilePath);
+    }
+
+    private Path findProfileFile(String name, String type) {
+        // Check aliases first
+        String resolvedName = profileAliases.getOrDefault(name, name);
+        
+        // Simple search: look for name.json in the profiles_root recursively
+        // Type could be "machine", "process", "filament" to narrow down, but for now global search
+        String filename = resolvedName.endsWith(".json") ? resolvedName : resolvedName + ".json";
+        
+        try (Stream<Path> stream = Files.walk(Paths.get(profilesRoot))) {
+            Optional<Path> found = stream
+                    .filter(p -> p.getFileName().toString().equals(filename))
+                    .findFirst();
+            return found.orElse(null);
+        } catch (IOException e) {
+            logger.severe("Error searching for profile: " + e.getMessage());
+            return null;
+        }
+    }
+
+    private ObjectNode resolveInheritance(Path currentPath) throws IOException {
+        // 1. Load current
+        JsonNode currentNode = mapper.readTree(currentPath.toFile());
+        
+        // 2. Check inherits
+        if (currentNode.has("inherits")) {
+            String parentName = currentNode.get("inherits").asText();
+            // Try to find parent in same directory or standard search
+            Path parentPath = currentPath.getParent().resolve(parentName);
+            if (!Files.exists(parentPath)) {
+                // If not in same dir, search globally
+                parentPath = findProfileFile(parentName, "any");
+            }
+
+            if (parentPath != null && Files.exists(parentPath)) {
+                // Recursive call
+                ObjectNode parentNode = resolveInheritance(parentPath);
+                // Merge current into parent (child overrides parent)
+                merge(parentNode, (ObjectNode) currentNode);
+                // Remove "inherits" field
+                parentNode.remove("inherits");
+                return parentNode;
+            } else {
+                 logger.warning("Inherited profile not found: " + parentName + " for " + currentPath);
+            }
+        }
+
+        if (currentNode instanceof ObjectNode) {
+            return (ObjectNode) currentNode;
+        } else {
+             // Should verify it is an object
+             return (ObjectNode) currentNode;
+        }
+    }
+
+    // Shallow merge suitable for OrcaSlicer profiles
+    private void merge(ObjectNode mainNode, ObjectNode updateNode) {
+        Iterator<String> fieldNames = updateNode.fieldNames();
+        while (fieldNames.hasNext()) {
+            String fieldName = fieldNames.next();
+            JsonNode jsonNode = updateNode.get(fieldName);
+            // Replace standard fields
+            mainNode.set(fieldName, jsonNode);
+        }
+    }
+}

backend/src/main/java/com/printcalculator/service/QuoteCalculator.java

@@ -0,0 +1,59 @@
+package com.printcalculator.service;
+
+import com.printcalculator.config.AppProperties;
+import com.printcalculator.model.CostBreakdown;
+import com.printcalculator.model.PrintStats;
+import com.printcalculator.model.QuoteResult;
+import org.springframework.stereotype.Service;
+
+import java.math.BigDecimal;
+import java.math.RoundingMode;
+import java.util.ArrayList;
+import java.util.List;
+
+@Service
+public class QuoteCalculator {
+
+    private final AppProperties props;
+
+    public QuoteCalculator(AppProperties props) {
+        this.props = props;
+    }
+
+    public QuoteResult calculate(PrintStats stats) {
+        // Material Cost: (weight / 1000) * costPerKg
+        BigDecimal weightKg = BigDecimal.valueOf(stats.filamentWeightGrams()).divide(BigDecimal.valueOf(1000), 4, RoundingMode.HALF_UP);
+        BigDecimal materialCost = weightKg.multiply(BigDecimal.valueOf(props.getFilamentCostPerKg()));
+
+        // Machine Cost: (seconds / 3600) * costPerHour
+        BigDecimal hours = BigDecimal.valueOf(stats.printTimeSeconds()).divide(BigDecimal.valueOf(3600), 4, RoundingMode.HALF_UP);
+        BigDecimal machineCost = hours.multiply(BigDecimal.valueOf(props.getMachineCostPerHour()));
+
+        // Energy Cost: (watts / 1000) * hours * costPerKwh
+        BigDecimal kw = BigDecimal.valueOf(props.getPrinterPowerWatts()).divide(BigDecimal.valueOf(1000), 4, RoundingMode.HALF_UP);
+        BigDecimal kwh = kw.multiply(hours);
+        BigDecimal energyCost = kwh.multiply(BigDecimal.valueOf(props.getEnergyCostPerKwh()));
+
+        // Subtotal
+        BigDecimal subtotal = materialCost.add(machineCost).add(energyCost);
+
+        // Markup
+        BigDecimal markupFactor = BigDecimal.valueOf(1.0 + (props.getMarkupPercent() / 100.0));
+        BigDecimal totalPrice = subtotal.multiply(markupFactor).setScale(2, RoundingMode.HALF_UP);
+
+        BigDecimal markupAmount = totalPrice.subtract(subtotal);
+
+        CostBreakdown breakdown = new CostBreakdown(
+            materialCost.setScale(2, RoundingMode.HALF_UP),
+            machineCost.setScale(2, RoundingMode.HALF_UP),
+            energyCost.setScale(2, RoundingMode.HALF_UP),
+            subtotal.setScale(2, RoundingMode.HALF_UP),
+            markupAmount.setScale(2, RoundingMode.HALF_UP)
+        );
+        
+        List<String> notes = new ArrayList<>();
+        // notes.add("Generated via Dynamic Slicer (Java Backend)");
+
+        return new QuoteResult(totalPrice, "CHF", stats, breakdown, notes);
+    }
+}

backend/src/main/java/com/printcalculator/service/SlicerService.java

@@ -0,0 +1,136 @@
+package com.printcalculator.service;
+
+import com.fasterxml.jackson.databind.ObjectMapper;
+import com.fasterxml.jackson.databind.node.ObjectNode;
+import com.printcalculator.model.PrintStats;
+import org.springframework.beans.factory.annotation.Value;
+import org.springframework.stereotype.Service;
+
+import java.io.File;
+import java.io.IOException;
+import java.nio.file.Files;
+import java.nio.file.Path;
+import java.util.ArrayList;
+import java.util.List;
+import java.util.concurrent.TimeUnit;
+import java.util.logging.Logger;
+
+@Service
+public class SlicerService {
+
+    private static final Logger logger = Logger.getLogger(SlicerService.class.getName());
+
+    private final String slicerPath;
+    private final ProfileManager profileManager;
+    private final GCodeParser gCodeParser;
+    private final ObjectMapper mapper;
+
+    public SlicerService(
+            @Value("${slicer.path}") String slicerPath,
+            ProfileManager profileManager,
+            GCodeParser gCodeParser,
+            ObjectMapper mapper) {
+        this.slicerPath = slicerPath;
+        this.profileManager = profileManager;
+        this.gCodeParser = gCodeParser;
+        this.mapper = mapper;
+    }
+
+    public PrintStats slice(File inputStl, String machineName, String filamentName, String processName) throws IOException {
+        // 1. Prepare Profiles
+        ObjectNode machineProfile = profileManager.getMergedProfile(machineName, "machine");
+        ObjectNode filamentProfile = profileManager.getMergedProfile(filamentName, "filament");
+        ObjectNode processProfile = profileManager.getMergedProfile(processName, "process");
+
+        // 2. Create Temp Dir
+        Path tempDir = Files.createTempDirectory("slicer_job_");
+        try {
+            File mFile = tempDir.resolve("machine.json").toFile();
+            File fFile = tempDir.resolve("filament.json").toFile();
+            File pFile = tempDir.resolve("process.json").toFile();
+
+            mapper.writeValue(mFile, machineProfile);
+            mapper.writeValue(fFile, filamentProfile);
+            mapper.writeValue(pFile, processProfile);
+
+            // 3. Build Command
+            // --load-settings "machine.json;process.json" --load-filaments "filament.json"
+            List<String> command = new ArrayList<>();
+            command.add(slicerPath);
+            
+            // Load machine settings
+            command.add("--load-settings");
+            command.add(mFile.getAbsolutePath());
+            
+            // Load process settings
+            command.add("--load-settings");
+            command.add(pFile.getAbsolutePath());
+            command.add("--load-filaments");
+            command.add(fFile.getAbsolutePath());
+            command.add("--ensure-on-bed");
+            command.add("--arrange");
+            command.add("1"); // force arrange
+            command.add("--slice");
+            command.add("0"); // slice plate 0
+            command.add("--outputdir");
+            command.add(tempDir.toAbsolutePath().toString());
+            // Need to handle Mac structure for console if needed? 
+            // Usually the binary at Contents/MacOS/OrcaSlicer works fine as console app.
+            
+            command.add(inputStl.getAbsolutePath());
+
+            logger.info("Executing Slicer: " + String.join(" ", command));
+
+            // 4. Run Process
+            ProcessBuilder pb = new ProcessBuilder(command);
+            pb.directory(tempDir.toFile());
+            // pb.inheritIO(); // Useful for debugging, but maybe capture instead?
+            
+            Process process = pb.start();
+            boolean finished = process.waitFor(5, TimeUnit.MINUTES);
+            
+            if (!finished) {
+                process.destroy();
+                throw new IOException("Slicer timed out");
+            }
+            
+            if (process.exitValue() != 0) {
+                // Read stderr
+                String error = new String(process.getErrorStream().readAllBytes());
+                throw new IOException("Slicer failed with exit code " + process.exitValue() + ": " + error);
+            }
+
+            // 5. Find Output GCode
+            // Usually [basename].gcode or plate_1.gcode
+            String basename = inputStl.getName();
+            if (basename.toLowerCase().endsWith(".stl")) {
+                basename = basename.substring(0, basename.length() - 4);
+            }
+            
+            File gcodeFile = tempDir.resolve(basename + ".gcode").toFile();
+            if (!gcodeFile.exists()) {
+                // Try plate_1.gcode fallback
+                File alt = tempDir.resolve("plate_1.gcode").toFile();
+                if (alt.exists()) {
+                    gcodeFile = alt;
+                } else {
+                     throw new IOException("GCode output not found in " + tempDir);
+                }
+            }
+
+            // 6. Parse Results
+            return gCodeParser.parse(gcodeFile);
+
+        } catch (InterruptedException e) {
+            Thread.currentThread().interrupt();
+            throw new IOException("Interrupted during slicing", e);
+        } finally {
+            // Cleanup temp dir
+            // In production we should delete, for debugging we might want to keep?
+            // Let's delete for now on success.
+            // recursiveDelete(tempDir);
+            // Leaving it effectively "leaks" temp, but safer for persistent debugging?
+            // Implementation detail: Use a utility to clean up.
+        }
+    }
+}

backend/src/main/resources/application.properties

@@ -0,0 +1,27 @@
+spring.application.name=backend
+server.port=8000
+
+# Database Configuration
+spring.datasource.url=${DB_URL:jdbc:postgresql://localhost:5432/printcalc}
+spring.datasource.username=${DB_USERNAME:printcalc}
+spring.datasource.password=${DB_PASSWORD:printcalc_secret}
+spring.jpa.hibernate.ddl-auto=update
+spring.jpa.properties.hibernate.dialect=org.hibernate.dialect.PostgreSQLDialect
+
+
+# Slicer Configuration
+# Map SLICER_PATH env var if present (default to /opt/orcaslicer/AppRun or Mac path)
+slicer.path=${SLICER_PATH:/Applications/OrcaSlicer.app/Contents/MacOS/OrcaSlicer}
+profiles.root=${PROFILES_DIR:profiles}
+
+# Pricing Configuration
+# Mapped to legacy environment variables for Docker compatibility
+pricing.filament-cost-per-kg=${FILAMENT_COST_PER_KG:25.0}
+pricing.machine-cost-per-hour=${MACHINE_COST_PER_HOUR:2.0}
+pricing.energy-cost-per-kwh=${ENERGY_COST_PER_KWH:0.30}
+pricing.printer-power-watts=${PRINTER_POWER_WATTS:150.0}
+pricing.markup-percent=${MARKUP_PERCENT:20.0}
+
+# File Upload Limits
+spring.servlet.multipart.max-file-size=200MB
+spring.servlet.multipart.max-request-size=200MB

backend/src/test/java/com/printcalculator/service/GCodeParserTest.java

@@ -0,0 +1,57 @@
+package com.printcalculator.service;
+
+import com.printcalculator.model.PrintStats;
+import org.junit.jupiter.api.Test;
+import java.io.File;
+import java.io.FileWriter;
+import java.io.IOException;
+
+import static org.junit.jupiter.api.Assertions.*;
+
+class GCodeParserTest {
+
+    @Test
+    void parse_validGcode_returnsCorrectStats() throws IOException {
+        // Arrange
+        File tempFile = File.createTempFile("test", ".gcode");
+        try (FileWriter writer = new FileWriter(tempFile)) {
+            writer.write("; generated by OrcaSlicer\n");
+            writer.write("; estimated printing time = 1h 2m 3s\n");
+            writer.write("; filament used [g] = 10.5\n");
+            writer.write("; filament used [mm] = 3000.0\n");
+        }
+
+        GCodeParser parser = new GCodeParser();
+
+        // Act
+        PrintStats stats = parser.parse(tempFile);
+
+        // Assert
+        assertEquals(3723, stats.printTimeSeconds()); // 3600 + 120 + 3
+        assertEquals("1h 2m 3s", stats.printTimeFormatted());
+        assertEquals(10.5, stats.filamentWeightGrams(), 0.001);
+        assertEquals(3000.0, stats.filamentLengthMm(), 0.001);
+
+        tempFile.delete();
+    }
+    
+    @Test
+    void parse_footerGcode_returnsCorrectStats() throws IOException {
+        // Arrange
+        File tempFile = File.createTempFile("test_footer", ".gcode");
+        try (FileWriter writer = new FileWriter(tempFile)) {
+            writer.write("; header\n");
+             // ... many lines ...
+            writer.write("; filament used [g] = 5.0\n");
+            writer.write("; estimated printing time = 12m 30s\n");
+        }
+
+        GCodeParser parser = new GCodeParser();
+        PrintStats stats = parser.parse(tempFile);
+
+        assertEquals(750, stats.printTimeSeconds()); // 12*60 + 30
+        assertEquals(5.0, stats.filamentWeightGrams(), 0.001);
+
+        tempFile.delete();
+    }
+}

backend/test_cube.stl

@@ -1,86 +0,0 @@
-solid cube
-facet normal 0 0 -1
-outer loop
-vertex 0 0 0
-vertex 10 0 0
-vertex 10 10 0
-endloop
-endfacet
-facet normal 0 0 -1
-outer loop
-vertex 0 0 0
-vertex 10 10 0
-vertex 0 10 0
-endloop
-endfacet
-facet normal 0 0 1
-outer loop
-vertex 0 0 10
-vertex 0 10 10
-vertex 10 10 10
-endloop
-endfacet
-facet normal 0 0 1
-outer loop
-vertex 0 0 10
-vertex 10 10 10
-vertex 10 0 10
-endloop
-endfacet
-facet normal 0 -1 0
-outer loop
-vertex 0 0 0
-vertex 0 0 10
-vertex 10 0 10
-endloop
-endfacet
-facet normal 0 -1 0
-outer loop
-vertex 0 0 0
-vertex 10 0 10
-vertex 10 0 0
-endloop
-endfacet
-facet normal 1 0 0
-outer loop
-vertex 10 0 0
-vertex 10 0 10
-vertex 10 10 10
-endloop
-endfacet
-facet normal 1 0 0
-outer loop
-vertex 10 0 0
-vertex 10 10 10
-vertex 10 10 0
-endloop
-endfacet
-facet normal 0 1 0
-outer loop
-vertex 10 10 0
-vertex 10 10 10
-vertex 0 10 10
-endloop
-endfacet
-facet normal 0 1 0
-outer loop
-vertex 10 10 0
-vertex 0 10 10
-vertex 0 10 0
-endloop
-endfacet
-facet normal -1 0 0
-outer loop
-vertex 0 10 0
-vertex 0 10 10
-vertex 0 0 10
-endloop
-endfacet
-facet normal -1 0 0
-outer loop
-vertex 0 10 0
-vertex 0 0 10
-vertex 0 0 0
-endloop
-endfacet
-endsolid cube

backend/tests/test_profile_logic.py

@@ -1,58 +0,0 @@
-import sys
-import os
-import unittest
-import json
-
-# Add backend to path
-sys.path.append(os.path.join(os.path.dirname(__file__), ".."))
-
-from profile_manager import ProfileManager
-from profile_cache import get_cache_key
-
-class TestProfileManager(unittest.TestCase):
-    def setUp(self):
-        self.pm = ProfileManager(profiles_root="profiles")
-        
-    def test_list_machines(self):
-        machines = self.pm.list_machines()
-        print(f"Found machines: {len(machines)}")
-        self.assertTrue(len(machines) > 0, "No machines found")
-        # Check for a known machine
-        self.assertTrue(any("Bambu Lab A1" in m for m in machines), "Bambu Lab A1 should be in the list")
-
-    def test_find_profile(self):
-        # We know "Bambu Lab A1 0.4 nozzle" should exist (based on user context and mappings)
-        # It might be in profiles/BBL/machine/
-        path = self.pm._find_profile_file("Bambu Lab A1 0.4 nozzle", "machine")
-        self.assertIsNotNone(path, "Could not find Bambu Lab A1 machine profile")
-        print(f"Found profile at: {path}")
-
-    def test_scan_profiles_inheritance(self):
-        # Pick a profile we expect to inherit stuff
-        # e.g. "Bambu Lab A1 0.4 nozzle" inherits "fdm_bbl_3dp_001_common" which inherits "fdm_machine_common"
-        merged, _, _ = self.pm.get_profiles(
-            "Bambu Lab A1 0.4 nozzle", 
-            "Bambu PLA Basic @BBL A1", 
-            "0.20mm Standard @BBL A1"
-        )
-        
-        self.assertIsNotNone(merged)
-        # Check if inherits is gone
-        self.assertNotIn("inherits", merged)
-        # Check if patch applied (G92 E0)
-        self.assertIn("G92 E0", merged.get("layer_change_gcode", ""))
-        
-        # Check specific key from base
-        # "printer_technology": "FFF" is usually in common
-        # We can't be 100% sure of keys without seeing file, but let's check something likely
-        self.assertTrue("nozzle_diameter" in merged or "extruder_clearance_height_to_lid" in merged or "printable_height" in merged)
-
-    def test_mappings_resolution(self):
-        # Test if the slicer service would resolve correctly? 
-        # We can just test the manager with mapped names if the manager supported it, 
-        # but the manager deals with explicit names. 
-        # Integration test handles the mapping.
-        pass
-
-if __name__ == '__main__':
-    unittest.main()

docker-compose.deploy.yml

@@ -15,7 +15,7 @@ services:
       - MARKUP_PERCENT=${MARKUP_PERCENT}
       - TEMP_DIR=/app/temp
       - PROFILES_DIR=/app/profiles
-    restart: unless-stopped
+    restart: always
     volumes:
       - backend_profiles_${ENV}:/app/profiles
 
@@ -23,10 +23,10 @@ services:
     image: ${REGISTRY_URL}/${REPO_OWNER}/print-calculator-frontend:${TAG}
     container_name: print-calculator-frontend-${ENV}
     ports:
-      - "${FRONTEND_PORT}:80"
+      - "${FRONTEND_PORT}:8008"
     depends_on:
       - backend
-    restart: unless-stopped
+    restart: always
 
 volumes:
   backend_profiles_prod:

docker-compose.yml

@@ -25,4 +25,21 @@ services:
       - "80:80"
     depends_on:
       - backend
+      - db
     restart: unless-stopped
+
+  db:
+    image: postgres:15-alpine
+    container_name: print-calculator-db
+    environment:
+      - POSTGRES_USER=printcalc
+      - POSTGRES_PASSWORD=printcalc_secret
+      - POSTGRES_DB=printcalc
+    ports:
+      - "5432:5432"
+    volumes:
+      - postgres_data:/var/lib/postgresql/data
+    restart: unless-stopped
+
+volumes:
+  postgres_data:

frontend/README.md

@@ -1,59 +1,53 @@
-# Frontend
+# Print Calculator Frontend
 
-This project was generated using [Angular CLI](https://github.com/angular/angular-cli) version 19.2.12.
+This is a modern Angular application designed with a Clean Architecture approach (Core, Shared, Features) and Design Tokens for easy theming.
 
-## Development server
+## Project Structure
 
-To start a local development server, run:
+- **Core**: Singleton services, global layout components (Navbar, Footer), guards.
+- **Shared**: Reusable dumb UI components (Buttons, Cards, Inputs). No business logic.
+- **Features**: Lazy-loaded modules (Calculator, Shop, About). Each contains its own pages, components, and services.
+- **Styles**: Design tokens and theming layer.
 
-```bash
-ng serve
-```
+## Getting Started
 
-Once the server is running, open your browser and navigate to `http://localhost:4200/`. The application will automatically reload whenever you modify any of the source files.
+1. **Install Dependencies**:
+   ```bash
+   npm install
+   ```
 
-## Code scaffolding
+2. **Run Development Server**:
+   ```bash
+   ng serve
+   ```
+   Navigate to `http://localhost:4200/`.
 
-Angular CLI includes powerful code scaffolding tools. To generate a new component, run:
+## Theming
 
-```bash
-ng generate component component-name
-```
+The application uses CSS Variables defined in `src/styles/tokens.scss` and mapped in `src/styles/theme.scss`.
 
-For a complete list of available schematics (such as `components`, `directives`, or `pipes`), run:
+- **Change Colors**: Edit `src/styles/tokens.scss`.
+- **Create New Theme**:
+  1. Duplicate `src/styles/theme.scss` (e.g., `theme-dark.scss`).
+  2. Override the semantic variables (e.g., `--color-bg`, `--color-text`).
+  3. Load the new theme file or switch classes on the body tag.
 
-```bash
-ng generate --help
-```
+## Adding a New Feature
 
-## Building
+1. **Create Directory**: `src/app/features/my-feature`.
+2. **Create Routes**: Create `my-feature.routes.ts` exporting a `Routes` array.
+3. **Register Route**: Add to `src/app/app.routes.ts` using lazy loading:
+   ```typescript
+   {
+     path: 'my-feature',
+     loadChildren: () => import('./features/my-feature/my-feature.routes').then(m => m.MY_FEATURE_ROUTES)
+   }
+   ```
 
-To build the project run:
+## Internationalization (i18n)
 
-```bash
-ng build
-```
+Translations are stored in `src/assets/i18n/`.
+- `it.json` (Italian - Default)
+- `en.json` (English)
 
-This will compile your project and store the build artifacts in the `dist/` directory. By default, the production build optimizes your application for performance and speed.
-
-## Running unit tests
-
-To execute unit tests with the [Karma](https://karma-runner.github.io) test runner, use the following command:
-
-```bash
-ng test
-```
-
-## Running end-to-end tests
-
-For end-to-end (e2e) testing, run:
-
-```bash
-ng e2e
-```
-
-Angular CLI does not come with an end-to-end testing framework by default. You can choose one that suits your needs.
-
-## Additional Resources
-
-For more information on using the Angular CLI, including detailed command references, visit the [Angular CLI Overview and Command Reference](https://angular.dev/tools/cli) page.
+To add a language, create the JSON file and update `LanguageService` in `src/app/core/services/language.service.ts`.

frontend/angular.json

@@ -29,7 +29,8 @@
               {
                 "glob": "**/*",
                 "input": "public"
-              }
+              },
+              "src/assets"
             ],
             "styles": [
               "@angular/material/prebuilt-themes/azure-blue.css",
@@ -39,6 +40,19 @@
           },
           "configurations": {
             "production": {
+              "fileReplacements": [
+                {
+                  "replace": "src/environments/environment.ts",
+                  "with": "src/environments/environment.prod.ts"
+                }
+              ],
+              "optimization": true,
+              "outputHashing": "all",
+              "sourceMap": false,
+              "namedChunks": false,
+              "aot": true,
+              "extractLicenses": true,
+
               "budgets": [
                 {
                   "type": "initial",
@@ -50,15 +64,26 @@
                   "maximumWarning": "4kB",
                   "maximumError": "8kB"
                 }
-              ],
-              "outputHashing": "all"
+              ]
             },
             "development": {
               "optimization": false,
               "extractLicenses": false,
               "sourceMap": true
+            },
+            "local": {
+              "fileReplacements": [
+                {
+                  "replace": "src/environments/environment.ts",
+                  "with": "src/environments/environment.local.ts"
+                }
+              ],
+              "optimization": false,
+              "extractLicenses": false,
+              "sourceMap": true
             }
           },
+
           "defaultConfiguration": "production"
         },
         "serve": {
@@ -69,6 +94,9 @@
             },
             "development": {
               "buildTarget": "frontend:build:development"
+            },
+            "local": {
+              "buildTarget": "frontend:build:local"
             }
           },
           "defaultConfiguration": "development"

frontend/package-lock.json

@@ -17,6 +17,8 @@
         "@angular/platform-browser": "^19.2.18",
         "@angular/platform-browser-dynamic": "^19.2.18",
         "@angular/router": "^19.2.18",
+        "@ngx-translate/core": "^17.0.0",
+        "@ngx-translate/http-loader": "^17.0.0",
         "@types/three": "^0.182.0",
         "rxjs": "~7.8.0",
         "three": "^0.182.0",
@@ -4305,6 +4307,32 @@
         "webpack": "^5.54.0"
       }
     },
+    "node_modules/@ngx-translate/core": {
+      "version": "17.0.0",
+      "resolved": "https://registry.npmjs.org/@ngx-translate/core/-/core-17.0.0.tgz",
+      "integrity": "sha512-Rft2D5ns2pq4orLZjEtx1uhNuEBerUdpFUG1IcqtGuipj6SavgB8SkxtNQALNDA+EVlvsNCCjC2ewZVtUeN6rg==",
+      "license": "MIT",
+      "dependencies": {
+        "tslib": "^2.3.0"
+      },
+      "peerDependencies": {
+        "@angular/common": ">=16",
+        "@angular/core": ">=16"
+      }
+    },
+    "node_modules/@ngx-translate/http-loader": {
+      "version": "17.0.0",
+      "resolved": "https://registry.npmjs.org/@ngx-translate/http-loader/-/http-loader-17.0.0.tgz",
+      "integrity": "sha512-hgS8sa0ARjH9ll3PhkLTufeVXNI2DNR2uFKDhBgq13siUXzzVr/a31M6zgecrtwbA34iaBV01hsTMbMS8V7iIw==",
+      "license": "MIT",
+      "dependencies": {
+        "tslib": "^2.3.0"
+      },
+      "peerDependencies": {
+        "@angular/common": ">=16",
+        "@angular/core": ">=16"
+      }
+    },
     "node_modules/@nodelib/fs.scandir": {
       "version": "2.1.5",
       "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz",

frontend/package.json

@@ -22,6 +22,8 @@
     "@angular/platform-browser": "^19.2.18",
     "@angular/platform-browser-dynamic": "^19.2.18",
     "@angular/router": "^19.2.18",
+    "@ngx-translate/core": "^17.0.0",
+    "@ngx-translate/http-loader": "^17.0.0",
     "@types/three": "^0.182.0",
     "rxjs": "~7.8.0",
     "three": "^0.182.0",

frontend/src/app/app.component.html

@@ -1 +1 @@
-<router-outlet></router-outlet>
+<router-outlet></router-outlet>

frontend/src/app/app.component.spec.ts

@@ -1,29 +0,0 @@
-import { TestBed } from '@angular/core/testing';
-import { AppComponent } from './app.component';
-
-describe('AppComponent', () => {
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      imports: [AppComponent],
-    }).compileComponents();
-  });
-
-  it('should create the app', () => {
-    const fixture = TestBed.createComponent(AppComponent);
-    const app = fixture.componentInstance;
-    expect(app).toBeTruthy();
-  });
-
-  it(`should have the 'frontend' title`, () => {
-    const fixture = TestBed.createComponent(AppComponent);
-    const app = fixture.componentInstance;
-    expect(app.title).toEqual('frontend');
-  });
-
-  it('should render title', () => {
-    const fixture = TestBed.createComponent(AppComponent);
-    fixture.detectChanges();
-    const compiled = fixture.nativeElement as HTMLElement;
-    expect(compiled.querySelector('h1')?.textContent).toContain('Hello, frontend');
-  });
-});

frontend/src/app/app.component.ts

@@ -6,8 +6,6 @@ import { RouterOutlet } from '@angular/router';
   standalone: true,
   imports: [RouterOutlet],
   templateUrl: './app.component.html',
-  styleUrls: ['./app.component.scss']
+  styleUrl: './app.component.scss'
 })
-export class AppComponent {
-  title = 'frontend';
-}
+export class AppComponent {}

frontend/src/app/app.config.ts

@@ -1,28 +1,27 @@
-import { ApplicationConfig, LOCALE_ID, provideZoneChangeDetection } from '@angular/core';
-import { provideRouter } from '@angular/router';
-
+import { ApplicationConfig, provideZoneChangeDetection, importProvidersFrom } from '@angular/core';
+import { provideRouter, withComponentInputBinding, withViewTransitions } from '@angular/router';
 import { routes } from './app.routes';
 import { provideHttpClient } from '@angular/common/http';
-
-const resolveLocale = () => {
-  if (typeof navigator === 'undefined') {
-    return 'de-CH';
-  }
-  const languages = navigator.languages ?? [];
-  if (navigator.language === 'it-CH' || languages.includes('it-CH')) {
-    return 'it-CH';
-  }
-  if (navigator.language === 'de-CH' || languages.includes('de-CH')) {
-    return 'de-CH';
-  }
-  return 'de-CH';
-};
+import { TranslateModule, TranslateLoader } from '@ngx-translate/core';
+import { provideTranslateHttpLoader, TranslateHttpLoader } from '@ngx-translate/http-loader';
 
 export const appConfig: ApplicationConfig = {
   providers: [
     provideZoneChangeDetection({ eventCoalescing: true }),
-    provideRouter(routes),
+    provideRouter(routes, withComponentInputBinding(), withViewTransitions()),
     provideHttpClient(),
-    { provide: LOCALE_ID, useFactory: resolveLocale }
+    provideTranslateHttpLoader({
+      prefix: './assets/i18n/',
+      suffix: '.json'
+    }),
+    importProvidersFrom(
+      TranslateModule.forRoot({
+        defaultLanguage: 'it',
+        loader: {
+          provide: TranslateLoader,
+          useClass: TranslateHttpLoader
+        }
+      })
+    )
   ]
-};
+};

frontend/src/app/app.routes.ts

@@ -1,13 +1,34 @@
 import { Routes } from '@angular/router';
-import { HomeComponent } from './home/home.component';
-import { BasicQuoteComponent } from './quote/basic-quote/basic-quote.component';
-import { AdvancedQuoteComponent } from './quote/advanced-quote/advanced-quote.component';
-import { ContactComponent } from './contact/contact.component';
 
 export const routes: Routes = [
-  { path: '', component: HomeComponent },
-  { path: 'quote/basic', component: BasicQuoteComponent },
-  { path: 'quote/advanced', component: AdvancedQuoteComponent },
-  { path: 'contact', component: ContactComponent },
-  { path: '**', redirectTo: '' }
+  {
+    path: '',
+    loadComponent: () => import('./core/layout/layout.component').then(m => m.LayoutComponent),
+    children: [
+      { 
+        path: '', 
+        loadComponent: () => import('./features/home/home.component').then(m => m.HomeComponent)
+      },
+      { 
+        path: 'cal', 
+        loadChildren: () => import('./features/calculator/calculator.routes').then(m => m.CALCULATOR_ROUTES) 
+      },
+      { 
+        path: 'shop', 
+        loadChildren: () => import('./features/shop/shop.routes').then(m => m.SHOP_ROUTES) 
+      },
+      { 
+        path: 'about', 
+        loadChildren: () => import('./features/about/about.routes').then(m => m.ABOUT_ROUTES) 
+      },
+      { 
+        path: 'contact', 
+        loadChildren: () => import('./features/contact/contact.routes').then(m => m.CONTACT_ROUTES) 
+      },
+      {
+        path: '',
+        loadChildren: () => import('./features/legal/legal.routes').then(m => m.LEGAL_ROUTES)
+      }
+    ]
+  }
 ];

frontend/src/app/calculator/calculator.component.html

@@ -1,69 +0,0 @@
-<div class="calculator-container">
-  <mat-card>
-    <mat-card-header>
-      <mat-card-title>3D Print Quote Calculator</mat-card-title>
-      <mat-card-subtitle>Bambu Lab A1 Estimation</mat-card-subtitle>
-    </mat-card-header>
-    
-    <mat-card-content>
-      <div class="upload-section">
-        <input type="file" (change)="onFileSelected($event)" accept=".stl" #fileInput style="display: none;">
-        <button mat-raised-button color="primary" (click)="fileInput.click()">
-          {{ file ? file.name : 'Select STL File' }}
-        </button>
-        
-        <button mat-raised-button color="accent" 
-                [disabled]="!file || loading" 
-                (click)="uploadAndCalculate()">
-          Calculate Quote
-        </button>
-      </div>
-
-      <div *ngIf="loading" class="spinner-container">
-        <mat-progress-spinner mode="indeterminate"></mat-progress-spinner>
-        <p>Slicing model... this may take a minute...</p>
-      </div>
-
-      <div *ngIf="error" class="error-message">
-        {{ error }}
-      </div>
-
-      <div *ngIf="results" class="results-section">
-        <div class="total-price">
-          <h3>Total Estimate: {{ results?.cost?.total | currency:'CHF' }}</h3>
-        </div>
-
-        <div class="details-grid">
-          <div class="detail-item">
-            <span class="label">Print Time:</span>
-            <span class="value">{{ results?.print_time_formatted }}</span>
-          </div>
-          <div class="detail-item">
-            <span class="label">Material Used:</span>
-            <span class="value">{{ results?.material_grams | number:'1.1-1' }} g</span>
-          </div>
-        </div>
-
-        <h4>Cost Breakdown</h4>
-        <ul class="breakdown-list">
-          <li>
-            <span>Material</span>
-            <span>{{ results?.cost?.material | currency:'CHF' }}</span>
-          </li>
-          <li>
-            <span>Machine Time</span>
-            <span>{{ results?.cost?.machine | currency:'CHF' }}</span>
-          </li>
-          <li>
-            <span>Energy</span>
-            <span>{{ results?.cost?.energy | currency:'CHF' }}</span>
-          </li>
-           <li>
-            <span>Service/Markup</span>
-            <span>{{ results?.cost?.markup | currency:'CHF' }}</span>
-          </li>
-        </ul>
-      </div>
-    </mat-card-content>
-  </mat-card>
-</div>

frontend/src/app/calculator/calculator.component.spec.ts

@@ -1,23 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { CalculatorComponent } from './calculator.component';
-
-describe('CalculatorComponent', () => {
-  let component: CalculatorComponent;
-  let fixture: ComponentFixture<CalculatorComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      imports: [CalculatorComponent]
-    })
-    .compileComponents();
-
-    fixture = TestBed.createComponent(CalculatorComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

frontend/src/app/calculator/calculator.component.ts

@@ -1,77 +0,0 @@
-// calculator.component.ts
-import { Component } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { FormsModule } from '@angular/forms';
-import { HttpClient } from '@angular/common/http';
-import { MatCardModule } from '@angular/material/card';
-import { MatButtonModule } from '@angular/material/button';
-import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
-
-interface QuoteResponse {
-  printer: string;
-  print_time_formatted: string;
-  material_grams: number;
-  cost: {
-    material: number;
-    machine: number;
-    energy: number;
-    markup: number;
-    total: number;
-  };
-}
-
-@Component({
-  selector: 'app-calculator',
-  standalone: true,
-  imports: [
-    CommonModule,
-    FormsModule,
-    MatCardModule,
-    MatButtonModule,
-    MatProgressSpinnerModule
-  ],
-  templateUrl: './calculator.component.html',
-  styleUrls: ['./calculator.component.scss']
-})
-export class CalculatorComponent {
-  file: File | null = null;
-  results: QuoteResponse | null = null;
-  error = '';
-  loading = false;
-
-  constructor(private http: HttpClient) {}
-
-  onFileSelected(event: Event): void {
-    const input = event.target as HTMLInputElement;
-    if (input.files && input.files.length > 0) {
-      this.file = input.files[0];
-      this.results = null;
-      this.error = '';
-    }
-  }
-
-  uploadAndCalculate(): void {
-    if (!this.file) {
-      this.error = 'Please select a file first.';
-      return;
-    }
-    const formData = new FormData();
-    formData.append('file', this.file);
-    this.loading = true;
-    this.error = '';
-    this.results = null;
-
-    this.http.post<QuoteResponse>('http://localhost:8000/calculate/stl', formData)
-      .subscribe({
-        next: res => {
-          this.results = res;
-          this.loading = false;
-        },
-        error: err => {
-          console.error(err);
-          this.error = err.error?.detail || "An error occurred during calculation.";
-          this.loading = false;
-        }
-      });
-  }
-}

frontend/src/app/common/stl-viewer/stl-viewer.component.ts

@@ -1,218 +0,0 @@
-import { Component, ElementRef, Input, OnChanges, OnDestroy, OnInit, ViewChild, SimpleChanges } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import * as THREE from 'three';
-import { STLLoader } from 'three/examples/jsm/loaders/STLLoader.js';
-import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls.js';
-
-@Component({
-  selector: 'app-stl-viewer',
-  standalone: true,
-  imports: [CommonModule],
-  template: `
-    <div class="viewer-container" #rendererContainer>
-      <div *ngIf="isLoading" class="loading-overlay">
-        <span class="material-icons spin">autorenew</span>
-        <p>Loading 3D Model...</p>
-      </div>
-      <div class="dimensions-overlay" *ngIf="dimensions">
-        <p>Size: {{ dimensions.x | number:'1.1-1' }} x {{ dimensions.y | number:'1.1-1' }} x {{ dimensions.z | number:'1.1-1' }} mm</p>
-      </div>
-    </div>
-  `,
-  styles: [`
-    .viewer-container {
-      width: 100%;
-      height: 100%;
-      min-height: 300px;
-      position: relative;
-      background: #0f172a; /* Match app bg approx */
-      overflow: hidden;
-      border-radius: inherit;
-    }
-    .loading-overlay {
-      position: absolute;
-      top: 0; left: 0; right: 0; bottom: 0;
-      display: flex;
-      flex-direction: column;
-      align-items: center;
-      justify-content: center;
-      background: rgba(15, 23, 42, 0.8);
-      color: white;
-      z-index: 10;
-    }
-    .spin {
-      animation: spin 1s linear infinite;
-      font-size: 2rem;
-      margin-bottom: 0.5rem;
-    }
-    @keyframes spin { 100% { transform: rotate(360deg); } }
-    
-    .dimensions-overlay {
-      position: absolute;
-      bottom: 10px;
-      right: 10px;
-      background: rgba(0,0,0,0.6);
-      color: white;
-      padding: 4px 8px;
-      border-radius: 4px;
-      font-size: 0.8rem;
-      pointer-events: none;
-    }
-  `]
-})
-export class StlViewerComponent implements OnInit, OnDestroy, OnChanges {
-  @Input() file: File | null = null;
-  @ViewChild('rendererContainer', { static: true }) rendererContainer!: ElementRef;
-
-  isLoading = false;
-  dimensions: { x: number, y: number, z: number } | null = null;
-
-  private scene!: THREE.Scene;
-  private camera!: THREE.PerspectiveCamera;
-  private renderer!: THREE.WebGLRenderer;
-  private mesh!: THREE.Mesh;
-  private controls!: OrbitControls;
-  private animationId: number | null = null;
-
-  ngOnInit() {
-    this.initThree();
-  }
-
-  ngOnChanges(changes: SimpleChanges) {
-    if (changes['file'] && this.file) {
-      this.loadSTL(this.file);
-    }
-  }
-
-  ngOnDestroy() {
-    this.stopAnimation();
-    if (this.renderer) {
-      this.renderer.dispose();
-    }
-    if (this.mesh) {
-      this.mesh.geometry.dispose();
-      (this.mesh.material as THREE.Material).dispose();
-    }
-  }
-
-  private initThree() {
-    const container = this.rendererContainer.nativeElement;
-    const width = container.clientWidth;
-    const height = container.clientHeight;
-
-    // Scene
-    this.scene = new THREE.Scene();
-    this.scene.background = new THREE.Color(0x1e293b); // Slate 800
-
-    // Camera
-    this.camera = new THREE.PerspectiveCamera(45, width / height, 0.1, 1000);
-    this.camera.position.set(100, 100, 100);
-
-    // Renderer
-    this.renderer = new THREE.WebGLRenderer({ antialias: true, alpha: true });
-    this.renderer.setSize(width, height);
-    this.renderer.setPixelRatio(window.devicePixelRatio);
-    container.appendChild(this.renderer.domElement);
-
-    // Controls
-    this.controls = new OrbitControls(this.camera, this.renderer.domElement);
-    this.controls.enableDamping = true;
-    this.controls.dampingFactor = 0.05;
-    this.controls.autoRotate = true;
-    this.controls.autoRotateSpeed = 2.0;
-
-    // Lights
-    const ambientLight = new THREE.AmbientLight(0xffffff, 0.6);
-    this.scene.add(ambientLight);
-
-    const dirLight = new THREE.DirectionalLight(0xffffff, 0.8);
-    dirLight.position.set(50, 50, 50);
-    this.scene.add(dirLight);
-    
-    const backLight = new THREE.DirectionalLight(0xffffff, 0.4);
-    backLight.position.set(-50, -50, -50);
-    this.scene.add(backLight);
-
-    // Grid (Printer Bed attempt)
-    const gridHelper = new THREE.GridHelper(256, 20, 0x4f46e5, 0x334155);
-    this.scene.add(gridHelper);
-
-    // Resize listener
-    const resizeObserver = new ResizeObserver(() => this.onWindowResize());
-    resizeObserver.observe(container);
-
-    this.animate();
-  }
-
-  private loadSTL(file: File) {
-    this.isLoading = true;
-    
-    // Remove previous mesh
-    if (this.mesh) {
-        this.scene.remove(this.mesh);
-        this.mesh.geometry.dispose();
-        (this.mesh.material as THREE.Material).dispose();
-    }
-
-    const loader = new STLLoader();
-    const reader = new FileReader();
-
-    reader.onload = (event) => {
-      const buffer = event.target?.result as ArrayBuffer;
-      const geometry = loader.parse(buffer);
-      
-      geometry.computeBoundingBox();
-      const center = new THREE.Vector3();
-      geometry.boundingBox?.getCenter(center);
-      geometry.center(); // Center geometry
-      
-      // Calculate dimensions
-      const size = new THREE.Vector3();
-      geometry.boundingBox?.getSize(size);
-      this.dimensions = { x: size.x, y: size.y, z: size.z };
-
-      // Re-position camera based on size
-      const maxDim = Math.max(size.x, size.y, size.z);
-      this.camera.position.set(maxDim * 1.5, maxDim * 1.5, maxDim * 1.5);
-      this.camera.lookAt(0, 0, 0);
-
-      // Material
-      const material = new THREE.MeshStandardMaterial({ 
-        color: 0x6366f1, // Indigo 500
-        roughness: 0.5,
-        metalness: 0.1
-      });
-
-      this.mesh = new THREE.Mesh(geometry, material);
-      this.mesh.rotation.x = -Math.PI / 2; // STL usually needs this
-      this.scene.add(this.mesh);
-      
-      this.isLoading = false;
-    };
-
-    reader.readAsArrayBuffer(file);
-  }
-
-  private animate() {
-    this.animationId = requestAnimationFrame(() => this.animate());
-    this.controls.update();
-    this.renderer.render(this.scene, this.camera);
-  }
-
-  private stopAnimation() {
-    if (this.animationId !== null) {
-      cancelAnimationFrame(this.animationId);
-    }
-  }
-
-  private onWindowResize() {
-    if (!this.rendererContainer) return;
-    const container = this.rendererContainer.nativeElement;
-    const width = container.clientWidth;
-    const height = container.clientHeight;
-
-    this.camera.aspect = width / height;
-    this.camera.updateProjectionMatrix();
-    this.renderer.setSize(width, height);
-  }
-}

frontend/src/app/contact/contact.component.html

@@ -1,50 +0,0 @@
-<div class="container fade-in">
-    <header class="section-header">
-      <a routerLink="/" class="back-link">
-        <span class="material-icons">arrow_back</span> Back
-      </a>
-      <h1>Contact Me</h1>
-      <p>Have a special project? Let's talk.</p>
-    </header>
-  
-    <div class="contact-card card">
-        <div class="contact-info">
-            <div class="info-item">
-                <span class="material-icons">email</span>
-                <div>
-                    <h3>Email</h3>
-                    <p>joe&#64;example.com</p>
-                </div>
-            </div>
-            
-            <div class="info-item">
-                <span class="material-icons">location_on</span>
-                <div>
-                    <h3>Location</h3>
-                    <p>Milan, Italy</p>
-                </div>
-            </div>
-        </div>
-        
-        <div class="divider"></div>
-        
-        <form class="contact-form" (submit)="onSubmit($event)">
-            <div class="form-group">
-                <label>Your Name</label>
-                <input type="text" placeholder="John Doe">
-            </div>
-            
-            <div class="form-group">
-                <label>Email Address</label>
-                <input type="email" placeholder="john@example.com">
-            </div>
-            
-            <div class="form-group">
-                <label>Message</label>
-                <textarea rows="5" placeholder="Tell me about your project..."></textarea>
-            </div>
-            
-            <button type="submit" class="btn btn-secondary btn-block">Send Message</button>
-        </form>
-    </div>
-  </div>

frontend/src/app/contact/contact.component.scss

@@ -1,97 +0,0 @@
-.section-header {
-    margin-bottom: 2rem;
-    text-align: center;
-    
-    .back-link {
-        position: absolute;
-        left: 2rem;
-        top: 2rem;
-        display: inline-flex;
-        align-items: center;
-        color: var(--text-muted);
-        
-        .material-icons { margin-right: 0.5rem; }
-        &:hover { color: var(--primary-color); }
-    }
-    
-    @media (max-width: 768px) {
-        .back-link {
-            position: static;
-            display: block;
-            margin-bottom: 1rem;
-        }
-    }
-}
-
-.contact-card {
-    max-width: 600px;
-    margin: 0 auto;
-}
-
-.contact-info {
-    display: flex;
-    gap: 2rem;
-    margin-bottom: 2rem;
-    
-    .info-item {
-        display: flex;
-        align-items: flex-start;
-        gap: 1rem;
-        
-        .material-icons {
-            color: var(--secondary-color);
-            background: rgba(236, 72, 153, 0.1);
-            padding: 0.5rem;
-            border-radius: 50%;
-        }
-        
-        h3 { margin: 0 0 0.25rem 0; font-size: 1rem; }
-        p { margin: 0; color: var(--text-muted); }
-    }
-}
-
-.divider {
-    height: 1px;
-    background: var(--border-color);
-    margin: 2rem 0;
-}
-
-.form-group {
-    margin-bottom: 1.5rem;
-    
-    label {
-        display: block;
-        margin-bottom: 0.5rem;
-        color: var(--text-muted);
-        font-size: 0.9rem;
-    }
-    
-    input, textarea {
-        width: 100%;
-        padding: 0.75rem;
-        background: var(--bg-color);
-        border: 1px solid var(--border-color);
-        border-radius: var(--radius-md);
-        color: var(--text-main);
-        font-family: inherit;
-        box-sizing: border-box;
-        
-        &:focus {
-            outline: none;
-            border-color: var(--secondary-color);
-        }
-    }
-}
-
-.btn-block {
-    width: 100%;
-}
-
-.fade-in {
-    animation: fadeIn 0.4s ease-out;
-}
-
-@keyframes fadeIn {
-    from { opacity: 0; transform: translateY(10px); }
-    to { opacity: 1; transform: translateY(0); }
-}

frontend/src/app/contact/contact.component.ts

@@ -1,17 +0,0 @@
-import { Component } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { RouterLink } from '@angular/router';
-
-@Component({
-  selector: 'app-contact',
-  standalone: true,
-  imports: [CommonModule, RouterLink],
-  templateUrl: './contact.component.html',
-  styleUrls: ['./contact.component.scss']
-})
-export class ContactComponent {
-    onSubmit(event: Event) {
-        event.preventDefault();
-        alert("Thanks for your message! This is a demo form.");
-    }
-}

frontend/src/app/core/constants/colors.const.ts

@@ -0,0 +1,41 @@
+export interface ColorOption {
+  label: string;
+  value: string;
+  hex: string;
+  outOfStock?: boolean;
+}
+
+export interface ColorCategory {
+  name: string; // 'Glossy' | 'Matte'
+  colors: ColorOption[];
+}
+
+export const PRODUCT_COLORS: ColorCategory[] = [
+  {
+    name: 'Lucidi', // Glossy
+    colors: [
+      { label: 'Black', value: 'Black', hex: '#1a1a1a' }, // Not pure black for visibility
+      { label: 'White', value: 'White', hex: '#f5f5f5' },
+      { label: 'Red', value: 'Red', hex: '#d32f2f', outOfStock: true },
+      { label: 'Blue', value: 'Blue', hex: '#1976d2' },
+      { label: 'Green', value: 'Green', hex: '#388e3c' },
+      { label: 'Yellow', value: 'Yellow', hex: '#fbc02d' }
+    ]
+  },
+  {
+    name: 'Opachi', // Matte
+    colors: [
+      { label: 'Matte Black', value: 'Matte Black', hex: '#2c2c2c' }, // Lighter charcoal for matte
+      { label: 'Matte White', value: 'Matte White', hex: '#e0e0e0' },
+      { label: 'Matte Gray', value: 'Matte Gray', hex: '#757575' }
+    ]
+  }
+];
+
+export function getColorHex(value: string): string {
+    for (const cat of PRODUCT_COLORS) {
+        const found = cat.colors.find(c => c.value === value);
+        if (found) return found.hex;
+    }
+    return '#facf0a'; // Default Brand Color if not found
+}

frontend/src/app/core/layout/footer.component.html

@@ -0,0 +1,21 @@
+    <footer class="footer">
+      <div class="container footer-inner">
+        <div class="col">
+          <span class="brand">3D fab</span>
+          <p class="copyright">&copy; 2026 3D fab.</p>
+        </div>
+
+        <div class="col links">
+          <a routerLink="/privacy">{{ 'FOOTER.PRIVACY' | translate }}</a>
+          <a routerLink="/terms">{{ 'FOOTER.TERMS' | translate }}</a>
+          <a routerLink="/contact">{{ 'FOOTER.CONTACT' | translate }}</a>
+        </div>
+
+        <div class="col social">
+           <!-- Social Placeholders -->
+           <div class="social-icon"></div>
+           <div class="social-icon"></div>
+           <div class="social-icon"></div>
+        </div>
+      </div>
+    </footer>

frontend/src/app/core/layout/footer.component.scss

@@ -0,0 +1,59 @@
+    @use '../../../styles/patterns';
+
+    .footer {
+      background: var(--color-neutral-900);
+      color: var(--color-neutral-50);
+      padding: var(--space-8) 0 var(--space-4);
+      font-size: 0.9rem;
+      position: relative;
+      margin-top: auto; /* Push to bottom if content is short */
+      // Cross Hatch Pattern
+      &::before {
+        content: '';
+        position: absolute;
+        inset: 0;
+        @include patterns.pattern-cross-hatch(var(--color-neutral-50), 20px, 1px);
+        opacity: 0.05;
+        pointer-events: none;
+      }
+    }
+    .footer-inner {
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      gap: var(--space-6);
+    }
+
+    @media (max-width: 768px) {
+      .footer-inner {
+        flex-direction: column;
+        text-align: center;
+        gap: var(--space-8);
+      }
+      
+      .links {
+        flex-direction: column;
+        gap: var(--space-3);
+      }
+    }
+
+    .brand { font-weight: 700; color: white; display: block; margin-bottom: var(--space-2); }
+    .copyright { font-size: 0.875rem; color: var(--color-secondary-500); margin: 0; }
+    
+    .links {
+      display: flex;
+      gap: var(--space-6);
+      a {
+        color: var(--color-neutral-300);
+        font-size: 0.875rem;
+        transition: color 0.2s;
+        &:hover { color: white; text-decoration: underline; }
+      }
+    }
+
+    .social { display: flex; gap: var(--space-3); }
+    .social-icon {
+      width: 24px; height: 24px;
+      background-color: var(--color-neutral-800);
+      border-radius: 50%;
+    }

frontend/src/app/core/layout/footer.component.ts

@@ -0,0 +1,12 @@
+import { Component } from '@angular/core';
+import { TranslateModule } from '@ngx-translate/core';
+import { RouterLink } from '@angular/router';
+
+@Component({
+  selector: 'app-footer',
+  standalone: true,
+  imports: [TranslateModule, RouterLink],
+  templateUrl: './footer.component.html',
+  styleUrls: ['./footer.component.scss']
+})
+export class FooterComponent {}

frontend/src/app/core/layout/layout.component.html

@@ -0,0 +1,7 @@
+<div class="layout-wrapper">
+  <app-navbar></app-navbar>
+  <main class="main-content">
+    <router-outlet></router-outlet>
+  </main>
+  <app-footer></app-footer>
+</div>

frontend/src/app/core/layout/layout.component.scss

@@ -0,0 +1,9 @@
+.layout-wrapper {
+  display: flex;
+  flex-direction: column;
+  min-height: 100vh;
+}
+.main-content {
+  flex: 1;
+  padding-bottom: var(--space-12);
+}

frontend/src/app/core/layout/layout.component.ts

@@ -0,0 +1,13 @@
+import { Component } from '@angular/core';
+import { RouterOutlet } from '@angular/router';
+import { NavbarComponent } from './navbar.component';
+import { FooterComponent } from './footer.component';
+
+@Component({
+  selector: 'app-layout',
+  standalone: true,
+  imports: [RouterOutlet, NavbarComponent, FooterComponent],
+  templateUrl: './layout.component.html',
+  styleUrl: './layout.component.scss'
+})
+export class LayoutComponent {}

frontend/src/app/core/layout/navbar.component.html

@@ -0,0 +1,29 @@
+    <header class="navbar">
+      <div class="container navbar-inner">
+        <a routerLink="/" class="brand">3D <span class="highlight">fab</span></a>
+        
+        <div class="mobile-toggle" (click)="toggleMenu()" [class.active]="isMenuOpen">
+          <span></span>
+          <span></span>
+          <span></span>
+        </div>
+
+        <nav class="nav-links" [class.open]="isMenuOpen">
+          <a routerLink="/" routerLinkActive="active" [routerLinkActiveOptions]="{exact: true}" (click)="closeMenu()">{{ 'NAV.HOME' | translate }}</a>
+          <a routerLink="/cal" routerLinkActive="active" [routerLinkActiveOptions]="{exact: false}" (click)="closeMenu()">{{ 'NAV.CALCULATOR' | translate }}</a>
+          <a routerLink="/shop" routerLinkActive="active" (click)="closeMenu()">{{ 'NAV.SHOP' | translate }}</a>
+          <a routerLink="/about" routerLinkActive="active" (click)="closeMenu()">{{ 'NAV.ABOUT' | translate }}</a>
+          <a routerLink="/contact" routerLinkActive="active" (click)="closeMenu()">{{ 'NAV.CONTACT' | translate }}</a>
+        </nav>
+
+        <div class="actions">
+          <button class="lang-switch" (click)="toggleLang()">
+            {{ langService.currentLang() === 'it' ? 'EN' : 'IT' }}
+          </button>
+          
+          <div class="icon-placeholder">
+            <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"></path><circle cx="12" cy="7" r="4"></circle></svg>
+          </div>
+        </div>
+      </div>
+    </header>

frontend/src/app/core/layout/navbar.component.scss

@@ -0,0 +1,141 @@
+    .navbar {
+      height: 64px;
+      border-bottom: 1px solid var(--color-border);
+      background-color: var(--color-bg-card);
+      position: sticky;
+      top: 0;
+      z-index: 100;
+      display: flex;
+      align-items: center;
+    }
+    .navbar-inner {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+    }
+    .brand {
+      font-size: 1.25rem;
+      font-weight: 700;
+      color: var(--color-text);
+      text-decoration: none;
+    }
+    .highlight { color: var(--color-brand); }
+    
+    .nav-links {
+      display: flex;
+      gap: var(--space-6);
+      
+      a {
+        color: var(--color-text-muted);
+        font-weight: 500;
+        text-decoration: none;
+        transition: color 0.2s;
+        
+        &:hover, &.active {
+          color: var(--color-brand);
+        }
+      }
+    }
+
+    .actions {
+      display: flex;
+      align-items: center;
+      gap: var(--space-4);
+    }
+
+    .lang-switch {
+      background: none;
+      border: 1px solid var(--color-border);
+      border-radius: var(--radius-sm);
+      padding: 2px 6px;
+      cursor: pointer;
+      font-size: 0.875rem;
+      font-weight: 600;
+      color: var(--color-text-muted);
+      &:hover { color: var(--color-text); border-color: var(--color-text); }
+    }
+
+    .icon-placeholder {
+      width: 32px;
+      height: 32px;
+      border-radius: 50%;
+      background-color: var(--color-neutral-100);
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      color: var(--color-text-muted);
+    }
+
+    /* Mobile Toggle */
+    .mobile-toggle {
+      display: none;
+      flex-direction: column;
+      justify-content: space-between;
+      width: 24px;
+      height: 18px;
+      cursor: pointer;
+      z-index: 101;
+      
+      span {
+        display: block;
+        height: 2px;
+        width: 100%;
+        background-color: var(--color-text);
+        border-radius: 2px;
+        transition: all 0.3s ease;
+      }
+      
+      &.active {
+        span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
+        span:nth-child(2) { opacity: 0; }
+        span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }
+      }
+    }
+
+    /* Responsive Design */
+    @media (max-width: 768px) {
+      .mobile-toggle {
+        display: flex;
+        order: 2; /* Place after actions */
+        margin-left: var(--space-4);
+      }
+
+      .actions {
+        order: 1; /* Place before toggle */
+        margin-left: auto; /* Push to right */
+      }
+
+      .nav-links {
+        position: absolute;
+        top: 64px;
+        left: 0;
+        right: 0;
+        background-color: var(--color-bg-card);
+        flex-direction: column;
+        padding: var(--space-4);
+        border-bottom: 1px solid var(--color-border);
+        gap: var(--space-4);
+        display: none;
+        z-index: 1000;
+        
+        &.open {
+          display: flex;
+          animation: slideDown 0.3s ease forwards;
+        }
+
+        a {
+          font-size: 1.1rem;
+          padding: var(--space-2) 0;
+          border-bottom: 1px solid var(--color-neutral-100);
+          
+          &:last-child {
+            border-bottom: none;
+          }
+        }
+      }
+    }
+
+    @keyframes slideDown {
+      from { opacity: 0; transform: translateY(-10px); }
+      to { opacity: 1; transform: translateY(0); }
+    }

frontend/src/app/core/layout/navbar.component.ts

@@ -0,0 +1,31 @@
+import { Component } from '@angular/core';
+import { RouterLink, RouterLinkActive } from '@angular/router';
+import { TranslateModule } from '@ngx-translate/core';
+import { LanguageService } from '../services/language.service';
+import { AppButtonComponent } from '../../shared/components/app-button/app-button.component';
+
+@Component({
+  selector: 'app-navbar',
+  standalone: true,
+  imports: [RouterLink, RouterLinkActive, TranslateModule],
+  templateUrl: './navbar.component.html',
+  styleUrls: ['./navbar.component.scss']
+})
+export class NavbarComponent {
+  isMenuOpen = false;
+
+  constructor(public langService: LanguageService) {}
+
+  toggleLang() {
+    const newLang = this.langService.currentLang() === 'it' ? 'en' : 'it';
+    this.langService.switchLang(newLang);
+  }
+
+  toggleMenu() {
+    this.isMenuOpen = !this.isMenuOpen;
+  }
+
+  closeMenu() {
+    this.isMenuOpen = false;
+  }
+}

frontend/src/app/core/services/language.service.ts

@@ -0,0 +1,20 @@
+import { Injectable, signal } from '@angular/core';
+import { TranslateService } from '@ngx-translate/core';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class LanguageService {
+  currentLang = signal('it');
+
+  constructor(private translate: TranslateService) {
+    this.translate.addLangs(['it', 'en']);
+    this.translate.setDefaultLang('it');
+    this.translate.use('it');
+  }
+
+  switchLang(lang: string) {
+    this.translate.use(lang);
+    this.currentLang.set(lang);
+  }
+}

frontend/src/app/features/about/about-page.component.html

@@ -0,0 +1,44 @@
+<section class="about-section">
+  <div class="container split-layout">
+    
+    <!-- Left Column: Content -->
+    <div class="text-content">
+      <p class="eyebrow">{{ 'ABOUT.EYEBROW' | translate }}</p>
+      <h1>{{ 'ABOUT.TITLE' | translate }}</h1>
+      <p class="subtitle">{{ 'ABOUT.SUBTITLE' | translate }}</p>
+      
+      <div class="divider"></div>
+
+      <p class="description">{{ 'ABOUT.HOW_TEXT' | translate }}</p>
+
+      <div class="tags-container">
+        <span class="tag">{{ 'ABOUT.PILL_1' | translate }}</span>
+        <span class="tag">{{ 'ABOUT.PILL_2' | translate }}</span>
+        <span class="tag">{{ 'ABOUT.PILL_3' | translate }}</span>
+        <span class="tag">{{ 'ABOUT.SERVICE_1' | translate }}</span>
+        <span class="tag">{{ 'ABOUT.SERVICE_2' | translate }}</span>
+      </div>
+    </div>
+
+    <!-- Right Column: Visuals -->
+    <div class="visual-content">
+      <div class="photo-card card-1">
+        <div class="placeholder-img"></div>
+        <div class="member-info">
+          <span class="member-name">Member 1</span>
+          <span class="member-role">Founder</span>
+        </div>
+      </div>
+      <div class="photo-card card-2">
+        <div class="placeholder-img"></div>
+        <div class="member-info">
+          <span class="member-name">Member 2</span>
+          <span class="member-role">Co-Founder</span>
+        </div>
+      </div>
+    </div>
+
+  </div>
+</section>
+
+<app-locations></app-locations>

frontend/src/app/features/about/about-page.component.scss

@@ -0,0 +1,157 @@
+.about-section {
+  padding: 6rem 0;
+  background: var(--color-bg);
+  min-height: 80vh;
+  display: flex;
+  align-items: center;
+}
+
+.split-layout {
+  display: grid;
+  grid-template-columns: 1fr;
+  gap: 4rem;
+  align-items: center;
+  text-align: center; /* Center on mobile */
+  
+  @media(min-width: 992px) {
+    grid-template-columns: 1fr 1fr;
+    gap: 6rem;
+    text-align: left; /* Reset to left on desktop */
+  }
+}
+
+/* Left Column */
+.text-content {
+  /* text-align: left; Removed to inherit from parent */
+}
+
+.eyebrow {
+  text-transform: uppercase;
+  letter-spacing: 0.15em;
+  font-size: 0.875rem;
+  color: var(--color-primary-500);
+  font-weight: 700;
+  margin-bottom: var(--space-2);
+  display: block;
+}
+
+h1 {
+  font-size: 3rem;
+  line-height: 1.1;
+  margin-bottom: var(--space-4);
+  color: var(--color-text-main);
+}
+
+.subtitle {
+  font-size: 1.25rem;
+  color: var(--color-text-muted);
+  margin-bottom: var(--space-6);
+  font-weight: 300;
+}
+
+.divider {
+  height: 4px;
+  width: 60px;
+  background: var(--color-primary-500);
+  border-radius: 2px;
+  margin-bottom: var(--space-6);
+  /* Center divider on mobile */
+  margin-left: auto;
+  margin-right: auto;
+
+  @media(min-width: 992px) {
+    margin-left: 0;
+    margin-right: 0;
+  }
+}
+
+.description {
+  font-size: 1.1rem;
+  line-height: 1.7;
+  color: var(--color-text-main);
+  margin-bottom: var(--space-8);
+}
+
+.tags-container {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.75rem;
+  justify-content: center; /* Center tags on mobile */
+  
+  @media(min-width: 992px) {
+    justify-content: flex-start;
+  }
+}
+
+.tag {
+  padding: 0.5rem 1rem;
+  border-radius: 99px;
+  background: var(--color-surface-card);
+  border: 1px solid var(--color-border);
+  color: var(--color-text-main);
+  font-weight: 500;
+  font-size: 0.9rem;
+  box-shadow: var(--shadow-sm);
+  transition: all 0.2s ease;
+}
+
+.tag:hover {
+  transform: translateY(-2px);
+  border-color: var(--color-primary-500);
+  color: var(--color-primary-500);
+  box-shadow: var(--shadow-md);
+}
+
+/* Right Column */
+.visual-content {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  gap: 2rem;
+  
+  @media(min-width: 768px) {
+    display: grid;
+    grid-template-columns: repeat(2, 1fr);
+    align-items: start;
+    justify-items: center;
+  }
+}
+
+.photo-card {
+  background: var(--color-surface-card);
+  padding: 1rem;
+  border-radius: var(--radius-lg);
+  box-shadow: var(--shadow-lg);
+  width: 100%;
+  max-width: 260px;
+  position: relative;
+}
+
+.placeholder-img {
+  width: 100%;
+  aspect-ratio: 3/4;
+  background: linear-gradient(45deg, var(--color-neutral-200), var(--color-neutral-100));
+  border-radius: var(--radius-md);
+  margin-bottom: 1rem;
+}
+
+.member-info {
+  text-align: center;
+}
+
+.member-name {
+  display: block;
+  font-weight: 700;
+  color: var(--color-text-main);
+  font-size: 1.1rem;
+}
+
+.member-role {
+  display: block;
+  font-size: 0.85rem;
+  color: var(--color-text-muted);
+  text-transform: uppercase;
+  letter-spacing: 0.05em;
+  margin-top: 0.25rem;
+}

frontend/src/app/features/about/about-page.component.ts

@@ -0,0 +1,13 @@
+import { Component } from '@angular/core';
+import { TranslateModule } from '@ngx-translate/core';
+import { AppLocationsComponent } from '../../shared/components/app-locations/app-locations.component';
+
+@Component({
+  selector: 'app-about-page',
+  standalone: true,
+  imports: [TranslateModule, AppLocationsComponent],
+  templateUrl: './about-page.component.html',
+  styleUrl: './about-page.component.scss'
+})
+export class AboutPageComponent {}
+

frontend/src/app/features/about/about.routes.ts

@@ -0,0 +1,6 @@
+import { Routes } from '@angular/router';
+import { AboutPageComponent } from './about-page.component';
+
+export const ABOUT_ROUTES: Routes = [
+  { path: '', component: AboutPageComponent }
+];

frontend/src/app/features/calculator/calculator-page.component.html

@@ -0,0 +1,80 @@
+<div class="container hero">
+  <h1>{{ 'CALC.TITLE' | translate }}</h1>
+  <p class="subtitle">{{ 'CALC.SUBTITLE' | translate }}</p>
+
+  @if (error()) {
+    <app-alert type="error">{{ 'CALC.ERROR_GENERIC' | translate }}</app-alert>
+  }
+</div>
+
+@if (step() === 'success') {
+    <div class="container hero">
+        <app-success-state context="calc" (action)="onNewQuote()"></app-success-state>
+    </div>
+} @else if (step() === 'details' && result()) {
+    <div class="container">
+        <app-user-details
+            [quote]="result()!"
+            (submitOrder)="onSubmitOrder($event)"
+            (cancel)="onCancelDetails()">
+        </app-user-details>
+    </div>
+} @else {
+    <div class="container content-grid">
+      <!-- Left Column: Input -->
+      <div class="col-input">
+        <app-card>
+          <div class="mode-selector">
+            <div class="mode-option"
+                 [class.active]="mode() === 'easy'"
+                 (click)="mode.set('easy')">
+              {{ 'CALC.MODE_EASY' | translate }}
+            </div>
+            <div class="mode-option"
+                 [class.active]="mode() === 'advanced'"
+                 (click)="mode.set('advanced')">
+              {{ 'CALC.MODE_ADVANCED' | translate }}
+            </div>
+          </div>
+    
+          <app-upload-form
+            #uploadForm
+            [mode]="mode()"
+            [loading]="loading()"
+            [uploadProgress]="uploadProgress()"
+            (submitRequest)="onCalculate($event)"
+          ></app-upload-form>
+        </app-card>
+      </div>
+    
+      <!-- Right Column: Result or Info -->
+      <div class="col-result" #resultCol>
+    
+        @if (loading()) {
+            <app-card class="loading-state">
+                <div class="loader-content">
+                    <div class="spinner"></div>
+                    <h3 class="loading-title">Analisi in corso...</h3>
+                    <p class="loading-text">Stiamo analizzando la geometria e calcolando il percorso utensile.</p>
+                </div>
+            </app-card>
+        } @else if (result()) {
+          <app-quote-result 
+            [result]="result()!" 
+            (consult)="onConsult()"
+            (proceed)="onProceed()"
+            (itemChange)="uploadForm.updateItemQuantityByName($event.fileName, $event.quantity)"
+          ></app-quote-result>
+        } @else {
+          <app-card>
+            <h3>{{ 'CALC.BENEFITS_TITLE' | translate }}</h3>
+            <ul class="benefits">
+               <li>{{ 'CALC.BENEFITS_1' | translate }}</li>
+               <li>{{ 'CALC.BENEFITS_2' | translate }}</li>
+               <li>{{ 'CALC.BENEFITS_3' | translate }}</li>
+            </ul>
+          </app-card>
+        }
+      </div>
+    </div>
+}

frontend/src/app/features/calculator/calculator-page.component.scss

@@ -0,0 +1,110 @@
+.hero { padding: var(--space-12) 0; text-align: center; }
+.subtitle { font-size: 1.25rem; color: var(--color-text-muted); max-width: 600px; margin: 0 auto; }
+
+.content-grid {
+  display: grid;
+  grid-template-columns: 1fr;
+  gap: var(--space-6);
+  @media(min-width: 768px) {
+    grid-template-columns: 1.5fr 1fr;
+    gap: var(--space-8);
+  }
+}
+
+.centered-col {
+    align-self: flex-start; /* Default */
+    @media(min-width: 768px) {
+        align-self: center;
+    }
+}
+
+.col-input {
+    min-width: 0;
+}
+
+.col-result {
+    min-width: 0;
+    display: flex;
+    flex-direction: column;
+
+    /* Make children (specifically app-card) stretch */
+    > * {
+        flex: 1;
+    }
+}
+
+/* Mode Selector (Segmented Control style) */
+.mode-selector {
+  display: flex;
+  background-color: var(--color-neutral-100);
+  border-radius: var(--radius-md);
+  padding: 4px;
+  margin-bottom: var(--space-6);
+  gap: 4px;
+  width: 100%;
+}
+
+.mode-option {
+  flex: 1;
+  text-align: center;
+  padding: 8px 16px;
+  border-radius: var(--radius-sm);
+  cursor: pointer;
+  font-size: 0.875rem;
+  font-weight: 500;
+  color: var(--color-text-muted);
+  transition: all 0.2s ease;
+  user-select: none;
+
+  &:hover { color: var(--color-text); }
+
+  &.active {
+    background-color: var(--color-brand);
+    color: #000;
+    font-weight: 600;
+    box-shadow: 0 1px 2px rgba(0,0,0,0.05);
+  }
+}
+
+.benefits { padding-left: var(--space-4); color: var(--color-text-muted); line-height: 2; }
+
+
+.loader-content {
+    text-align: center;
+    max-width: 300px;
+    margin: 0 auto;
+    
+    /* Center content vertically within the stretched card */
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+}
+
+.loading-title {
+    font-size: 1.1rem;
+    font-weight: 600;
+    margin: var(--space-4) 0 var(--space-2);
+    color: var(--color-text);
+}
+
+.loading-text {
+    font-size: 0.9rem;
+    color: var(--color-text-muted);
+    line-height: 1.5;
+}
+
+.spinner {
+    border: 3px solid var(--color-neutral-200);
+    border-left-color: var(--color-brand);
+    border-radius: 50%;
+    width: 48px;
+    height: 48px;
+    animation: spin 1s linear infinite;
+    margin: 0 auto;
+}
+
+@keyframes spin {
+    0% { transform: rotate(0deg); }
+    100% { transform: rotate(360deg); }
+}

frontend/src/app/features/calculator/calculator-page.component.ts

@@ -0,0 +1,125 @@
+import { Component, signal, ViewChild, ElementRef } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { TranslateModule } from '@ngx-translate/core';
+
+import { AppCardComponent } from '../../shared/components/app-card/app-card.component';
+import { AppAlertComponent } from '../../shared/components/app-alert/app-alert.component';
+import { UploadFormComponent } from './components/upload-form/upload-form.component';
+import { QuoteResultComponent } from './components/quote-result/quote-result.component';
+import { QuoteRequest, QuoteResult, QuoteEstimatorService } from './services/quote-estimator.service';
+import { UserDetailsComponent } from './components/user-details/user-details.component';
+import { SuccessStateComponent } from '../../shared/components/success-state/success-state.component';
+import { Router } from '@angular/router';
+
+@Component({
+  selector: 'app-calculator-page',
+  standalone: true,
+  imports: [CommonModule, TranslateModule, AppCardComponent, AppAlertComponent, UploadFormComponent, QuoteResultComponent, UserDetailsComponent, SuccessStateComponent],
+  templateUrl: './calculator-page.component.html',
+  styleUrl: './calculator-page.component.scss'
+})
+export class CalculatorPageComponent {
+  mode = signal<any>('easy');
+  step = signal<'upload' | 'quote' | 'details' | 'success'>('upload');
+  
+  loading = signal(false);
+  uploadProgress = signal(0);
+  result = signal<QuoteResult | null>(null);
+  error = signal<boolean>(false);
+  
+  orderSuccess = signal(false);
+  
+  @ViewChild('uploadForm') uploadForm!: UploadFormComponent;
+  @ViewChild('resultCol') resultCol!: ElementRef;
+
+  constructor(private estimator: QuoteEstimatorService, private router: Router) {}
+
+  onCalculate(req: QuoteRequest) {
+    // ... (logic remains the same, simplified for diff)
+    this.currentRequest = req;
+    this.loading.set(true);
+    this.uploadProgress.set(0);
+    this.error.set(false);
+    this.result.set(null);
+    this.orderSuccess.set(false);
+
+    // Auto-scroll on mobile to make analysis visible
+    setTimeout(() => {
+        if (this.resultCol && window.innerWidth < 768) {
+             this.resultCol.nativeElement.scrollIntoView({ behavior: 'smooth', block: 'start' });
+        }
+    }, 100);
+
+    this.estimator.calculate(req).subscribe({
+      next: (event) => {
+        if (typeof event === 'number') {
+            this.uploadProgress.set(event);
+        } else {
+            // It's the result
+            this.result.set(event as QuoteResult);
+            this.loading.set(false);
+            this.uploadProgress.set(100);
+            this.step.set('quote');
+        }
+      },
+      error: () => {
+        this.error.set(true);
+        this.loading.set(false);
+      }
+    });
+  }
+
+  onProceed() {
+    this.step.set('details');
+  }
+
+  onCancelDetails() {
+    this.step.set('quote');
+  }
+
+  onSubmitOrder(orderData: any) {
+    console.log('Order Submitted:', orderData);
+    this.orderSuccess.set(true);
+    this.step.set('success'); 
+  }
+  
+  onNewQuote() {
+      this.step.set('upload');
+      this.result.set(null);
+      this.orderSuccess.set(false);
+      this.mode.set('easy'); // Reset to default
+  }
+
+  private currentRequest: QuoteRequest | null = null;
+
+  onConsult() {
+    if (!this.currentRequest) return;
+
+    const req = this.currentRequest;
+    let details = `Richiesta Preventivo:\n`;
+    details += `- Materiale: ${req.material}\n`;
+    details += `- Qualità: ${req.quality}\n`;
+    
+    details += `- File:\n`;
+    req.items.forEach(item => {
+        details += `  * ${item.file.name} (Qtà: ${item.quantity}`;
+        if (item.color) {
+            details += `, Colore: ${item.color}`;
+        }
+        details += `)\n`;
+    });
+
+    if (req.mode === 'advanced') {
+       if (req.infillDensity) details += `- Infill: ${req.infillDensity}%\n`;
+    }
+
+    if (req.notes) details += `\nNote: ${req.notes}`;
+
+    this.estimator.setPendingConsultation({
+      files: req.items.map(i => i.file),
+      message: details
+    });
+
+    this.router.navigate(['/contact']);
+  }
+}

frontend/src/app/features/calculator/calculator.routes.ts

@@ -0,0 +1,6 @@
+import { Routes } from '@angular/router';
+import { CalculatorPageComponent } from './calculator-page.component';
+
+export const CALCULATOR_ROUTES: Routes = [
+  { path: '', component: CalculatorPageComponent }
+];

frontend/src/app/features/calculator/components/quote-result/quote-result.component.html

@@ -0,0 +1,67 @@
+<app-card>
+  <h3 class="title">{{ 'CALC.RESULT' | translate }}</h3>
+  
+  <!-- Summary Grid (NOW ON TOP) -->
+  <div class="result-grid">
+    <app-summary-card 
+      class="item full-width" 
+      [label]="'CALC.COST' | translate" 
+      [large]="true" 
+      [highlight]="true">
+      {{ totals().price | currency:result().currency }}
+    </app-summary-card>
+
+    <app-summary-card [label]="'CALC.TIME' | translate">
+      {{ totals().hours }}h {{ totals().minutes }}m
+    </app-summary-card>
+
+    <app-summary-card [label]="'CALC.MATERIAL' | translate">
+      {{ totals().weight }}g
+    </app-summary-card>
+  </div>
+
+  <div class="setup-note">
+    <small>* Include {{ result().setupCost | currency:result().currency }} Setup Cost</small>
+  </div>
+
+  <div class="divider"></div>
+  
+  <!-- Detailed Items List (NOW ON BOTTOM) -->
+  <div class="items-list">
+    @for (item of items(); track item.fileName; let i = $index) {
+      <div class="item-row">
+        <div class="item-info">
+          <span class="file-name">{{ item.fileName }}</span>
+          <span class="file-details">
+             {{ (item.unitTime / 3600) | number:'1.1-1' }}h | {{ item.unitWeight | number:'1.0-0' }}g
+          </span>
+        </div>
+        
+        <div class="item-controls">
+            <div class="qty-control">
+                <label>Qtà:</label>
+                <input 
+                    type="number" 
+                    min="1" 
+                    [ngModel]="item.quantity" 
+                    (ngModelChange)="updateQuantity(i, $event)"
+                    class="qty-input">
+            </div>
+            <div class="item-price">
+                {{ (item.unitPrice * item.quantity) | currency:result().currency }}
+            </div>
+        </div>
+      </div>
+    }
+  </div>
+
+  <div class="actions">
+    <app-button variant="outline" (click)="consult.emit()">
+      {{ 'QUOTE.CONSULT' | translate }}
+    </app-button>
+    
+    <app-button (click)="proceed.emit()">
+        {{ 'QUOTE.PROCEED_ORDER' | translate }}
+    </app-button>
+  </div>
+</app-card>

frontend/src/app/features/calculator/components/quote-result/quote-result.component.scss

@@ -0,0 +1,85 @@
+.title { margin-bottom: var(--space-6); text-align: center; }
+
+.divider { 
+    height: 1px; 
+    background: var(--color-border); 
+    margin: var(--space-4) 0;
+}
+
+.items-list {
+    display: flex;
+    flex-direction: column;
+    gap: var(--space-3);
+    margin-bottom: var(--space-4);
+}
+
+.item-row {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: var(--space-3);
+    background: var(--color-neutral-50);
+    border-radius: var(--radius-md);
+    border: 1px solid var(--color-border);
+}
+
+.item-info {
+    display: flex;
+    flex-direction: column;
+    min-width: 0;
+    flex: 1; /* Ensure it takes available space */
+}
+
+.file-name { font-weight: 500; font-size: 0.9rem; color: var(--color-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
+.file-details { font-size: 0.8rem; color: var(--color-text-muted); }
+
+.item-controls {
+    display: flex;
+    align-items: center;
+    gap: var(--space-4);
+}
+
+.qty-control {
+    display: flex;
+    align-items: center;
+    gap: var(--space-2);
+    
+    label { font-size: 0.8rem; color: var(--color-text-muted); }
+}
+
+.qty-input {
+    width: 60px;
+    padding: 4px 8px;
+    border: 1px solid var(--color-border);
+    border-radius: var(--radius-sm);
+    text-align: center;
+    &:focus { outline: none; border-color: var(--color-brand); }
+}
+
+.item-price {
+    font-weight: 600;
+    min-width: 60px;
+    text-align: right;
+}
+
+.result-grid {
+  display: grid;
+  grid-template-columns: 1fr;
+  gap: var(--space-3);
+  margin-bottom: var(--space-2);
+  
+  @media(min-width: 500px) {
+      grid-template-columns: 1fr 1fr;
+      gap: var(--space-4);
+  }
+}
+.full-width { grid-column: span 2; }
+
+.setup-note {
+    text-align: center;
+    margin-bottom: var(--space-6);
+    color: var(--color-text-muted);
+    font-size: 0.8rem;
+}
+
+.actions { display: flex; flex-direction: column; gap: var(--space-3); }

frontend/src/app/features/calculator/components/quote-result/quote-result.component.ts

@@ -0,0 +1,74 @@
+import { Component, input, output, signal, computed, effect } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+import { TranslateModule } from '@ngx-translate/core';
+import { AppCardComponent } from '../../../../shared/components/app-card/app-card.component';
+import { AppButtonComponent } from '../../../../shared/components/app-button/app-button.component';
+import { SummaryCardComponent } from '../../../../shared/components/summary-card/summary-card.component';
+import { QuoteResult, QuoteItem } from '../../services/quote-estimator.service';
+
+@Component({
+  selector: 'app-quote-result',
+  standalone: true,
+  imports: [CommonModule, FormsModule, TranslateModule, AppCardComponent, AppButtonComponent, SummaryCardComponent],
+  templateUrl: './quote-result.component.html',
+  styleUrl: './quote-result.component.scss'
+})
+export class QuoteResultComponent {
+  result = input.required<QuoteResult>();
+  consult = output<void>();
+  proceed = output<void>();
+  itemChange = output<{fileName: string, quantity: number}>();
+
+  // Local mutable state for items to handle quantity changes
+  items = signal<QuoteItem[]>([]);
+
+  constructor() {
+      effect(() => {
+          // Initialize local items when result inputs change
+          // We map to new objects to avoid mutating the input directly if it was a reference
+          this.items.set(this.result().items.map(i => ({...i})));
+      }, { allowSignalWrites: true });
+  }
+
+  updateQuantity(index: number, newQty: number | string) {
+      const qty = typeof newQty === 'string' ? parseInt(newQty, 10) : newQty;
+      if (qty < 1 || isNaN(qty)) return;
+
+      this.items.update(current => {
+          const updated = [...current];
+          updated[index] = { ...updated[index], quantity: qty };
+          return updated;
+      });
+      
+      this.itemChange.emit({
+          fileName: this.items()[index].fileName,
+          quantity: qty
+      });
+  }
+
+  totals = computed(() => {
+      const currentItems = this.items();
+      const setup = this.result().setupCost;
+      
+      let price = setup;
+      let time = 0;
+      let weight = 0;
+      
+      currentItems.forEach(i => {
+          price += i.unitPrice * i.quantity;
+          time += i.unitTime * i.quantity;
+          weight += i.unitWeight * i.quantity;
+      });
+      
+      const hours = Math.floor(time / 3600);
+      const minutes = Math.ceil((time % 3600) / 60);
+      
+      return {
+          price: Math.round(price * 100) / 100,
+          hours,
+          minutes,
+          weight: Math.ceil(weight)
+      };
+  });
+}

frontend/src/app/features/calculator/components/upload-form/upload-form.component.html

@@ -0,0 +1,155 @@
+<form [formGroup]="form" (ngSubmit)="onSubmit()">
+  
+  <div class="section">
+    @if (selectedFile()) {
+      <div class="viewer-wrapper">
+         <app-stl-viewer 
+            [file]="selectedFile()"
+            [color]="getSelectedFileColor()">
+         </app-stl-viewer>
+         <!-- Close button removed as requested -->
+      </div>
+    }
+    
+    <!-- Initial Dropzone (Visible only when no files) -->
+    @if (items().length === 0) {
+        <app-dropzone 
+            [label]="'CALC.UPLOAD_LABEL' | translate" 
+            [subtext]="'CALC.UPLOAD_SUB' | translate"
+            [accept]="acceptedFormats"
+            [multiple]="true"
+            (filesDropped)="onFilesDropped($event)">
+        </app-dropzone>
+    }
+
+    <!-- New File List with Details -->
+    @if (items().length > 0) {
+        <div class="items-grid">
+            @for (item of items(); track item.file.name; let i = $index) {
+                <div class="file-card" [class.active]="item.file === selectedFile()" (click)="selectFile(item.file)">
+                    <div class="card-header">
+                        <span class="file-name" [title]="item.file.name">{{ item.file.name }}</span>
+                    </div>
+                    
+                    <div class="card-body">
+                        <div class="card-controls">
+                             <div class="qty-group">
+                                <label>QTÀ</label>
+                                <input 
+                                    type="number" 
+                                    min="1" 
+                                    [value]="item.quantity"
+                                    (change)="updateItemQuantity(i, $event)"
+                                    class="qty-input"
+                                    (click)="$event.stopPropagation()">
+                            </div>
+
+                            <div class="color-group">
+                                <label>COLORE</label>
+                                <app-color-selector 
+                                    [selectedColor]="item.color" 
+                                    (colorSelected)="updateItemColor(i, $event)">
+                                </app-color-selector>
+                            </div>
+                        </div>
+                        
+                        <button type="button" class="btn-remove" (click)="removeItem(i); $event.stopPropagation()" title="Remove file">
+                            X
+                        </button>
+                    </div>
+                </div>
+            }
+        </div>
+        
+        <!-- "Add Files" Button (Visible only when files exist) -->
+        <div class="add-more-container">
+            <input #additionalInput type="file" [accept]="acceptedFormats" multiple hidden (change)="onAdditionalFilesSelected($event)">
+            
+            <button type="button" class="btn-add-more" (click)="additionalInput.click()">
+                + {{ 'CALC.ADD_FILES' | translate }}
+            </button>
+        </div>
+    }
+    
+    @if (items().length === 0 && form.get('itemsTouched')?.value) {
+      <div class="error-msg">{{ 'CALC.ERR_FILE_REQUIRED' | translate }}</div>
+    }
+  </div>
+
+  <div class="grid">
+    <app-select
+      formControlName="material"
+      [label]="'CALC.MATERIAL' | translate"
+      [options]="materials"
+    ></app-select>
+
+    @if (mode() === 'easy') {
+        <app-select
+          formControlName="quality"
+          [label]="'CALC.QUALITY' | translate"
+          [options]="qualities"
+        ></app-select>
+    } @else {
+        <app-select
+          formControlName="nozzleDiameter"
+          [label]="'CALC.NOZZLE' | translate"
+          [options]="nozzleDiameters"
+        ></app-select>
+    }
+  </div>
+  
+  <!-- Global quantity removed, now per item -->
+
+  @if (mode() === 'advanced') {
+    <div class="grid">
+        <app-select
+          formControlName="infillPattern"
+          [label]="'CALC.PATTERN' | translate"
+          [options]="infillPatterns"
+        ></app-select>
+
+        <app-select
+          formControlName="layerHeight"
+          [label]="'CALC.LAYER_HEIGHT' | translate"
+          [options]="layerHeights"
+        ></app-select>
+    </div>
+
+    <div class="grid">
+        <app-input
+          formControlName="infillDensity"
+          type="number"
+          [label]="'CALC.INFILL' | translate"
+        ></app-input>
+        
+        <div class="checkbox-row">
+            <input type="checkbox" formControlName="supportEnabled" id="support">
+            <label for="support">{{ 'CALC.SUPPORT' | translate }}</label>
+        </div>
+    </div>
+
+    <app-input
+      formControlName="notes"
+      [label]="'CALC.NOTES' | translate"
+      placeholder="Istruzioni specifiche..."
+    ></app-input>
+  }
+
+  <div class="actions">
+    <!-- Progress Bar (Only when uploading i.e. progress < 100) -->
+    @if (loading() && uploadProgress() < 100) {
+        <div class="progress-container">
+            <div class="progress-bar">
+                <div class="progress-fill" [style.width.%]="uploadProgress()"></div>
+            </div>
+        </div>
+    }
+
+    <app-button 
+      type="submit" 
+      [disabled]="form.invalid || items().length === 0 || loading()" 
+      [fullWidth]="true">
+      {{ loading() ? (uploadProgress() < 100 ? 'Uploading...' : 'Processing...') : ('CALC.CALCULATE' | translate) }}
+    </app-button>
+  </div>
+</form>

frontend/src/app/features/calculator/components/upload-form/upload-form.component.scss

@@ -0,0 +1,207 @@
+.section { margin-bottom: var(--space-6); }
+.grid { 
+    display: grid; 
+    grid-template-columns: 1fr; 
+    gap: var(--space-4); 
+    
+    @media(min-width: 640px) {
+        grid-template-columns: 1fr 1fr;
+    }
+}
+.actions { margin-top: var(--space-6); }
+.error-msg { color: var(--color-danger-500); font-size: 0.875rem; margin-top: var(--space-2); text-align: center; }
+
+.viewer-wrapper { position: relative; margin-bottom: var(--space-4); }
+
+/* Grid Layout for Files */
+.items-grid {
+    display: grid;
+    grid-template-columns: 1fr 1fr; /* Force 2 columns on mobile */
+    gap: var(--space-2); /* Tighten gap for mobile */
+    margin-top: var(--space-4);
+    margin-bottom: var(--space-4);
+    
+    @media(min-width: 640px) {
+        gap: var(--space-3);
+    }
+}
+
+.file-card {
+    padding: var(--space-2); /* Reduced from space-3 */
+    background: var(--color-neutral-100);
+    border: 1px solid var(--color-border);
+    border-radius: var(--radius-md);
+    transition: all 0.2s;
+    cursor: pointer;
+    display: flex;
+    flex-direction: column;
+    gap: 4px; /* Reduced gap */
+    position: relative; /* For absolute positioning of remove btn */
+    min-width: 0; /* Allow flex item to shrink below content size if needed */
+    
+    &:hover { border-color: var(--color-neutral-300); }
+    &.active {
+         border-color: var(--color-brand);
+         background: rgba(250, 207, 10, 0.05);
+         box-shadow: 0 0 0 1px var(--color-brand);
+    }
+}
+
+.card-header {
+    overflow: hidden;
+    padding-right: 25px; /* Adjusted */
+    margin-bottom: 2px;
+}
+
+.file-name { 
+    font-weight: 500; 
+    font-size: 0.8rem; /* Smaller font */
+    color: var(--color-text);
+    display: block;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
+.card-body {
+    display: flex;
+    align-items: center;
+    padding-top: 0;
+}
+
+.card-controls {
+    display: flex;
+    align-items: flex-end; /* Align bottom of input and color circle */
+    gap: 16px; /* Space between Qty and Color */
+    width: 100%;
+}
+
+.qty-group, .color-group {
+    display: flex;
+    flex-direction: column; /* Stack label and input */
+    align-items: flex-start;
+    gap: 0px; 
+    
+    label { 
+        font-size: 0.6rem; 
+        color: var(--color-text-muted); 
+        text-transform: uppercase; 
+        letter-spacing: 0.5px; 
+        font-weight: 600;
+        margin-bottom: 2px;
+    }
+}
+
+.color-group {
+    align-items: flex-start; /* Align label left */
+    /* margin-right removed */
+    
+    /* Override margin in selector for this context */
+    ::ng-deep .color-selector-container {
+        margin-left: 0;
+    }
+}
+
+.qty-input {
+    width: 36px; /* Slightly smaller */
+    padding: 1px 2px;
+    border: 1px solid var(--color-border);
+    border-radius: var(--radius-sm);
+    text-align: center;
+    font-size: 0.85rem;
+    background: white;
+    height: 24px; /* Explicit height to match color circle somewhat */
+    &:focus { outline: none; border-color: var(--color-brand); }
+}
+
+.btn-remove {
+    position: absolute;
+    top: 4px;
+    right: 4px;
+    width: 18px;
+    height: 18px;
+    border-radius: 4px;
+    border: none;
+    background: transparent;
+    color: var(--color-text-muted);
+    font-weight: bold;
+    cursor: pointer;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    transition: all 0.2s;
+    font-size: 0.8rem;
+    
+    &:hover { 
+        background: var(--color-danger-100); 
+        color: var(--color-danger-500);
+    }
+}
+
+/* Prominent Add Button */
+.add-more-container {
+    margin-top: var(--space-2);
+}
+
+.btn-add-more {
+    width: 100%;
+    padding: var(--space-3);
+    background: var(--color-neutral-800);
+    color: white;
+    border: none;
+    border-radius: var(--radius-md);
+    font-weight: 600;
+    font-size: 0.9rem;
+    cursor: pointer;
+    transition: all 0.2s;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: var(--space-2);
+    
+    &:hover {
+        background: var(--color-neutral-900);
+        transform: translateY(-1px);
+    }
+    &:active { transform: translateY(0); }
+}
+
+.checkbox-row {
+    display: flex;
+    align-items: center;
+    gap: var(--space-3);
+    height: 100%;
+    padding-top: var(--space-4);
+    
+    input[type="checkbox"] {
+        width: 20px;
+        height: 20px;
+        accent-color: var(--color-brand);
+    }
+    label {
+        font-weight: 500;
+        cursor: pointer;
+    }
+}
+
+/* Progress Bar */
+.progress-container {
+    margin-bottom: var(--space-3);
+    text-align: center;
+    width: 100%;
+}
+.progress-bar {
+    height: 4px;
+    background: var(--color-border);
+    border-radius: 2px;
+    overflow: hidden;
+    margin-bottom: 0;
+    position: relative;
+    width: 100%;
+}
+.progress-fill {
+    height: 100%;
+    background: var(--color-brand);
+    width: 0%;
+    transition: width 0.2s ease-out;
+}

frontend/src/app/features/calculator/components/upload-form/upload-form.component.ts

@@ -0,0 +1,201 @@
+import { Component, input, output, signal, effect } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { ReactiveFormsModule, FormBuilder, FormGroup, Validators } from '@angular/forms';
+import { TranslateModule } from '@ngx-translate/core';
+import { AppInputComponent } from '../../../../shared/components/app-input/app-input.component';
+import { AppSelectComponent } from '../../../../shared/components/app-select/app-select.component';
+import { AppDropzoneComponent } from '../../../../shared/components/app-dropzone/app-dropzone.component';
+import { AppButtonComponent } from '../../../../shared/components/app-button/app-button.component';
+import { StlViewerComponent } from '../../../../shared/components/stl-viewer/stl-viewer.component';
+import { ColorSelectorComponent } from '../../../../shared/components/color-selector/color-selector.component';
+import { QuoteRequest } from '../../services/quote-estimator.service';
+import { getColorHex } from '../../../../core/constants/colors.const';
+
+interface FormItem {
+    file: File;
+    quantity: number;
+    color: string;
+}
+
+@Component({
+  selector: 'app-upload-form',
+  standalone: true,
+  imports: [CommonModule, ReactiveFormsModule, TranslateModule, AppInputComponent, AppSelectComponent, AppDropzoneComponent, AppButtonComponent, StlViewerComponent, ColorSelectorComponent],
+  templateUrl: './upload-form.component.html',
+  styleUrl: './upload-form.component.scss'
+})
+export class UploadFormComponent {
+  mode = input<'easy' | 'advanced'>('easy');
+  loading = input<boolean>(false);
+  uploadProgress = input<number>(0);
+  submitRequest = output<QuoteRequest>();
+
+  form: FormGroup;
+  
+  items = signal<FormItem[]>([]);
+  selectedFile = signal<File | null>(null);
+
+  materials = [
+    { label: 'PLA (Standard)', value: 'PLA' },
+    { label: 'PETG (Resistente)', value: 'PETG' },
+    { label: 'TPU (Flessibile)', value: 'TPU' }
+  ];
+
+  qualities = [
+    { label: 'Bozza (Fast)', value: 'Draft' },
+    { label: 'Standard', value: 'Standard' },
+    { label: 'Alta definizione', value: 'High' }
+  ];
+
+  nozzleDiameters = [
+      { label: '0.2 mm (+2 CHF)', value: 0.2 },
+      { label: '0.4 mm (Standard)', value: 0.4 },
+      { label: '0.6 mm (+2 CHF)', value: 0.6 },
+      { label: '0.8 mm (+2 CHF)', value: 0.8 }
+  ];
+  
+  infillPatterns = [
+      { label: 'Grid', value: 'grid' },
+      { label: 'Gyroid', value: 'gyroid' },
+      { label: 'Cubic', value: 'cubic' },
+      { label: 'Triangles', value: 'triangles' }
+  ];
+
+  layerHeights = [
+      { label: '0.08 mm', value: 0.08 },
+      { label: '0.12 mm (High Quality - Slow)', value: 0.12 },
+      { label: '0.16 mm', value: 0.16 },
+      { label: '0.20 mm (Standard)', value: 0.20 },
+      { label: '0.24 mm', value: 0.24 },
+      { label: '0.28 mm', value: 0.28 }
+  ];
+  
+  acceptedFormats = '.stl,.3mf,.step,.stp,.obj,.amf,.ply,.igs,.iges';
+
+  constructor(private fb: FormBuilder) {
+    this.form = this.fb.group({
+      itemsTouched: [false], // Hack to track touched state for custom items list
+      material: ['PLA', Validators.required],
+      quality: ['Standard', Validators.required],
+      // Print Speed removed
+      notes: [''],
+      // Advanced fields
+      // Color removed from global form
+      infillDensity: [20, [Validators.min(0), Validators.max(100)]],
+      layerHeight: [0.2, [Validators.min(0.05), Validators.max(1.0)]],
+      nozzleDiameter: [0.4, Validators.required],
+      infillPattern: ['grid'],
+      supportEnabled: [false]
+    });
+  }
+
+  onFilesDropped(newFiles: File[]) {
+    const MAX_SIZE = 200 * 1024 * 1024; // 200MB
+    const validItems: FormItem[] = [];
+    let hasError = false;
+
+    for (const file of newFiles) {
+        if (file.size > MAX_SIZE) {
+            hasError = true;
+        } else {
+            // Default color is Black
+            validItems.push({ file, quantity: 1, color: 'Black' });
+        }
+    }
+
+    if (hasError) {
+        alert("Alcuni file superano il limite di 200MB e non sono stati aggiunti.");
+    }
+
+    if (validItems.length > 0) {
+        this.items.update(current => [...current, ...validItems]);
+        this.form.get('itemsTouched')?.setValue(true);
+        // Auto select last added
+        this.selectedFile.set(validItems[validItems.length - 1].file);
+    }
+  }
+
+  onAdditionalFilesSelected(event: Event) {
+      const input = event.target as HTMLInputElement;
+      if (input.files && input.files.length > 0) {
+          this.onFilesDropped(Array.from(input.files));
+          // Reset input so same files can be selected again if needed
+          input.value = '';
+      }
+  }
+
+  updateItemQuantityByName(fileName: string, quantity: number) {
+      this.items.update(current => {
+          return current.map(item => {
+              if (item.file.name === fileName) {
+                  return { ...item, quantity };
+              }
+              return item;
+          });
+      });
+  }
+
+  selectFile(file: File) {
+      if (this.selectedFile() === file) {
+          // toggle off? no, keep active
+      } else {
+          this.selectedFile.set(file);
+      }
+  }
+
+  // Helper to get color of currently selected file
+  getSelectedFileColor(): string {
+      const file = this.selectedFile();
+      if (!file) return '#facf0a'; // Default
+      
+      const item = this.items().find(i => i.file === file);
+      if (item) {
+          return getColorHex(item.color);
+      }
+      return '#facf0a';
+  }
+
+  updateItemQuantity(index: number, event: Event) {
+      const input = event.target as HTMLInputElement;
+      let val = parseInt(input.value, 10);
+      if (isNaN(val) || val < 1) val = 1;
+      
+      this.items.update(current => {
+          const updated = [...current];
+          updated[index] = { ...updated[index], quantity: val };
+          return updated;
+      });
+  }
+
+  updateItemColor(index: number, newColor: string) {
+      this.items.update(current => {
+          const updated = [...current];
+          updated[index] = { ...updated[index], color: newColor };
+          return updated;
+      });
+  }
+
+  removeItem(index: number) {
+      this.items.update(current => {
+          const updated = [...current];
+          const removed = updated.splice(index, 1)[0];
+          if (this.selectedFile() === removed.file) {
+              this.selectedFile.set(null);
+          }
+          return updated;
+      });
+  }
+
+  onSubmit() {
+    if (this.form.valid && this.items().length > 0) {
+      this.submitRequest.emit({
+        items: this.items(), // Pass the items array including colors
+        ...this.form.value,
+        mode: this.mode()
+      });
+    } else {
+      this.form.markAllAsTouched();
+      this.form.get('itemsTouched')?.setValue(true);
+    }
+  }
+}

frontend/src/app/features/calculator/components/user-details/user-details.component.html

@@ -0,0 +1,127 @@
+<div class="user-details-container">
+  <div class="row">
+    <div class="col-md-6">
+      <app-card [title]="'USER_DETAILS.TITLE' | translate">
+        <form [formGroup]="form" (ngSubmit)="onSubmit()">
+          
+          <!-- Name & Surname -->
+          <div class="row">
+            <div class="col-md-6">
+              <app-input 
+                formControlName="name"
+                label="USER_DETAILS.NAME" 
+                placeholder="USER_DETAILS.NAME_PLACEHOLDER"
+                [required]="true"
+                [error]="form.get('name')?.invalid && form.get('name')?.touched ? ('COMMON.REQUIRED' | translate) : null">
+              </app-input>
+            </div>
+            <div class="col-md-6">
+              <app-input 
+                formControlName="surname"
+                label="USER_DETAILS.SURNAME" 
+                placeholder="USER_DETAILS.SURNAME_PLACEHOLDER"
+                [required]="true"
+                [error]="form.get('surname')?.invalid && form.get('surname')?.touched ? ('COMMON.REQUIRED' | translate) : null">
+              </app-input>
+            </div>
+          </div>
+
+          <!-- Email & Phone -->
+          <div class="row">
+            <div class="col-md-6">
+              <app-input 
+                formControlName="email"
+                label="USER_DETAILS.EMAIL" 
+                type="email"
+                placeholder="USER_DETAILS.EMAIL_PLACEHOLDER"
+                [required]="true"
+                [error]="form.get('email')?.invalid && form.get('email')?.touched ? ('COMMON.INVALID_EMAIL' | translate) : null">
+              </app-input>
+            </div>
+            <div class="col-md-6">
+              <app-input 
+                formControlName="phone"
+                label="USER_DETAILS.PHONE" 
+                type="tel"
+                placeholder="USER_DETAILS.PHONE_PLACEHOLDER"
+                [required]="true"
+                [error]="form.get('phone')?.invalid && form.get('phone')?.touched ? ('COMMON.REQUIRED' | translate) : null">
+              </app-input>
+            </div>
+          </div>
+
+          <!-- Address -->
+          <app-input 
+            formControlName="address"
+            label="USER_DETAILS.ADDRESS" 
+            placeholder="USER_DETAILS.ADDRESS_PLACEHOLDER"
+            [required]="true"
+            [error]="form.get('address')?.invalid && form.get('address')?.touched ? ('COMMON.REQUIRED' | translate) : null">
+          </app-input>
+
+          <!-- Zip & City -->
+          <div class="row">
+            <div class="col-md-4">
+              <app-input 
+                formControlName="zip"
+                label="USER_DETAILS.ZIP" 
+                placeholder="USER_DETAILS.ZIP_PLACEHOLDER"
+                [required]="true"
+                [error]="form.get('zip')?.invalid && form.get('zip')?.touched ? ('COMMON.REQUIRED' | translate) : null">
+              </app-input>
+            </div>
+            <div class="col-md-8">
+              <app-input 
+                formControlName="city"
+                label="USER_DETAILS.CITY" 
+                placeholder="USER_DETAILS.CITY_PLACEHOLDER"
+                [required]="true"
+                [error]="form.get('city')?.invalid && form.get('city')?.touched ? ('COMMON.REQUIRED' | translate) : null">
+              </app-input>
+            </div>
+          </div>
+
+          <div class="actions">
+            <app-button 
+              type="button" 
+              variant="outline" 
+              (click)="onCancel()">
+              {{ 'COMMON.BACK' | translate }}
+            </app-button>
+            <app-button 
+              type="submit" 
+              [disabled]="form.invalid || submitting()">
+              {{ 'USER_DETAILS.SUBMIT' | translate }}
+            </app-button>
+          </div>
+
+        </form>
+      </app-card>
+    </div>
+
+    <!-- Order Summary Column -->
+    <div class="col-md-6">
+      <app-card [title]="'USER_DETAILS.SUMMARY_TITLE' | translate">
+        
+        <div class="summary-content" *ngIf="quote()">
+          <div class="summary-item" *ngFor="let item of quote()!.items">
+            <div class="item-info">
+              <span class="item-name">{{ item.fileName }}</span>
+              <span class="item-meta">{{ item.material }} - {{ item.color || 'Default' }}</span>
+            </div>
+            <div class="item-qty">x{{ item.quantity }}</div>
+            <div class="item-price">{{ (item.unitPrice * item.quantity) | currency:'CHF' }}</div>
+          </div>
+
+          <hr>
+
+          <div class="total-row">
+            <span>{{ 'QUOTE.TOTAL' | translate }}</span>
+            <span class="total-price">{{ quote()!.totalPrice | currency:'CHF' }}</span>
+          </div>
+        </div>
+
+      </app-card>
+    </div>
+  </div>
+</div>

frontend/src/app/features/calculator/components/user-details/user-details.component.scss

@@ -0,0 +1,102 @@
+.user-details-container {
+  padding: 1rem 0;
+}
+
+.row {
+  display: flex;
+  flex-wrap: wrap;
+  margin: 0 -0.5rem;
+  
+  > [class*='col-'] {
+    padding: 0 0.5rem;
+  }
+}
+
+.col-md-6 {
+  width: 100%;
+  
+  @media (min-width: 768px) {
+    width: 50%;
+  }
+}
+
+.col-md-4 {
+  width: 100%;
+  
+  @media (min-width: 768px) {
+    width: 33.333%;
+  }
+}
+
+.col-md-8 {
+  width: 100%;
+  
+  @media (min-width: 768px) {
+    width: 66.666%;
+  }
+}
+
+.actions {
+  display: flex;
+  justify-content: flex-end;
+  gap: 1rem;
+  margin-top: 1.5rem;
+}
+
+// Summary Styles
+.summary-content {
+  display: flex;
+  flex-direction: column;
+  gap: 1rem;
+}
+
+.summary-item {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 0.5rem 0;
+  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
+  
+  &:last-child {
+    border-bottom: none;
+  }
+}
+
+.item-info {
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+}
+
+.item-name {
+  font-weight: 500;
+}
+
+.item-meta {
+  font-size: 0.85rem;
+  opacity: 0.7;
+}
+
+.item-qty {
+  margin: 0 1rem;
+  opacity: 0.8;
+}
+
+.item-price {
+  font-weight: 600;
+}
+
+.total-row {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  font-size: 1.2rem;
+  font-weight: 700;
+  margin-top: 1rem;
+  padding-top: 1rem;
+  border-top: 2px solid rgba(255, 255, 255, 0.2);
+  
+  .total-price {
+    color: var(--primary-color, #00C853); // Fallback color
+  }
+}

frontend/src/app/features/calculator/components/user-details/user-details.component.ts

@@ -0,0 +1,59 @@
+import { Component, input, output, signal } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { ReactiveFormsModule, FormBuilder, FormGroup, Validators } from '@angular/forms';
+import { TranslateModule } from '@ngx-translate/core';
+import { AppCardComponent } from '../../../../shared/components/app-card/app-card.component';
+import { AppInputComponent } from '../../../../shared/components/app-input/app-input.component';
+import { AppButtonComponent } from '../../../../shared/components/app-button/app-button.component';
+import { QuoteResult } from '../../services/quote-estimator.service';
+
+@Component({
+  selector: 'app-user-details',
+  standalone: true,
+  imports: [CommonModule, ReactiveFormsModule, TranslateModule, AppCardComponent, AppInputComponent, AppButtonComponent],
+  templateUrl: './user-details.component.html',
+  styleUrl: './user-details.component.scss'
+})
+export class UserDetailsComponent {
+  quote = input<QuoteResult>();
+  submitOrder = output<any>();
+  cancel = output<void>();
+
+  form: FormGroup;
+  submitting = signal(false);
+
+  constructor(private fb: FormBuilder) {
+    this.form = this.fb.group({
+      name: ['', Validators.required],
+      surname: ['', Validators.required],
+      email: ['', [Validators.required, Validators.email]],
+      phone: ['', Validators.required],
+      address: ['', Validators.required],
+      zip: ['', Validators.required],
+      city: ['', Validators.required]
+    });
+  }
+
+  onSubmit() {
+    if (this.form.valid) {
+      this.submitting.set(true);
+      
+      const orderData = {
+        customer: this.form.value,
+        quote: this.quote()
+      };
+
+      // Simulate API delay
+      setTimeout(() => {
+        this.submitOrder.emit(orderData);
+        this.submitting.set(false);
+      }, 1000);
+    } else {
+      this.form.markAllAsTouched();
+    }
+  }
+
+  onCancel() {
+    this.cancel.emit();
+  }
+}

frontend/src/app/features/calculator/services/quote-estimator.service.ts

@@ -0,0 +1,237 @@
+import { Injectable, inject, signal } from '@angular/core';
+import { HttpClient, HttpEventType } from '@angular/common/http';
+import { Observable, of } from 'rxjs';
+import { map, catchError } from 'rxjs/operators';
+import { environment } from '../../../../environments/environment';
+
+export interface QuoteRequest {
+  items: { file: File, quantity: number, color?: string }[];
+  material: string;
+  quality: string;
+  notes?: string;
+  infillDensity?: number;
+  infillPattern?: string;
+  supportEnabled?: boolean;
+  layerHeight?: number;
+  nozzleDiameter?: number;
+  mode: 'easy' | 'advanced';
+}
+
+export interface QuoteItem {
+  fileName: string;
+  unitPrice: number;
+  unitTime: number; // seconds
+  unitWeight: number; // grams
+  quantity: number;
+  material?: string;
+  color?: string;
+}
+
+export interface QuoteResult {
+  items: QuoteItem[];
+  setupCost: number;
+  currency: string;
+  totalPrice: number;
+  totalTimeHours: number;
+  totalTimeMinutes: number;
+  totalWeight: number;
+}
+
+interface BackendResponse {
+  success: boolean;
+  data: {
+    print_time_seconds: number;
+    material_grams: number;
+    cost: {
+      total: number;
+    };
+  };
+  error?: string;
+}
+
+@Injectable({
+  providedIn: 'root'
+})
+export class QuoteEstimatorService {
+  private http = inject(HttpClient);
+  
+  calculate(request: QuoteRequest): Observable<number | QuoteResult> {
+    if (request.items.length === 0) return of();
+    
+    return new Observable(observer => {
+        const totalItems = request.items.length;
+        const allProgress: number[] = new Array(totalItems).fill(0);
+        const finalResponses: any[] = [];
+        let completedRequests = 0;
+
+        const uploads = request.items.map((item, index) => {
+             const formData = new FormData();
+             formData.append('file', item.file);
+             formData.append('machine', 'bambu_a1'); 
+             formData.append('filament', this.mapMaterial(request.material));
+             formData.append('quality', this.mapQuality(request.quality));
+             
+             // Send color for both modes if present, defaulting to Black
+             formData.append('material_color', item.color || 'Black');
+
+             if (request.mode === 'advanced') {
+                if (request.infillDensity) formData.append('infill_density', request.infillDensity.toString());
+                if (request.infillPattern) formData.append('infill_pattern', request.infillPattern);
+                if (request.supportEnabled) formData.append('support_enabled', 'true');
+                if (request.layerHeight) formData.append('layer_height', request.layerHeight.toString());
+                if (request.nozzleDiameter) formData.append('nozzle_diameter', request.nozzleDiameter.toString());
+             }
+             
+             const headers: any = {};
+             // @ts-ignore
+             if (environment.basicAuth) headers['Authorization'] = 'Basic ' + btoa(environment.basicAuth);
+
+             return this.http.post<BackendResponse>(`${environment.apiUrl}/api/quote`, formData, { 
+                 headers,
+                 reportProgress: true,
+                 observe: 'events'
+             }).pipe(
+                 map(event => ({ item, event, index })),
+                 catchError(err => of({ item, error: err, index }))
+             );
+        });
+
+        // Subscribe to all
+        uploads.forEach((obs) => {
+            obs.subscribe({
+                next: (wrapper: any) => {
+                    const idx = wrapper.index;
+                    
+                    if (wrapper.error) {
+                        finalResponses[idx] = { success: false, fileName: wrapper.item.file.name };
+                         // Even if error, we count as complete
+                         // But we need to handle completion logic carefully.
+                         // For simplicity, let's treat it as complete but check later.
+                    }
+
+                    const event = wrapper.event;
+                    if (event && event.type === HttpEventType.UploadProgress) {
+                        if (event.total) {
+                            const percent = Math.round((100 * event.loaded) / event.total);
+                            allProgress[idx] = percent;
+                            // Emit average progress
+                            const avg = Math.round(allProgress.reduce((a, b) => a + b, 0) / totalItems);
+                            observer.next(avg); 
+                        }
+                    } else if ((event && event.type === HttpEventType.Response) || wrapper.error) { 
+                        // It's done (either response or error caught above)
+                        if (!finalResponses[idx]) { // only if not already set by error
+                             allProgress[idx] = 100;
+                             if (wrapper.error) {
+                                 finalResponses[idx] = { success: false, fileName: wrapper.item.file.name };
+                             } else {
+                                finalResponses[idx] = { ...event.body, fileName: wrapper.item.file.name, originalQty: wrapper.item.quantity };
+                             }
+                             completedRequests++;
+                        }
+                        
+                        if (completedRequests === totalItems) {
+                            // All done
+                            observer.next(100); 
+                            
+                            // Calculate Results
+                            let setupCost = 10;
+                            
+                            if (request.nozzleDiameter && request.nozzleDiameter !== 0.4) {
+                                setupCost += 2;
+                            }
+                            
+                            const items: QuoteItem[] = [];
+                            
+                            finalResponses.forEach((res, idx) => {
+                                if (res && res.success) {
+                                    const originalItem = request.items[idx];
+                                    items.push({
+                                        fileName: res.fileName,
+                                        unitPrice: res.data.cost.total,
+                                        unitTime: res.data.print_time_seconds,
+                                        unitWeight: res.data.material_grams,
+                                        quantity: res.originalQty, // Use the requested quantity
+                                        material: request.material,
+                                        color: originalItem.color || 'Default'
+                                    });
+                                }
+                            });
+
+                            if (items.length === 0) {
+                                // If at least one failed? Or all? 
+                                // For now if NO items succeeded, error.
+                                observer.error('All calculations failed.');
+                                return;
+                            }
+                            
+                            // Initial Aggregation
+                            let grandTotal = setupCost;
+                            let totalTime = 0;
+                            let totalWeight = 0;
+                            
+                            items.forEach(item => {
+                                grandTotal += item.unitPrice * item.quantity;
+                                totalTime += item.unitTime * item.quantity;
+                                totalWeight += item.unitWeight * item.quantity;
+                            });
+
+                            const totalHours = Math.floor(totalTime / 3600);
+                            const totalMinutes = Math.ceil((totalTime % 3600) / 60);
+
+                            const result: QuoteResult = {
+                                items,
+                                setupCost,
+                                currency: 'CHF',
+                                totalPrice: Math.round(grandTotal * 100) / 100,
+                                totalTimeHours: totalHours,
+                                totalTimeMinutes: totalMinutes,
+                                totalWeight: Math.ceil(totalWeight)
+                            };
+                            
+                            observer.next(result);
+                            observer.complete();
+                        }
+                    }
+                },
+                error: (err) => {
+                    console.error('Error in request subscription', err);
+                    // Should be caught by inner pipe, but safety net
+                    completedRequests++;
+                     if (completedRequests === totalItems) {
+                         observer.error('Requests failed');
+                    }
+                }
+            });
+        });
+    });
+  }
+
+  private mapMaterial(mat: string): string {
+    const m = mat.toUpperCase();
+    if (m.includes('PLA')) return 'pla_basic';
+    if (m.includes('PETG')) return 'petg_basic';
+    if (m.includes('TPU')) return 'tpu_95a';
+    return 'pla_basic';
+  }
+
+  private mapQuality(qual: string): string {
+    const q = qual.toLowerCase();
+    if (q.includes('draft')) return 'draft';
+    if (q.includes('high')) return 'extra_fine';
+    return 'standard';
+  }
+
+  // Consultation Data Transfer
+  private pendingConsultation = signal<{files: File[], message: string} | null>(null);
+
+  setPendingConsultation(data: {files: File[], message: string}) {
+      this.pendingConsultation.set(data);
+  }
+
+  getPendingConsultation() {
+      const data = this.pendingConsultation();
+      this.pendingConsultation.set(null); // Clear after reading
+      return data;
+  }
+}

frontend/src/app/features/contact/components/contact-form/contact-form.component.html

@@ -0,0 +1,77 @@
+@if (sent()) {
+  <app-success-state context="contact" (action)="resetForm()"></app-success-state>
+} @else {
+  <form [formGroup]="form" (ngSubmit)="onSubmit()">
+    <!-- Request Type -->
+    <div class="form-group">
+      <label>{{ 'CONTACT.REQ_TYPE_LABEL' | translate }} *</label>
+      <select formControlName="requestType" class="form-control">
+        <option *ngFor="let type of requestTypes" [value]="type.value">
+          {{ type.label | translate }}
+        </option>
+      </select>
+    </div>
+
+    <div class="row">
+      <!-- Phone -->
+      <app-input formControlName="email" type="email" [label]="'CONTACT.LABEL_EMAIL' | translate" [placeholder]="'CONTACT.PLACEHOLDER_EMAIL' | translate" class="col"></app-input>
+      <!-- Phone -->
+      <app-input formControlName="phone" type="tel" [label]="('CONTACT.PHONE' | translate)" [placeholder]="'CONTACT.PLACEHOLDER_PHONE' | translate" class="col"></app-input>
+    </div>
+
+    <!-- User Type Selector (Segmented Control) -->
+    <div class="user-type-selector">
+      <div class="type-option" [class.selected]="!isCompany" (click)="setCompanyMode(false)">
+        {{ 'CONTACT.TYPE_PRIVATE' | translate }}
+      </div>
+      <div class="type-option" [class.selected]="isCompany" (click)="setCompanyMode(true)">
+        {{ 'CONTACT.TYPE_COMPANY' | translate }}
+      </div>
+    </div>
+
+    <!-- Personal Name (Only if NOT Company) -->
+    <app-input *ngIf="!isCompany" formControlName="name" [label]="'CONTACT.LABEL_NAME' | translate" [placeholder]="'CONTACT.PLACEHOLDER_NAME' | translate"></app-input>
+
+    <!-- Company Fields (Only if Company) -->
+    <div *ngIf="isCompany" class="company-fields">
+      <app-input formControlName="companyName" [label]="('CONTACT.COMPANY_NAME' | translate) + ' *'" [placeholder]="'CONTACT.PLACEHOLDER_COMPANY' | translate"></app-input>
+      <app-input formControlName="referencePerson" [label]="('CONTACT.REF_PERSON' | translate) + ' *'" [placeholder]="'CONTACT.PLACEHOLDER_REF_PERSON' | translate"></app-input>
+    </div>
+    
+    <div class="form-group">
+      <label>{{ 'CONTACT.LABEL_MESSAGE' | translate }}</label>
+      <textarea formControlName="message" class="form-control" rows="4"></textarea>
+    </div>
+
+    <!-- File Upload Section -->
+    <div class="form-group">
+      <label>{{ 'CONTACT.UPLOAD_LABEL' | translate }}</label>
+      <p class="hint">{{ 'CONTACT.UPLOAD_HINT' | translate }}</p>
+      
+      <div class="drop-zone" (click)="fileInput.click()" 
+           (dragover)="onDragOver($event)" (drop)="onDrop($event)">
+        <input #fileInput type="file" multiple (change)="onFileSelected($event)" hidden 
+               accept=".jpg,.jpeg,.png,.pdf,.stl,.step,.stp,.3mf,.obj">
+        <p>{{ 'CONTACT.DROP_FILES' | translate }}</p>
+      </div>
+
+      <div class="file-grid" *ngIf="files().length > 0">
+        <div class="file-item" *ngFor="let file of files(); let i = index">
+          <button type="button" class="remove-btn" (click)="removeFile(i)">×</button>
+          <img *ngIf="file.type === 'image'" [src]="file.url" class="preview-img">
+          <div *ngIf="file.type !== 'image'" class="file-icon">
+            <span *ngIf="file.type === 'pdf'">PDF</span>
+            <span *ngIf="file.type === '3d'">3D</span>
+          </div>
+          <div class="file-name" [title]="file.file.name">{{ file.file.name }}</div>
+        </div>
+      </div>
+    </div>
+
+    <div class="actions">
+      <app-button type="submit" [disabled]="form.invalid || sent()">
+        {{ sent() ? ('CONTACT.MSG_SENT' | translate) : ('CONTACT.SEND' | translate) }}
+      </app-button>
+    </div>
+  </form>
+}

frontend/src/app/features/contact/components/contact-form/contact-form.component.scss

@@ -0,0 +1,135 @@
+.form-group { display: flex; flex-direction: column; margin-bottom: var(--space-4); }
+label { font-size: 0.875rem; font-weight: 500; margin-bottom: var(--space-2); color: var(--color-text); }
+.hint { font-size: 0.75rem; color: var(--color-text-muted); margin-bottom: var(--space-2); }
+
+.form-control {
+  padding: 0.5rem 0.75rem;
+  border: 1px solid var(--color-border);
+  border-radius: var(--radius-md);
+  width: 100%;
+  background: var(--color-bg-card);
+  color: var(--color-text);
+  font-family: inherit;
+  &:focus { outline: none; border-color: var(--color-brand); }
+}
+
+select.form-control {
+  appearance: none;
+  background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
+  background-repeat: no-repeat;
+  background-position: right 1rem center;
+  background-size: 1em;
+}
+
+.row {
+  display: flex;
+  flex-direction: column;
+  gap: var(--space-4);
+  margin-bottom: var(--space-4);
+  @media(min-width: 768px) {
+    flex-direction: row;
+    .col { flex: 1; margin-bottom: 0; }
+  }
+}
+
+app-input.col { width: 100%; }
+
+/* User Type Selector Styles */
+.user-type-selector {
+  display: flex;
+  background-color: var(--color-neutral-100);
+  border-radius: var(--radius-md);
+  padding: 4px;
+  margin-bottom: var(--space-4);
+  gap: 4px;
+  width: 100%; /* Full width */
+  max-width: 400px; /* Limit on desktop */
+}
+
+.type-option {
+  flex: 1; /* Equal width */
+  text-align: center;
+  padding: 8px 16px;
+  border-radius: var(--radius-sm);
+  cursor: pointer;
+  font-size: 0.875rem;
+  font-weight: 500;
+  color: var(--color-text-muted);
+  transition: all 0.2s ease;
+  user-select: none;
+  
+  &:hover { color: var(--color-text); }
+  
+  &.selected {
+    background-color: var(--color-brand);
+    color: #000;
+    font-weight: 600;
+    box-shadow: 0 1px 2px rgba(0,0,0,0.05);
+  }
+}
+
+.company-fields {
+  display: flex;
+  flex-direction: column;
+  gap: var(--space-4);
+  padding-left: var(--space-4);
+  border-left: 2px solid var(--color-border);
+  margin-bottom: var(--space-4);
+}
+
+/* File Upload Styles */
+.drop-zone {
+  border: 2px dashed var(--color-border);
+  border-radius: var(--radius-md);
+  padding: var(--space-6);
+  text-align: center;
+  cursor: pointer;
+  color: var(--color-text-muted);
+  transition: all 0.2s;
+  &:hover { border-color: var(--color-brand); color: var(--color-brand); }
+}
+
+.file-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(80px, 1fr));
+  gap: var(--space-3);
+  margin-top: var(--space-3);
+}
+
+.file-item {
+  position: relative;
+  background: var(--color-neutral-100);
+  border-radius: var(--radius-sm);
+  padding: var(--space-2);
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  aspect-ratio: 1;
+  overflow: hidden;
+}
+
+.preview-img {
+   width: 100%; height: 100%; object-fit: cover; position: absolute; top:0; left:0;
+   border-radius: var(--radius-sm);
+}
+
+.file-icon {
+   font-weight: 700; color: var(--color-text-muted); font-size: 0.8rem;
+}
+
+.file-name {
+   font-size: 0.65rem; color: var(--color-text); white-space: nowrap; overflow: hidden;
+   text-overflow: ellipsis; width: 100%; text-align: center; position: absolute; bottom: 2px;
+   padding: 0 4px; z-index: 2; background: rgba(255,255,255,0.8);
+}
+
+.remove-btn {
+  position: absolute; top: 2px; right: 2px; z-index: 10;
+  background: rgba(0,0,0,0.5); color: white; border: none; border-radius: 50%;
+  width: 18px; height: 18px; font-size: 12px; cursor: pointer;
+  display: flex; align-items: center; justify-content: center; line-height: 1;
+  &:hover { background: red; }
+}
+
+/* Success State styles moved to shared component */

frontend/src/app/features/contact/components/contact-form/contact-form.component.ts

@@ -0,0 +1,176 @@
+import { Component, signal, effect } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { ReactiveFormsModule, FormBuilder, FormGroup, Validators } from '@angular/forms';
+import { TranslateModule, TranslateService } from '@ngx-translate/core';
+import { AppInputComponent } from '../../../../shared/components/app-input/app-input.component';
+import { AppButtonComponent } from '../../../../shared/components/app-button/app-button.component';
+import { QuoteEstimatorService } from '../../../calculator/services/quote-estimator.service';
+
+interface FilePreview {
+  file: File;
+  url?: string;
+  type: 'image' | 'pdf' | '3d' | 'other';
+}
+
+import { SuccessStateComponent } from '../../../../shared/components/success-state/success-state.component';
+
+@Component({
+  selector: 'app-contact-form',
+  standalone: true,
+  imports: [CommonModule, ReactiveFormsModule, TranslateModule, AppInputComponent, AppButtonComponent, SuccessStateComponent],
+  templateUrl: './contact-form.component.html',
+  styleUrl: './contact-form.component.scss'
+})
+export class ContactFormComponent {
+  form: FormGroup;
+  sent = signal(false);
+  files = signal<FilePreview[]>([]);
+  
+  get isCompany(): boolean {
+    return this.form.get('isCompany')?.value;
+  }
+  
+  requestTypes = [
+    { value: 'custom', label: 'CONTACT.REQ_TYPE_CUSTOM' },
+    { value: 'series', label: 'CONTACT.REQ_TYPE_SERIES' },
+    { value: 'consult', label: 'CONTACT.REQ_TYPE_CONSULT' },
+    { value: 'question', label: 'CONTACT.REQ_TYPE_QUESTION' }
+  ];
+
+  constructor(
+      private fb: FormBuilder, 
+      private translate: TranslateService,
+      private estimator: QuoteEstimatorService
+  ) {
+    this.form = this.fb.group({
+      requestType: ['custom', Validators.required],
+      name: ['', Validators.required],
+      email: ['', [Validators.required, Validators.email]],
+      phone: [''],
+      message: ['', Validators.required],
+      isCompany: [false],
+      companyName: [''],
+      referencePerson: ['']
+    });
+
+    // Handle conditional validation for Company fields
+    this.form.get('isCompany')?.valueChanges.subscribe(isCompany => {
+      const nameControl = this.form.get('name');
+      const companyNameControl = this.form.get('companyName');
+      const refPersonControl = this.form.get('referencePerson');
+
+      if (isCompany) {
+        // Company Mode: Name not required / cleared, Company defaults required
+        nameControl?.clearValidators();
+        nameControl?.setValue(''); // Optional: clear value
+        
+        companyNameControl?.setValidators([Validators.required]);
+        refPersonControl?.setValidators([Validators.required]);
+      } else {
+        // Private Mode: Name required
+        nameControl?.setValidators([Validators.required]);
+        
+        companyNameControl?.clearValidators();
+        refPersonControl?.clearValidators();
+      }
+      
+      nameControl?.updateValueAndValidity();
+      companyNameControl?.updateValueAndValidity();
+      refPersonControl?.updateValueAndValidity();
+    });
+    
+    // Check for pending consultation data
+    effect(() => {
+        // Use timeout or run in constructor to ensure dependency availability? 
+        // Actually best in constructor or ngOnInit. Let's stick to constructor logic but executed immediately.
+    });
+    
+    const pending = this.estimator.getPendingConsultation();
+    if (pending) {
+        this.form.patchValue({
+            requestType: 'consult',
+            message: pending.message
+        });
+        
+        // Process files
+        const filePreviews: FilePreview[] = [];
+        pending.files.forEach(f => {
+            filePreviews.push({ file: f, type: this.getFileType(f) });
+        });
+        this.files.set(filePreviews);
+    }
+  }
+
+  setCompanyMode(isCompany: boolean) {
+    this.form.patchValue({ isCompany });
+  }
+
+  onFileSelected(event: Event) {
+    const input = event.target as HTMLInputElement;
+    if (input.files) this.handleFiles(Array.from(input.files));
+  }
+
+  onDragOver(event: DragEvent) {
+    event.preventDefault(); event.stopPropagation();
+  }
+
+  onDrop(event: DragEvent) {
+    event.preventDefault(); event.stopPropagation();
+    if (event.dataTransfer?.files) this.handleFiles(Array.from(event.dataTransfer.files));
+  }
+
+  handleFiles(newFiles: File[]) {
+    const currentFiles = this.files();
+    if (currentFiles.length + newFiles.length > 15) {
+      alert(this.translate.instant('CONTACT.ERR_MAX_FILES'));
+      return;
+    }
+
+    newFiles.forEach(file => {
+      const type = this.getFileType(file);
+      const preview: FilePreview = { file, type };
+
+      if (type === 'image') {
+        const reader = new FileReader();
+        reader.onload = (e) => {
+          preview.url = e.target?.result as string;
+          this.files.update(files => [...files]); 
+        };
+        reader.readAsDataURL(file);
+      }
+      this.files.update(files => [...files, preview]);
+    });
+  }
+
+  removeFile(index: number) {
+    this.files.update(files => files.filter((_, i) => i !== index));
+  }
+
+  getFileType(file: File): 'image' | 'pdf' | '3d' | 'other' {
+    if (file.type.startsWith('image/')) return 'image';
+    if (file.type === 'application/pdf') return 'pdf';
+    const ext = file.name.split('.').pop()?.toLowerCase();
+    if (['stl', 'step', 'stp', '3mf', 'obj'].includes(ext || '')) return '3d';
+    return 'other';
+  }
+
+  onSubmit() {
+    if (this.form.valid) {
+      const formData = {
+        ...this.form.value,
+        files: this.files().map(f => f.file)
+      };
+      console.log('Form Submit:', formData);
+      
+      this.sent.set(true);
+    } else {
+      this.form.markAllAsTouched();
+    }
+  }
+
+  resetForm() {
+    this.sent.set(false);
+    this.form.reset({ requestType: 'custom', isCompany: false });
+    this.files.set([]);
+  }
+}

frontend/src/app/features/contact/contact-page.component.html

@@ -0,0 +1,12 @@
+<section class="contact-hero">
+  <div class="container">
+    <h1>{{ 'CONTACT.TITLE' | translate }}</h1>
+    <p class="subtitle">Siamo qui per aiutarti. Compila il modulo sottostante per qualsiasi richiesta.</p>
+  </div>
+</section>
+
+<div class="container content">
+  <app-card>
+    <app-contact-form></app-contact-form>
+  </app-card>
+</div>

frontend/src/app/features/contact/contact-page.component.scss

@@ -0,0 +1,14 @@
+.contact-hero {
+  padding: 3rem 0 2rem;
+  background: var(--color-bg);
+  text-align: center;
+}
+.subtitle {
+  color: var(--color-text-muted);
+  max-width: 640px;
+  margin: var(--space-3) auto 0;
+}
+.content {
+  padding: 2rem 0 5rem;
+  max-width: 800px;
+}

frontend/src/app/features/contact/contact-page.component.ts

@@ -0,0 +1,14 @@
+import { Component } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { TranslateModule } from '@ngx-translate/core';
+import { ContactFormComponent } from './components/contact-form/contact-form.component';
+import { AppCardComponent } from '../../shared/components/app-card/app-card.component';
+
+@Component({
+  selector: 'app-contact-page',
+  standalone: true,
+  imports: [CommonModule, TranslateModule, ContactFormComponent, AppCardComponent],
+  templateUrl: './contact-page.component.html',
+  styleUrl: './contact-page.component.scss'
+})
+export class ContactPageComponent {}

frontend/src/app/features/contact/contact.routes.ts

@@ -0,0 +1,8 @@
+import { Routes } from '@angular/router';
+
+export const CONTACT_ROUTES: Routes = [
+  {
+    path: '',
+    loadComponent: () => import('./contact-page.component').then(m => m.ContactPageComponent)
+  }
+];

frontend/src/app/features/home/home.component.html

@@ -0,0 +1,154 @@
+    <main class="home-page">
+      <section class="hero">
+        <div class="container hero-grid">
+          <div class="hero-copy">
+            <p class="eyebrow">Stampa 3D tecnica per aziende, freelance e maker</p>
+            <h1 class="hero-title">
+              Prezzo e tempi in pochi secondi.<br>
+              Dal file 3D al pezzo finito.
+            </h1>
+            <p class="hero-lead">
+              Il calcolatore più avanzato per le tue stampe 3D: precisione assoluta e zero sorprese.
+            </p>
+            <p class="hero-subtitle">
+              Realizziamo pezzi unici e produzioni in serie. Se hai il file, il preventivo è istantaneo. 
+              Se devi ancora crearlo, il nostro team di design lo progetterà per te.
+            </p>
+            <div class="hero-actions">
+              <app-button variant="primary" routerLink="/cal">Calcola Preventivo</app-button>
+              <app-button variant="outline" routerLink="/shop">Vai allo shop</app-button>
+              <app-button variant="text" routerLink="/contact">Parla con noi</app-button>
+            </div>
+          </div>
+        </div>
+      </section>
+
+      <section class="section calculator">
+        <div class="container calculator-grid">
+          <div class="calculator-copy">
+            <h2 class="section-title">Preventivo immediato in pochi secondi</h2>
+            <p class="section-subtitle">
+              Nessuna registrazione necessaria. Non salviamo il tuo file fino al momento dell'ordine e la stima è effettuata tramite vero slicing.
+            </p>
+            <ul class="calculator-list">
+              <li>Formati supportati: STL, 3MF, STEP, OBJ</li>
+              <li>Qualità: bozza, standard, alta definizione</li>
+            </ul>
+          </div>
+          <app-card class="quote-card">
+            <div class="quote-header">
+              <div>
+                <p class="quote-eyebrow">Calcolo automatico</p>
+                <h3 class="quote-title">Prezzo e tempi in un click</h3>
+              </div>
+              <span class="quote-tag">Senza registrazione</span>
+            </div>
+            <ul class="quote-steps">
+              <li>Carica il file 3D</li>
+              <li>Scegli materiale e qualità</li>
+              <li>Ricevi subito costo e tempo</li>
+            </ul>
+            <div class="quote-actions">
+              <app-button variant="primary" [fullWidth]="true" routerLink="/cal">Apri calcolatore</app-button>
+              <app-button variant="outline" [fullWidth]="true" routerLink="/contact">Parla con noi</app-button>
+            </div>
+          </app-card>
+        </div>
+      </section>
+
+      <section class="section capabilities">
+        <div class="capabilities-bg"></div>
+        <div class="container">
+          <div class="section-head">
+            <h2 class="section-title">Cosa puoi ottenere</h2>
+            <p class="section-subtitle">
+              Produzione su misura per prototipi, piccole serie e pezzi personalizzati.
+            </p>
+          </div>
+          <div class="cap-cards">
+            <app-card>
+              <div class="card-image-placeholder">
+                  <!-- <img src="..." alt="..."> -->
+              </div>
+              <h3>Prototipazione veloce</h3>
+              <p class="text-muted">Dal file digitale al modello fisico in 24/48 ore. Verifica ergonomia, incastri e funzionamento prima dello stampo definitivo.</p>
+            </app-card>
+            <app-card>
+              <div class="card-image-placeholder">
+                  <!-- <img src="..." alt="..."> -->
+              </div>
+              <h3>Pezzi personalizzati</h3>
+              <p class="text-muted">Componenti unici impossibili da trovare in commercio. Riproduciamo parti rotte o creiamo adattamenti su misura.</p>
+            </app-card>
+            <app-card>
+              <div class="card-image-placeholder">
+                  <!-- <img src="..." alt="..."> -->
+              </div>
+              <h3>Piccole serie</h3>
+              <p class="text-muted">Produzione ponte o serie limitate (10-500 pezzi) con qualità ripetibile. Ideale per validazione di mercato.</p>
+            </app-card>
+            <app-card>
+              <div class="card-image-placeholder">
+                  <!-- <img src="..." alt="..."> -->
+              </div>
+              <h3>Consulenza e CAD</h3>
+              <p class="text-muted">Non hai il file 3D? Ti aiutiamo a progettarlo, ottimizzarlo per la stampa e scegliere il materiale giusto.</p>
+            </app-card>
+          </div>
+        </div>
+      </section>
+
+      <section class="section shop">
+        <div class="container split">
+          <div class="shop-copy">
+            <h2 class="section-title">Shop di soluzioni tecniche pronte</h2>
+            <p>
+              Prodotti selezionati, testati in laboratorio e pronti all'uso. Risolvono problemi reali con
+              funzionalità concrete.
+            </p>
+            <ul class="shop-list">
+              <li>Accessori funzionali per officine e laboratori</li>
+              <li>Ricambi e componenti difficili da reperire</li>
+              <li>Supporti e organizzatori per migliorare i flussi di lavoro</li>
+            </ul>
+            <div class="shop-actions">
+              <app-button variant="primary" routerLink="/shop">Scopri i prodotti</app-button>
+              <app-button variant="outline" routerLink="/contact">Richiedi una soluzione</app-button>
+            </div>
+          </div>
+          <div class="shop-cards">
+            <app-card>
+              <h3>Best seller tecnici</h3>
+              <p class="text-muted">Soluzioni provate sul campo e già pronte alla spedizione.</p>
+            </app-card>
+            <app-card>
+              <h3>Kit pronti all'uso</h3>
+              <p class="text-muted">Componenti compatibili e facili da montare senza sorprese.</p>
+            </app-card>
+            <app-card>
+              <h3>Su richiesta</h3>
+              <p class="text-muted">Non trovi quello che serve? Lo progettiamo e lo produciamo per te.</p>
+            </app-card>
+          </div>
+        </div>
+      </section>
+
+      <section class="section about">
+        <div class="container about-grid">
+          <div class="about-copy">
+            <h2 class="section-title">Su di noi</h2>
+            <p>
+              3D fab è un laboratorio tecnico di stampa 3D. Seguiamo progetti dalla consulenza iniziale
+              alla produzione, con tempi chiari e supporto diretto.
+            </p>
+            <app-button variant="outline" routerLink="/contact">Contattaci</app-button>
+          </div>
+          <div class="about-media">
+            <div class="about-feature-image">
+              <!-- Foto founders -->
+              <span class="text-sm">Foto Founders</span>
+            </div>
+          </div>
+        </div>
+      </section>
+    </main>

frontend/src/app/features/home/home.component.scss

@@ -0,0 +1,345 @@
+    @use '../../../styles/patterns';
+
+    .home-page {
+      background: var(--color-bg);
+    }
+
+    .hero {
+      position: relative;
+      padding: 6rem 0 5rem;
+      overflow: hidden;
+      background: var(--color-bg);
+      // Enhanced Grid Pattern
+      &::after {
+        content: '';
+        position: absolute;
+        inset: 0;
+        @include patterns.pattern-grid(var(--color-neutral-900), 40px, 1px);
+        opacity: 0.06;
+        z-index: 0;
+        pointer-events: none;
+        mask-image: linear-gradient(to bottom, black 70%, transparent 100%);
+      }
+    }
+
+    // Keep the accent blob
+    .hero::before {
+      content: '';
+      position: absolute;
+      width: 420px;
+      height: 420px;
+      right: -120px;
+      top: -160px;
+      background: radial-gradient(circle at 30% 30%, rgba(0, 0, 0, 0.03), transparent 70%);
+      opacity: 0.8;
+      z-index: 0;
+      animation: floatGlow 12s ease-in-out infinite;
+    }
+
+    .hero-grid {
+      display: grid;
+      gap: var(--space-12);
+      align-items: center;
+      position: relative;
+      z-index: 1;
+    }
+    
+    .hero-copy { animation: fadeUp 0.8s ease both; }
+    .hero-panel { animation: fadeUp 0.8s ease 0.15s both; }
+
+    .eyebrow {
+      text-transform: uppercase;
+      letter-spacing: 0.12em;
+      font-size: 0.75rem;
+      color: var(--color-secondary-600);
+      margin-bottom: var(--space-3);
+      font-weight: 600;
+    }
+    .hero-title {
+      font-size: clamp(2.5rem, 2.4vw + 1.8rem, 4rem);
+      font-weight: 700;
+      line-height: 1.05;
+      letter-spacing: -0.02em;
+      margin-bottom: var(--space-4);
+    }
+    .hero-lead {
+      font-size: 1.35rem;
+      font-weight: 500;
+      color: var(--color-neutral-900);
+      margin-bottom: var(--space-3);
+      max-width: 600px;
+    }
+    .hero-subtitle {
+      font-size: 1.1rem;
+      color: var(--color-text-muted);
+      max-width: 560px;
+      line-height: 1.6;
+    }
+    .hero-actions {
+      display: flex;
+      gap: var(--space-4);
+      flex-wrap: wrap;
+      margin: var(--space-6) 0 var(--space-4);
+    }
+    .hero-badges {
+      display: flex;
+      flex-wrap: wrap;
+      gap: var(--space-2);
+    }
+    .hero-badges span {
+      display: inline-flex;
+      padding: 0.35rem 0.75rem;
+      border-radius: 999px;
+      background: var(--color-neutral-100);
+      color: var(--color-neutral-900);
+      font-size: 0.85rem;
+      font-weight: 600;
+      border: 1px solid var(--color-border);
+    }
+
+    .quote-card {
+      display: block;
+    }
+    .focus-card {
+      display: grid;
+      gap: var(--space-4);
+    }
+    .focus-list {
+      list-style: none;
+      padding: 0;
+      margin: 0;
+      display: grid;
+      gap: var(--space-2);
+      color: var(--color-text-muted);
+    }
+    .focus-list li::before {
+      content: '•';
+      color: var(--color-brand);
+      margin-right: var(--space-2);
+    }
+    .focus-list li {
+      display: flex;
+      align-items: baseline;
+      gap: var(--space-2);
+    }
+    .quote-header {
+      display: flex;
+      justify-content: space-between;
+      align-items: flex-start;
+      gap: var(--space-4);
+      margin-bottom: var(--space-4);
+    }
+    .quote-eyebrow {
+      text-transform: uppercase;
+      font-size: 0.7rem;
+      letter-spacing: 0.12em;
+      color: var(--color-secondary-600);
+      margin: 0 0 var(--space-2);
+    }
+    .quote-title { margin: 0; font-size: 1.35rem; }
+    .quote-tag {
+      background: var(--color-neutral-100);
+      border: 1px solid var(--color-border);
+      border-radius: 999px;
+      padding: 0.35rem 0.75rem;
+      font-size: 0.8rem;
+      font-weight: 600;
+      color: var(--color-brand-600);
+      background: var(--color-brand-50);
+      border-color: var(--color-brand-200);
+    }
+    .quote-steps {
+      list-style: none;
+      padding: 0;
+      margin: 0 0 var(--space-5);
+      display: grid;
+      gap: var(--space-2);
+    }
+    .quote-steps li {
+      position: relative;
+      padding-left: 1.5rem;
+      color: var(--color-text-muted);
+    }
+    .quote-steps li::before {
+      content: '';
+      width: 8px;
+      height: 8px;
+      border-radius: 50%;
+      background: var(--color-brand);
+      position: absolute;
+      left: 0.25rem;
+      top: 0.5rem;
+    }
+    .quote-meta {
+      display: grid;
+      grid-template-columns: repeat(2, minmax(0, 1fr));
+      gap: var(--space-4);
+      margin-bottom: var(--space-5);
+    }
+    .meta-label {
+      display: block;
+      font-size: 0.75rem;
+      text-transform: uppercase;
+      letter-spacing: 0.08em;
+      color: var(--color-secondary-600);
+      margin-bottom: var(--space-1);
+    }
+    .meta-value { font-weight: 600; }
+    .quote-actions { display: grid; gap: var(--space-3); }
+
+    .capabilities {
+      position: relative;
+      border-bottom: 1px solid var(--color-border);
+    }
+    .capabilities-bg {
+      display: none;
+    }
+    
+    .section { padding: 5.5rem 0; position: relative; }
+    .section-head { margin-bottom: var(--space-8); }
+    .section-title { font-size: clamp(2rem, 1.8vw + 1.2rem, 2.8rem); margin-bottom: var(--space-3); }
+    .section-subtitle { color: var(--color-text-muted); max-width: 620px; }
+    .text-muted { color: var(--color-text-muted); }
+
+    .calculator {
+      position: relative;
+      border-bottom: 1px solid var(--color-border);
+    }
+    .calculator-grid {
+      display: grid;
+      gap: var(--space-10);
+      align-items: start;
+      position: relative;
+      z-index: 1;
+    }
+    .calculator-list {
+      padding-left: var(--space-4);
+      color: var(--color-text-muted);
+      margin: var(--space-6) 0 0;
+    }
+    .cap-cards {
+      display: grid;
+      gap: var(--space-4);
+      grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
+    }
+    
+    .card-image-placeholder {
+        width: 100%;
+        height: 160px;
+        background: var(--color-neutral-100);
+        margin: -1.5rem -1.5rem 1.5rem -1.5rem; /* Negative margins to bleed to edge */
+        width: calc(100% + 3rem);
+        border-bottom: 1px solid var(--color-border);
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        color: var(--color-neutral-400);
+    }
+
+    .shop {
+      background: var(--color-neutral-50);
+      position: relative;
+      // Triangular/Isogrid Pattern
+      &::before {
+        content: '';
+        position: absolute;
+        inset: 0;
+        @include patterns.pattern-triangular(var(--color-neutral-900), 40px);
+        opacity: 0.03;
+        pointer-events: none;
+      }
+    }
+    .split {
+      display: grid;
+      gap: var(--space-10);
+      align-items: center;
+      position: relative;
+      z-index: 1;
+    }
+    .shop-list {
+      padding-left: var(--space-4);
+      color: var(--color-text-muted);
+      margin-bottom: var(--space-6);
+    }
+    .shop-actions {
+      display: flex;
+      flex-wrap: wrap;
+      gap: var(--space-3);
+    }
+    .shop-cards {
+      display: grid;
+      gap: var(--space-4);
+      grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
+    }
+
+    .about {
+      background: var(--color-neutral-50);
+      border-top: 1px solid var(--color-border);
+      position: relative;
+      // Gyroid Pattern
+      &::before {
+        content: '';
+        position: absolute;
+        inset: 0;
+        @include patterns.pattern-gyroid(var(--color-neutral-900), 40px);
+        opacity: 0.03;
+        pointer-events: none;
+      }
+    }
+    .about-grid {
+      display: grid;
+      gap: var(--space-10);
+      align-items: center;
+    }
+    .about-media {
+      position: relative;
+    }
+    
+    .about-feature-image {
+      width: 100%;
+      height: 100%;
+      min-height: 320px;
+      object-fit: cover;
+      border-radius: var(--radius-lg);
+      background: var(--color-neutral-100);
+      border: 1px solid var(--color-border);
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      color: var(--color-text-muted);
+    }
+    .media-tile p {
+      margin: 0;
+      color: var(--color-text-muted);
+      font-size: 0.9rem;
+    }
+    .about-note {
+      padding: var(--space-5);
+    }
+
+    @media (min-width: 960px) {
+      .hero-grid { grid-template-columns: 1.1fr 0.9fr; }
+      .calculator-grid { grid-template-columns: 1.1fr 0.9fr; }
+      .calculator-grid { grid-template-columns: 1.1fr 0.9fr; }
+      .split { grid-template-columns: 1.1fr 0.9fr; }
+      .about-grid { grid-template-columns: 1.1fr 0.9fr; }
+    }
+
+    @media (max-width: 640px) {
+      .hero-actions { flex-direction: column; align-items: stretch; }
+      .quote-meta { grid-template-columns: 1fr; }
+    }
+
+    @keyframes fadeUp {
+      from { opacity: 0; transform: translateY(18px); }
+      to { opacity: 1; transform: translateY(0); }
+    }
+    @keyframes floatGlow {
+      0%, 100% { transform: translateY(0); }
+      50% { transform: translateY(20px); }
+    }
+
+    @media (prefers-reduced-motion: reduce) {
+      .hero-copy, .hero-panel { animation: none; }
+      .hero::before { animation: none; }
+    }

frontend/src/app/features/home/home.component.ts

@@ -0,0 +1,15 @@
+import { Component } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { RouterLink } from '@angular/router';
+import { TranslateModule } from '@ngx-translate/core';
+import { AppButtonComponent } from '../../shared/components/app-button/app-button.component';
+import { AppCardComponent } from '../../shared/components/app-card/app-card.component';
+
+@Component({
+  selector: 'app-home-page',
+  standalone: true,
+  imports: [CommonModule, RouterLink, TranslateModule, AppButtonComponent, AppCardComponent],
+  templateUrl: './home.component.html',
+  styleUrls: ['./home.component.scss']
+})
+export class HomeComponent {}

frontend/src/app/features/legal/legal.routes.ts

@@ -0,0 +1,12 @@
+import { Routes } from '@angular/router';
+
+export const LEGAL_ROUTES: Routes = [
+  {
+    path: 'privacy',
+    loadComponent: () => import('./privacy/privacy.component').then(m => m.PrivacyComponent)
+  },
+  {
+    path: 'terms',
+    loadComponent: () => import('./terms/terms.component').then(m => m.TermsComponent)
+  }
+];

frontend/src/app/features/legal/privacy/privacy.component.html

@@ -0,0 +1,17 @@
+<section class="legal-page">
+  <div class="container narrow">
+    <h1>{{ 'LEGAL.PRIVACY_TITLE' | translate }}</h1>
+    <div class="content">
+      <p class="intro">{{ 'LEGAL.LAST_UPDATE' | translate }}: February 2026</p>
+      
+      <h2>{{ 'LEGAL.PRIVACY.SECTION_1' | translate }}</h2>
+      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
+
+      <h2>{{ 'LEGAL.PRIVACY.SECTION_2' | translate }}</h2>
+      <p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
+
+      <h2>{{ 'LEGAL.PRIVACY.SECTION_3' | translate }}</h2>
+      <p>Curabitur pretium tincidunt lacus. Nulla gravida orci a odio. Nullam varius, turpis et commodo pharetra, est eros bibendum elit, nec luctus magna felis sollicitudin mauris.</p>
+    </div>
+  </div>
+</section>