{
  "reasoning": "Vecchio Forno Firenze is a warm, heritage-driven Florentine bakery with a handwritten-script logo, purple and amber brand palette, and a traditional artisanal soul. The 03-warm-traditional reference style matches perfectly: bordeaux/burgundy headers, cream backgrounds, terracotta accent bands, serif titles with humanist sans body, and a storytelling-first structure that celebrates craftspersonship and local roots. The four slideshow images (bakery counter, pastries, dough, muffins) map directly to this editorial food-photography approach.",
  "selected_reference_style": "03-warm-traditional",
  "astro_file": "---\nconst { data, copy, i, lang } = Astro.props;\nconst imgUrl = (p) => `${import.meta.env.BASE_URL.replace(/\\/$/, '')}/images/${p}`;\nconst palette = {\n  primary:    data.visual_identity?.color_palette?.primary    || '#7A1F2B',\n  secondary:  data.visual_identity?.color_palette?.secondary  || '#C47E3E',\n  accent:     data.visual_identity?.color_palette?.accent     || '#D4A843',\n  background: data.visual_identity?.color_palette?.background || '#F5EFE6',\n  text:       data.visual_identity?.color_palette?.text       || '#2B2B2B',\n};\n---\n\n<!DOCTYPE html>\n<html lang={lang}>\n<head>\n  <meta charset=\"UTF-8\" />\n  <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\" />\n  <title>{data.business_name}</title>\n  <meta name=\"description\" content={data.description} />\n  <link rel=\"preconnect\" href=\"https://fonts.googleapis.com\" />\n  <link rel=\"preconnect\" href=\"https://fonts.gstatic.com\" crossorigin />\n  <link href=\"https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,600;1,400&family=Cormorant+Garamond:ital,wght@1,500&family=Inter:wght@300;400;500&display=swap\" rel=\"stylesheet\" />\n</head>\n<body>\n\n<style define:vars={{\n  colorPrimary:    palette.primary,\n  colorSecondary:  palette.secondary,\n  colorAccent:     palette.accent,\n  colorBackground: palette.background,\n  colorText:       palette.text,\n}}>\n  :root {\n    --color-primary:    var(--colorPrimary);\n    --color-secondary:  var(--colorSecondary);\n    --color-accent:     var(--colorAccent);\n    --color-background: var(--colorBackground);\n    --color-text:       var(--colorText);\n    --color-cream:      #F5EFE6;\n    --color-dark:       #2B2B2B;\n    --font-heading:     'Playfair Display', Georgia, serif;\n    --font-script:      'Cormorant Garamond', Georgia, serif;\n    --font-body:        'Inter', system-ui, sans-serif;\n  }\n\n  *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }\n\n  html { scroll-behavior: smooth; }\n\n  body {\n    font-family: var(--font-body);\n    color: var(--color-text);\n    background-color: var(--color-background);\n    line-height: 1.6;\n  }\n\n  /* ── HEADER ── */\n  .site-header {\n    position: sticky;\n    top: 0;\n    z-index: 100;\n    background-color: var(--color-primary);\n    padding: 0 2rem;\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    height: 64px;\n    box-shadow: 0 2px 8px rgba(0,0,0,0.18);\n  }\n\n  .header-logo {\n    display: flex;\n    align-items: center;\n    gap: 0.75rem;\n    text-decoration: none;\n  }\n\n  .header-logo img {\n    height: 44px;\n    width: auto;\n    filter: brightness(0) invert(1);\n  }\n\n  .header-logo-text {\n    font-family: var(--font-heading);\n    font-size: 1.1rem;\n    color: #fff;\n    letter-spacing: 0.04em;\n    font-weight: 400;\n    white-space: nowrap;\n  }\n\n  .site-nav {\n    display: flex;\n    align-items: center;\n    gap: 2rem;\n    list-style: none;\n  }\n\n  .site-nav a {\n    font-family: var(--font-body);\n    font-size: 0.78rem;\n    letter-spacing: 0.12em;\n    text-transform: uppercase;\n    color: rgba(255,255,255,0.85);\n    text-decoration: none;\n    transition: color 0.2s;\n  }\n\n  .site-nav a:hover { color: var(--color-accent); }\n\n  .nav-cta {\n    background-color: var(--color-accent);\n    color: #fff !important;\n    padding: 0.45rem 1.1rem;\n    font-size: 0.75rem !important;\n    letter-spacing: 0.12em;\n    text-transform: uppercase;\n    text-decoration: none;\n    font-family: var(--font-body);\n    transition: background-color 0.2s;\n  }\n\n  .nav-cta:hover { background-color: var(--color-secondary) !important; }\n\n  .hamburger {\n    display: none;\n    flex-direction: column;\n    gap: 5px;\n    cursor: pointer;\n    background: none;\n    border: none;\n    padding: 4px;\n  }\n\n  .hamburger span {\n    display: block;\n    width: 24px;\n    height: 2px;\n    background: #fff;\n    border-radius: 2px;\n  }\n\n  /* ── HERO ── */\n  .hero-section {\n    min-height: 80vh;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    background-color: var(--color-primary);\n    position: relative;\n    overflow: hidden;\n  }\n\n  /* Decorative wheat/bread SVG pattern overlay */\n  .hero-section::before {\n    content: '';\n    position: absolute;\n    inset: 0;\n    background-image:\n      radial-gradient(ellipse at 20% 50%, rgba(212,168,67,0.18) 0%, transparent 60%),\n      radial-gradient(ellipse at 80% 30%, rgba(196,126,62,0.15) 0%, transparent 55%);\n    pointer-events: none;\n  }\n\n  /* Grain/texture overlay */\n  .hero-section::after {\n    content: '';\n    position: absolute;\n    inset: 0;\n    background-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80'%3E%3Ccircle cx='10' cy='10' r='1' fill='%23ffffff' opacity='0.04'/%3E%3Ccircle cx='40' cy='10' r='0.7' fill='%23ffffff' opacity='0.03'/%3E%3Ccircle cx='70' cy='20' r='1.2' fill='%23ffffff' opacity='0.04'/%3E%3Ccircle cx='20' cy='50' r='0.8' fill='%23ffffff' opacity='0.03'/%3E%3Ccircle cx='60' cy='60' r='1' fill='%23ffffff' opacity='0.04'/%3E%3Ccircle cx='10' cy='70' r='0.6' fill='%23ffffff' opacity='0.03'/%3E%3Ccircle cx='50' cy='40' r='1.1' fill='%23ffffff' opacity='0.04'/%3E%3C/svg%3E\");\n    pointer-events: none;\n  }\n\n  .hero-inner {\n    position: relative;\n    z-index: 1;\n    text-align: center;\n    padding: 5rem 2rem;\n    max-width: 780px;\n    width: 100%;\n  }\n\n  .hero-eyebrow {\n    font-family: var(--font-body);\n    font-size: 0.72rem;\n    letter-spacing: 0.22em;\n    text-transform: uppercase;\n    color: var(--color-accent);\n    margin-bottom: 1.5rem;\n    display: block;\n  }\n\n  .hero-title {\n    font-family: var(--font-heading);\n    font-size: clamp(2.6rem, 6vw, 5rem);\n    font-weight: 400;\n    color: #fff;\n    line-height: 1.15;\n    margin-bottom: 1.5rem;\n    letter-spacing: 0.01em;\n  }\n\n  .hero-title em {\n    font-style: italic;\n    color: var(--color-accent);\n  }\n\n  .hero-tagline {\n    font-family: var(--font-script);\n    font-size: clamp(1.05rem, 2.2vw, 1.4rem);\n    font-style: italic;\n    color: rgba(255,255,255,0.82);\n    margin-bottom: 2.5rem;\n    line-height: 1.5;\n  }\n\n  /* Decorative wheat SVG divider in hero */\n  .hero-ornament {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    gap: 1rem;\n    margin-bottom: 2.5rem;\n  }\n\n  .hero-ornament-line {\n    width: 60px;\n    height: 1px;\n    background: rgba(212,168,67,0.55);\n  }\n\n  .hero-ornament-icon {\n    color: var(--color-accent);\n    font-size: 1.2rem;\n    opacity: 0.9;\n  }\n\n  .hero-cta {\n    display: inline-block;\n    background-color: var(--color-accent);\n    color: var(--color-dark);\n    font-family: var(--font-body);\n    font-size: 0.78rem;\n    font-weight: 500;\n    letter-spacing: 0.14em;\n    text-transform: uppercase;\n    text-decoration: none;\n    padding: 0.85rem 2.2rem;\n    transition: background-color 0.2s, color 0.2s;\n  }\n\n  .hero-cta:hover {\n    background-color: var(--color-secondary);\n    color: #fff;\n  }\n\n  .hero-scroll-hint {\n    position: absolute;\n    bottom: 2rem;\n    left: 50%;\n    transform: translateX(-50%);\n    z-index: 1;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    gap: 0.4rem;\n    opacity: 0.5;\n  }\n\n  .hero-scroll-hint span {\n    font-size: 0.65rem;\n    letter-spacing: 0.15em;\n    text-transform: uppercase;\n    color: #fff;\n  }\n\n  .hero-scroll-hint svg {\n    stroke: #fff;\n  }\n\n  /* ── SLIDESHOW STRIP ── */\n  .slideshow-section {\n    display: grid;\n    grid-template-columns: repeat(4, 1fr);\n  }\n\n  .slideshow-cell {\n    position: relative;\n    overflow: hidden;\n    aspect-ratio: 4/3;\n  }\n\n  .slideshow-cell img {\n    width: 100%;\n    height: 100%;\n    object-fit: cover;\n    display: block;\n    transition: transform 0.5s ease;\n  }\n\n  .slideshow-cell:hover img { transform: scale(1.05); }\n\n  .slideshow-cell-overlay {\n    position: absolute;\n    inset: 0;\n    background: linear-gradient(to top, rgba(122,31,43,0.45) 0%, transparent 60%);\n    opacity: 0;\n    transition: opacity 0.3s;\n  }\n\n  .slideshow-cell:hover .slideshow-cell-overlay { opacity: 1; }\n\n  /* ── SECTION SHARED ── */\n  .section-eyebrow {\n    font-family: var(--font-body);\n    font-size: 0.68rem;\n    letter-spacing: 0.22em;\n    text-transform: uppercase;\n    color: var(--color-secondary);\n    display: block;\n    margin-bottom: 0.8rem;\n  }\n\n  .section-title {\n    font-family: var(--font-heading);\n    font-size: clamp(1.8rem, 3.5vw, 2.8rem);\n    font-weight: 400;\n    color: var(--color-primary);\n    line-height: 1.2;\n    margin-bottom: 1.2rem;\n  }\n\n  .section-divider {\n    display: flex;\n    align-items: center;\n    gap: 0.8rem;\n    margin-bottom: 2rem;\n  }\n\n  .section-divider-line {\n    flex: 1;\n    height: 1px;\n    background: var(--color-secondary);\n    opacity: 0.35;\n  }\n\n  .section-divider-dot {\n    width: 6px;\n    height: 6px;\n    border-radius: 50%;\n    background: var(--color-accent);\n  }\n\n  /* ── STORIA ── */\n  .storia-section {\n    background-color: var(--color-cream);\n    padding: 7rem 2rem;\n  }\n\n  .storia-container {\n    max-width: 1100px;\n    margin: 0 auto;\n    display: grid;\n    grid-template-columns: 1fr 1fr;\n    gap: 5rem;\n    align-items: center;\n  }\n\n  .storia-text .section-title {\n    font-style: italic;\n  }\n\n  .storia-body {\n    font-size: 1rem;\n    line-height: 1.8;\n    color: var(--color-text);\n    margin-bottom: 1.5rem;\n  }\n\n  .storia-cta {\n    display: inline-block;\n    font-family: var(--font-body);\n    font-size: 0.75rem;\n    letter-spacing: 0.14em;\n    text-transform: uppercase;\n    color: var(--color-primary);\n    text-decoration: none;\n    border-bottom: 1.5px solid var(--color-primary);\n    padding-bottom: 2px;\n    transition: color 0.2s, border-color 0.2s;\n  }\n\n  .storia-cta:hover {\n    color: var(--color-secondary);\n    border-color: var(--color-secondary);\n  }\n\n  .storia-visual {\n    position: relative;\n  }\n\n  .storia-badge {\n    background-color: var(--color-primary);\n    color: #fff;\n    padding: 2.5rem 2rem;\n    text-align: center;\n  }\n\n  .storia-badge-title {\n    font-family: var(--font-heading);\n    font-size: 1.1rem;\n    font-style: italic;\n    color: var(--color-accent);\n    margin-bottom: 0.5rem;\n  }\n\n  .storia-badge-name {\n    font-family: var(--font-heading);\n    font-size: 1.9rem;\n    font-weight: 600;\n    color: #fff;\n    margin-bottom: 0.4rem;\n  }\n\n  .storia-badge-sub {\n    font-family: var(--font-body);\n    font-size: 0.7rem;\n    letter-spacing: 0.16em;\n    text-transform: uppercase;\n    color: rgba(255,255,255,0.65);\n  }\n\n  .storia-values {\n    display: grid;\n    grid-template-columns: 1fr 1fr;\n    gap: 0;\n    margin-top: 0;\n  }\n\n  .storia-value-item {\n    background: #fff;\n    padding: 1.5rem;\n    border: 1px solid rgba(122,31,43,0.1);\n    text-align: center;\n  }\n\n  .storia-value-icon {\n    font-size: 1.5rem;\n    margin-bottom: 0.5rem;\n    display: block;\n  }\n\n  .storia-value-label {\n    font-family: var(--font-body);\n    font-size: 0.68rem;\n    letter-spacing: 0.14em;\n    text-transform: uppercase;\n    color: var(--color-secondary);\n    font-weight: 500;\n  }\n\n  /* ── ACCENT BAND ── */\n  .accent-band {\n    background-color: var(--color-accent);\n    padding: 2.5rem 2rem;\n    text-align: center;\n  }\n\n  .accent-band-text {\n    font-family: var(--font-script);\n    font-size: clamp(1.2rem, 2.5vw, 1.8rem);\n    font-style: italic;\n    color: var(--color-dark);\n    max-width: 700px;\n    margin: 0 auto;\n    line-height: 1.5;\n  }\n\n  /* ── PRODOTTI ── */\n  .prodotti-section {\n    background-color: #fff;\n    padding: 7rem 2rem;\n  }\n\n  .prodotti-container {\n    max-width: 1100px;\n    margin: 0 auto;\n  }\n\n  .prodotti-header {\n    text-align: center;\n    margin-bottom: 3.5rem;\n  }\n\n  .prodotti-grid {\n    display: grid;\n    grid-template-columns: repeat(3, 1fr);\n    gap: 0;\n    border: 1px solid rgba(122,31,43,0.12);\n  }\n\n  .prodotto-card {\n    padding: 2rem 1.8rem;\n    border-right: 1px solid rgba(122,31,43,0.12);\n    border-bottom: 1px solid rgba(122,31,43,0.12);\n    transition: background-color 0.25s;\n  }\n\n  .prodotto-card:nth-child(3n) { border-right: none; }\n  .prodotto-card:nth-last-child(-n+3) { border-bottom: none; }\n\n  .prodotto-card:hover { background-color: var(--color-background); }\n\n  .prodotto-icon {\n    font-size: 1.6rem;\n    margin-bottom: 0.8rem;\n    display: block;\n  }\n\n  .prodotto-name {\n    font-family: var(--font-heading);\n    font-size: 1.15rem;\n    font-weight: 600;\n    color: var(--color-primary);\n    margin-bottom: 0.6rem;\n    line-height: 1.3;\n  }\n\n  .prodotto-desc {\n    font-size: 0.87rem;\n    color: var(--color-text);\n    line-height: 1.65;\n    opacity: 0.85;\n  }\n\n  /* ── ORDINI BAND ── */\n  .ordini-band {\n    background-color: var(--color-primary);\n    padding: 5rem 2rem;\n    text-align: center;\n    position: relative;\n    overflow: hidden;\n  }\n\n  .ordini-band::before {\n    content: '';\n    position: absolute;\n    inset: 0;\n    background: radial-gradient(ellipse at center, rgba(212,168,67,0.12) 0%, transparent 70%);\n    pointer-events: none;\n  }\n\n  .ordini-eyebrow {\n    font-family: var(--font-body);\n    font-size: 0.68rem;\n    letter-spacing: 0.22em;\n    text-transform: uppercase;\n    color: var(--color-accent);\n    display: block;\n    margin-bottom: 1rem;\n  }\n\n  .ordini-title {\n    font-family: var(--font-heading);\n    font-size: clamp(1.6rem, 3vw, 2.4rem);\n    font-weight: 400;\n    font-style: italic;\n    color: #fff;\n    margin-bottom: 1.2rem;\n    position: relative;\n    z-index: 1;\n  }\n\n  .ordini-desc {\n    font-size: 1rem;\n    color: rgba(255,255,255,0.78);\n    max-width: 520px;\n    margin: 0 auto 2rem;\n    line-height: 1.7;\n    position: relative;\n    z-index: 1;\n  }\n\n  .ordini-cta {\n    display: inline-block;\n    background-color: var(--color-accent);\n    color: var(--color-dark);\n    font-family: var(--font-body);\n    font-size: 0.75rem;\n    font-weight: 500;\n    letter-spacing: 0.14em;\n    text-transform: uppercase;\n    text-decoration: none;\n    padding: 0.85rem 2.2rem;\n    position: relative;\n    z-index: 1;\n    transition: background-color 0.2s, color 0.2s;\n  }\n\n  .ordini-cta:hover {\n    background-color: var(--color-secondary);\n    color: #fff;\n  }\n\n  /* ── CONTATTI ── */\n  .contatti-section {\n    background-color: var(--color-cream);\n    padding: 7rem 2rem;\n  }\n\n  .contatti-container {\n    max-width: 1100px;\n    margin: 0 auto;\n  }\n\n  .contatti-header {\n    text-align: center;\n    margin-bottom: 3.5rem;\n  }\n\n  .contatti-cards {\n    display: grid;\n    grid-template-columns: repeat(3, 1fr);\n    gap: 1.5rem;\n  }\n\n  .contatto-card {\n    background: #fff;\n    padding: 2.5rem 2rem;\n    text-align: center;\n    border-top: 3px solid var(--color-primary);\n  }\n\n  .contatto-icon {\n    font-size: 2rem;\n    margin-bottom: 1rem;\n    display: block;\n  }\n\n  .contatto-label {\n    font-family: var(--font-body);\n    font-size: 0.68rem;\n    letter-spacing: 0.18em;\n    text-transform: uppercase;\n    color: var(--color-secondary);\n    font-weight: 500;\n    margin-bottom: 0.5rem;\n  }\n\n  .contatto-value {\n    font-family: var(--font-heading);\n    font-size: 1rem;\n    color: var(--color-text);\n    line-height: 1.5;\n  }\n\n  .contatto-card-empty {\n    background: var(--color-background);\n    padding: 2.5rem 2rem;\n    text-align: center;\n    border-top: 3px solid rgba(122,31,43,0.2);\n  }\n\n  .contatto-card-empty .contatto-label {\n    color: rgba(43,43,43,0.5);\n  }\n\n  .contatto-card-empty .contatto-value {\n    font-family: var(--font-body);\n    font-size: 0.9rem;\n    color: rgba(43,43,43,0.45);\n    font-style: italic;\n  }\n\n  /* ── FOOTER ── */\n  .site-footer {\n    background-color: var(--color-dark);\n    padding: 4rem 2rem 2rem;\n  }\n\n  .footer-inner {\n    max-width: 1100px;\n    margin: 0 auto;\n  }\n\n  .footer-top {\n    display: grid;\n    grid-template-columns: 1.4fr 1fr 1fr;\n    gap: 3rem;\n    margin-bottom: 3rem;\n    padding-bottom: 3rem;\n    border-bottom: 1px solid rgba(255,255,255,0.1);\n  }\n\n  .footer-brand-logo {\n    height: 48px;\n    width: auto;\n    filter: brightness(0) invert(1);\n    opacity: 0.85;\n    margin-bottom: 1rem;\n    display: block;\n  }\n\n  .footer-brand-name {\n    font-family: var(--font-heading);\n    font-size: 1.15rem;\n    font-style: italic;\n    color: #fff;\n    margin-bottom: 0.6rem;\n  }\n\n  .footer-brand-desc {\n    font-size: 0.85rem;\n    color: rgba(255,255,255,0.5);\n    line-height: 1.7;\n  }\n\n  .footer-col-title {\n    font-family: var(--font-body);\n    font-size: 0.68rem;\n    letter-spacing: 0.2em;\n    text-transform: uppercase;\n    color: var(--color-accent);\n    font-weight: 500;\n    margin-bottom: 1.2rem;\n    display: block;\n  }\n\n  .footer-nav-list {\n    list-style: none;\n    display: flex;\n    flex-direction: column;\n    gap: 0.6rem;\n  }\n\n  .footer-nav-list a {\n    font-size: 0.88rem;\n    color: rgba(255,255,255,0.6);\n    text-decoration: none;\n    transition: color 0.2s;\n  }\n\n  .footer-nav-list a:hover { color: var(--color-accent); }\n\n  .footer-info-list {\n    list-style: none;\n    display: flex;\n    flex-direction: column;\n    gap: 0.7rem;\n  }\n\n  .footer-info-item {\n    font-size: 0.85rem;\n    color: rgba(255,255,255,0.55);\n    display: flex;\n    gap: 0.5rem;\n    align-items: flex-start;\n    line-height: 1.5;\n  }\n\n  .footer-info-item span:first-child {\n    opacity: 0.7;\n    flex-shrink: 0;\n    font-size: 0.95rem;\n  }\n\n  .footer-bottom {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    flex-wrap: wrap;\n    gap: 1rem;\n  }\n\n  .footer-legal {\n    font-size: 0.75rem;\n    color: rgba(255,255,255,0.35);\n    letter-spacing: 0.03em;\n  }\n\n  .footer-credits {\n    font-size: 0.75rem;\n    color: rgba(255,255,255,0.35);\n  }\n\n  /* ── RESPONSIVE ── */\n  @media (max-width: 900px) {\n    .site-nav { display: none; }\n    .hamburger { display: flex; }\n\n    .storia-container {\n      grid-template-columns: 1fr;\n      gap: 3rem;\n    }\n\n    .prodotti-grid {\n      grid-template-columns: repeat(2, 1fr);\n    }\n\n    .prodotto-card:nth-child(3n) { border-right: 1px solid rgba(122,31,43,0.12); }\n    .prodotto-card:nth-child(2n) { border-right: none; }\n    .prodotto-card:nth-last-child(-n+3) { border-bottom: 1px solid rgba(122,31,43,0.12); }\n    .prodotto-card:nth-last-child(-n+2) { border-bottom: none; }\n\n    .contatti-cards { grid-template-columns: 1fr; }\n\n    .footer-top { grid-template-columns: 1fr; gap: 2rem; }\n  }\n\n  @media (max-width: 640px) {\n    .slideshow-section {\n      grid-template-columns: repeat(2, 1fr);\n    }\n\n    .prodotti-grid {\n      grid-template-columns: 1fr;\n    }\n\n    .prodotto-card { border-right: none !important; }\n    .prodotto-card { border-bottom: 1px solid rgba(122,31,43,0.12) !important; }\n    .prodotto-card:last-child { border-bottom: none !important; }\n\n    .storia-values { grid-template-columns: 1fr 1fr; }\n\n    .footer-bottom { flex-direction: column; align-items: flex-start; }\n  }\n</style>\n\n<!-- HEADER -->\n<header class=\"site-header\">\n  <a href=\"#\" class=\"header-logo\">\n    {data.images.logo && (\n      <img\n        src={imgUrl(data.images.logo.path)}\n        alt={data.images.logo.alt}\n      />\n    )}\n    <span class=\"header-logo-text\">{data.business_name}</span>\n  </a>\n\n  <nav>\n    <ul class=\"site-nav\">\n      <li><a href=\"#storia\">{i.nav_story}</a></li>\n      <li><a href=\"#prodotti\">{i.nav_products}</a></li>\n      <li><a href=\"#contatti\">{i.nav_contacts}</a></li>\n      <li><a href=\"#contatti\" class=\"nav-cta\">{i.cta_order}</a></li>\n    </ul>\n  </nav>\n\n  <button class=\"hamburger\" aria-label={i.nav_menu_label}>\n    <span></span><span></span><span></span>\n  </button>\n</header>\n\n<!-- HERO -->\n<section class=\"hero-section\" id=\"home\">\n  <div class=\"hero-inner\">\n    <span class=\"hero-eyebrow\">{copy.hero_eyebrow}</span>\n    <h1 class=\"hero-title\">\n      {data.business_name}\n    </h1>\n    <div class=\"hero-ornament\">\n      <span class=\"hero-ornament-line\"></span>\n      <span class=\"hero-ornament-icon\">&#127806;</span>\n      <span class=\"hero-ornament-line\"></span>\n    </div>\n    <p class=\"hero-tagline\">{copy.hero_tagline}</p>\n    <a href=\"#prodotti\" class=\"hero-cta\">{i.cta_discover}</a>\n  </div>\n  <div class=\"hero-scroll-hint\" aria-hidden=\"true\">\n    <span>{i.scroll_hint}</span>\n    <svg width=\"14\" height=\"20\" viewBox=\"0 0 14 20\" fill=\"none\">\n      <path d=\"M7 1v18M1 13l6 6 6-6\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n    </svg>\n  </div>\n</section>\n\n<!-- SLIDESHOW STRIP (only renders when images are available) -->\n{data.images.slideshow.length > 0 && (\n  <section class=\"slideshow-section\" aria-label={i.gallery_label}>\n    {data.images.slideshow.map((img) => (\n      <div class=\"slideshow-cell\">\n        <img\n          src={imgUrl(img.path)}\n          alt={img.alt}\n          loading=\"lazy\"\n        />\n        <div class=\"slideshow-cell-overlay\" aria-hidden=\"true\"></div>\n      </div>\n    ))}\n  </section>\n)}\n\n<!-- ACCENT QUOTE BAND -->\n<div class=\"accent-band\">\n  <p class=\"accent-band-text\">{copy.accent_quote}</p>\n</div>\n\n<!-- STORIA -->\n<section class=\"storia-section\" id=\"storia\">\n  <div class=\"storia-container\">\n    <div class=\"storia-text\">\n      <span class=\"section-eyebrow\">{copy.story_eyebrow}</span>\n      <h2 class=\"section-title\">{i.section_title_story}</h2>\n      <div class=\"section-divider\">\n        <span class=\"section-divider-line\"></span>\n        <span class=\"section-divider-dot\"></span>\n        <span class=\"section-divider-line\" style=\"flex: 0; width: 20px;\"></span>\n      </div>\n      <p class=\"storia-body\">{copy.story_paragraph}</p>\n      <p class=\"storia-body\">{copy.story_paragraph_2}</p>\n      <a href=\"#prodotti\" class=\"storia-cta\">{i.cta_discover}</a>\n    </div>\n\n    <div class=\"storia-visual\">\n      <div class=\"storia-badge\">\n        <p class=\"storia-badge-title\">{copy.badge_label}</p>\n        <p class=\"storia-badge-name\">{data.business_name}</p>\n        <p class=\"storia-badge-sub\">{data.tagline}</p>\n      </div>\n      <div class=\"storia-values\">\n        <div class=\"storia-value-item\">\n          <span class=\"storia-value-icon\">🌾</span>\n          <span class=\"storia-value-label\">{i.value_local}</span>\n        </div>\n        <div class=\"storia-value-item\">\n          <span class=\"storia-value-icon\">🤲</span>\n          <span class=\"storia-value-label\">{i.value_artisan}</span>\n        </div>\n        <div class=\"storia-value-item\">\n          <span class=\"storia-value-icon\">🍷</span>\n          <span class=\"storia-value-label\">{i.value_wines}</span>\n        </div>\n        <div class=\"storia-value-item\">\n          <span class=\"storia-value-icon\">🎂</span>\n          <span class=\"storia-value-label\">{i.value_events}</span>\n        </div>\n      </div>\n    </div>\n  </div>\n</section>\n\n<!-- PRODOTTI -->\n<section class=\"prodotti-section\" id=\"prodotti\">\n  <div class=\"prodotti-container\">\n    <div class=\"prodotti-header\">\n      <span class=\"section-eyebrow\">{copy.products_eyebrow}</span>\n      <h2 class=\"section-title\">{i.section_title_products}</h2>\n      <div class=\"section-divider\" style=\"justify-content: center;\">\n        <span class=\"section-divider-line\" style=\"max-width: 60px;\"></span>\n        <span class=\"section-divider-dot\"></span>\n        <span class=\"section-divider-line\" style=\"max-width: 60px;\"></span>\n      </div>\n    </div>\n\n    <div class=\"prodotti-grid\">\n      {data.products_or_services.map((p) => (\n        <article class=\"prodotto-card\">\n          <span class=\"prodotto-icon\" aria-hidden=\"true\">✦</span>\n          <h3 class=\"prodotto-name\">{p.name}</h3>\n          <p class=\"prodotto-desc\">{p.description}</p>\n        </article>\n      ))}\n    </div>\n  </div>\n</section>\n\n<!-- ORDINI BAND -->\n<section class=\"ordini-band\">\n  <span class=\"ordini-eyebrow\">{i.section_eyebrow_events}</span>\n  <h2 class=\"ordini-title\">{copy.ordini_title}</h2>\n  <p class=\"ordini-desc\">{copy.ordini_desc}</p>\n  <a href=\"#contatti\" class=\"ordini-cta\">{i.cta_order}</a>\n</section>\n\n<!-- CONTATTI -->\n<section class=\"contatti-section\" id=\"contatti\">\n  <div class=\"contatti-container\">\n    <div class=\"contatti-header\">\n      <span class=\"section-eyebrow\">{copy.contacts_eyebrow}</span>\n      <h2 class=\"section-title\">{i.section_title_contacts}</h2>\n      <div class=\"section-divider\" style=\"justify-content: center;\">\n        <span class=\"section-divider-line\" style=\"max-width: 60px;\"></span>\n        <span class=\"section-divider-dot\"></span>\n        <span class=\"section-divider-line\" style=\"max-width: 60px;\"></span>\n      </div>\n    </div>\n\n    <div class=\"contatti-cards\">\n      {data.contacts.address ? (\n        <div class=\"contatto-card\">\n          <span class=\"contatto-icon\" aria-hidden=\"true\">📍</span>\n          <p class=\"contatto-label\">{i.label_address}</p>\n          <p class=\"contatto-value\">{data.contacts.address}</p>\n        </div>\n      ) : (\n        <div class=\"contatto-card-empty\">\n          <span class=\"contatto-icon\" aria-hidden=\"true\">📍</span>\n          <p class=\"contatto-label\">{i.label_address}</p>\n          <p class=\"contatto-value\">{copy.address_placeholder}</p>\n        </div>\n      )}\n\n      {data.contacts.phone ? (\n        <div class=\"contatto-card\">\n          <span class=\"contatto-icon\" aria-hidden=\"true\">📞</span>\n          <p class=\"contatto-label\">{i.label_phone}</p>\n          <p class=\"contatto-value\">\n            <a href={`tel:${data.contacts.phone}`} style=\"color: inherit; text-decoration: none;\">\n              {data.contacts.phone}\n            </a>\n          </p>\n        </div>\n      ) : (\n        <div class=\"contatto-card-empty\">\n          <span class=\"contatto-icon\" aria-hidden=\"true\">📞</span>\n          <p class=\"contatto-label\">{i.label_phone}</p>\n          <p class=\"contatto-value\">{copy.phone_placeholder}</p>\n        </div>\n      )}\n\n      {data.contacts.hours ? (\n        <div class=\"contatto-card\">\n          <span class=\"contatto-icon\" aria-hidden=\"true\">🕐</span>\n          <p class=\"contatto-label\">{i.label_hours}</p>\n          <p class=\"contatto-value\">{data.contacts.hours}</p>\n        </div>\n      ) : (\n        <div class=\"contatto-card-empty\">\n          <span class=\"contatto-icon\" aria-hidden=\"true\">🕐</span>\n          <p class=\"contatto-label\">{i.label_hours}</p>\n          <p class=\"contatto-value\">{copy.hours_placeholder}</p>\n        </div>\n      )}\n    </div>\n\n    {data.contacts.email && (\n      <div style=\"text-align: center; margin-top: 2.5rem;\">\n        <a\n          href={`mailto:${data.contacts.email}`}\n          style=\"font-family: var(--font-body); font-size: 0.78rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--color-primary); text-decoration: none; border-bottom: 1.5px solid var(--color-primary); padding-bottom: 2px;\">\n          {data.contacts.email}\n        </a>\n      </div>\n    )}\n  </div>\n</section>\n\n<!-- FOOTER -->\n<footer class=\"site-footer\">\n  <div class=\"footer-inner\">\n    <div class=\"footer-top\">\n      <div class=\"footer-brand\">\n        {data.images.logo && (\n          <img\n            src={imgUrl(data.images.logo.path)}\n            alt={data.images.logo.alt}\n            class=\"footer-brand-logo\"\n          />\n        )}\n        <p class=\"footer-brand-name\">{data.business_name}</p>\n        <p class=\"footer-brand-desc\">{copy.footer_tagline}</p>\n      </div>\n\n      <div>\n        <span class=\"footer-col-title\">{i.footer_nav_title}</span>\n        <ul class=\"footer-nav-list\">\n          <li><a href=\"#storia\">{i.nav_story}</a></li>\n          <li><a href=\"#prodotti\">{i.nav_products}</a></li>\n          <li><a href=\"#contatti\">{i.nav_contacts}</a></li>\n        </ul>\n      </div>\n\n      <div>\n        <span class=\"footer-col-title\">{i.footer_info_title}</span>\n        <ul class=\"footer-info-list\">\n          <li class=\"footer-info-item\">\n            <span>🌍</span>\n            <span>{data.category}</span>\n          </li>\n          {data.contacts.address && (\n            <li class=\"footer-info-item\">\n              <span>📍</span>\n              <span>{data.contacts.address}</span>\n            </li>\n          )}\n          {data.contacts.phone && (\n            <li class=\"footer-info-item\">\n              <span>📞</span>\n              <a href={`tel:${data.contacts.phone}`} style=\"color: inherit; text-decoration: none;\">{data.contacts.phone}</a>\n            </li>\n          )}\n          {data.contacts.email && (\n            <li class=\"footer-info-item\">\n              <span>✉️</span>\n              <a href={`mailto:${data.contacts.email}`} style=\"color: inherit; text-decoration: none;\">{data.contacts.email}</a>\n            </li>\n          )}\n          {data.contacts.hours && (\n            <li class=\"footer-info-item\">\n              <span>🕐</span>\n              <span>{data.contacts.hours}</span>\n            </li>\n          )}\n        </ul>\n      </div>\n    </div>\n\n    <div class=\"footer-bottom\">\n      <p class=\"footer-legal\">{i.footer_legal}</p>\n      <p class=\"footer-credits\">{i.footer_credits}</p>\n    </div>\n  </div>\n</footer>\n\n</body>\n</html>",
  "content_schema": [
    {
      "key": "hero_eyebrow",
      "type": "text",
      "max_chars": 60,
      "description": "Short atmospheric eyebrow label above the hero title — evokes artisanal Florentine tradition. No specific facts.",
      "array_source": null,
      "is_array_item": false,
      "array_key": null,
      "field_name": null
    },
    {
      "key": "hero_tagline",
      "type": "text",
      "max_chars": 160,
      "description": "Hero subtitle — poetic, sensory, warm. Evokes the scent of fresh bread, the heart of Florence, Daisy's passion. No specific verifiable claims.",
      "array_source": null,
      "is_array_item": false,
      "array_key": null,
      "field_name": null
    },
    {
      "key": "accent_quote",
      "type": "text",
      "max_chars": 180,
      "description": "Short atmospheric quote for the terracotta/accent band. Warm, handwritten-feel tone. Celebrates local ingredients and artisanal craft.",
      "array_source": null,
      "is_array_item": false,
      "array_key": null,
      "field_name": null
    },
    {
      "key": "story_eyebrow",
      "type": "text",
      "max_chars": 60,
      "description": "Short eyebrow label above the storia section title. E.g. a poetic phrase evoking heritage, hands at work, Florentine roots.",
      "array_source": null,
      "is_array_item": false,
      "array_key": null,
      "field_name": null
    },
    {
      "key": "story_paragraph",
      "type": "text",
      "max_chars": 420,
      "description": "First narrative paragraph for the story section. Warm, personal, evocative. May allude to passion and craft without inventing specific facts.",
      "array_source": null,
      "is_array_item": false,
      "array_key": null,
      "field_name": null
    },
    {
      "key": "story_paragraph_2",
      "type": "text",
      "max_chars": 360,
      "description": "Second narrative paragraph continuing the story. Mentions the range of products (sweet and savoury) and local sourcing. Atmospheric, no invented facts.",
      "array_source": null,
      "is_array_item": false,
      "array_key": null,
      "field_name": null
    },
    {
      "key": "badge_label",
      "type": "text",
      "max_chars": 50,
      "description": "Decorative label inside the dark brand badge in the storia section. E.g. a short poetic phrase like 'Forno artigianale' or 'Dal cuore di Firenze'.",
      "array_source": null,
      "is_array_item": false,
      "array_key": null,
      "field_name": null
    },
    {
      "key": "products_eyebrow",
      "type": "text",
      "max_chars": 60,
      "description": "Short eyebrow above the products section title. Warm and appetising, referencing artisanal craft.",
      "array_source": null,
      "is_array_item": false,
      "array_key": null,
      "field_name": null
    },
    {
      "key": "ordini_title",
      "type": "text",
      "max_chars": 80,
      "description": "Headline for the events/orders CTA band. Inviting, warm tone. Celebrates the bakery's availability for parties and custom cakes.",
      "array_source": null,
      "is_array_item": false,
      "array_key": null,
      "field_name": null
    },
    {
      "key": "ordini_desc",
      "type": "text",
      "max_chars": 200,
      "description": "Short atmospheric description under the ordini CTA headline. Invites visitors to get in touch for custom orders. Warm, no invented facts.",
      "array_source": null,
      "is_array_item": false,
      "array_key": null,
      "field_name": null
    },
    {
      "key": "contacts_eyebrow",
      "type": "text",
      "max_chars": 60,
      "description": "Short eyebrow above the contacts section title. Welcoming, e.g. 'Vieni a trovarci'.",
      "array_source": null,
      "is_array_item": false,
      "array_key": null,
      "field_name": null
    },
    {
      "key": "address_placeholder",
      "type": "text",
      "max_chars": 80,
      "description": "Friendly placeholder text shown in the address card when no address is available. E.g. 'Zona Mercato San Lorenzo, Firenze'.",
      "array_source": null,
      "is_array_item": false,
      "array_key": null,
      "field_name": null
    },
    {
      "key": "phone_placeholder",
      "type": "text",
      "max_chars": 60,
      "description": "Friendly placeholder text when phone is not available. E.g. 'Contattaci via email'.",
      "array_source": null,
      "is_array_item": false,
      "array_key": null,
      "field_name": null
    },
    {
      "key": "hours_placeholder",
      "type": "text",
      "max_chars": 80,
      "description": "Friendly placeholder text when hours are not available. E.g. 'Aperto tutti i giorni — contattaci per conferma'.",
      "array_source": null,
      "is_array_item": false,
      "array_key": null,
      "field_name": null
    },
    {
      "key": "footer_tagline",
      "type": "text",
      "max_chars": 140,
      "description": "Short footer brand description. Warm, atmospheric, evokes the bakery's soul and Florentine setting.",
      "array_source": null,
      "is_array_item": false,
      "array_key": null,
      "field_name": null
    }
  ],
  "data_bindings": [
    "business_name",
    "tagline",
    "category",
    "description",
    "contacts.address",
    "contacts.phone",
    "contacts.email",
    "contacts.hours",
    "products_or_services[]",
    "available_locales",
    "images.logo",
    "images.slideshow",
    "visual_identity.color_palette.primary",
    "visual_identity.color_palette.secondary",
    "visual_identity.color_palette.accent",
    "visual_identity.color_palette.background",
    "visual_identity.color_palette.text"
  ],
  "ui_translations": {
    "nav_story": "La nostra storia",
    "nav_products": "Specialità",
    "nav_contacts": "Contatti",
    "nav_menu_label": "Menu",
    "cta_discover": "Scopri le specialità",
    "cta_order": "Ordina ora",
    "scroll_hint": "Scorri",
    "gallery_label": "Galleria fotografica",
    "section_title_story": "La nostra storia",
    "section_title_products": "Le nostre specialità",
    "section_title_contacts": "Dove siamo",
    "section_eyebrow_events": "Feste & ordinazioni",
    "value_local": "Materie prime locali",
    "value_artisan": "Produzione artigianale",
    "value_wines": "Vini toscani",
    "value_events": "Torte su ordinazione",
    "label_address": "Indirizzo",
    "label_phone": "Telefono",
    "label_hours": "Orari",
    "footer_nav_title": "Navigazione",
    "footer_info_title": "Informazioni",
    "footer_legal": "© Vecchio Forno Firenze. Tutti i diritti riservati.",
    "footer_credits": "Fatto con passione a Firenze"
  }
}