26:["$","div",null,{"className":"mb-4 rounded border overflow-hidden","style":{"borderColor":"#F9731630"},"children":[["$","div",null,{"className":"px-4 py-2.5 border-b","style":{"background":"#F9731610","borderColor":"#F9731625"},"children":["$","p",null,{"className":"text-xs font-semibold","style":{"color":"#F97316"},"children":["▶ ","Build a complete landing page step by step"]}]}],["$","div",null,{"className":"divide-y divide-border","children":[["$","div","0",{"className":"px-4 py-3","children":["$","div",null,{"className":"flex items-start gap-3","children":[["$","span",null,{"className":"font-mono text-xs font-bold shrink-0 w-6 mt-0.5","style":{"color":"#F97316"},"children":[1,"."]}],["$","div",null,{"className":"flex-1 min-w-0","children":[["$","p",null,{"className":"text-sm text-text-dim mb-2","children":"Create index.html with the full skeleton and a hero section"}],["$","div",null,{"className":"bg-bg rounded border border-border px-3 py-2 mb-2 overflow-x-auto","children":["$","pre",null,{"className":"font-mono text-xs text-amber whitespace-pre","children":"\n\n\n \n \n My Product\n \n\n\n

\n MyProduct\n Get started\n

The headline that explains your value

One sentence that says who it's for and what it does.

\n Start for free →\n

\n\n"}]}],["$","div",null,{"className":"bg-surface-2 rounded border border-border/50 px-3 py-2 mb-1","children":[["$","p",null,{"className":"data-label mb-0.5","children":"Result"}],["$","pre",null,{"className":"font-mono text-xs text-text-muted whitespace-pre-wrap","children":"The page structure — unstyled but semantic."}]]}],"$undefined"]}]]}]}],["$","div","1",{"className":"px-4 py-3","children":["$","div",null,{"className":"flex items-start gap-3","children":[["$","span",null,{"className":"font-mono text-xs font-bold shrink-0 w-6 mt-0.5","style":{"color":"#F97316"},"children":[2,"."]}],["$","div",null,{"className":"flex-1 min-w-0","children":[["$","p",null,{"className":"text-sm text-text-dim mb-2","children":"Create styles.css with a dark theme and hero styling"}],["$","div",null,{"className":"bg-bg rounded border border-border px-3 py-2 mb-2 overflow-x-auto","children":["$","pre",null,{"className":"font-mono text-xs text-amber whitespace-pre","children":"* { box-sizing: border-box; margin: 0; padding: 0; }\n\nbody {\n background: #080A0E;\n color: #F1F5F9;\n font-family: system-ui, sans-serif;\n line-height: 1.6;\n}\n\n.nav {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 16px 40px;\n border-bottom: 1px solid #1E2A3A;\n}\n\n.hero {\n max-width: 800px;\n margin: 120px auto;\n padding: 0 40px;\n text-align: center;\n}\n\n.hero h1 { font-size: 56px; line-height: 1.1; }\n.hero p { color: #94A3B8; font-size: 20px; margin: 24px 0; }\n\n.hero-cta, .cta-btn {\n background: #F59E0B;\n color: #080A0E;\n padding: 12px 28px;\n border-radius: 6px;\n text-decoration: none;\n font-weight: 700;\n}"}]}],["$","div",null,{"className":"bg-surface-2 rounded border border-border/50 px-3 py-2 mb-1","children":[["$","p",null,{"className":"data-label mb-0.5","children":"Result"}],["$","pre",null,{"className":"font-mono text-xs text-text-muted whitespace-pre-wrap","children":"A clean, dark-themed landing page styled like RadarTrek."}]]}],"$undefined"]}]]}]}],["$","div","2",{"className":"px-4 py-3","children":["$","div",null,{"className":"flex items-start gap-3","children":[["$","span",null,{"className":"font-mono text-xs font-bold shrink-0 w-6 mt-0.5","style":{"color":"#F97316"},"children":[3,"."]}],"$L2b"]}]}],"$L2c"]}]]}]

Build and Deploy: Your First Complete Website

You've finished the course!