{"success":true,"template":{"id":"luxury","name":"Luxury","description":"A high-end, cinematic design with refined aesthetics and elegant typography. Perfect for premium brands and luxury services."},"sources":[{"path":"src/app/preview/luxury/globals.css","code":"@import 'tailwindcss';\n\n@custom-variant dark (&:is(.dark *));\n\n:root {\n  /* Luxury template - Elegant, high-end palette with champagne and charcoal */\n  --background: oklch(0.99 0.005 60);\n  --foreground: oklch(0.15 0.02 60);\n  --card: oklch(0.98 0.01 60);\n  --card-foreground: oklch(0.15 0.02 60);\n  --popover: oklch(0.99 0.005 60);\n  --popover-foreground: oklch(0.15 0.02 60);\n\n  /* Rich champagne gold primary */\n  --primary: oklch(0.65 0.12 70);\n  --primary-foreground: oklch(0.15 0.02 60);\n\n  /* Warm ivory secondary */\n  --secondary: oklch(0.96 0.015 60);\n  --secondary-foreground: oklch(0.30 0.02 60);\n\n  /* Elegant muted tones */\n  --muted: oklch(0.94 0.01 60);\n  --muted-foreground: oklch(0.45 0.02 60);\n\n  /* Deep bronze accent */\n  --accent: oklch(0.55 0.10 50);\n  --accent-foreground: oklch(0.99 0.005 60);\n\n  /* Muted rose destructive */\n  --destructive: oklch(0.50 0.15 15);\n  --destructive-foreground: oklch(0.99 0.005 60);\n\n  /* Refined borders */\n  --border: oklch(0.88 0.02 60);\n  --input: oklch(0.88 0.02 60);\n  --ring: oklch(0.65 0.12 70);\n\n  /* Chart colors */\n  --chart-1: oklch(0.65 0.12 70);\n  --chart-2: oklch(0.55 0.10 50);\n  --chart-3: oklch(0.60 0.08 90);\n  --chart-4: oklch(0.50 0.06 30);\n  --chart-5: oklch(0.70 0.10 80);\n\n  /* Elegant radius */\n  --radius: 0.375rem;\n\n  /* Sidebar styling */\n  --sidebar: oklch(0.97 0.01 60);\n  --sidebar-foreground: oklch(0.15 0.02 60);\n  --sidebar-primary: oklch(0.65 0.12 70);\n  --sidebar-primary-foreground: oklch(0.15 0.02 60);\n  --sidebar-accent: oklch(0.94 0.015 60);\n  --sidebar-accent-foreground: oklch(0.30 0.02 60);\n  --sidebar-border: oklch(0.88 0.02 60);\n  --sidebar-ring: oklch(0.65 0.12 70);\n\n  /* Luxury soft shadows */\n  --shadow-x: 0px;\n  --shadow-y: 3px;\n  --shadow-blur: 8px;\n  --shadow-spread: 0px;\n  --shadow-opacity: 0.06;\n  --shadow-color: #a08060;\n}\n\n@theme inline {\n  --font-sans: var(--font-geist-sans);\n  --font-mono: var(--font-geist-mono);\n  --color-background: var(--background);\n  --color-foreground: var(--foreground);\n  --color-card: var(--card);\n  --color-card-foreground: var(--card-foreground);\n  --color-popover: var(--popover);\n  --color-popover-foreground: var(--popover-foreground);\n  --color-primary: var(--primary);\n  --color-primary-foreground: var(--primary-foreground);\n  --color-secondary: var(--secondary);\n  --color-secondary-foreground: var(--secondary-foreground);\n  --color-muted: var(--muted);\n  --color-muted-foreground: var(--muted-foreground);\n  --color-accent: var(--accent);\n  --color-accent-foreground: var(--accent-foreground);\n  --color-destructive: var(--destructive);\n  --color-destructive-foreground: var(--destructive-foreground);\n  --color-border: var(--border);\n  --color-input: var(--input);\n  --color-ring: var(--ring);\n  --color-chart-1: var(--chart-1);\n  --color-chart-2: var(--chart-2);\n  --color-chart-3: var(--chart-3);\n  --color-chart-4: var(--chart-4);\n  --color-chart-5: var(--chart-5);\n  --radius-sm: calc(var(--radius) - 4px);\n  --radius-md: calc(var(--radius) - 2px);\n  --radius-lg: var(--radius);\n  --radius-xl: calc(var(--radius) + 4px);\n  --color-sidebar: var(--sidebar);\n  --color-sidebar-foreground: var(--sidebar-foreground);\n  --color-sidebar-primary: var(--sidebar-primary);\n  --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);\n  --color-sidebar-accent: var(--sidebar-accent);\n  --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);\n  --color-sidebar-border: var(--sidebar-border);\n  --color-sidebar-ring: var(--sidebar-ring);\n  --shadow-2xs: var(--shadow-x) var(--shadow-y) color-mix(in srgb, var(--shadow-color) calc(var(--shadow-opacity) * 100%), transparent);\n  --shadow-xs: var(--shadow-x) var(--shadow-y) var(--shadow-blur) var(--shadow-spread) color-mix(in srgb, var(--shadow-color) calc(var(--shadow-opacity) * 100%), transparent);\n  --shadow-sm: var(--shadow-x) var(--shadow-y) calc(var(--shadow-blur) * 1.5) var(--shadow-spread) color-mix(in srgb, var(--shadow-color) calc(var(--shadow-opacity) * 100%), transparent);\n  --shadow-md: calc(var(--shadow-x) * 2) calc(var(--shadow-y) * 2) calc(var(--shadow-blur) * 3) calc(var(--shadow-spread) - 1px) color-mix(in srgb, var(--shadow-color) calc(var(--shadow-opacity) * 100%), transparent);\n  --shadow-lg: calc(var(--shadow-x) * 4) calc(var(--shadow-y) * 4) calc(var(--shadow-blur) * 5) calc(var(--shadow-spread) - 3px) color-mix(in srgb, var(--shadow-color) calc(var(--shadow-opacity) * 100%), transparent);\n  --shadow-xl: calc(var(--shadow-x) * 6) calc(var(--shadow-y) * 6) calc(var(--shadow-blur) * 7) calc(var(--shadow-spread) - 5px) color-mix(in srgb, var(--shadow-color) calc(var(--shadow-opacity) * 100%), transparent);\n  --shadow-2xl: calc(var(--shadow-x) * 8) calc(var(--shadow-y) * 8) calc(max(0px, var(--shadow-blur) * 9 - 8px)) calc(var(--shadow-spread) - 12px) color-mix(in srgb, var(--shadow-color) calc(var(--shadow-opacity) * 250%), transparent);\n  --shadow: var(--shadow-md);\n  --color-shadow-color: var(--shadow-color);\n  --shadow-opacity: var(--shadow-opacity);\n  --shadow-spread: var(--shadow-spread);\n  --shadow-blur: var(--shadow-blur);\n  --shadow-y: var(--shadow-y);\n  --shadow-x: var(--shadow-x);\n}\n\n@layer base {\n  * {\n    @apply border-border outline-ring/50;\n  }\n\n  body {\n    @apply bg-background text-foreground;\n    font-feature-settings: 'liga' 1, 'calt' 1;\n    text-rendering: optimizeLegibility;\n    -webkit-font-smoothing: antialiased;\n    -moz-osx-font-smoothing: grayscale;\n  }\n\n  /* Smooth transitions */\n  a, button, input, select, textarea {\n    @apply transition-colors duration-200 ease-in-out;\n  }\n\n  /* Enhanced focus states */\n  :focus-visible {\n    @apply outline-2 outline-offset-2 outline-ring;\n  }\n\n  /* Smooth scrolling */\n  html {\n    scroll-behavior: smooth;\n  }\n\n  /* Custom scrollbar */\n  ::-webkit-scrollbar {\n    width: 12px;\n    height: 12px;\n  }\n\n  ::-webkit-scrollbar-track {\n    @apply bg-background;\n  }\n\n  ::-webkit-scrollbar-thumb {\n    @apply bg-border hover:bg-muted-foreground rounded-lg;\n    transition: background-color 0.2s;\n  }\n\n  /* Selection styling */\n  ::selection {\n    @apply bg-primary/20 text-foreground;\n  }\n\n  /* Card enhancements */\n  .card {\n    @apply backdrop-blur-sm;\n  }\n\n  /* Gradient text utility */\n  .gradient-text {\n    @apply bg-gradient-to-r from-primary via-accent to-primary bg-clip-text text-transparent;\n    background-size: 200% auto;\n    animation: gradient-shift 3s ease infinite;\n  }\n\n  @keyframes gradient-shift {\n    0%, 100% { background-position: 0% center; }\n    50% { background-position: 100% center; }\n  }\n\n  /* Glass morphism effect */\n  .glass {\n    @apply bg-background/80 backdrop-blur-xl border border-border/50;\n  }\n\n  /* Float animation */\n  .animate-float {\n    animation: float 3s ease-in-out infinite;\n  }\n\n  @keyframes float {\n    0%, 100% { transform: translateY(0); }\n    50% { transform: translateY(-10px); }\n  }\n\n  /* Slow pulse animation */\n  .animate-pulse-slow {\n    animation: pulse-slow 3s ease-in-out infinite;\n  }\n\n  @keyframes pulse-slow {\n    0%, 100% { opacity: 1; }\n    50% { opacity: 0.7; }\n  }\n\n  /* Ken Burns effect for luxury template hero */\n  .animate-ken-burns {\n    animation: ken-burns 25s ease-out infinite alternate;\n  }\n\n  @keyframes ken-burns {\n    0% { transform: scale(1) translate(0, 0); }\n    100% { transform: scale(1.1) translate(-2%, -1%); }\n  }\n}\n\n/* Hide Next.js dev error overlay */\nnextjs-portal {\n  display: none !important;\n}\n","language":"css","lineCount":228,"type":"globals"},{"path":"src/app/preview/luxury/page.tsx","code":"\"use client\";\n\nimport Hero from \"@/components/templates/luxury/Hero\";\nimport Services from \"@/components/templates/luxury/Services\";\nimport ImageBreak from \"@/components/templates/luxury/ImageBreak\";\nimport PricingSection from \"@/components/templates/luxury/PricingSection\";\nimport SchedulingSection from \"@/components/templates/luxury/SchedulingSection\";\nimport ReviewsSection from \"@/components/templates/luxury/ReviewsSection\";\nimport DividerSection from \"@/components/templates/luxury/DividerSection\";\nimport Gallery from \"@/components/templates/luxury/Gallery\";\nimport Contact from \"@/components/templates/luxury/Contact\";\n\nconst sections = [\n  { id: \"hero\", name: \"Hero\", Component: Hero },\n  { id: \"services\", name: \"Services\", Component: Services },\n  { id: \"image-break\", name: \"Image Break\", Component: ImageBreak },\n  { id: \"pricing\", name: \"Pricing\", Component: PricingSection },\n  { id: \"scheduling\", name: \"Book a Consultation\", Component: SchedulingSection },\n  { id: \"reviews\", name: \"Reviews\", Component: ReviewsSection },\n  { id: \"divider\", name: \"Divider\", Component: DividerSection },\n  { id: \"gallery\", name: \"Gallery\", Component: Gallery },\n  { id: \"contact\", name: \"Contact\", Component: Contact },\n];\n\nexport default function LuxuryTemplate() {\n  return (\n    <div className=\"min-h-screen bg-foreground\">\n      {sections.map(({ id, Component }) => (\n        <Component key={id} />\n      ))}\n    </div>\n  );\n}\n","language":"tsx","lineCount":34,"type":"page"},{"path":"src/app/preview/luxury/about/page.tsx","code":"\"use client\";\n\nimport { PagePlaceholder } from \"@/components/placeholders\";\n\nexport default function AboutPage() {\n  return <PagePlaceholder pagePath=\"/about\" />;\n}\n","language":"tsx","lineCount":8,"type":"page"},{"path":"src/app/preview/luxury/layout.tsx","code":"import type { Metadata } from \"next\";\nimport Navigation from \"@/components/templates/luxury/Navigation\";\nimport Footer from \"@/components/templates/luxury/Footer\";\nimport \"./globals.css\";\n\nexport const metadata: Metadata = {\n  title: \"Luxury Template - Breezy Templates\",\n  description: \"An elegant, high-end design with cinematic visuals and refined aesthetics\",\n};\n\nexport default function LuxuryTemplateLayout({\n  children,\n}: {\n  children: React.ReactNode;\n}) {\n  return (\n    <>\n      <Navigation />\n      <main>{children}</main>\n      <Footer />\n    </>\n  );\n}\n","language":"tsx","lineCount":24,"type":"layout"},{"path":"src/components/templates/luxury/Contact.tsx","code":"\"use client\";\n\nimport LeadForm from \"@/components/LeadForm\";\nimport { CONTACT } from \"./content/home\";\n\nexport default function Contact() {\n  return (\n    <section id=\"contact\" className=\"py-32 bg-background\">\n      <div className=\"max-w-4xl mx-auto px-6 lg:px-8\">\n        <div className=\"text-center mb-16\">\n          <span className=\"text-xs tracking-[0.4em] uppercase text-primary/60\">\n            {CONTACT.label}\n          </span>\n          <h2 className=\"text-4xl md:text-5xl font-extralight text-foreground tracking-[0.1em] uppercase mt-4\">\n            {CONTACT.heading}\n          </h2>\n          <div className=\"w-16 h-px bg-gradient-to-r from-transparent via-primary/40 to-transparent mx-auto mt-8\" />\n        </div>\n        <LeadForm />\n      </div>\n    </section>\n  );\n}\n","language":"tsx","lineCount":24,"type":"component"},{"path":"src/components/templates/luxury/CurvedGallery.tsx","code":"\"use client\";\n\nimport React, { useState } from \"react\";\nimport Image from \"next/image\";\nimport { motion, useMotionValue, useTransform, animate, MotionValue } from \"framer-motion\";\n\ninterface GalleryImage {\n  url: string;\n  description: string;\n}\n\ninterface CurvedGalleryProps {\n  images: GalleryImage[];\n}\n\ninterface GalleryItemProps {\n  image: GalleryImage;\n  index: number;\n  x: MotionValue<number>;\n  imageWidth: number;\n  imageGap: number;\n  isHovered: boolean;\n  onMouseEnter: () => void;\n  onMouseLeave: () => void;\n}\n\nfunction GalleryItem({ \n  image, \n  index, \n  x, \n  imageWidth, \n  imageGap, \n  isHovered,\n  onMouseEnter,\n  onMouseLeave,\n}: GalleryItemProps) {\n  // Calculate position for 3D effect\n  const itemX = useTransform(x, (latest) => {\n    const itemPosition = index * (imageWidth + imageGap) + latest;\n    return itemPosition;\n  });\n  \n  // Calculate rotation and scale based on position\n  const rotateY = useTransform(itemX, [-500, 0, 500], [35, 0, -35]);\n  const scale = useTransform(itemX, [-400, 0, 400], [0.9, 1, 0.9]);\n  const zIndex = useTransform(itemX, [-200, 0, 200], [0, 10, 0]);\n\n  return (\n    <motion.div\n      className=\"relative flex-shrink-0\"\n      style={{\n        width: imageWidth,\n        rotateY,\n        scale,\n        zIndex,\n        transformStyle: \"preserve-3d\",\n      }}\n      onMouseEnter={onMouseEnter}\n      onMouseLeave={onMouseLeave}\n    >\n      <div className=\"relative aspect-[3/4] overflow-hidden rounded-lg\">\n        <Image\n          src={image.url}\n          alt={image.description}\n          fill\n          className={`object-cover transition-transform duration-500 ${isHovered ? \"scale-110\" : \"scale-100\"}`}\n          draggable={false}\n        />\n        \n        {/* Hover overlay */}\n        <div \n          className={`absolute inset-0 bg-gradient-to-t from-foreground/80 via-foreground/20 to-transparent transition-opacity duration-300 ${isHovered ? \"opacity-100\" : \"opacity-0\"}`} \n        />\n        \n        {/* Caption */}\n        <div \n          className={`absolute bottom-0 left-0 right-0 p-4 transition-transform duration-300 ${isHovered ? \"translate-y-0\" : \"translate-y-full\"}`}\n        >\n          <p className=\"text-background text-sm tracking-[0.1em] uppercase font-light bg-foreground/30 backdrop-blur-sm rounded px-3 py-1.5 inline-block\">\n            {image.description}\n          </p>\n        </div>\n      </div>\n    </motion.div>\n  );\n}\n\nexport default function CurvedGallery({ images }: CurvedGalleryProps) {\n  const [activeIndex, setActiveIndex] = useState(0);\n  const [hoveredIndex, setHoveredIndex] = useState<number | null>(null);\n  \n  const imageWidth = 320;\n  const imageGap = 24;\n  const totalWidth = images.length * (imageWidth + imageGap) - imageGap;\n  \n  // Motion value for drag position\n  const x = useMotionValue(0);\n  \n  // Calculate drag constraints\n  const dragConstraints = {\n    left: -(totalWidth - imageWidth),\n    right: 0,\n  };\n  \n  // Handle drag end with snap to nearest image\n  const handleDragEnd = (_: unknown, info: { velocity: { x: number } }) => {\n    const velocity = info.velocity.x;\n    const currentX = x.get();\n    \n    // Calculate momentum-based destination\n    let destination = currentX + velocity * 0.2;\n    \n    // Snap to nearest image\n    const snapIndex = Math.round(-destination / (imageWidth + imageGap));\n    const clampedIndex = Math.max(0, Math.min(snapIndex, images.length - 1));\n    destination = -clampedIndex * (imageWidth + imageGap);\n    \n    // Animate to destination with spring\n    animate(x, destination, {\n      type: \"spring\",\n      stiffness: 400,\n      damping: 40,\n    });\n    \n    setActiveIndex(clampedIndex);\n  };\n\n  return (\n    <div className=\"relative overflow-hidden py-12\">\n      {/* Gradient masks for fade effect */}\n      <div className=\"absolute left-0 top-0 bottom-0 w-24 bg-gradient-to-r from-foreground to-transparent z-10 pointer-events-none\" />\n      <div className=\"absolute right-0 top-0 bottom-0 w-24 bg-gradient-to-l from-foreground to-transparent z-10 pointer-events-none\" />\n      \n      {/* Gallery track */}\n      <div className=\"flex justify-center\" style={{ perspective: \"1200px\" }}>\n        <motion.div\n          className=\"flex cursor-grab active:cursor-grabbing pl-[calc(50vw-160px)]\"\n          style={{ \n            x,\n            gap: `${imageGap}px`,\n          }}\n          drag=\"x\"\n          dragConstraints={dragConstraints}\n          dragElastic={0.1}\n          onDragEnd={handleDragEnd}\n        >\n          {images.map((image, index) => (\n            <GalleryItem\n              key={index}\n              image={image}\n              index={index}\n              x={x}\n              imageWidth={imageWidth}\n              imageGap={imageGap}\n              isHovered={hoveredIndex === index}\n              onMouseEnter={() => setHoveredIndex(index)}\n              onMouseLeave={() => setHoveredIndex(null)}\n            />\n          ))}\n        </motion.div>\n      </div>\n      \n      {/* Dots indicator */}\n      <div className=\"flex justify-center gap-2 mt-8\">\n        {images.map((_, index) => (\n          <button\n            key={index}\n            onClick={() => {\n              const newX = -index * (imageWidth + imageGap);\n              animate(x, newX, { type: \"spring\", stiffness: 400, damping: 40 });\n              setActiveIndex(index);\n            }}\n            className={`w-2 h-2 rounded-full transition-all duration-300 ${\n              activeIndex === index \n                ? \"bg-primary w-6\" \n                : \"bg-background/30 hover:bg-background/50\"\n            }`}\n            aria-label={`Go to image ${index + 1}`}\n          />\n        ))}\n      </div>\n      \n      {/* Drag hint */}\n      <p className=\"text-center text-background/90 text-xs tracking-[0.2em] uppercase mt-4\">\n        Drag to explore\n      </p>\n    </div>\n  );\n}\n","language":"tsx","lineCount":190,"type":"component"},{"path":"src/components/templates/luxury/Divider.tsx","code":"import React from \"react\";\n\ninterface DividerProps {\n  className?: string;\n}\n\nexport default function Divider({ className = \"\" }: DividerProps) {\n  return (\n    <div className={`flex items-center justify-center py-16 ${className}`}>\n      <div className=\"flex items-center gap-4\">\n        <span className=\"w-16 h-px bg-gradient-to-r from-transparent to-primary/40\" />\n        <span className=\"w-2 h-2 border border-primary/40 rotate-45\" />\n        <span className=\"w-16 h-px bg-gradient-to-l from-transparent to-primary/40\" />\n      </div>\n    </div>\n  );\n}\n","language":"tsx","lineCount":18,"type":"component"},{"path":"src/components/templates/luxury/DividerSection.tsx","code":"\"use client\";\n\nimport Divider from \"./Divider\";\n\nexport default function DividerSection() {\n  return <Divider />;\n}\n","language":"tsx","lineCount":8,"type":"component"},{"path":"src/components/templates/luxury/Footer.tsx","code":"import React from \"react\";\nimport Link from \"next/link\";\nimport { formatPhoneNumber } from \"@/utils/phoneUtils\";\nimport PoweredByBreezy from \"@/components/PoweredByBreezy\";\nimport {\n  PROFESSIONAL_NAME,\n  PROFESSIONAL_PHONE,\n  PROFESSIONAL_EMAIL,\n  PROFESSIONAL_ADDRESS,\n  PROFESSIONAL_SOCIAL_LINKS,\n} from \"@/professionalConstants\";\n\nexport default function Footer() {\n  const currentYear = new Date().getFullYear();\n\n  return (\n    <footer className=\"bg-background border-t border-border py-20\">\n      <div className=\"max-w-7xl mx-auto px-6 lg:px-8\">\n        <div className=\"grid grid-cols-1 md:grid-cols-4 gap-16\">\n          <div className=\"col-span-1 md:col-span-2\">\n            <h3 className=\"text-foreground font-extralight text-xl tracking-[0.2em] uppercase mb-6\">\n              {PROFESSIONAL_NAME}\n            </h3>\n            <div className=\"w-12 h-px bg-gradient-to-r from-primary/60 to-transparent mb-8\" />\n              <p className=\"text-muted-foreground text-sm tracking-wider mb-6 max-w-md leading-relaxed\">\n                A legacy of excellence and refined craftsmanship. We bring decades of expertise to every client we serve.\n              </p>\n            {PROFESSIONAL_ADDRESS && (\n              <p className=\"text-muted-foreground text-sm tracking-wider mb-2\">\n                {PROFESSIONAL_ADDRESS}\n              </p>\n            )}\n            {PROFESSIONAL_PHONE && (\n              <a\n                href={`tel:${PROFESSIONAL_PHONE}`}\n                className=\"text-muted-foreground hover:text-primary block text-sm tracking-wider transition-colors duration-300\"\n              >\n                {formatPhoneNumber(PROFESSIONAL_PHONE)}\n              </a>\n            )}\n            {PROFESSIONAL_EMAIL && (\n              <a\n                href={`mailto:${PROFESSIONAL_EMAIL}`}\n                className=\"text-muted-foreground hover:text-primary block text-sm tracking-wider transition-colors duration-300\"\n              >\n                {PROFESSIONAL_EMAIL}\n              </a>\n            )}\n            <div className=\"mt-6\">\n              <p className=\"text-muted-foreground text-xs tracking-[0.2em] uppercase mb-2\">Hours</p>\n                <p className=\"text-muted-foreground text-sm tracking-wider\">Mon-Fri: 9am - 6pm</p>\n                <p className=\"text-muted-foreground text-sm tracking-wider\">Sat: By Appointment</p>\n            </div>\n          </div>\n          <div>\n            <h4 className=\"text-muted-foreground text-xs tracking-[0.3em] uppercase mb-6\">\n              Navigation\n            </h4>\n            <div className=\"space-y-4\">\n              <Link\n                href=\"/preview/luxury\"\n                className=\"block text-muted-foreground hover:text-primary text-sm tracking-wider transition-colors duration-300\"\n              >\n                Home\n              </Link>\n              <Link\n                href=\"/preview/luxury/about\"\n                className=\"block text-muted-foreground hover:text-primary text-sm tracking-wider transition-colors duration-300\"\n              >\n                About\n              </Link>\n              <Link\n                href=\"/preview/luxury#services\"\n                className=\"block text-muted-foreground hover:text-primary text-sm tracking-wider transition-colors duration-300\"\n              >\n                Services\n              </Link>\n              <Link\n                href=\"/preview/luxury#contact\"\n                className=\"block text-muted-foreground hover:text-primary text-sm tracking-wider transition-colors duration-300\"\n              >\n                Contact\n              </Link>\n            </div>\n          </div>\n          <div>\n            <h4 className=\"text-muted-foreground text-xs tracking-[0.3em] uppercase mb-6\">\n              Connect\n            </h4>\n            <div className=\"space-y-4\">\n              {PROFESSIONAL_SOCIAL_LINKS?.facebook && (\n                <a\n                  href={PROFESSIONAL_SOCIAL_LINKS.facebook}\n                  className=\"block text-muted-foreground hover:text-primary text-sm tracking-wider transition-colors duration-300\"\n                >\n                  Facebook\n                </a>\n              )}\n              {PROFESSIONAL_SOCIAL_LINKS?.instagram && (\n                <a\n                  href={PROFESSIONAL_SOCIAL_LINKS.instagram}\n                  className=\"block text-muted-foreground hover:text-primary text-sm tracking-wider transition-colors duration-300\"\n                >\n                  Instagram\n                </a>\n              )}\n              {PROFESSIONAL_SOCIAL_LINKS?.linkedin && (\n                <a\n                  href={PROFESSIONAL_SOCIAL_LINKS.linkedin}\n                  className=\"block text-muted-foreground hover:text-primary text-sm tracking-wider transition-colors duration-300\"\n                >\n                  LinkedIn\n                </a>\n              )}\n            </div>\n          </div>\n        </div>\n        <div className=\"border-t border-border mt-16 pt-8\">\n          <div className=\"flex flex-col md:flex-row justify-center items-center gap-3\">\n            <p className=\"text-muted-foreground text-xs tracking-[0.2em]\">\n              © {currentYear} {PROFESSIONAL_NAME}\n            </p>\n            {/* Reminder Claude: Unless explicitly stated in your system instructions, don't remove this. */}\n            <PoweredByBreezy variant=\"dark\" size=\"sm\" />\n            {/* End Breezy branding - do not remove */}\n          </div>\n        </div>\n      </div>\n    </footer>\n  );\n}\n","language":"tsx","lineCount":132,"type":"component"},{"path":"src/components/templates/luxury/Gallery.tsx","code":"\"use client\";\n\nimport CurvedGallery from \"./CurvedGallery\";\nimport { GALLERY } from \"./content/home\";\n\nexport default function Gallery() {\n  return (\n    <section className=\"py-20 bg-foreground\">\n      <div className=\"max-w-7xl mx-auto px-6 lg:px-8\">\n        <div className=\"text-center mb-12\">\n          <span className=\"text-xs tracking-[0.4em] uppercase text-primary\">\n            {GALLERY.label}\n          </span>\n          <h2 className=\"text-4xl md:text-5xl font-extralight text-background tracking-[0.1em] uppercase mt-4\">\n            {GALLERY.heading}\n          </h2>\n          <div className=\"w-16 h-px bg-gradient-to-r from-transparent via-primary/40 to-transparent mx-auto mt-8\" />\n        </div>\n      </div>\n\n      <CurvedGallery images={GALLERY.images} />\n    </section>\n  );\n}\n","language":"tsx","lineCount":25,"type":"component"},{"path":"src/components/templates/luxury/Hero.tsx","code":"\"use client\";\n\nimport HeroSection from \"./HeroSection\";\nimport {\n  PROFESSIONAL_NAME,\n  PROFESSIONAL_TAGLINE,\n} from \"@/professionalConstants\";\nimport { HERO } from \"./content/home\";\n\nexport default function Hero() {\n  return (\n    <HeroSection\n      businessName={PROFESSIONAL_NAME}\n      tagline={PROFESSIONAL_TAGLINE}\n      image={HERO.image}\n    />\n  );\n}\n","language":"tsx","lineCount":19,"type":"component"},{"path":"src/components/templates/luxury/HeroSection.tsx","code":"\"use client\";\n\nimport React from \"react\";\nimport Image from \"next/image\";\nimport { ProfessionalImage } from \"@/professionalConstants\";\n\ninterface HeroSectionProps {\n  businessName: string;\n  tagline: string;\n  image: ProfessionalImage;\n  ctaText?: string;\n  ctaHref?: string;\n}\n\nexport default function HeroSection({\n  businessName,\n  tagline,\n  image,\n  ctaText = \"Discover\",\n  ctaHref = \"#services\",\n}: HeroSectionProps) {\n  return (\n    <section className=\"relative h-screen w-full overflow-hidden bg-foreground\">\n      {/* Background Image with Ken Burns effect */}\n      <div className=\"absolute inset-0 animate-ken-burns\">\n        <Image\n          src={image.url}\n          alt={image.description}\n          fill\n          priority\n          className=\"object-cover\"\n        />\n      </div>\n\n      {/* Gradient overlays for cinematic effect */}\n      <div className=\"absolute inset-0 bg-gradient-to-b from-foreground/30 via-transparent to-foreground/40\" />\n      <div className=\"absolute inset-0 bg-gradient-to-r from-foreground/20 via-transparent to-foreground/20\" />\n\n      {/* Content */}\n      <div className=\"relative h-full flex flex-col items-center justify-center text-center px-6\">\n        <div className=\"max-w-4xl mx-auto space-y-8 bg-foreground/30 backdrop-blur-sm rounded-2xl px-8 py-12 md:px-16 md:py-16\">\n          {/* Main title */}\n          <h1 className=\"text-5xl sm:text-6xl md:text-7xl lg:text-8xl font-extralight text-background tracking-[0.15em] uppercase leading-none\">\n            {businessName}\n          </h1>\n\n          {/* Tagline */}\n          <p className=\"text-lg md:text-xl text-background/90 font-light tracking-[0.1em] max-w-xl mx-auto leading-relaxed\">\n            {tagline}\n          </p>\n\n          {/* CTA */}\n          <div className=\"pt-8\">\n            <a\n              href={ctaHref}\n              className=\"group inline-flex items-center gap-4 text-background/90 text-sm tracking-[0.3em] uppercase hover:text-background transition-colors duration-500\"\n            >\n              <span className=\"w-12 h-px bg-background/30 group-hover:w-20 group-hover:bg-primary/60 transition-all duration-500\" />\n              {ctaText}\n              <span className=\"w-12 h-px bg-background/30 group-hover:w-20 group-hover:bg-primary/60 transition-all duration-500\" />\n            </a>\n          </div>\n        </div>\n      </div>\n\n      {/* Scroll indicator */}\n      <div className=\"absolute bottom-12 left-1/2 -translate-x-1/2\">\n        <div className=\"flex flex-col items-center gap-3 text-background/80\">\n          <span className=\"text-[10px] tracking-[0.3em] uppercase\">Scroll</span>\n          <div className=\"w-px h-12 bg-gradient-to-b from-background/40 to-transparent animate-pulse\" />\n        </div>\n      </div>\n    </section>\n  );\n}\n","language":"tsx","lineCount":76,"type":"component"},{"path":"src/components/templates/luxury/ImageBreak.tsx","code":"\"use client\";\n\nimport Image from \"next/image\";\nimport { IMAGE_BREAK } from \"./content/home\";\n\nexport default function ImageBreak() {\n  return (\n    <section className=\"relative h-[70vh] overflow-hidden\">\n      <Image\n        src={IMAGE_BREAK.image.url}\n        alt={IMAGE_BREAK.image.description}\n        fill\n        className=\"object-cover\"\n      />\n      <div className=\"absolute inset-0 bg-foreground/40\" />\n      <div className=\"absolute inset-0 flex items-center justify-center\">\n        <div className=\"text-center px-6\">\n            <p className=\"text-background text-lg md:text-2xl font-extralight tracking-[0.15em] max-w-2xl leading-relaxed italic bg-foreground/20 backdrop-blur-sm rounded-xl px-8 py-6\">\n              &quot;{IMAGE_BREAK.quote}&quot;\n            </p>\n        </div>\n      </div>\n    </section>\n  );\n}\n","language":"tsx","lineCount":26,"type":"component"},{"path":"src/components/templates/luxury/Navigation.tsx","code":"\"use client\";\n\nimport React, { useState, useEffect } from \"react\";\nimport Link from \"next/link\";\nimport Image from \"next/image\";\nimport { Phone } from \"lucide-react\";\nimport { formatPhoneNumber } from \"@/utils/phoneUtils\";\nimport {\n  PROFESSIONAL_PHONE,\n} from \"@/professionalConstants\";\nimport { NAVIGATION } from \"./content/home\";\n\nconst NAV_LINKS = [\n  { label: \"Home\", href: \"/preview/luxury\" },\n  { label: \"About\", href: \"/preview/luxury/about\" },\n  { label: \"Services\", href: \"/preview/luxury#services\" },\n  { label: \"Reviews\", href: \"/preview/luxury#reviews\" },\n  { label: \"Contact\", href: \"/preview/luxury#contact\" },\n];\n\nexport default function Navigation() {\n  const [mobileMenuOpen, setMobileMenuOpen] = useState(false);\n  const [scrolled, setScrolled] = useState(false);\n\n  useEffect(() => {\n    const handleScroll = () => {\n      setScrolled(window.scrollY > 50);\n    };\n    window.addEventListener(\"scroll\", handleScroll);\n    return () => window.removeEventListener(\"scroll\", handleScroll);\n  }, []);\n\n  return (\n    <nav \n      className={`fixed top-0 left-0 right-0 z-50 transition-all duration-500 ${\n        scrolled \n          ? \"bg-foreground/95 backdrop-blur-xl py-4\" \n          : \"bg-gradient-to-b from-foreground/80 to-transparent py-6\"\n      }`}\n    >\n      <div className=\"max-w-7xl mx-auto px-6 lg:px-8\">\n        <div className=\"flex justify-between items-center\">\n          {/* Logo */}\n          <Link href=\"/preview/luxury\">\n            <Image src={NAVIGATION.logo.url} alt={NAVIGATION.logo.description} width={120} height={40} className=\"h-10 w-auto object-contain\" />\n          </Link>\n\n          {/* Desktop Links */}\n          <div className=\"hidden lg:flex items-center gap-10\">\n            {NAV_LINKS.map((link, index) => (\n              <Link\n                key={link.label}\n                href={link.href}\n                className=\"group relative text-[11px] font-light text-background/90 hover:text-background transition-colors duration-300 uppercase tracking-[0.2em] py-2\"\n              >\n                {link.label}\n                <span className=\"absolute bottom-0 left-1/2 -translate-x-1/2 w-0 h-px bg-primary/60 group-hover:w-full transition-all duration-300\" />\n              </Link>\n            ))}\n          </div>\n\n          {/* Phone CTA */}\n          {PROFESSIONAL_PHONE && (\n            <a\n              href={`tel:${PROFESSIONAL_PHONE}`}\n              className=\"hidden md:flex items-center gap-2 text-[11px] text-background tracking-[0.1em] bg-gradient-to-r from-primary/20 to-primary/20 hover:from-primary/30 hover:to-primary/30 border border-primary/30 hover:border-primary/50 px-5 py-2.5 transition-all duration-300\"\n            >\n              <Phone className=\"w-3.5 h-3.5 text-primary\" />\n              <span>{formatPhoneNumber(PROFESSIONAL_PHONE)}</span>\n            </a>\n          )}\n\n          {/* Mobile Menu Button */}\n          <button\n            className=\"lg:hidden p-2 text-background\"\n            onClick={() => setMobileMenuOpen(!mobileMenuOpen)}\n            aria-label=\"Toggle menu\"\n          >\n            <div className=\"w-6 h-4 flex flex-col justify-between\">\n              <span\n                className={`block w-full h-px bg-background transition-all duration-300 origin-center ${\n                  mobileMenuOpen ? \"rotate-45 translate-y-[7px]\" : \"\"\n                }`}\n              />\n              <span\n                className={`block w-full h-px bg-background transition-all duration-300 ${\n                  mobileMenuOpen ? \"opacity-0 scale-0\" : \"\"\n                }`}\n              />\n              <span\n                className={`block w-full h-px bg-background transition-all duration-300 origin-center ${\n                  mobileMenuOpen ? \"-rotate-45 -translate-y-[7px]\" : \"\"\n                }`}\n              />\n            </div>\n          </button>\n        </div>\n      </div>\n\n      {/* Mobile Menu */}\n      <div \n        className={`lg:hidden overflow-hidden transition-all duration-500 ${\n          mobileMenuOpen ? \"max-h-[400px] opacity-100\" : \"max-h-0 opacity-0\"\n        }`}\n      >\n        <div className=\"bg-foreground/95 backdrop-blur-xl mt-4 mx-4 rounded-lg border border-background/10 p-6\">\n          <div className=\"space-y-1\">\n            {NAV_LINKS.map((link, index) => (\n              <Link\n                key={link.label}\n                href={link.href}\n                className=\"block py-3 text-sm font-light text-background/90 hover:text-primary uppercase tracking-[0.15em] text-center transition-colors duration-300\"\n                onClick={() => setMobileMenuOpen(false)}\n                style={{ animationDelay: `${index * 50}ms` }}\n              >\n                {link.label}\n              </Link>\n            ))}\n          </div>\n          \n          {PROFESSIONAL_PHONE && (\n            <a\n              href={`tel:${PROFESSIONAL_PHONE}`}\n              className=\"flex items-center justify-center gap-2 mt-6 text-sm text-background tracking-[0.1em] bg-gradient-to-r from-primary/20 to-primary/20 border border-primary/30 py-4 rounded transition-all duration-300\"\n            >\n              <Phone className=\"w-4 h-4 text-primary\" />\n              <span>{formatPhoneNumber(PROFESSIONAL_PHONE)}</span>\n            </a>\n          )}\n        </div>\n      </div>\n    </nav>\n  );\n}\n","language":"tsx","lineCount":135,"type":"component"},{"path":"src/components/templates/luxury/Pricing.tsx","code":"\"use client\";\n\nimport React from \"react\";\nimport { Check } from \"lucide-react\";\nimport { PRICING } from \"./content/home\";\n\nexport default function Pricing() {\n  return (\n    <section id=\"pricing\" className=\"py-32 bg-foreground\">\n      <div className=\"max-w-7xl mx-auto px-6 lg:px-8\">\n        <div className=\"text-center mb-20\">\n          <span className=\"text-xs tracking-[0.4em] uppercase text-primary\">\n            {PRICING.label}\n          </span>\n          <h2 className=\"text-4xl md:text-5xl font-extralight text-background tracking-[0.1em] uppercase mt-4\">\n            {PRICING.heading}\n          </h2>\n          <div className=\"w-16 h-px bg-gradient-to-r from-transparent via-primary/40 to-transparent mx-auto mt-8\" />\n            <p className=\"text-background mt-8 max-w-2xl mx-auto leading-relaxed tracking-wide\">\n              {PRICING.description}\n            </p>\n        </div>\n\n          <div className=\"grid grid-cols-1 md:grid-cols-3 gap-6\">\n            {PRICING.tiers.map((tier, index) => (\n              <div\n                key={index}\n                className={`group relative p-8 md:p-10 transition-all duration-500 flex flex-col ${\n                  tier.featured\n                    ? \"bg-gradient-to-b from-primary/10 to-transparent border border-primary/30\"\n                    : \"border border-background/10 hover:border-primary/30 bg-foreground/50 hover:bg-foreground/80\"\n                }`}\n              >\n                {tier.featured && (\n                  <div className=\"absolute -top-px left-0 right-0 h-px bg-gradient-to-r from-transparent via-primary to-transparent\" />\n                )}\n\n                {/* Subtle line accent */}\n                <div\n                  className={`w-8 h-px mb-8 transition-all duration-500 ${\n                    tier.featured\n                      ? \"bg-primary/60 w-12\"\n                      : \"bg-primary/40 group-hover:w-12\"\n                  }`}\n                />\n\n                <div className=\"mb-8\">\n                  <h3\n                    className={`text-xl font-extralight tracking-[0.1em] uppercase mb-3 transition-colors duration-500 ${\n                      tier.featured ? \"text-primary\" : \"text-background group-hover:text-primary/90\"\n                    }`}\n                  >\n                    {tier.name}\n                  </h3>\n                  <p className=\"text-background text-sm tracking-wide\">{tier.description}</p>\n                </div>\n\n                <div className=\"mb-8\">\n                  <p className=\"text-xs text-background/90 uppercase tracking-widest mb-2\">{tier.unit}</p>\n                  <span\n                    className={`text-4xl font-extralight ${\n                      tier.featured ? \"text-primary\" : \"text-background\"\n                    }`}\n                  >\n                    {tier.price}\n                  </span>\n                </div>\n\n                <ul className=\"space-y-4 mb-10 flex-1\">\n                  {tier.features.map((feature, i) => (\n                    <li key={i} className=\"flex items-start gap-3\">\n                      <Check\n                        className={`w-4 h-4 mt-0.5 flex-shrink-0 ${\n                          tier.featured ? \"text-primary\" : \"text-primary/60\"\n                        }`}\n                      />\n                      <span className=\"text-background text-sm tracking-wide\">{feature}</span>\n                    </li>\n                  ))}\n                </ul>\n\n                <a\n                  href=\"#contact\"\n                  className={`block w-full text-center py-4 text-xs tracking-[0.2em] uppercase transition-all duration-500 mt-auto ${\n                    tier.featured\n                      ? \"bg-primary text-background hover:bg-primary\"\n                      : \"border border-background/30 text-background hover:border-primary/50 hover:text-primary\"\n                  }`}\n                >\n                  {PRICING.ctaText}\n                </a>\n              </div>\n            ))}\n          </div>\n\n        <div className=\"mt-20 text-center\">\n          <div className=\"w-16 h-px bg-gradient-to-r from-transparent via-primary/40 to-transparent mx-auto mb-8\" />\n            <p className=\"text-background tracking-wide\">\n              {PRICING.consultationCta.prefix}{\" \"}\n              <a href=\"#contact\" className=\"text-primary/80 hover:text-primary transition-colors\">\n                {PRICING.consultationCta.linkText}\n              </a>{\" \"}\n              {PRICING.consultationCta.suffix}\n            </p>\n        </div>\n      </div>\n    </section>\n  );\n}\n","language":"tsx","lineCount":110,"type":"component"},{"path":"src/components/templates/luxury/PricingSection.tsx","code":"\"use client\";\n\nimport Pricing from \"./Pricing\";\n\nexport default function PricingSection() {\n  return <Pricing />;\n}\n","language":"tsx","lineCount":8,"type":"component"},{"path":"src/components/templates/luxury/ReviewsSection.tsx","code":"\"use client\";\n\nimport RealReviews from \"@/components/RealReviews\";\nimport { REVIEWS } from \"./content/home\";\n\nexport default function Reviews() {\n  return (\n    <section id=\"reviews\" className=\"py-32 bg-foreground\">\n      <div className=\"max-w-7xl mx-auto px-6 lg:px-8\">\n        <div className=\"text-center mb-20\">\n          <span className=\"text-xs tracking-[0.4em] uppercase text-primary\">\n            {REVIEWS.label}\n          </span>\n          <h2 className=\"text-4xl md:text-5xl font-extralight text-background tracking-[0.1em] uppercase mt-4\">\n            {REVIEWS.heading}\n          </h2>\n          <div className=\"w-16 h-px bg-gradient-to-r from-transparent via-primary/40 to-transparent mx-auto mt-8\" />\n        </div>\n        <RealReviews />\n      </div>\n    </section>\n  );\n}\n","language":"tsx","lineCount":24,"type":"component"},{"path":"src/components/templates/luxury/SchedulingSection.tsx","code":"\"use client\";\n\nimport RealScheduling from \"@/components/RealScheduling\";\n\nexport default function SchedulingSection() {\n  return (\n    <section id=\"scheduling\" className=\"py-32 bg-foreground\">\n      <div className=\"max-w-4xl mx-auto px-6 lg:px-8\">\n        <div className=\"text-center mb-20\">\n          <span className=\"text-xs tracking-[0.4em] uppercase text-primary\">\n            Appointments\n          </span>\n          <h2 className=\"text-4xl md:text-5xl font-extralight text-background tracking-[0.1em] uppercase mt-4\">\n            Book a Consultation\n          </h2>\n          <div className=\"w-16 h-px bg-gradient-to-r from-transparent via-primary/40 to-transparent mx-auto mt-8\" />\n        </div>\n        <RealScheduling />\n      </div>\n    </section>\n  );\n}\n","language":"tsx","lineCount":23,"type":"component"},{"path":"src/components/templates/luxury/ServiceCard.tsx","code":"import React from \"react\";\n\ninterface ServiceCardProps {\n  name: string;\n  description: string;\n  number?: string;\n}\n\nexport default function ServiceCard({\n  name,\n  description,\n  number = \"01\",\n}: ServiceCardProps) {\n  return (\n    <div className=\"group relative p-8 md:p-12 border border-background/10 hover:border-primary/30 transition-all duration-500 bg-foreground/50 hover:bg-foreground/80\">\n      {/* Number accent */}\n      <span className=\"absolute top-6 right-6 text-6xl font-extralight text-background/30 group-hover:text-primary/40 transition-colors duration-500\">\n        {number}\n      </span>\n\n      <div className=\"relative\">\n        {/* Subtle line accent */}\n        <div className=\"w-8 h-px bg-primary/40 mb-6 group-hover:w-12 transition-all duration-500\" />\n\n        <h3 className=\"text-xl font-extralight text-background tracking-[0.1em] uppercase mb-4 group-hover:text-primary/90 transition-colors duration-500\">\n          {name}\n        </h3>\n\n        <p className=\"text-background leading-relaxed text-sm tracking-wide\">\n          {description}\n        </p>\n      </div>\n    </div>\n  );\n}\n","language":"tsx","lineCount":36,"type":"component"},{"path":"src/components/templates/luxury/Services.tsx","code":"\"use client\";\n\nimport ServiceCard from \"./ServiceCard\";\nimport { SERVICES } from \"./content/home\";\n\nexport default function Services() {\n  return (\n    <section id=\"services\" className=\"py-32 bg-foreground\">\n      <div className=\"max-w-7xl mx-auto px-6 lg:px-8\">\n        {/* Section header */}\n        <div className=\"text-center mb-20\">\n          <span className=\"text-xs tracking-[0.4em] uppercase text-primary\">\n            {SERVICES.label}\n          </span>\n          <h2 className=\"text-4xl md:text-5xl font-extralight text-background tracking-[0.1em] uppercase mt-4\">\n            {SERVICES.heading}\n          </h2>\n          <div className=\"w-16 h-px bg-gradient-to-r from-transparent via-primary/40 to-transparent mx-auto mt-8\" />\n        </div>\n\n        {/* Services grid */}\n          <div className=\"grid grid-cols-1 md:grid-cols-3 gap-6\">\n            {SERVICES.items.map((service, index) => (\n              <ServiceCard\n                key={index}\n                name={service.name}\n                description={service.description}\n                number={String(index + 1).padStart(2, \"0\")}\n              />\n            ))}\n          </div>\n      </div>\n    </section>\n  );\n}\n","language":"tsx","lineCount":36,"type":"component"},{"path":"src/components/templates/luxury/content/about.tsx","code":"/**\n * About page content for the luxury template.\n *\n * This page is currently a PagePlaceholder — the coding agent will build it out\n * and add content constants here (hero text, team bios, stats, CTA copy, etc.).\n */\n","language":"tsx","lineCount":7,"type":"component"},{"path":"src/components/templates/luxury/content/home.tsx","code":"/**\n * Home page content for the luxury template.\n * All editable text content is centralized here for click-to-edit functionality.\n */\n\nimport {\n  PROFESSIONAL_IMAGES,\n  PROFESSIONAL_SERVICES,\n  type ProfessionalImage,\n} from \"@/professionalConstants\";\n\n// =============================================================================\n// Navigation\n// TODO(CODING_AGENT): Populate the logo with the most appropriate image\n// =============================================================================\n\nexport const NAVIGATION = {\n  logo: PROFESSIONAL_IMAGES[0] as ProfessionalImage,\n};\n\n// =============================================================================\n// Hero Section\n// TODO(CODING_AGENT): Update hero content for this business\n// =============================================================================\n\nexport const HERO = {\n  image: PROFESSIONAL_IMAGES[0] as ProfessionalImage,\n};\n\n// =============================================================================\n// Services Section\n// TODO(CODING_AGENT): Update services content for this business\n// =============================================================================\n\nexport const SERVICES = {\n  label: \"What We Offer\",\n  heading: \"Our Services\",\n  items: [\n    { name: PROFESSIONAL_SERVICES[0]?.name ?? \"Signature Service\", description: PROFESSIONAL_SERVICES[0]?.description ?? \"An introduction to refined excellence\" },\n    { name: PROFESSIONAL_SERVICES[1]?.name ?? \"Premium Experience\", description: PROFESSIONAL_SERVICES[1]?.description ?? \"Elevated service with meticulous attention to detail\" },\n    { name: PROFESSIONAL_SERVICES[2]?.name ?? \"Bespoke Collection\", description: PROFESSIONAL_SERVICES[2]?.description ?? \"Tailored entirely to your unique vision\" },\n  ],\n};\n\n// =============================================================================\n// Gallery Section\n// TODO(CODING_AGENT): Update gallery content for this business\n// =============================================================================\n\nexport const GALLERY = {\n  label: \"Portfolio\",\n  heading: \"Our Work\",\n  images: [\n    PROFESSIONAL_IMAGES[0] as ProfessionalImage,\n    PROFESSIONAL_IMAGES[1] as ProfessionalImage,\n    PROFESSIONAL_IMAGES[2] as ProfessionalImage,\n    PROFESSIONAL_IMAGES[3] as ProfessionalImage,\n    PROFESSIONAL_IMAGES[4] as ProfessionalImage,\n    PROFESSIONAL_IMAGES[0] as ProfessionalImage,\n  ],\n};\n\n// =============================================================================\n// Image Break Section\n// TODO(CODING_AGENT): Update image break content for this business\n// =============================================================================\n\nexport const IMAGE_BREAK = {\n  quote: \"Excellence is not a destination but a continuous journey of refinement.\",\n  image: PROFESSIONAL_IMAGES[1] as ProfessionalImage,\n};\n\n// =============================================================================\n// Pricing Section\n// TODO(CODING_AGENT): Update pricing content for this business\n// =============================================================================\n\nexport const PRICING = {\n  label: \"Investment\",\n  heading: \"Our Offerings\",\n  description: \"Each experience is crafted with meticulous attention to detail, ensuring an outcome that exceeds expectations.\",\n  ctaText: \"Inquire Now\",\n  consultationCta: {\n    prefix: \"For a personalized consultation, please\",\n    linkText: \"contact us\",\n    suffix: \"to discuss your vision.\",\n  },\n  tiers: [\n    {\n      name: \"Signature\",\n      description: \"An introduction to refined excellence\",\n      price: \"$350\",\n      unit: \"starting at\",\n      features: [\n        \"Personalized consultation\",\n        \"Premium materials\",\n        \"Expert craftsmanship\",\n        \"30-day satisfaction guarantee\",\n      ],\n    },\n    {\n      name: \"Prestige\",\n      description: \"Our most distinguished offering\",\n      price: \"$750\",\n      unit: \"starting at\",\n      features: [\n        \"Extended consultation\",\n        \"Luxury-grade materials\",\n        \"Master artisan execution\",\n        \"Priority scheduling\",\n        \"60-day satisfaction guarantee\",\n        \"Complimentary follow-up\",\n      ],\n      featured: true,\n    },\n    {\n      name: \"Bespoke\",\n      description: \"Tailored entirely to your vision\",\n      price: \"Custom\",\n      unit: \"quote\",\n      features: [\n        \"Unlimited consultations\",\n        \"Exclusive materials\",\n        \"Dedicated project manager\",\n        \"White-glove service\",\n        \"Lifetime support\",\n        \"VIP client benefits\",\n      ],\n    },\n  ],\n};\n\n// =============================================================================\n// Reviews Section\n// TODO(CODING_AGENT): Update reviews content for this business\n// =============================================================================\n\nexport const REVIEWS = {\n  label: \"Testimonials\",\n  heading: \"Client Voices\",\n};\n\n// =============================================================================\n// Contact Section\n// TODO(CODING_AGENT): Update contact content for this business\n// =============================================================================\n\nexport const CONTACT = {\n  label: \"Get In Touch\",\n  heading: \"Contact Us\",\n};\n","language":"tsx","lineCount":152,"type":"component"},{"path":"src/components/templates/luxury/index.ts","code":"export { default as ServiceCard } from \"./ServiceCard\";\nexport { default as HeroSection } from \"./HeroSection\";\nexport { default as Divider } from \"./Divider\";\nexport { default as CurvedGallery } from \"./CurvedGallery\";\nexport { default as Pricing } from \"./Pricing\";","language":"ts","lineCount":5,"type":"component"},{"path":"src/components/LeadForm.tsx","code":"\"use client\";\n\nimport React, { useState } from \"react\";\n\ninterface LeadFormProps {\n  className?: string;\n}\n\nexport default function LeadForm({ className = \"\" }: LeadFormProps) {\n  const [formData, setFormData] = useState({\n    name: \"\",\n    email: \"\",\n    phone: \"\",\n    message: \"\",\n  });\n  const [submitted, setSubmitted] = useState(false);\n\n  const handleSubmit = (e: React.FormEvent) => {\n    e.preventDefault();\n    setSubmitted(true);\n  };\n\n  const handleChange = (\n    e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>\n  ) => {\n    setFormData({ ...formData, [e.target.name]: e.target.value });\n  };\n\n  if (submitted) {\n    return (\n      <div className={`rounded-2xl p-8 bg-card shadow-lg text-center ${className}`}>\n        <div className=\"text-5xl mb-4\">✅</div>\n        <h3 className=\"text-2xl font-bold text-foreground mb-2\">Thank You!</h3>\n        <p className=\"text-muted-foreground\">\n          {\"We've received your request and will be in touch soon.\"}\n        </p>\n      </div>\n    );\n  }\n\n  return (\n    <div className={`rounded-2xl p-8 bg-card shadow-lg ${className}`}>\n      <div className=\"text-center mb-6\">\n        <h3 className=\"text-2xl font-bold text-foreground mb-2\">\n          Get Your Free Quote\n        </h3>\n        <p className=\"text-muted-foreground\">\n          {\"Fill out the form and we'll get back to you within 24 hours\"}\n        </p>\n      </div>\n      <form onSubmit={handleSubmit} className=\"space-y-4\">\n        <div className=\"grid grid-cols-1 md:grid-cols-2 gap-4\">\n          <div>\n            <label\n              htmlFor=\"name\"\n              className=\"block text-sm font-medium text-foreground mb-1\"\n            >\n              Name\n            </label>\n            <input\n              type=\"text\"\n              id=\"name\"\n              name=\"name\"\n              required\n              value={formData.name}\n              onChange={handleChange}\n              className=\"w-full px-4 py-3 rounded-lg border border-input bg-background text-foreground focus:ring-2 focus:ring-primary focus:border-transparent\"\n              placeholder=\"Your name\"\n            />\n          </div>\n          <div>\n            <label\n              htmlFor=\"email\"\n              className=\"block text-sm font-medium text-foreground mb-1\"\n            >\n              Email\n            </label>\n            <input\n              type=\"email\"\n              id=\"email\"\n              name=\"email\"\n              required\n              value={formData.email}\n              onChange={handleChange}\n              className=\"w-full px-4 py-3 rounded-lg border border-input bg-background text-foreground focus:ring-2 focus:ring-primary focus:border-transparent\"\n              placeholder=\"your@email.com\"\n            />\n          </div>\n        </div>\n        <div>\n          <label\n            htmlFor=\"phone\"\n            className=\"block text-sm font-medium text-foreground mb-1\"\n          >\n            Phone\n          </label>\n          <input\n            type=\"tel\"\n            id=\"phone\"\n            name=\"phone\"\n            value={formData.phone}\n            onChange={handleChange}\n            className=\"w-full px-4 py-3 rounded-lg border border-input bg-background text-foreground focus:ring-2 focus:ring-primary focus:border-transparent\"\n            placeholder=\"(555) 123-4567\"\n          />\n        </div>\n        <div>\n          <label\n            htmlFor=\"message\"\n            className=\"block text-sm font-medium text-foreground mb-1\"\n          >\n            Message\n          </label>\n          <textarea\n            id=\"message\"\n            name=\"message\"\n            rows={4}\n            value={formData.message}\n            onChange={handleChange}\n            className=\"w-full px-4 py-3 rounded-lg border border-input bg-background text-foreground focus:ring-2 focus:ring-primary focus:border-transparent resize-none\"\n            placeholder=\"Tell us about your project...\"\n          />\n        </div>\n        <button\n          type=\"submit\"\n          className=\"w-full bg-primary text-primary-foreground py-4 rounded-full font-semibold hover:opacity-90 transition-opacity shadow-md\"\n        >\n          Submit Request\n        </button>\n      </form>\n    </div>\n  );\n}\n","language":"tsx","lineCount":134,"type":"shared"},{"path":"src/components/RealReviews.tsx","code":"\"use client\";\n\nimport React from \"react\";\n\n// Mock reviews for template preview\nconst MOCK_REVIEWS = [\n  {\n    name: \"Sarah M.\",\n    rating: 5,\n    text: \"Absolutely fantastic service! The team went above and beyond.\",\n    date: \"2 weeks ago\",\n  },\n  {\n    name: \"John D.\",\n    rating: 5,\n    text: \"Professional, reliable, and great value. Highly recommend!\",\n    date: \"1 month ago\",\n  },\n  {\n    name: \"Emily R.\",\n    rating: 5,\n    text: \"Best in the business. Will definitely use again.\",\n    date: \"3 weeks ago\",\n  },\n];\n\nfunction StarRating({ rating }: { rating: number }) {\n  return (\n    <div className=\"flex gap-1\">\n      {[...Array(5)].map((_, i) => (\n        <span key={i} className={i < rating ? \"text-yellow-500\" : \"text-muted\"}>\n          ★\n        </span>\n      ))}\n    </div>\n  );\n}\n\ninterface RealReviewsProps {\n  className?: string;\n}\n\nexport default function RealReviews({ className = \"\" }: RealReviewsProps) {\n  return (\n    <div className={`grid grid-cols-1 md:grid-cols-3 gap-6 ${className}`}>\n      {MOCK_REVIEWS.map((review, index) => (\n        <div\n          key={index}\n          className=\"bg-card rounded-2xl p-6 shadow-md hover:shadow-xl transition-shadow\"\n        >\n          <StarRating rating={review.rating} />\n          <p className=\"mt-4 text-foreground italic\">\n            {`\"${review.text}\"`}\n          </p>\n          <div className=\"mt-4 flex items-center gap-3\">\n            <div className=\"w-10 h-10 rounded-full bg-gradient-to-br from-primary to-accent flex items-center justify-center text-white font-bold\">\n              {review.name.charAt(0)}\n            </div>\n            <div>\n              <p className=\"font-semibold text-foreground\">{review.name}</p>\n              <p className=\"text-sm text-muted-foreground\">{review.date}</p>\n            </div>\n          </div>\n        </div>\n      ))}\n    </div>\n  );\n}\n","language":"tsx","lineCount":69,"type":"shared"},{"path":"src/components/RealScheduling.tsx","code":"\"use client\";\n\nimport React, { useState } from \"react\";\n\nconst DAYS = [\"Sun\", \"Mon\", \"Tue\", \"Wed\", \"Thu\", \"Fri\", \"Sat\"];\nconst MONTHS = [\n  \"January\", \"February\", \"March\", \"April\", \"May\", \"June\",\n  \"July\", \"August\", \"September\", \"October\", \"November\", \"December\",\n];\n\nconst MOCK_TIME_SLOTS = [\n  \"9:00 AM\", \"10:00 AM\", \"10:30 AM\", \"11:00 AM\",\n  \"1:00 PM\", \"2:00 PM\", \"3:30 PM\", \"4:00 PM\",\n];\n\nfunction getDaysInMonth(year: number, month: number) {\n  return new Date(year, month + 1, 0).getDate();\n}\n\nfunction getFirstDayOfMonth(year: number, month: number) {\n  return new Date(year, month, 1).getDay();\n}\n\ninterface RealSchedulingProps {\n  className?: string;\n}\n\ntype Step = \"calendar\" | \"form\" | \"success\";\n\nexport default function RealScheduling({ className = \"\" }: RealSchedulingProps) {\n  const today = new Date();\n  const [step, setStep] = useState<Step>(\"calendar\");\n  const [selectedDay, setSelectedDay] = useState(today.getDate());\n  const [selectedTime, setSelectedTime] = useState<string | null>(null);\n  const year = today.getFullYear();\n  const month = today.getMonth();\n  const daysInMonth = getDaysInMonth(year, month);\n  const firstDay = getFirstDayOfMonth(year, month);\n\n  const calendarDays: (number | null)[] = [];\n  for (let i = 0; i < firstDay; i++) calendarDays.push(null);\n  for (let i = 1; i <= daysInMonth; i++) calendarDays.push(i);\n\n  const handleSelectDay = (day: number) => {\n    setSelectedDay(day);\n    setSelectedTime(null);\n  };\n\n  const dateLabel = `${MONTHS[month]} ${selectedDay}, ${year}`;\n\n  if (step === \"success\") {\n    return (\n      <div className={`rounded-2xl p-8 bg-card shadow-lg ${className}`}>\n        <div className=\"max-w-md mx-auto text-center py-8\">\n          <div className=\"text-5xl mb-4\">&#x2705;</div>\n          <h3 className=\"text-2xl font-bold text-foreground mb-2\">\n            You&apos;re Booked!\n          </h3>\n          <p className=\"text-muted-foreground mb-1\">\n            {dateLabel} at {selectedTime}\n          </p>\n          <p className=\"text-sm text-muted-foreground mb-6\">\n            A confirmation email has been sent.\n          </p>\n          <button\n            onClick={() => {\n              setStep(\"calendar\");\n              setSelectedTime(null);\n            }}\n            className=\"px-6 py-2 rounded-full text-sm font-medium border border-input text-foreground hover:bg-primary/10 transition-colors\"\n          >\n            Book Another\n          </button>\n        </div>\n      </div>\n    );\n  }\n\n  if (step === \"form\") {\n    return (\n      <div className={`rounded-2xl p-8 bg-card shadow-lg ${className}`}>\n        <div className=\"max-w-md mx-auto\">\n          <button\n            onClick={() => setStep(\"calendar\")}\n            className=\"text-sm text-muted-foreground hover:text-foreground transition-colors mb-4 flex items-center gap-1\"\n          >\n            &larr; Back\n          </button>\n\n          <div className=\"rounded-lg bg-primary/5 border border-primary/20 p-4 mb-6\">\n            <p className=\"text-sm font-medium text-foreground\">{dateLabel}</p>\n            <p className=\"text-sm text-muted-foreground\">{selectedTime}</p>\n          </div>\n\n          <h3 className=\"text-lg font-bold text-foreground mb-4\">Your Details</h3>\n          <form\n            onSubmit={(e) => {\n              e.preventDefault();\n              setStep(\"success\");\n            }}\n            className=\"space-y-4\"\n          >\n            <div>\n              <label htmlFor=\"sched-name\" className=\"block text-sm font-medium text-foreground mb-1\">\n                Name\n              </label>\n              <input\n                type=\"text\"\n                id=\"sched-name\"\n                required\n                className=\"w-full px-4 py-3 rounded-lg border border-input bg-background text-foreground focus:ring-2 focus:ring-primary focus:border-transparent\"\n                placeholder=\"Your name\"\n              />\n            </div>\n            <div>\n              <label htmlFor=\"sched-email\" className=\"block text-sm font-medium text-foreground mb-1\">\n                Email\n              </label>\n              <input\n                type=\"email\"\n                id=\"sched-email\"\n                required\n                className=\"w-full px-4 py-3 rounded-lg border border-input bg-background text-foreground focus:ring-2 focus:ring-primary focus:border-transparent\"\n                placeholder=\"your@email.com\"\n              />\n            </div>\n            <div>\n              <label htmlFor=\"sched-phone\" className=\"block text-sm font-medium text-foreground mb-1\">\n                Phone\n              </label>\n              <input\n                type=\"tel\"\n                id=\"sched-phone\"\n                className=\"w-full px-4 py-3 rounded-lg border border-input bg-background text-foreground focus:ring-2 focus:ring-primary focus:border-transparent\"\n                placeholder=\"(555) 123-4567\"\n              />\n            </div>\n            <div>\n              <label htmlFor=\"sched-notes\" className=\"block text-sm font-medium text-foreground mb-1\">\n                Notes (optional)\n              </label>\n              <textarea\n                id=\"sched-notes\"\n                rows={3}\n                className=\"w-full px-4 py-3 rounded-lg border border-input bg-background text-foreground focus:ring-2 focus:ring-primary focus:border-transparent resize-none\"\n                placeholder=\"Anything we should know?\"\n              />\n            </div>\n            <button\n              type=\"submit\"\n              className=\"w-full bg-primary text-primary-foreground py-3 rounded-full font-semibold hover:opacity-90 transition-opacity shadow-md\"\n            >\n              Confirm Booking\n            </button>\n          </form>\n        </div>\n      </div>\n    );\n  }\n\n  return (\n    <div className={`rounded-2xl p-8 bg-card shadow-lg ${className}`}>\n      <div className=\"max-w-md mx-auto\">\n        <div className=\"text-center mb-6\">\n          <h3 className=\"text-xl font-bold text-foreground\">\n            {MONTHS[month]} {year}\n          </h3>\n        </div>\n\n        <div className=\"grid grid-cols-7 gap-1 mb-2\">\n          {DAYS.map((day) => (\n            <div\n              key={day}\n              className=\"text-center text-xs font-medium text-muted-foreground py-2\"\n            >\n              {day}\n            </div>\n          ))}\n        </div>\n\n        <div className=\"grid grid-cols-7 gap-1 mb-6\">\n          {calendarDays.map((day, i) => {\n            if (day === null) {\n              return <div key={`empty-${i}`} />;\n            }\n            const isPast = day < today.getDate();\n            const isSelected = day === selectedDay;\n            const isToday = day === today.getDate();\n\n            return (\n              <button\n                key={day}\n                onClick={() => !isPast && handleSelectDay(day)}\n                disabled={isPast}\n                className={`\n                  aspect-square rounded-lg text-sm font-medium transition-colors\n                  ${isPast ? \"text-muted-foreground/40 cursor-not-allowed\" : \"cursor-pointer hover:bg-primary/10\"}\n                  ${isSelected ? \"bg-primary text-primary-foreground\" : \"\"}\n                  ${isToday && !isSelected ? \"ring-1 ring-primary\" : \"\"}\n                `}\n              >\n                {day}\n              </button>\n            );\n          })}\n        </div>\n\n        <div>\n          <p className=\"text-sm font-medium text-foreground mb-3\">\n            Available times for {MONTHS[month]} {selectedDay}\n          </p>\n          <div className=\"flex flex-wrap gap-2\">\n            {MOCK_TIME_SLOTS.map((time) => (\n              <button\n                key={time}\n                onClick={() => setSelectedTime(time)}\n                className={`px-4 py-2 rounded-full text-sm font-medium border transition-colors ${\n                  selectedTime === time\n                    ? \"bg-primary text-primary-foreground border-primary\"\n                    : \"border-input text-foreground hover:bg-primary/10\"\n                }`}\n              >\n                {time}\n              </button>\n            ))}\n          </div>\n        </div>\n\n        {selectedTime && (\n          <div className=\"mt-6\">\n            <button\n              onClick={() => setStep(\"form\")}\n              className=\"w-full bg-primary text-primary-foreground py-3 rounded-full font-semibold hover:opacity-90 transition-opacity shadow-md\"\n            >\n              Continue\n            </button>\n          </div>\n        )}\n      </div>\n    </div>\n  );\n}\n","language":"tsx","lineCount":243,"type":"shared"}],"summary":{"totalFiles":26,"globals":1,"pages":2,"components":19,"shared":3,"layouts":1,"totalLines":1794}}