[{"data":1,"prerenderedAt":787},["ShallowReactive",2],{"$fOd_fEFpHM9UuzxE_diNb9_B87ngDUZrV849E5YFi57U":3},{"newThing":4,"project":5,"cycle":8,"sections":20,"threads":770,"otherDocs":774,"documents":777,"images":784,"archiveItems":785,"links":786},null,{"id":6,"label":7,"liveBase":4},"www","www.qpoint.io",{"id":9,"num":10,"dir":11,"name":12,"title":13,"focus":4,"status":14,"statusNote":4,"created":15,"completed":4,"mode":4,"report":4,"recordless":16,"thumbnail":4,"imageCount":17,"artifactCount":18,"lastActivity":15,"hasPickup":16,"hasInitialPrompt":19},"c2",2,"c2.brochure-site-q2","brochure-site-q2","Brochure Site Q2 Redesign","active","2026-05-20",false,0,3,true,[21,43,63,183,338,472,489],{"key":22,"title":23,"empty":16,"ast":24},"why","Why",{"type":25,"children":26},"root",[27],{"type":28,"tag":29,"props":30,"children":31},"element","p",{},[32,35,41],{"type":33,"value":34},"text","The current brochure site was positioned for security buyers (c11). The product story has evolved — Qpoint is now squarely about ",{"type":28,"tag":36,"props":37,"children":38},"strong",{},[39],{"type":33,"value":40},"visibility and control for AI agents",{"type":33,"value":42},". The Q2 design (from Illustrator) reframes the entire landing page around this narrative: the agent gap, qcontrol as the answer, three verbs (discover\u002Fobserve\u002Fenforce), and maximum surface area coverage.",{"key":44,"title":45,"empty":16,"ast":46},"objective","Objective",{"type":25,"children":47},[48],{"type":28,"tag":29,"props":49,"children":50},{},[51,53,61],{"type":33,"value":52},"Implement the Q2 2026 brochure site design as a live page in ",{"type":28,"tag":54,"props":55,"children":59},"a",{"href":56,"rel":57},"http:\u002F\u002Fwww.qpoint.io",[58],"nofollow",[60],{"type":33,"value":7},{"type":33,"value":62},", faithfully translating the Illustrator comp into Vue + Tailwind using shared layer components.",{"key":64,"title":65,"empty":16,"ast":66},"scope","Scope",{"type":25,"children":67},[68,75,159,165],{"type":28,"tag":69,"props":70,"children":72},"h3",{"id":71},"in-scope",[73],{"type":33,"value":74},"In scope",{"type":28,"tag":76,"props":77,"children":78},"ul",{},[79,90,100,110,129,139,144,149,154],{"type":28,"tag":80,"props":81,"children":82},"li",{},[83,88],{"type":28,"tag":36,"props":84,"children":85},{},[86],{"type":33,"value":87},"Section 1 — Hero:",{"type":33,"value":89}," \"Visibility and control for the agents in your environment.\" Two CTAs (Install Qcontrol, Talk to Us). Right side: terminal\u002Fcode illustration with Claude Code + qcontrol snippets.",{"type":28,"tag":80,"props":91,"children":92},{},[93,98],{"type":28,"tag":36,"props":94,"children":95},{},[96],{"type":33,"value":97},"Section 2 — The Gap:",{"type":33,"value":99}," \"No layer of your stack was built for the agent.\" Left: narrative text. Right: diagram showing Security Layer vs Limitations, Claude Desktop stats bar (1.2s, 97+, 276+).",{"type":28,"tag":80,"props":101,"children":102},{},[103,108],{"type":28,"tag":36,"props":104,"children":105},{},[106],{"type":33,"value":107},"Section 3 — The Agent Itself:",{"type":33,"value":109}," \"The AI Agent Itself\" with robot\u002Ftentacle illustration. \"Every file it reads, every tool call it makes, every outbound connection — captured by the agent and piped at the source.\"",{"type":28,"tag":80,"props":111,"children":112},{},[113,118,120,127],{"type":28,"tag":36,"props":114,"children":115},{},[116],{"type":33,"value":117},"Section 4 — Three Verbs:",{"type":33,"value":119}," \"Three verbs in one binary\" — ",{"type":28,"tag":121,"props":122,"children":124},"code",{"className":123},[],[125],{"type":33,"value":126},"qcontrol run",{"type":33,"value":128},". Three columns: Discover (find every agent), Observe (see what they're doing), Enforce (decide what happens next). Each column has sub-cards (Flow Discovered, Skills & Tools Used, HTTP Requests, Access Blocked, Mutate\u002FValidate Content as Signal).",{"type":28,"tag":80,"props":130,"children":131},{},[132,137],{"type":28,"tag":36,"props":133,"children":134},{},[135],{"type":33,"value":136},"Section 5 — Maximum Surface Area:",{"type":33,"value":138}," \"Every file, agent, binary, exec, tool call, network connection…\" Four categories: File Activity, Network Behavior, Tool Calls, Process Execution. Right side: file tree illustration with category icons.",{"type":28,"tag":80,"props":140,"children":141},{},[142],{"type":33,"value":143},"Existing navigation, footer, and shared layer components carry over as-is",{"type":28,"tag":80,"props":145,"children":146},{},[147],{"type":33,"value":148},"New section-level components where the design calls for patterns not yet in the layer",{"type":28,"tag":80,"props":150,"children":151},{},[152],{"type":33,"value":153},"Responsive behavior (the comp is desktop-only — mobile breakpoints need design decisions)",{"type":28,"tag":80,"props":155,"children":156},{},[157],{"type":33,"value":158},"Dark mode variant if c46 deliverables are ready; otherwise light-only first pass",{"type":28,"tag":69,"props":160,"children":162},{"id":161},"out-of-scope",[163],{"type":33,"value":164},"Out of scope",{"type":28,"tag":76,"props":166,"children":167},{},[168,173,178],{"type":28,"tag":80,"props":169,"children":170},{},[171],{"type":33,"value":172},"Pricing, docs, or secondary pages",{"type":28,"tag":80,"props":174,"children":175},{},[176],{"type":33,"value":177},"Backend\u002FAPI changes",{"type":28,"tag":80,"props":179,"children":180},{},[181],{"type":33,"value":182},"Illustrations as final vector assets (use placeholder compositions initially, swap in finals later)",{"key":184,"title":185,"empty":16,"ast":186},"plan","Plan",{"type":25,"children":187},[188,194,226,232,251,257,283,289,308,314],{"type":28,"tag":69,"props":189,"children":191},{"id":190},"phase-1-scaffold-hero",[192],{"type":33,"value":193},"Phase 1 — Scaffold & Hero",{"type":28,"tag":195,"props":196,"children":197},"ol",{},[198,211,216,221],{"type":28,"tag":80,"props":199,"children":200},{},[201,203,209],{"type":33,"value":202},"Audit existing ",{"type":28,"tag":121,"props":204,"children":206},{"className":205},[],[207],{"type":33,"value":208},"index.vue",{"type":33,"value":210}," to understand current structure",{"type":28,"tag":80,"props":212,"children":213},{},[214],{"type":33,"value":215},"Create section scaffold with all five sections as empty containers",{"type":28,"tag":80,"props":217,"children":218},{},[219],{"type":33,"value":220},"Build Hero section: headline, subtext, two CTA buttons, right-side terminal illustration",{"type":28,"tag":80,"props":222,"children":223},{},[224],{"type":33,"value":225},"Get typography scale right — the design uses very large display type",{"type":28,"tag":69,"props":227,"children":229},{"id":228},"phase-2-the-gap-the-agent",[230],{"type":33,"value":231},"Phase 2 — The Gap + The Agent",{"type":28,"tag":195,"props":233,"children":235},{"start":234},5,[236,241,246],{"type":28,"tag":80,"props":237,"children":238},{},[239],{"type":33,"value":240},"Build \"The Gap\" section: two-column layout, Security Layer vs Limitations diagram, Claude Desktop stats bar",{"type":28,"tag":80,"props":242,"children":243},{},[244],{"type":33,"value":245},"Build \"The Agent Itself\" section: illustration placeholder + narrative text",{"type":28,"tag":80,"props":247,"children":248},{},[249],{"type":33,"value":250},"Decide illustration strategy: inline SVG compositions vs image assets vs mixed",{"type":28,"tag":69,"props":252,"children":254},{"id":253},"phase-3-three-verbs",[255],{"type":33,"value":256},"Phase 3 — Three Verbs",{"type":28,"tag":195,"props":258,"children":260},{"start":259},8,[261,266,271],{"type":28,"tag":80,"props":262,"children":263},{},[264],{"type":33,"value":265},"Build the three-column Discover\u002FObserve\u002FEnforce layout",{"type":28,"tag":80,"props":267,"children":268},{},[269],{"type":33,"value":270},"Build the sub-cards within each column (Flow Discovered, Skills & Tools, HTTP Requests, Access Blocked, etc.)",{"type":28,"tag":80,"props":272,"children":273},{},[274,276,281],{"type":33,"value":275},"Wire up the ",{"type":28,"tag":121,"props":277,"children":279},{"className":278},[],[280],{"type":33,"value":126},{"type":33,"value":282}," command display at the top of the section",{"type":28,"tag":69,"props":284,"children":286},{"id":285},"phase-4-maximum-surface-area",[287],{"type":33,"value":288},"Phase 4 — Maximum Surface Area",{"type":28,"tag":195,"props":290,"children":292},{"start":291},11,[293,298,303],{"type":28,"tag":80,"props":294,"children":295},{},[296],{"type":33,"value":297},"Build the four-category grid (File Activity, Network Behavior, Tool Calls, Process Execution)",{"type":28,"tag":80,"props":299,"children":300},{},[301],{"type":33,"value":302},"Build the right-side file tree illustration",{"type":28,"tag":80,"props":304,"children":305},{},[306],{"type":33,"value":307},"Category icon treatment",{"type":28,"tag":69,"props":309,"children":311},{"id":310},"phase-5-polish-responsive",[312],{"type":33,"value":313},"Phase 5 — Polish & Responsive",{"type":28,"tag":195,"props":315,"children":317},{"start":316},14,[318,323,328,333],{"type":28,"tag":80,"props":319,"children":320},{},[321],{"type":33,"value":322},"Responsive breakpoints — make mobile decisions where the comp doesn't specify",{"type":28,"tag":80,"props":324,"children":325},{},[326],{"type":33,"value":327},"Animation\u002Ftransition passes if desired",{"type":28,"tag":80,"props":329,"children":330},{},[331],{"type":33,"value":332},"Dark mode application (pending c46)",{"type":28,"tag":80,"props":334,"children":335},{},[336],{"type":33,"value":337},"Cross-browser check, Lighthouse pass",{"key":339,"title":340,"empty":16,"ast":341},"key-changes","Key Changes",{"type":25,"children":342},[343],{"type":28,"tag":344,"props":345,"children":346},"table",{},[347,366],{"type":28,"tag":348,"props":349,"children":350},"thead",{},[351],{"type":28,"tag":352,"props":353,"children":354},"tr",{},[355,361],{"type":28,"tag":356,"props":357,"children":358},"th",{},[359],{"type":33,"value":360},"Area",{"type":28,"tag":356,"props":362,"children":363},{},[364],{"type":33,"value":365},"What changes",{"type":28,"tag":367,"props":368,"children":369},"tbody",{},[370,396,413,430,447],{"type":28,"tag":352,"props":371,"children":372},{},[373,383],{"type":28,"tag":374,"props":375,"children":376},"td",{},[377],{"type":28,"tag":121,"props":378,"children":380},{"className":379},[],[381],{"type":33,"value":382},"app\u002Fpages\u002Fproducts\u002Fqcontrol.vue",{"type":28,"tag":374,"props":384,"children":385},{},[386,388,394],{"type":33,"value":387},"New dedicated product page (overrides ",{"type":28,"tag":121,"props":389,"children":391},{"className":390},[],[392],{"type":33,"value":393},"[slug].vue",{"type":33,"value":395},")",{"type":28,"tag":352,"props":397,"children":398},{},[399,408],{"type":28,"tag":374,"props":400,"children":401},{},[402],{"type":28,"tag":121,"props":403,"children":405},{"className":404},[],[406],{"type":33,"value":407},"content\u002Fproducts\u002Fqcontrol.md",{"type":28,"tag":374,"props":409,"children":410},{},[411],{"type":33,"value":412},"Minimal frontmatter for nav dropdown integration",{"type":28,"tag":352,"props":414,"children":415},{},[416,425],{"type":28,"tag":374,"props":417,"children":418},{},[419],{"type":28,"tag":121,"props":420,"children":422},{"className":421},[],[423],{"type":33,"value":424},"app\u002Fcomponents\u002Fqcontrol\u002F",{"type":28,"tag":374,"props":426,"children":427},{},[428],{"type":33,"value":429},"5 section components + 3 sub-components (gap\u002FLayerTr, verbs\u002FItem, surface\u002FAreaItem)",{"type":28,"tag":352,"props":431,"children":432},{},[433,442],{"type":28,"tag":374,"props":434,"children":435},{},[436],{"type":28,"tag":121,"props":437,"children":439},{"className":438},[],[440],{"type":33,"value":441},"app\u002Fassets\u002Fimages\u002Fqcontrol\u002F",{"type":28,"tag":374,"props":443,"children":444},{},[445],{"type":33,"value":446},"7 SVG assets (agents, robot, dossier, layer icons, verbs, surface)",{"type":28,"tag":352,"props":448,"children":449},{},[450,459],{"type":28,"tag":374,"props":451,"children":452},{},[453],{"type":28,"tag":121,"props":454,"children":456},{"className":455},[],[457],{"type":33,"value":458},"app\u002Fassets\u002Fcss\u002Fmain.css",{"type":28,"tag":374,"props":460,"children":461},{},[462,464,470],{"type":33,"value":463},"Added ",{"type":28,"tag":121,"props":465,"children":467},{"className":466},[],[468],{"type":33,"value":469},".eyebrow",{"type":33,"value":471}," utility class",{"key":473,"title":474,"empty":16,"ast":475},"outcome","Outcome",{"type":25,"children":476},[477],{"type":28,"tag":29,"props":478,"children":479},{},[480,482,487],{"type":33,"value":481},"A live, deployed brochure page at ",{"type":28,"tag":54,"props":483,"children":485},{"href":56,"rel":484},[58],[486],{"type":33,"value":7},{"type":33,"value":488}," that matches the Q2 Illustrator design — telling the AI agent visibility story through five clear sections, built on the shared layer, ready for dark mode when the color system lands.",{"key":490,"title":491,"empty":16,"ast":492},"extra","Status",{"type":25,"children":493},[494,541,547,706,712],{"type":28,"tag":29,"props":495,"children":496},{},[497,502,504,510,512,518,520,525,526,532,534,539],{"type":28,"tag":36,"props":498,"children":499},{},[500],{"type":33,"value":501},"Branch:",{"type":33,"value":503}," ",{"type":28,"tag":121,"props":505,"children":507},{"className":506},[],[508],{"type":33,"value":509},"qcontrol-initial",{"type":33,"value":511}," (off ",{"type":28,"tag":121,"props":513,"children":515},{"className":514},[],[516],{"type":33,"value":517},"design-integration",{"type":33,"value":519},")\n",{"type":28,"tag":36,"props":521,"children":522},{},[523],{"type":33,"value":524},"Page route:",{"type":33,"value":503},{"type":28,"tag":121,"props":527,"children":529},{"className":528},[],[530],{"type":33,"value":531},"\u002Fproducts\u002Fqcontrol",{"type":33,"value":533}," (dedicated Vue SFC, not content-driven)\n",{"type":28,"tag":36,"props":535,"children":536},{},[537],{"type":33,"value":538},"Progress:",{"type":33,"value":540}," Phase 1–4 complete, Phase 5 in progress",{"type":28,"tag":69,"props":542,"children":544},{"id":543},"completed",[545],{"type":33,"value":546},"Completed",{"type":28,"tag":76,"props":548,"children":551},{"className":549},[550],"contains-task-list",[552,571,587,596,613,622,639,656,672,681],{"type":28,"tag":80,"props":553,"children":556},{"className":554},[555],"task-list-item",[557,562,564,569],{"type":28,"tag":558,"props":559,"children":561},"input",{"checked":19,"disabled":19,"type":560},"checkbox",[],{"type":33,"value":563}," Nav integration via ",{"type":28,"tag":121,"props":565,"children":567},{"className":566},[],[568],{"type":33,"value":407},{"type":33,"value":570}," (auto-appears in products dropdown)",{"type":28,"tag":80,"props":572,"children":574},{"className":573},[555],[575,578,580,585],{"type":28,"tag":558,"props":576,"children":577},{"checked":19,"disabled":19,"type":560},[],{"type":33,"value":579}," Page composer: ",{"type":28,"tag":121,"props":581,"children":583},{"className":582},[],[584],{"type":33,"value":382},{"type":33,"value":586}," with SEO + schema.org",{"type":28,"tag":80,"props":588,"children":590},{"className":589},[555],[591,594],{"type":28,"tag":558,"props":592,"children":593},{"checked":19,"disabled":19,"type":560},[],{"type":33,"value":595}," Section 1 — Hero: headline, CTAs, agents SVG illustration",{"type":28,"tag":80,"props":597,"children":599},{"className":598},[555],[600,603,605,611],{"type":28,"tag":558,"props":601,"children":602},{"checked":19,"disabled":19,"type":560},[],{"type":33,"value":604}," Section 2 — The Gap: security layer table (",{"type":28,"tag":121,"props":606,"children":608},{"className":607},[],[609],{"type":33,"value":610},"QcontrolGapLayerTr",{"type":33,"value":612},"), SVG icons per layer",{"type":28,"tag":80,"props":614,"children":616},{"className":615},[555],[617,620],{"type":28,"tag":558,"props":618,"children":619},{"checked":19,"disabled":19,"type":560},[],{"type":33,"value":621}," Section 3 — The Agent: robot illustration, dossier SVG, stats card (1.2s \u002F 97+ \u002F 276+)",{"type":28,"tag":80,"props":623,"children":625},{"className":624},[555],[626,629,631,637],{"type":28,"tag":558,"props":627,"children":628},{"checked":19,"disabled":19,"type":560},[],{"type":33,"value":630}," Section 4 — Three Verbs: ",{"type":28,"tag":121,"props":632,"children":634},{"className":633},[],[635],{"type":33,"value":636},"VerbsItem",{"type":33,"value":638}," sub-component, arrow connectors, blinking cursor, verb detail SVGs",{"type":28,"tag":80,"props":640,"children":642},{"className":641},[555],[643,646,648,654],{"type":28,"tag":558,"props":644,"children":645},{"checked":19,"disabled":19,"type":560},[],{"type":33,"value":647}," Section 5 — Surface Area: ",{"type":28,"tag":121,"props":649,"children":651},{"className":650},[],[652],{"type":33,"value":653},"SurfaceAreaItem",{"type":33,"value":655}," sub-component, surface-area SVG, 2x2 category grid",{"type":28,"tag":80,"props":657,"children":659},{"className":658},[555],[660,663,665,671],{"type":28,"tag":558,"props":661,"children":662},{"checked":19,"disabled":19,"type":560},[],{"type":33,"value":664}," Body background override (",{"type":28,"tag":121,"props":666,"children":668},{"className":667},[],[669],{"type":33,"value":670},"bg-grey-100",{"type":33,"value":395},{"type":28,"tag":80,"props":673,"children":675},{"className":674},[555],[676,679],{"type":28,"tag":558,"props":677,"children":678},{"checked":19,"disabled":19,"type":560},[],{"type":33,"value":680}," Eyebrow utility class",{"type":28,"tag":80,"props":682,"children":684},{"className":683},[555],[685,688,690,696,698,704],{"type":28,"tag":558,"props":686,"children":687},{"checked":19,"disabled":19,"type":560},[],{"type":33,"value":689}," Responsive breakpoints (custom ",{"type":28,"tag":121,"props":691,"children":693},{"className":692},[],[694],{"type":33,"value":695},"min-[800px]",{"type":33,"value":697},", ",{"type":28,"tag":121,"props":699,"children":701},{"className":700},[],[702],{"type":33,"value":703},"min-[1040px]",{"type":33,"value":705},", etc.)",{"type":28,"tag":69,"props":707,"children":709},{"id":708},"remaining",[710],{"type":33,"value":711},"Remaining",{"type":28,"tag":76,"props":713,"children":715},{"className":714},[550],[716,725,734,743,752,761],{"type":28,"tag":80,"props":717,"children":719},{"className":718},[555],[720,723],{"type":28,"tag":558,"props":721,"children":722},{"disabled":19,"type":560},[],{"type":33,"value":724}," Responsive polish pass (mobile edge cases)",{"type":28,"tag":80,"props":726,"children":728},{"className":727},[555],[729,732],{"type":28,"tag":558,"props":730,"children":731},{"disabled":19,"type":560},[],{"type":33,"value":733}," Animation\u002Ftransition passes",{"type":28,"tag":80,"props":735,"children":737},{"className":736},[555],[738,741],{"type":28,"tag":558,"props":739,"children":740},{"disabled":19,"type":560},[],{"type":33,"value":742}," Dark mode (pending c46)",{"type":28,"tag":80,"props":744,"children":746},{"className":745},[555],[747,750],{"type":28,"tag":558,"props":748,"children":749},{"disabled":19,"type":560},[],{"type":33,"value":751}," Cross-browser check, Lighthouse",{"type":28,"tag":80,"props":753,"children":755},{"className":754},[555],[756,759],{"type":28,"tag":558,"props":757,"children":758},{"disabled":19,"type":560},[],{"type":33,"value":760}," Final copy review",{"type":28,"tag":80,"props":762,"children":764},{"className":763},[555],[765,768],{"type":28,"tag":558,"props":766,"children":767},{"disabled":19,"type":560},[],{"type":33,"value":769}," Deploy to production",[771],{"name":772,"prompt":773,"plan":4},"index-redesign-initial","index-redesign-initial-prompt.md",[775,776],"initial-prompt.md","plan.md",[778,780,782],{"file":773,"title":779},"Index page redesign",{"file":775,"title":781},"c47 — Initial Prompt",{"file":776,"title":783},"QControl Product Page — Implementation Plan",[],[],[],1794599355597]