{
  "design": {
    "id": "voltage",
    "name": "Voltage",
    "niche": "Digital marketing agency",
    "vibe": "Kinetic, confident, electric",
    "tailwindVersion": "4.3.3",
    "fonts": {
      "heading": "Space Grotesk",
      "body": "DM Sans",
      "label": "IBM Plex Mono"
    },
    "colors": {
      "background": "#111310",
      "foreground": "#f4f5ed",
      "primary": "#d7ff3f",
      "primary-foreground": "#171c08",
      "card": "#1b1e17",
      "card-foreground": "#f4f5ed",
      "muted": "#25291f",
      "muted-foreground": "#b0b6a5",
      "border": "#3b4132",
      "accent": "#d8c3ff",
      "accent-foreground": "#201933",
      "secondary": "#25291f",
      "secondary-foreground": "#f4f5ed",
      "popover": "#1b1e17",
      "popover-foreground": "#f4f5ed",
      "destructive": "#b42318",
      "input": "#3b4132",
      "ring": "#d7ff3f"
    },
    "typography": {
      "hero": "clamp(4rem,7.8vw,7.4rem)",
      "heroMobile": "clamp(3rem,12.5vw,5.5rem)",
      "headingTracking": "-.065em",
      "headingLineHeight": ".98",
      "headingWeight": "500",
      "bodySize": "1rem",
      "bodyLineHeight": "1.65"
    },
    "spacing": {
      "unit": ".25rem",
      "contentWidth": "1280px",
      "gutter": "clamp(1.25rem,4vw,4rem)",
      "section": "6.5rem",
      "layoutGap": "2rem"
    },
    "radii": {
      "base": "999px"
    },
    "shadows": {
      "card": "0 12px 36px #00000014"
    },
    "motifs": [
      "Acid-lime field",
      "Thin orbital rings",
      "Oversized index numbers",
      "Lavender secondary accent"
    ],
    "motion": {
      "character": "Slow orbital rotation; crisp button lift",
      "fast": "180ms",
      "respectReducedMotion": true,
      "pauseControl": true
    },
    "layoutGuidance": "Large asymmetric type, generous dark negative space, compact numbered service rows. Avoid conventional centered SaaS cards. Additional section references: Asymmetric campaign gallery with typographic artwork; Three-stage creative sprint timeline; Before-and-after messaging study. Footer: Lime contact billboard with oversized wordmark and compact studio navigation. Choose the sections relevant to the new brief rather than repeating this sequence.",
    "reusePolicy": "Transfer typography, spacing rhythm, semantic colors, component treatments, imagery direction and motion principles. Compose a new layout for the user’s content; do not copy this page structure or fictional copy.",
    "shadcnMapping": {
      "btn": "Button",
      "card": "Card",
      "faq": "Accordion",
      "contact-dialog": "Dialog + Form + Input + Textarea",
      "mobile-nav": "Sheet",
      "badge": "Badge"
    },
    "demo": {
      "fictionalBrand": true,
      "backend": false
    },
    "revision": 2,
    "sectionIdeas": [
      "Asymmetric campaign gallery with typographic artwork",
      "Three-stage creative sprint timeline",
      "Before-and-after messaging study"
    ],
    "footerDesign": "Lime contact billboard with oversized wordmark and compact studio navigation",
    "sortOrder": 1
  },
  "themeTokensCSS": ":root {\n  --background: #111310;\n  --foreground: #f4f5ed;\n  --primary: #d7ff3f;\n  --primary-foreground: #171c08;\n  --card: #1b1e17;\n  --card-foreground: #f4f5ed;\n  --muted: #25291f;\n  --muted-foreground: #b0b6a5;\n  --border: #3b4132;\n  --accent: #d8c3ff;\n  --accent-foreground: #201933;\n  --secondary: #25291f;\n  --secondary-foreground: #f4f5ed;\n  --popover: #1b1e17;\n  --popover-foreground: #f4f5ed;\n  --destructive: #b42318;\n  --input: #3b4132;\n  --ring: #d7ff3f;\n  --font-heading: 'Space Grotesk', sans-serif;\n  --font-body: 'DM Sans', sans-serif; --font-label: 'IBM Plex Mono', monospace;\n  --radius:999px; --shadow:0 12px 36px #00000014; --hero-size:clamp(4rem,7.8vw,7.4rem); --hero-mobile:clamp(3rem,12.5vw,5.5rem);\n  --heading-tracking:-.065em; --heading-line:.98; --heading-weight:500;\n  --content-width:1280px; --gutter:clamp(1.25rem,4vw,4rem); --section-space:6.5rem; --layout-gap:2rem; --motion-fast:180ms;\n}",
  "tailwindThemeCSS": "@theme inline {\n  --color-background:var(--background);\n  --color-foreground:var(--foreground);\n  --color-primary:var(--primary);\n  --color-primary-foreground:var(--primary-foreground);\n  --color-card:var(--card);\n  --color-card-foreground:var(--card-foreground);\n  --color-muted:var(--muted);\n  --color-muted-foreground:var(--muted-foreground);\n  --color-border:var(--border);\n  --color-accent:var(--accent);\n  --color-accent-foreground:var(--accent-foreground);\n  --color-secondary:var(--secondary);\n  --color-secondary-foreground:var(--secondary-foreground);\n  --color-popover:var(--popover);\n  --color-popover-foreground:var(--popover-foreground);\n  --color-destructive:var(--destructive);\n  --color-input:var(--input);\n  --color-ring:var(--ring);\n  --font-sans:var(--font-body); --font-display:var(--font-heading); --font-mono:var(--font-label);\n  --radius-sm:calc(var(--radius)*.5); --radius-md:var(--radius); --radius-lg:calc(var(--radius)*1.5);\n  --spacing-gutter:var(--gutter); --spacing-section:var(--section-space); --container-content:var(--content-width);\n}",
  "componentAndMotifCSS": "\n*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:2rem}body{margin:0;background:var(--background);color:var(--foreground);font-family:var(--font-body);font-size:1rem;line-height:1.65}button,input,textarea,select{font:inherit}button,a,summary{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a{color:inherit;text-decoration:none}button{color:inherit}img{display:block;max-width:100%;object-fit:cover}@layer base{h1,h2,h3,p{margin:0}p{max-width:65ch}}h1,h2,h3{font-family:var(--font-heading);font-weight:var(--heading-weight);text-wrap:balance}h1{font-size:var(--hero-size);line-height:var(--heading-line);letter-spacing:var(--heading-tracking)}h2{font-size:clamp(2.3rem,4.5vw,4.5rem);line-height:1.08;letter-spacing:var(--heading-tracking)}h3{font-size:1.5rem;line-height:1.2}section[id]{scroll-margin-top:2rem}.wrap{width:min(var(--content-width),calc(100% - var(--gutter)*2));margin-inline:auto}.section{padding-block:var(--section-space)}.eyebrow{font-family:var(--font-label);font-size:.75rem;line-height:1.5;font-weight:600;text-transform:uppercase;letter-spacing:.14em}.muted{color:var(--muted-foreground)}.rule{border-top:1px solid var(--border)}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:var(--layout-gap)}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--layout-gap)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.8rem;min-height:3rem;padding:.8rem 1.5rem;border:1px solid transparent;border-radius:var(--radius);background:var(--primary);color:var(--primary-foreground);font-size:.875rem;font-weight:600;line-height:1.4;transition:transform var(--motion-fast) ease,background var(--motion-fast) ease,box-shadow var(--motion-fast) ease}.btn:hover{transform:translateY(-2px);box-shadow:var(--shadow)}.btn.outline{background:transparent;color:inherit;border-color:var(--border)}.link{display:inline-flex;gap:1rem;align-items:center;min-height:2.75rem;font-size:.875rem;border-bottom:1px solid currentColor}.icon{width:1.25rem;height:1.25rem;display:inline-block;flex-shrink:0;vertical-align:middle}.nav{min-height:6rem;display:flex;align-items:center;justify-content:space-between;gap:2rem}.brand{display:flex;align-items:center;gap:.65rem;font-family:var(--font-heading);font-weight:700;font-size:1.35rem;letter-spacing:-.04em}.nav-links{display:flex;align-items:center;gap:2rem;font-size:.875rem}.nav-links a:hover{text-decoration:underline;text-underline-offset:6px}.mobile-nav{display:none;position:relative}.mobile-nav summary{cursor:pointer;list-style:none;padding:.65rem .9rem;border:1px solid var(--border);border-radius:var(--radius);font-size:.875rem}.mobile-nav summary::-webkit-details-marker{display:none}.mobile-links{position:absolute;right:0;top:3.25rem;z-index:30;min-width:220px;background:var(--card);color:var(--card-foreground);border:1px solid var(--border);padding:1rem;box-shadow:var(--shadow)}.mobile-links a{display:block;padding:.8rem}.skip{position:fixed;z-index:100;left:1rem;top:-8rem;background:var(--primary);color:var(--primary-foreground);padding:1rem}.skip:focus{top:1rem}:focus-visible{outline:3px solid var(--ring);outline-offset:5px}.card{padding:2rem;background:var(--card);color:var(--card-foreground);border:1px solid var(--border);border-radius:var(--radius)}.photo-credit{font-size:.75rem;opacity:.8}.faq{border-bottom:1px solid var(--border);padding-block:1.3rem}.faq summary{cursor:pointer;font-weight:500;display:flex;gap:1.5rem;align-items:center;justify-content:space-between;list-style:none}.faq summary::-webkit-details-marker{display:none}.faq summary:after{content:'+';font-size:1.5rem}.faq[open] summary:after{content:'−'}.faq p{padding-top:1rem;color:var(--muted-foreground)}.contact-dialog{width:min(540px,calc(100% - 2rem));max-height:calc(100dvh - 2rem);overflow:auto;padding:2rem;border:1px solid var(--border);border-radius:var(--radius);background:var(--card);color:var(--card-foreground);box-shadow:var(--shadow)}.contact-dialog::backdrop{background:#0009;backdrop-filter:blur(6px)}.contact-dialog h2{font-size:2rem;margin-block:1rem}.contact-dialog label{display:block;font-size:.875rem;margin-top:1rem}.contact-dialog input,.contact-dialog textarea{display:block;width:100%;margin-top:.4rem;padding:.8rem;border:1px solid var(--input);border-radius:var(--radius);background:var(--background);color:var(--foreground)}.contact-dialog .close{float:right;background:transparent;border:1px solid var(--border);width:2.75rem;height:2.75rem;border-radius:var(--radius)}.contact-dialog .status{margin-top:1rem;font-size:.875rem;color:var(--foreground)}.motion-control{font-family:var(--font-body);background:transparent;border:1px solid var(--border);border-radius:var(--radius);font-size:.75rem;padding:.45rem .7rem;min-height:2.75rem}.motion-paused *{animation-play-state:paused!important}.reveal{animation:enter 750ms both}@keyframes enter{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:none}}@keyframes rotate{to{transform:rotate(360deg)}}@media(max-width:760px){.nav{min-height:5rem}.nav-links{display:none}.mobile-nav{display:block}.grid2,.grid3{grid-template-columns:1fr}.section{padding-block:4rem}h1{font-size:var(--hero-mobile)}.card{padding:1.5rem}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}}\n\n\n.agency-hero{min-height:690px;position:relative;display:flex;align-items:center;padding-block:4rem 6rem;overflow:clip}.orbit-field{position:absolute;right:0;top:5rem;width:49%;height:480px;display:grid;place-items:center}.orbit{position:absolute;width:96%;height:67%;border:1px solid #d7ff3f88;border-radius:50%;animation:rotate 24s linear infinite}.orbit-b{width:80%;height:85%;animation-direction:reverse;border-color:#d8c3ff99}.orbit-c{height:100%;width:55%;animation-duration:36s}.orbit-core{font-family:var(--font-heading);font-size:11rem;letter-spacing:-.12em;color:var(--primary);line-height:1}.orbit-tag{position:absolute;bottom:0;right:0;font-family:var(--font-label);font-size:.75rem;letter-spacing:.16em}.agency-note{position:absolute;right:0;bottom:3rem;color:var(--muted-foreground)}.ticker{overflow:hidden;background:var(--primary);color:var(--primary-foreground);padding:1.3rem 0;font-size:1.3rem;font-weight:600;letter-spacing:-.03em;white-space:nowrap}.ticker div{width:max-content;animation:ticker 35s linear infinite}.ticker span{padding-inline:2rem}.service-row{display:grid;grid-template-columns:60px 1.2fr 1fr 24px;gap:1rem;align-items:center;border-top:1px solid var(--border);padding:2rem 0}.service-row h3{font-size:2rem}.service-row p{font-size:.875rem}.agency-cta{background:var(--accent);color:var(--accent-foreground)}.agency-cta .btn{border-color:currentColor}@keyframes ticker{to{transform:translateX(-35%)}}@media(max-width:760px){.agency-hero{min-height:820px;align-items:flex-start;padding-top:2rem}.orbit-field{top:auto;bottom:3rem;height:230px;width:70%;right:0;opacity:.8}.orbit-core{font-size:7rem}.agency-note{left:0;right:auto;bottom:2rem;max-width:7rem}.orbit-tag{display:none}.service-row{grid-template-columns:30px 1fr 24px}.service-row p{grid-column:2}.service-row>.icon{grid-column:3;grid-row:1}.service-row h3{font-size:1.5rem}}\n\n.fineprint{font-size:.75rem;line-height:1.7}.fineprint a{text-decoration:underline;text-underline-offset:4px}.section-note{font-size:.875rem;color:var(--muted-foreground)}.section-title{display:flex;align-items:end;justify-content:space-between;gap:2rem;margin-bottom:3rem}.section-title p{max-width:25rem}.editorial-label{font-family:var(--font-label);font-size:.75rem;letter-spacing:.12em;text-transform:uppercase}.editorial-photo{width:100%;height:100%;object-fit:cover}.section-title h2{max-width:18ch}footer nav a{display:block;width:fit-content;padding:.45rem 0;font-size:.875rem}footer nav a:hover{text-decoration:underline;text-underline-offset:5px}footer :focus-visible{outline-color:currentColor}footer .photo-credit{opacity:1}footer .fineprint .photo-credit{display:block}.minor-link{display:inline-block;border:0;border-bottom:1px solid currentColor;background:none;padding:.7rem 0;color:inherit;cursor:pointer;font-size:.875rem}.editorial-quote{margin:0}.editorial-quote p{font-family:var(--font-heading);line-height:1.18;letter-spacing:var(--heading-tracking)}.editorial-quote cite{display:block;margin-top:2rem;font-style:normal;font-size:.875rem}figure{margin:0}.contact-large{display:block;text-align:left;border:0;padding:0;background:none;font-family:var(--font-heading)!important;font-size:clamp(3rem,7vw,7rem)!important;letter-spacing:var(--heading-tracking);line-height:1.05;font-weight:var(--heading-weight)}.contact-large:hover{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:.12em}.section-endnote{font-size:.75rem;letter-spacing:.03em}.inset-rule{border-top:1px solid currentColor;padding-top:1.5rem}@media(max-width:760px){.section-title{display:block}.section-title>p{margin-top:1.5rem}.contact-large{font-size:clamp(2.6rem,12vw,5rem)!important}}\n\n.voltage-campaigns{display:grid;grid-template-columns:1.3fr 1fr;gap:2rem;align-items:start}.voltage-campaigns article:nth-child(2){margin-top:7rem}.campaign-night,.campaign-common{position:relative;min-height:470px;padding:2rem;overflow:hidden}.campaign-night{background:#d8c3ff;color:#241d34}.campaign-night>p{font-family:var(--font-heading);font-size:clamp(3.5rem,6vw,6rem);font-weight:600;line-height:.95;letter-spacing:-.065em;margin-top:5rem}.campaign-night p em{font-style:normal;color:#492c86}.campaign-stamp{position:absolute;right:2rem;bottom:2rem;border:1px solid currentColor;padding:1rem;font-family:var(--font-label);font-size:.75rem;text-align:center;line-height:1.3;transform:rotate(7deg)}.campaign-common{background:#d7ff3f;color:#20280b}.campaign-common>p{font-family:var(--font-heading);font-size:clamp(3rem,4.6vw,4.6rem);line-height:1.02;letter-spacing:-.07em;margin-top:3rem}.campaign-common p em{font-style:normal;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:8px}.campaign-wordmark{display:block;font-size:3rem;font-weight:700;text-align:right;margin-top:2rem}.campaign-caption{display:flex;justify-content:space-between;gap:1rem;margin-top:1.2rem}.campaign-caption h3{font-size:1.2rem}.campaign-caption span{font-size:.75rem;color:var(--muted-foreground)}.voltage-sprint{background:#1b1e17}.sprint-line{display:grid;grid-template-columns:repeat(3,1fr);gap:3rem;border-top:1px solid var(--border);padding-top:2rem}.sprint-line span{font-family:var(--font-label);font-size:.75rem;color:var(--primary)}.sprint-line h3{margin:2rem 0 1rem}.sprint-line p{color:var(--muted-foreground)}.voltage-experiment{display:grid;grid-template-columns:.85fr 1.15fr;gap:4rem;align-items:center}.signal-study>div{padding:2rem}.signal-before{background:#2a2d26;color:#c6cabb}.signal-before p{font-size:2rem;line-height:1.2;margin-top:1.5rem}.signal-after{background:#d8c3ff;color:#241d34;transform:translateX(-1rem) rotate(-2deg)}.signal-after p{font-family:var(--font-heading);font-size:2.5rem;line-height:1;margin-top:1.5rem;font-weight:600;letter-spacing:-.05em}.signal-after em{font-style:normal}.voltage-footer{background:var(--primary);color:var(--primary-foreground);padding:3rem 0 0;overflow:clip}.voltage-footer-top{display:flex;justify-content:space-between;gap:2rem;align-items:center;margin-bottom:3rem}.voltage-footer .motion-control{border-color:#171c0866}.voltage-footer .contact-large svg{width:3rem;height:3rem}.voltage-footer-bottom{display:grid;grid-template-columns:1fr 1fr 1fr;gap:3rem;border-top:1px solid #171c0844;padding-top:2rem;margin-top:4rem}.voltage-footer-bottom>p{font-size:.875rem}.voltage-footer-word{font-family:var(--font-heading);font-weight:600;font-size:clamp(5rem,19vw,18rem);line-height:1.15;letter-spacing:-.085em;margin-top:2rem}@media(max-width:760px){.voltage-campaigns,.sprint-line,.voltage-experiment{grid-template-columns:1fr}.voltage-campaigns article:nth-child(2){margin-top:1rem}.campaign-night,.campaign-common{min-height:380px}.campaign-caption{flex-direction:column;gap:.5rem}.sprint-line{gap:3rem}.sprint-line h3{margin-top:1rem}.voltage-experiment{gap:3rem}.signal-after{transform:rotate(-2deg)}.signal-after p{font-size:2.15rem}.voltage-footer-bottom{grid-template-columns:1fr 1fr;gap:2rem}.voltage-footer-bottom .fineprint{grid-column:1/-1}.voltage-footer-word{font-size:19vw}}\n",
  "implementationNotes": [
    "This is a style reference, not a layout to copy. Compose around the new content.",
    "Use the semantic colors and font roles. Preserve the spacing rhythm and contrast.",
    "In React, use the existing shadcn components and apply the supplied tokens.",
    "HTML dialog/details examples are native counterparts, not the actual shadcn React implementation.",
    "Keep reduced-motion support, keyboard operation, focus visibility and responsive layouts.",
    "Replace fictional business copy, sample prices, photos and all demo-only behavior.",
    "Compile Tailwind in the production builder; the browser CDN is for these references."
  ]
}
