@misterzik/create-kiss 1.0.0 → 1.0.2

package/LICENSE

@@ -1,21 +1,21 @@
-MIT License
-
-Copyright (c) 2026 Nick
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.
+MIT License
+
+Copyright (c) 2026 Nick
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,53 +1,53 @@
-# create-kiss
-
-![KISS Logo](kiss.jpg)
-
-Scaffold a landing page, by Keepin' It Simply Stupid (KISS), with a Webpack + Sass starter. The CLI copies the ready-to-run template (HTML, SCSS, JS, and assets) so end users only focus on files inside `src/`.
-
-## Quick start
-
-```sh
-npx @misterzik/create-kiss my-landing
-cd my-landing
-npm install
-npm run start
-```
-
-What the command does:
-1. Creates `my-landing/` (or fails if the folder already exists).
-2. Copies the template (including Webpack config, assets, and scripts).
-3. Normalizes the package name inside the generated `package.json` (e.g., `"My Cool App"` ➜ `"my-cool-app"`).
-4. Prints the next steps you need to run locally.
-
-> Tip: You can substitute `npx` with `npm create @misterzik/kiss@latest` or install globally via `npm install -g @misterzik/create-kiss`.
-
-## Template contents
-
-The generated project contains:
-
-- `src/` with HTML pages, SCSS, JS, and assets.
-- `webpack.config.js` configured for multi-page output.
-- Scripts:
-  - `npm run start` – launches `webpack-dev-server` with HMR.
-  - `npm run build` – outputs optimized assets to `dist/`.
-
-## Contributing / local development
-
-All feature work happens on the `dev` branch. Please avoid pushing directly to `main`.
-
-1. Clone the repo and install dependencies: `npm install`.
-2. Create a feature branch off `dev`: `git checkout dev && git pull && git checkout -b feat/my-change`.
-3. Run tests: `npm test` (uses [Vitest](https://vitest.dev/)).
-4. Make your changes under `template/` or the CLI in `bin/create-kiss.js`.
-5. Rebuild to ensure the scaffold still works: `npm run build`.
-6. Push your branch to `origin` and open a pull request into `dev`.
-
-When you're ready to merge to `main`, open a PR from `dev` → `main`. The PR workflow runs lint/build/test gates before merging.
-
-For local smoke testing, you can link the package: `npm link` (or run `node bin/create-kiss.js demo-app` from the repo root and inspect the generated folder in a temporary directory).
-
-## Releasing
-
-1. Bump the version in `package.json`.
-2. `npm publish --access public`
-3. Verify `npx @misterzik/create-kiss <project-name>` pulls the new version.
+# create-kiss
+
+![KISS Logo](kiss.jpg)
+
+Scaffold a landing page, by Keepin' It Simply Stupid (KISS), with a Webpack + Sass starter. The CLI copies the ready-to-run template (HTML, SCSS, JS, and assets) so end users only focus on files inside `src/`.
+
+## Quick start
+
+```sh
+npx @misterzik/create-kiss my-landing
+cd my-landing
+npm install
+npm run start
+```
+
+What the command does:
+1. Creates `my-landing/` (or fails if the folder already exists).
+2. Copies the template (including Webpack config, assets, and scripts).
+3. Normalizes the package name inside the generated `package.json` (e.g., `"My Cool App"` ➜ `"my-cool-app"`).
+4. Prints the next steps you need to run locally.
+
+> Tip: You can substitute `npx` with `npm create @misterzik/kiss@latest` or install globally via `npm install -g @misterzik/create-kiss`.
+
+## Template contents
+
+The generated project contains:
+
+- `src/` with HTML pages, SCSS, JS, and assets.
+- `webpack.config.js` configured for multi-page output.
+- Scripts:
+  - `npm run start` – launches `webpack-dev-server` with HMR.
+  - `npm run build` – outputs optimized assets to `dist/`.
+
+## Contributing / local development
+
+All feature work happens on the `dev` branch. Please avoid pushing directly to `main`.
+
+1. Clone the repo and install dependencies: `npm install`.
+2. Create a feature branch off `dev`: `git checkout dev && git pull && git checkout -b feat/my-change`.
+3. Run tests: `npm test` (uses [Vitest](https://vitest.dev/)).
+4. Make your changes under `template/` or the CLI in `bin/create-kiss.js`.
+5. Rebuild to ensure the scaffold still works: `npm run build`.
+6. Push your branch to `origin` and open a pull request into `dev`.
+
+When you're ready to merge to `main`, open a PR from `dev` → `main`. The PR workflow runs lint/build/test gates before merging.
+
+For local smoke testing, you can link the package: `npm link` (or run `node bin/create-kiss.js demo-app` from the repo root and inspect the generated folder in a temporary directory).
+
+## Releasing
+
+1. Bump the version in `package.json`.
+2. `npm publish --access public`
+3. Verify `npx @misterzik/create-kiss <project-name>` pulls the new version.

package/bin/create-kiss.js

@@ -1,90 +1,90 @@
-#!/usr/bin/env node
-
-const fs = require('fs');
-const path = require('path');
-
-const templateDir = path.resolve(__dirname, '..', 'template');
-
-const args = process.argv.slice(2);
-const rawProjectName = args[0] || 'kiss-app';
-const targetDir = path.resolve(process.cwd(), rawProjectName);
-
-const formatPackageName = (name) => name
-  .trim()
-  .toLowerCase()
-  .replace(/[^a-z0-9-_.]/g, '-')
-  .replace(/-{2,}/g, '-')
-  .replace(/^-+|-+$/g, '')
-  || 'kiss-app';
-
-const ensureDirectory = (dir) => {
-  if (!fs.existsSync(dir)) {
-    fs.mkdirSync(dir, { recursive: true });
-    return;
-  }
-
-  const contents = fs.readdirSync(dir);
-  if (contents.length > 0) {
-    throw new Error(`Target directory "${dir}" already exists and is not empty.`);
-  }
-};
-
-const copyTemplate = (destination) => {
-  if (!fs.existsSync(templateDir)) {
-    throw new Error('Template directory is missing from the package.');
-  }
-  fs.cpSync(templateDir, destination, { recursive: true });
-};
-
-const flattenNestedSrc = (destination) => {
-  const outerSrc = path.join(destination, 'src');
-  const nestedSrc = path.join(outerSrc, 'src');
-
-  if (!fs.existsSync(nestedSrc)) {
-    return;
-  }
-
-  for (const entry of fs.readdirSync(nestedSrc)) {
-    const from = path.join(nestedSrc, entry);
-    const to = path.join(outerSrc, entry);
-    fs.renameSync(from, to);
-  }
-
-  fs.rmSync(nestedSrc, { recursive: true, force: true });
-};
-
-const updatePackageJson = (destination, finalName) => {
-  const pkgPath = path.join(destination, 'package.json');
-  if (!fs.existsSync(pkgPath)) {
-    return;
-  }
-
-  const pkg = JSON.parse(fs.readFileSync(pkgPath, 'utf8'));
-  pkg.name = finalName;
-  pkg.version = '0.1.0';
-
-  fs.writeFileSync(pkgPath, JSON.stringify(pkg, null, 2));
-};
-
-const main = () => {
-  try {
-    ensureDirectory(targetDir);
-    copyTemplate(targetDir);
-    flattenNestedSrc(targetDir);
-
-    const pkgName = formatPackageName(rawProjectName);
-    updatePackageJson(targetDir, pkgName);
-
-    console.log(`\nSuccess! Created ${pkgName} at ${targetDir}`);
-    console.log('\nNext steps:');
-    console.log(`  cd ${rawProjectName}`);
-    console.log('  npm install');
-    console.log('  npm run start');
-    console.log('\nHappy building!');
-  } catch (error) {
-    console.error(`\nError: ${error.message}`);
-    process.exit(1);
-  }
-};
-
-main();
+#!/usr/bin/env node
+
+const fs = require('fs');
+const path = require('path');
+
+const templateDir = path.resolve(__dirname, '..', 'template');
+
+const args = process.argv.slice(2);
+const rawProjectName = args[0] || 'kiss-app';
+const targetDir = path.resolve(process.cwd(), rawProjectName);
+
+const formatPackageName = (name) => name
+  .trim()
+  .toLowerCase()
+  .replace(/[^a-z0-9-_.]/g, '-')
+  .replace(/-{2,}/g, '-')
+  .replace(/^-+|-+$/g, '')
+  || 'kiss-app';
+
+const ensureDirectory = (dir) => {
+  if (!fs.existsSync(dir)) {
+    fs.mkdirSync(dir, { recursive: true });
+    return;
+  }
+
+  const contents = fs.readdirSync(dir);
+  if (contents.length > 0) {
+    throw new Error(`Target directory "${dir}" already exists and is not empty.`);
+  }
+};
+
+const copyTemplate = (destination) => {
+  if (!fs.existsSync(templateDir)) {
+    throw new Error('Template directory is missing from the package.');
+  }
+  fs.cpSync(templateDir, destination, { recursive: true });
+};
+
+const flattenNestedSrc = (destination) => {
+  const outerSrc = path.join(destination, 'src');
+  const nestedSrc = path.join(outerSrc, 'src');
+
+  if (!fs.existsSync(nestedSrc)) {
+    return;
+  }
+
+  for (const entry of fs.readdirSync(nestedSrc)) {
+    const from = path.join(nestedSrc, entry);
+    const to = path.join(outerSrc, entry);
+    fs.renameSync(from, to);
+  }
+
+  fs.rmSync(nestedSrc, { recursive: true, force: true });
+};
+
+const updatePackageJson = (destination, finalName) => {
+  const pkgPath = path.join(destination, 'package.json');
+  if (!fs.existsSync(pkgPath)) {
+    return;
+  }
+
+  const pkg = JSON.parse(fs.readFileSync(pkgPath, 'utf8'));
+  pkg.name = finalName;
+  pkg.version = '0.1.0';
+
+  fs.writeFileSync(pkgPath, JSON.stringify(pkg, null, 2));
+};
+
+const main = () => {
+  try {
+    ensureDirectory(targetDir);
+    copyTemplate(targetDir);
+    flattenNestedSrc(targetDir);
+
+    const pkgName = formatPackageName(rawProjectName);
+    updatePackageJson(targetDir, pkgName);
+
+    console.log(`\nSuccess! Created ${pkgName} at ${targetDir}`);
+    console.log('\nNext steps:');
+    console.log(`  cd ${rawProjectName}`);
+    console.log('  npm install');
+    console.log('  npm run start');
+    console.log('\nHappy building!');
+  } catch (error) {
+    console.error(`\nError: ${error.message}`);
+    process.exit(1);
+  }
+};
+
+main();

package/package.json

@@ -1,47 +1,47 @@
-{
-  "name": "@misterzik/create-kiss",
-  "version": "1.0.0",
-  "description": "Scaffold a landing page, by Keepin' It Simply Stupid (KISS), with a starter template powered by Webpack + Sass.",
-  "bin": {
-    "create-kiss": "bin/create-kiss.js"
-  },
-  "files": [
-    "bin",
-    "template"
-  ],
-  "keywords": [
-    "kiss",
-    "landing-page",
-    "scaffold",
-    "webpack",
-    "sass",
-    "html",
-    "css",
-    "js",
-    "jquery",
-    "bootstrap",
-    "bxslider",
-    "wowjs",
-    "scrollit"
-  ],
-  "author": "MisterZik",
-  "license": "MIT",
-  "type": "commonjs",
-  "engines": {
-    "node": ">=18.0.0"
-  },
-  "scripts": {
-    "test": "vitest run --config vitest.config.mjs"
-  },
-  "devDependencies": {
-    "vitest": "^1.3.1"
-  },
-  "repository": {
-    "type": "git",
-    "url": "git+https://github.com/misterzik/create-kiss.git"
-  },
-  "bugs": {
-    "url": "https://github.com/misterzik/create-kiss/issues"
-  },
-  "homepage": "https://github.com/misterzik/create-kiss#readme"
-}
+{
+  "name": "@misterzik/create-kiss",
+  "version": "1.0.2",
+  "description": "Scaffold a landing page, by Keepin' It Simply Stupid (KISS), with a starter template powered by Webpack + Sass.",
+  "bin": {
+    "create-kiss": "bin/create-kiss.js"
+  },
+  "files": [
+    "bin",
+    "template"
+  ],
+  "keywords": [
+    "kiss",
+    "landing-page",
+    "scaffold",
+    "webpack",
+    "sass",
+    "html",
+    "css",
+    "js",
+    "jquery",
+    "bootstrap",
+    "bxslider",
+    "wowjs",
+    "scrollit"
+  ],
+  "author": "MisterZik",
+  "license": "MIT",
+  "type": "commonjs",
+  "engines": {
+    "node": ">=18.0.0"
+  },
+  "scripts": {
+    "test": "vitest run --config vitest.config.mjs"
+  },
+  "devDependencies": {
+    "vitest": "^1.3.1"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/misterzik/create-kiss.git"
+  },
+  "bugs": {
+    "url": "https://github.com/misterzik/create-kiss/issues"
+  },
+  "homepage": "https://github.com/misterzik/create-kiss#readme"
+}

package/template/dist/assets/images/wavy.svg

@@ -0,0 +1,7 @@
+<svg id="visual" viewBox="0 0 900 600" xmlns="http://www.w3.org/2000/svg"
+    xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" style="enable-background:new 0 0 1920 204.8;" xml:space="preserve">
+    <rect x="0" y="0" width="900" height="600" fill="transparent"></rect>
+    <path
+        d="M0 448L21.5 453.2C43 458.3 86 468.7 128.8 473.8C171.7 479 214.3 479 257.2 484C300 489 343 499 385.8 484.8C428.7 470.7 471.3 432.3 514.2 422.8C557 413.3 600 432.7 642.8 430.5C685.7 428.3 728.3 404.7 771.2 392.7C814 380.7 857 380.3 878.5 380.2L900 380L900 601L878.5 601C857 601 814 601 771.2 601C728.3 601 685.7 601 642.8 601C600 601 557 601 514.2 601C471.3 601 428.7 601 385.8 601C343 601 300 601 257.2 601C214.3 601 171.7 601 128.8 601C86 601 43 601 21.5 601L0 601Z"
+        fill="#FFFFFF" stroke-linecap="round" stroke-linejoin="miter"></path>
+</svg>

package/template/dist/bundle.js

@@ -0,0 +1,2 @@
+(()=>{"use strict";function t(t,n){(null==n||n>t.length)&&(n=t.length);for(var r=0,e=Array(n);r<n;r++)e[r]=t[r];return e}var n=function(t){return document.querySelector(t)},r=function(){var t=n(".navbar");t&&(window.scrollY>48?t.classList.add("nav-scroll"):t.classList.remove("nav-scroll"))},e=function(){var r,e=n("[data-nav-toggle]"),a=n("#primary-nav");if(e&&a){var o=function(){var t=a.classList.toggle("is-open");e.setAttribute("aria-expanded",String(t))};e.addEventListener("click",function(){o()}),(r=document.querySelectorAll("#primary-nav a"),function(n){if(Array.isArray(n))return t(n)}(r)||function(t){if("undefined"!=typeof Symbol&&null!=t[Symbol.iterator]||null!=t["@@iterator"])return Array.from(t)}(r)||function(n,r){if(n){if("string"==typeof n)return t(n,r);var e={}.toString.call(n).slice(8,-1);return"Object"===e&&n.constructor&&(e=n.constructor.name),"Map"===e||"Set"===e?Array.from(n):"Arguments"===e||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(e)?t(n,r):void 0}}(r)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()).forEach(function(t){t.addEventListener("click",function(){a.classList.contains("is-open")&&o()})})}};document.addEventListener("DOMContentLoaded",function(){var t;(t=n("#year"))&&(t.textContent=(new Date).getFullYear()),e(),r(),window.addEventListener("scroll",r,{passive:!0})})})();
+//# sourceMappingURL=bundle.js.map

package/template/dist/bundle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"bundle.js","mappings":"yHAEA,IAEMA,EAAS,SAACC,GAAQ,OAAKC,SAASC,cAAcF,EAAS,EAUvDG,EAAqB,WACzB,IAAMC,EAASL,EAAO,WACjBK,IAIDC,OAAOC,QAlBY,GAmBrBF,EAAOG,UAAUC,IAAI,cAErBJ,EAAOG,UAAUE,OAAO,cAE5B,EAEMC,EAAkB,WACtB,I,EAAMC,EAAYZ,EAAO,qBACnBa,EAAab,EAAO,gBAE1B,GAAKY,GAAcC,EAAnB,CAIA,IAAMC,EAAY,WAChB,IAAMC,EAASF,EAAWL,UAAUQ,OAAO,WAC3CJ,EAAUK,aAAa,gBAAiBC,OAAOH,GACjD,EAEAH,EAAUO,iBAAiB,QAAS,WAClCL,GACF,I,EArCkCZ,SAASkB,iBAuCjC,kB,omBAAkBC,QAAQ,SAACC,GACnCA,EAAKH,iBAAiB,QAAS,WACzBN,EAAWL,UAAUe,SAAS,YAChCT,GAEJ,EACF,EAjBA,CAkBF,EAUAZ,SAASiB,iBAAiB,mBARV,WA9CG,IACXK,KAAcxB,EAAO,YAEzBwB,EAAYC,aAAc,IAAIC,MAAOC,eA6CvChB,IACAP,IAEAE,OAAOa,iBAAiB,SAAUf,EAAoB,CAAEwB,SAAS,GACnE,E","sources":["webpack://kiss-app/./src/js/app.js"],"sourcesContent":["import '../scss/app.scss';\n\nconst SCROLL_THRESHOLD = 48;\n\nconst select = (selector) => document.querySelector(selector);\nconst selectAll = (selector) => [...document.querySelectorAll(selector)];\n\nconst updateYear = () => {\n  const yearElement = select('#year');\n  if (yearElement) {\n    yearElement.textContent = new Date().getFullYear();\n  }\n};\n\nconst handleNavbarScroll = () => {\n  const navbar = select('.navbar');\n  if (!navbar) {\n    return;\n  }\n\n  if (window.scrollY > SCROLL_THRESHOLD) {\n    navbar.classList.add('nav-scroll');\n  } else {\n    navbar.classList.remove('nav-scroll');\n  }\n};\n\nconst setupNavigation = () => {\n  const navToggle = select('[data-nav-toggle]');\n  const primaryNav = select('#primary-nav');\n\n  if (!navToggle || !primaryNav) {\n    return;\n  }\n\n  const toggleNav = () => {\n    const isOpen = primaryNav.classList.toggle('is-open');\n    navToggle.setAttribute('aria-expanded', String(isOpen));\n  };\n\n  navToggle.addEventListener('click', () => {\n    toggleNav();\n  });\n\n  selectAll('#primary-nav a').forEach((link) => {\n    link.addEventListener('click', () => {\n      if (primaryNav.classList.contains('is-open')) {\n        toggleNav();\n      }\n    });\n  });\n};\n\nconst initApp = () => {\n  updateYear();\n  setupNavigation();\n  handleNavbarScroll();\n\n  window.addEventListener('scroll', handleNavbarScroll, { passive: true });\n};\n\ndocument.addEventListener('DOMContentLoaded', initApp);\n"],"names":["select","selector","document","querySelector","handleNavbarScroll","navbar","window","scrollY","classList","add","remove","setupNavigation","navToggle","primaryNav","toggleNav","isOpen","toggle","setAttribute","String","addEventListener","querySelectorAll","forEach","link","contains","yearElement","textContent","Date","getFullYear","passive"],"ignoreList":[],"sourceRoot":""}

package/template/dist/css/app.css

@@ -0,0 +1,3 @@
+*,*::before,*::after{box-sizing:border-box}html,body{margin:0;padding:0}body{font-family:"Space Grotesk","Sora",system-ui,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.65;color:#e7ecff;background:#04060c;-webkit-font-smoothing:antialiased}img{display:block;max-width:100%}p{margin:0 0 1rem}code,pre{font-family:"JetBrains Mono","Space Grotesk",monospace}.kiss-site{min-height:100vh;background:radial-gradient(circle at top, rgba(110, 125, 255, 0.15), transparent 55%) #04060c}.container{width:min(1120px,100% - 3rem);margin:0 auto}a{color:inherit;text-decoration:none}button{font-family:inherit}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.35rem;padding:.65rem 1.5rem;border-radius:999px;border:1px solid rgba(0,0,0,0);font-weight:600;cursor:pointer;transition:background 220ms ease,color 220ms ease,border-color 220ms ease,transform 220ms ease}.btn-primary{background:linear-gradient(120deg, #6f7dff, #ff7b5f);color:#fff;box-shadow:0 15px 35px rgba(13,18,43,.45)}.btn-primary:hover{transform:translateY(-2px)}.btn-outline-light{color:#fff;border-color:hsla(0,0%,100%,.5)}.btn-outline-light:hover{border-color:#fff;background:hsla(0,0%,100%,.08)}.btn-outline-dark{color:#0f1423;border-color:rgba(15,20,35,.2)}.btn-outline-dark:hover{background:#0f1423;color:#fff}code{display:inline-flex;align-items:center;border-radius:12px;padding:.35rem .75rem;background:hsla(0,0%,100%,.06);color:#41f2b8;font-size:.95rem}.hero{padding:2.5rem 0 4rem}.navbar{position:sticky;top:0;z-index:20;background:rgba(0,0,0,0);transition:background 220ms ease,box-shadow 220ms ease}.navbar-inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.75rem 0}.navbar-brand{display:inline-flex;align-items:center;gap:.75rem;color:#fff;font-weight:600;letter-spacing:.05em}.nav-links{display:flex;list-style:none;gap:1rem;align-items:center;margin:0;padding:0}.nav-links li{display:flex}.nav-links a{color:hsla(0,0%,100%,.8);font-weight:500;padding:.35rem .6rem;transition:color 220ms ease}.nav-links a:hover{color:#fff}.nav-links .btn{font-size:.85rem;padding-inline:1rem}.nav-toggle{display:none;flex-direction:column;justify-content:center;gap:4px;border:none;border-radius:12px;padding:.6rem;background:hsla(0,0%,100%,.1);color:#fff;cursor:pointer}.nav-toggle span{display:block;width:22px;height:2px;background:currentColor}.nav-scroll{background:rgba(4,6,12,.9);box-shadow:0 15px 35px rgba(4,6,12,.6);backdrop-filter:blur(12px)}.hero-grid{margin-top:2.5rem;display:grid;grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));gap:2.5rem;align-items:center}.hero-copy h1{font-size:clamp(2.5rem,5vw,3.8rem);line-height:1.1;margin-bottom:1rem}.eyebrow{text-transform:uppercase;letter-spacing:.3em;font-size:.75rem;color:#41f2b8}.hero-cta{margin-top:1.5rem;display:flex;flex-direction:column;gap:.75rem}.hero-meta{list-style:none;display:flex;gap:1.25rem;padding:0;margin:1.5rem 0 0;color:hsla(0,0%,100%,.8);font-weight:600}.hero-visual{position:relative;padding:2rem}.hero-visual::after{content:"";position:absolute;inset:8% 6% 0;background:radial-gradient(circle, rgba(255, 255, 255, 0.13), transparent 65%);filter:blur(18px);z-index:-1}.hero-wave{position:absolute;inset:auto 0 -40px;width:88%;opacity:.6;margin-bottom:4rem;margin-left:2rem;border-bottom-right-radius:20px;border-bottom-left-radius:20px}.hero-card{background:linear-gradient(145deg, #121a2e, #1c2644);border-radius:20px;padding:1.2rem;box-shadow:0 25px 60px rgba(3,5,12,.85);position:relative}.hero-card__badge{position:absolute;top:1.25rem;right:1.25rem;border-radius:999px;border:1px solid hsla(0,0%,100%,.18);padding:.35rem .75rem;background:hsla(0,0%,100%,.07)}.badge-pill{font-size:.8rem;letter-spacing:.08em}.section-light{background:#f5f8ff;color:#0f1423;padding:5rem 0}.section-dark{background:#0f1423;padding:5rem 0}.section-header{text-align:center;max-width:620px;margin:0 auto 3rem}.section-header p{color:#97a2c5}.feature-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));gap:1.5rem}.feature-card{border-radius:18px;padding:1.75rem;background:#fff;color:#0f1423;box-shadow:0 25px 45px rgba(15,20,35,.08)}.section-dark .feature-card{background:hsla(0,0%,100%,.06);color:#e7ecff;box-shadow:none}.template-layout{display:grid;grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));gap:2.5rem;align-items:center}.template-visual{border-radius:26px;padding:1.5rem;background:linear-gradient(140deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.01));box-shadow:0 25px 50px rgba(7,10,22,.65)}.template-list{list-style:none;padding:0;margin:1.5rem 0 0}.template-list li{position:relative;padding-left:1.5rem;margin-bottom:.85rem}.template-list li::before{content:"";position:absolute;left:0;top:.65rem;width:10px;height:10px;border-radius:50%;background:#41f2b8}.workflow-steps{display:grid;grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));gap:1.5rem}.workflow-step{background:#fff;border-radius:20px;padding:2rem;box-shadow:0 30px 60px rgba(15,20,35,.08);color:#0f1423;position:relative}.workflow-step .step-number{font-size:.85rem;letter-spacing:.25em;text-transform:uppercase;color:#ff7b5f}.testimonial{color:#fff;background:linear-gradient(135deg, #6f7dff, #aa66ff)}.testimonial-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));gap:2rem;align-items:center}blockquote{margin:0;font-size:1.35rem;line-height:1.45}.terminal-card{background:rgba(4,6,12,.85);border-radius:20px;padding:1.75rem;box-shadow:0 20px 35px rgba(4,6,12,.6)}.terminal-dots{display:flex;gap:.35rem;margin-bottom:1rem}.terminal-dots span{width:10px;height:10px;border-radius:50%;background:hsla(0,0%,100%,.35)}.terminal-card pre{margin:0;padding:1rem;background:hsla(0,0%,100%,.05);border-radius:14px;overflow-x:auto}.final-cta{text-align:center}.cta-command{margin:1.5rem 0;background:rgba(16,20,35,.08);color:#6f7dff}.cta-buttons{display:flex;flex-wrap:wrap;justify-content:center;gap:1rem}.kiss-footer{background:#05070d;padding:1.5rem 0;border-top:1px solid hsla(0,0%,100%,.08);font-size:.95rem}.footer-layout{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem}.divider{color:hsla(0,0%,100%,.3);margin:0 .5rem}#primary-nav{position:relative}#primary-nav.is-open{position:absolute;top:70px;right:1.5rem;left:1.5rem;flex-direction:column;background:rgba(4,6,12,.95);padding:1.5rem;border-radius:20px;box-shadow:0 25px 60px rgba(4,6,12,.65)}.hero .btn{min-width:180px}@media(max-width: 960px){.nav-links{display:none}#primary-nav.is-open{display:flex}.nav-toggle{display:inline-flex}.hero-cta{width:100%}}@media(max-width: 720px){.container{width:min(100%,100% - 2rem)}.hero-grid{gap:2rem}.hero-visual{padding:1.25rem}.feature-card,.workflow-step,.terminal-card{padding:1.5rem}.footer-layout{flex-direction:column;text-align:center}}@media(max-width: 520px){code{width:100%;justify-content:center}.hero-meta{flex-direction:column;gap:.5rem}#primary-nav.is-open{left:1rem;right:1rem}}
+
+/*# sourceMappingURL=app.css.map*/

package/template/dist/css/app.css.map

@@ -0,0 +1 @@
+{"version":3,"file":"css/app.css","mappings":"AAoBA,qBAGE,sBAGF,UAEE,SACA,UAGF,KACE,wFA/Ba,CAgCb,iBACA,aAzBU,CA0BV,kBA/BQ,CAgCR,mCAGF,IACE,cACA,eAGF,EACE,gBAGF,SAEE,sDA/CU,CAkDZ,WACE,iBACA,8FAQF,WACE,8BACA,cAGF,EACE,cACA,qBAGF,OACE,oBAGF,SACE,kBACA,UACA,WACA,UACA,YACA,gBACA,sBACA,SAGF,KACE,oBACA,mBACA,uBACA,WACA,sBACA,oBACA,+BACA,gBACA,eACA,+FAIF,aACE,qDACA,WACA,0CAEA,mBACE,2BAIJ,mBACE,WACA,gCAEA,yBACE,kBACA,+BAIJ,kBACE,aAhHU,CAiHV,+BAEA,wBACE,kBApHQ,CAqHR,WAIJ,KACE,oBACA,mBACA,mBACA,sBACA,+BACA,aA5HiB,CA6HjB,iBAGF,MACE,sBAGF,QACE,gBACA,MACA,WACA,yBACA,uDAGF,cACE,aACA,mBACA,8BACA,SACA,iBAGF,cACE,oBACA,mBACA,WACA,WACA,gBACA,qBAGF,WACE,aACA,gBACA,SACA,mBACA,SACA,UAGF,cACE,aAGF,aACE,yBACA,gBACA,qBACA,4BAEA,mBACE,WAIJ,gBACE,iBACA,oBAGF,YACE,aACA,sBACA,uBACA,QACA,YACA,mBACA,cACA,8BACA,WACA,eAGF,iBACE,cACA,WACA,WACA,wBAGF,YACE,2BACA,uCACA,2BAGF,WACE,kBACA,aACA,2DACA,WACA,mBAGF,cACE,mCACA,gBACA,mBAGF,SACE,yBACA,oBACA,iBACA,aAtOiB,CAyOnB,UACE,kBACA,aACA,sBACA,WAGF,WACE,gBACA,aACA,YACA,UACA,kBACA,yBACA,gBAGF,aACE,kBACA,aAGF,oBACE,WACA,kBACA,cACA,+EAKA,kBACA,WAGF,WACE,kBACA,mBACA,UACA,WACA,mBACA,iBACA,gCACA,+BAGF,WACE,qDACA,kBAvRO,CAwRP,eACA,wCACA,kBAGF,kBACE,kBACA,YACA,cACA,oBACA,qCACA,sBACA,+BAGF,YACE,gBACA,qBAGF,eACE,kBArTS,CAsTT,aAnTU,CAoTV,eAGF,cACE,kBA9TS,CA+TT,eAGF,gBACE,kBACA,gBACA,mBAGF,kBACE,aApUW,CAuUb,cACE,aACA,2DACA,WAGF,cACE,mBACA,gBACA,gBACA,aAhVU,CAiVV,0CAGF,4BACE,+BACA,aAxVU,CAyVV,gBAGF,iBACE,aACA,2DACA,WACA,mBAGF,iBACE,mBACA,eACA,yFAKA,yCAGF,eACE,gBACA,UACA,kBAGF,kBACE,kBACA,oBACA,qBAGF,0BACE,WACA,kBACA,OACA,WACA,WACA,YACA,kBACA,kBA7XiB,CAgYnB,gBACE,aACA,2DACA,WAGF,eACE,gBACA,mBACA,aACA,0CACA,aA9YU,CA+YV,kBAGF,4BACE,iBACA,qBACA,yBACA,aApZO,CAuZT,aACE,WACA,qDAGF,kBACE,aACA,2DACA,SACA,mBAGF,WACE,SACA,kBACA,iBAGF,eACE,4BACA,mBACA,gBACA,uCAGF,eACE,aACA,WACA,mBAGF,oBACE,WACA,YACA,kBACA,+BAGF,mBACE,SACA,aACA,+BACA,mBACA,gBAGF,WACE,kBAGF,aACE,gBACA,8BACA,aA7cQ,CAgdV,aACE,aACA,eACA,uBACA,SAGF,aACE,mBACA,iBACA,yCACA,iBAGF,eACE,aACA,eACA,mBACA,8BACA,SAGF,SACE,yBACA,eAGF,aACE,kBAGF,qBACE,kBACA,SACA,aACA,YACA,sBACA,4BACA,eACA,mBACA,wCAGF,WACE,gBAGF,yBACE,WACE,aAGF,qBACE,aAGF,YACE,oBAGF,UACE,YAIJ,yBACE,WACE,4BAGF,WACE,SAGF,aACE,gBAGF,4CAGE,eAGF,eACE,sBACA,mBAIJ,yBACE,KACE,WACA,uBAGF,WACE,sBACA,UAGF,qBACE,UACA,Y","sources":["webpack://kiss-app/./src/scss/app.scss"],"sourcesContent":["@use \"sass:color\";\n\n$font-display: \"Space Grotesk\", \"Sora\", system-ui, -apple-system,\n  BlinkMacSystemFont, sans-serif;\n$font-mono: \"JetBrains Mono\", \"Space Grotesk\", monospace;\n$bg-body: #04060c;\n$bg-panel: #0f1423;\n$bg-card: #121a2e;\n$bg-card-alt: #1c2644;\n$bg-light: #f5f8ff;\n$text-base: #e7ecff;\n$text-muted: #97a2c5;\n$text-dark: #0f1423;\n$primary: #6f7dff;\n$accent: #ff7b5f;\n$accent-secondary: #41f2b8;\n$border: rgba(255, 255, 255, 0.12);\n$radius: 20px;\n$transition: 220ms ease;\n\n*,\n*::before,\n*::after {\n  box-sizing: border-box;\n}\n\nhtml,\nbody {\n  margin: 0;\n  padding: 0;\n}\n\nbody {\n  font-family: $font-display;\n  line-height: 1.65;\n  color: $text-base;\n  background: $bg-body;\n  -webkit-font-smoothing: antialiased;\n}\n\nimg {\n  display: block;\n  max-width: 100%;\n}\n\np {\n  margin: 0 0 1rem;\n}\n\ncode,\npre {\n  font-family: $font-mono;\n}\n\n.kiss-site {\n  min-height: 100vh;\n  background: radial-gradient(\n      circle at top,\n      rgba(110, 125, 255, 0.15),\n      transparent 55%\n    )\n    $bg-body;\n}\n\n.container {\n  width: min(1120px, calc(100% - 3rem));\n  margin: 0 auto;\n}\n\na {\n  color: inherit;\n  text-decoration: none;\n}\n\nbutton {\n  font-family: inherit;\n}\n\n.sr-only {\n  position: absolute;\n  width: 1px;\n  height: 1px;\n  padding: 0;\n  margin: -1px;\n  overflow: hidden;\n  clip: rect(0, 0, 0, 0);\n  border: 0;\n}\n\n.btn {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  gap: 0.35rem;\n  padding: 0.65rem 1.5rem;\n  border-radius: 999px;\n  border: 1px solid transparent;\n  font-weight: 600;\n  cursor: pointer;\n  transition: background $transition, color $transition,\n    border-color $transition, transform $transition;\n}\n\n.btn-primary {\n  background: linear-gradient(120deg, $primary, $accent);\n  color: #fff;\n  box-shadow: 0 15px 35px rgba(13, 18, 43, 0.45);\n\n  &:hover {\n    transform: translateY(-2px);\n  }\n}\n\n.btn-outline-light {\n  color: #fff;\n  border-color: rgba(255, 255, 255, 0.5);\n\n  &:hover {\n    border-color: #fff;\n    background: rgba(255, 255, 255, 0.08);\n  }\n}\n\n.btn-outline-dark {\n  color: $text-dark;\n  border-color: rgba(15, 20, 35, 0.2);\n\n  &:hover {\n    background: $text-dark;\n    color: #fff;\n  }\n}\n\ncode {\n  display: inline-flex;\n  align-items: center;\n  border-radius: 12px;\n  padding: 0.35rem 0.75rem;\n  background: rgba(255, 255, 255, 0.06);\n  color: $accent-secondary;\n  font-size: 0.95rem;\n}\n\n.hero {\n  padding: 2.5rem 0 4rem;\n}\n\n.navbar {\n  position: sticky;\n  top: 0;\n  z-index: 20;\n  background: transparent;\n  transition: background $transition, box-shadow $transition;\n}\n\n.navbar-inner {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 1rem;\n  padding: 0.75rem 0;\n}\n\n.navbar-brand {\n  display: inline-flex;\n  align-items: center;\n  gap: 0.75rem;\n  color: #fff;\n  font-weight: 600;\n  letter-spacing: 0.05em;\n}\n\n.nav-links {\n  display: flex;\n  list-style: none;\n  gap: 1rem;\n  align-items: center;\n  margin: 0;\n  padding: 0;\n}\n\n.nav-links li {\n  display: flex;\n}\n\n.nav-links a {\n  color: rgba(255, 255, 255, 0.8);\n  font-weight: 500;\n  padding: 0.35rem 0.6rem;\n  transition: color $transition;\n\n  &:hover {\n    color: #fff;\n  }\n}\n\n.nav-links .btn {\n  font-size: 0.85rem;\n  padding-inline: 1rem;\n}\n\n.nav-toggle {\n  display: none;\n  flex-direction: column;\n  justify-content: center;\n  gap: 4px;\n  border: none;\n  border-radius: 12px;\n  padding: 0.6rem;\n  background: rgba(255, 255, 255, 0.1);\n  color: #fff;\n  cursor: pointer;\n}\n\n.nav-toggle span {\n  display: block;\n  width: 22px;\n  height: 2px;\n  background: currentColor;\n}\n\n.nav-scroll {\n  background: rgba(4, 6, 12, 0.9);\n  box-shadow: 0 15px 35px rgba(4, 6, 12, 0.6);\n  backdrop-filter: blur(12px);\n}\n\n.hero-grid {\n  margin-top: 2.5rem;\n  display: grid;\n  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));\n  gap: 2.5rem;\n  align-items: center;\n}\n\n.hero-copy h1 {\n  font-size: clamp(2.5rem, 5vw, 3.8rem);\n  line-height: 1.1;\n  margin-bottom: 1rem;\n}\n\n.eyebrow {\n  text-transform: uppercase;\n  letter-spacing: 0.3em;\n  font-size: 0.75rem;\n  color: $accent-secondary;\n}\n\n.hero-cta {\n  margin-top: 1.5rem;\n  display: flex;\n  flex-direction: column;\n  gap: 0.75rem;\n}\n\n.hero-meta {\n  list-style: none;\n  display: flex;\n  gap: 1.25rem;\n  padding: 0;\n  margin: 1.5rem 0 0;\n  color: rgba(255, 255, 255, 0.8);\n  font-weight: 600;\n}\n\n.hero-visual {\n  position: relative;\n  padding: 2rem;\n}\n\n.hero-visual::after {\n  content: \"\";\n  position: absolute;\n  inset: 8% 6% 0;\n  background: radial-gradient(\n    circle,\n    rgba(255, 255, 255, 0.13),\n    transparent 65%\n  );\n  filter: blur(18px);\n  z-index: -1;\n}\n\n.hero-wave {\n  position: absolute;\n  inset: auto 0 -40px;\n  width: 88%;\n  opacity: 0.6;\n  margin-bottom: 4rem;\n  margin-left: 2rem;\n  border-bottom-right-radius: 20px;\n  border-bottom-left-radius: 20px;\n}\n\n.hero-card {\n  background: linear-gradient(145deg, $bg-card, $bg-card-alt);\n  border-radius: $radius;\n  padding: 1.2rem;\n  box-shadow: 0 25px 60px rgba(3, 5, 12, 0.85);\n  position: relative;\n}\n\n.hero-card__badge {\n  position: absolute;\n  top: 1.25rem;\n  right: 1.25rem;\n  border-radius: 999px;\n  border: 1px solid rgba(255, 255, 255, 0.18);\n  padding: 0.35rem 0.75rem;\n  background: rgba(255, 255, 255, 0.07);\n}\n\n.badge-pill {\n  font-size: 0.8rem;\n  letter-spacing: 0.08em;\n}\n\n.section-light {\n  background: $bg-light;\n  color: $text-dark;\n  padding: 5rem 0;\n}\n\n.section-dark {\n  background: $bg-panel;\n  padding: 5rem 0;\n}\n\n.section-header {\n  text-align: center;\n  max-width: 620px;\n  margin: 0 auto 3rem;\n}\n\n.section-header p {\n  color: $text-muted;\n}\n\n.feature-grid {\n  display: grid;\n  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));\n  gap: 1.5rem;\n}\n\n.feature-card {\n  border-radius: 18px;\n  padding: 1.75rem;\n  background: #fff;\n  color: $text-dark;\n  box-shadow: 0 25px 45px rgba(15, 20, 35, 0.08);\n}\n\n.section-dark .feature-card {\n  background: rgba(255, 255, 255, 0.06);\n  color: $text-base;\n  box-shadow: none;\n}\n\n.template-layout {\n  display: grid;\n  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));\n  gap: 2.5rem;\n  align-items: center;\n}\n\n.template-visual {\n  border-radius: 26px;\n  padding: 1.5rem;\n  background: linear-gradient(\n    140deg,\n    rgba(255, 255, 255, 0.04),\n    rgba(255, 255, 255, 0.01)\n  );\n  box-shadow: 0 25px 50px rgba(7, 10, 22, 0.65);\n}\n\n.template-list {\n  list-style: none;\n  padding: 0;\n  margin: 1.5rem 0 0;\n}\n\n.template-list li {\n  position: relative;\n  padding-left: 1.5rem;\n  margin-bottom: 0.85rem;\n}\n\n.template-list li::before {\n  content: \"\";\n  position: absolute;\n  left: 0;\n  top: 0.65rem;\n  width: 10px;\n  height: 10px;\n  border-radius: 50%;\n  background: $accent-secondary;\n}\n\n.workflow-steps {\n  display: grid;\n  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));\n  gap: 1.5rem;\n}\n\n.workflow-step {\n  background: #fff;\n  border-radius: 20px;\n  padding: 2rem;\n  box-shadow: 0 30px 60px rgba(15, 20, 35, 0.08);\n  color: $text-dark;\n  position: relative;\n}\n\n.workflow-step .step-number {\n  font-size: 0.85rem;\n  letter-spacing: 0.25em;\n  text-transform: uppercase;\n  color: $accent;\n}\n\n.testimonial {\n  color: #fff;\n  background: linear-gradient(135deg, #6f7dff, #aa66ff);\n}\n\n.testimonial-grid {\n  display: grid;\n  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));\n  gap: 2rem;\n  align-items: center;\n}\n\nblockquote {\n  margin: 0;\n  font-size: 1.35rem;\n  line-height: 1.45;\n}\n\n.terminal-card {\n  background: rgba(4, 6, 12, 0.85);\n  border-radius: 20px;\n  padding: 1.75rem;\n  box-shadow: 0 20px 35px rgba(4, 6, 12, 0.6);\n}\n\n.terminal-dots {\n  display: flex;\n  gap: 0.35rem;\n  margin-bottom: 1rem;\n}\n\n.terminal-dots span {\n  width: 10px;\n  height: 10px;\n  border-radius: 50%;\n  background: rgba(255, 255, 255, 0.35);\n}\n\n.terminal-card pre {\n  margin: 0;\n  padding: 1rem;\n  background: rgba(255, 255, 255, 0.05);\n  border-radius: 14px;\n  overflow-x: auto;\n}\n\n.final-cta {\n  text-align: center;\n}\n\n.cta-command {\n  margin: 1.5rem 0;\n  background: rgba(16, 20, 35, 0.08);\n  color: $primary;\n}\n\n.cta-buttons {\n  display: flex;\n  flex-wrap: wrap;\n  justify-content: center;\n  gap: 1rem;\n}\n\n.kiss-footer {\n  background: #05070d;\n  padding: 1.5rem 0;\n  border-top: 1px solid rgba(255, 255, 255, 0.08);\n  font-size: 0.95rem;\n}\n\n.footer-layout {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n  justify-content: space-between;\n  gap: 1rem;\n}\n\n.divider {\n  color: rgba(255, 255, 255, 0.3);\n  margin: 0 0.5rem;\n}\n\n#primary-nav {\n  position: relative;\n}\n\n#primary-nav.is-open {\n  position: absolute;\n  top: 70px;\n  right: 1.5rem;\n  left: 1.5rem;\n  flex-direction: column;\n  background: rgba(4, 6, 12, 0.95);\n  padding: 1.5rem;\n  border-radius: 20px;\n  box-shadow: 0 25px 60px rgba(4, 6, 12, 0.65);\n}\n\n.hero .btn {\n  min-width: 180px;\n}\n\n@media (max-width: 960px) {\n  .nav-links {\n    display: none;\n  }\n\n  #primary-nav.is-open {\n    display: flex;\n  }\n\n  .nav-toggle {\n    display: inline-flex;\n  }\n\n  .hero-cta {\n    width: 100%;\n  }\n}\n\n@media (max-width: 720px) {\n  .container {\n    width: min(100%, calc(100% - 2rem));\n  }\n\n  .hero-grid {\n    gap: 2rem;\n  }\n\n  .hero-visual {\n    padding: 1.25rem;\n  }\n\n  .feature-card,\n  .workflow-step,\n  .terminal-card {\n    padding: 1.5rem;\n  }\n\n  .footer-layout {\n    flex-direction: column;\n    text-align: center;\n  }\n}\n\n@media (max-width: 520px) {\n  code {\n    width: 100%;\n    justify-content: center;\n  }\n\n  .hero-meta {\n    flex-direction: column;\n    gap: 0.5rem;\n  }\n\n  #primary-nav.is-open {\n    left: 1rem;\n    right: 1rem;\n  }\n}\n"],"names":[],"ignoreList":[],"sourceRoot":""}

package/template/dist/index.html

@@ -0,0 +1,4 @@
+<!doctype html><html lang="en"><head><meta charset="UTF-8"/><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/><meta name="viewport" content="width=device-width,initial-scale=1"/><title>K.I.S.S – Keepin' It Simply Stupid Starter</title><meta name="description" content="K.I.S.S is a Webpack + Sass starter that scaffolds bold marketing pages in seconds. Ship handcrafted landers without wrestling with boilerplate."/><meta name="keywords" content="landing page starter, webpack sass template, marketing scaffold, create-kiss CLI"/><meta property="og:title" content="K.I.S.S – Lightning-fast landing pages"/><meta property="og:description" content="Spin up a complete landing page with one command using create-kiss."/><meta property="og:type" content="website"/><meta property="og:image" content="assets/images/logo.png"/><link rel="preconnect" href="https://fonts.googleapis.com"/><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin/><link href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=JetBrains+Mono:wght@400;600&display=swap" rel="stylesheet"/><link rel="stylesheet" href="css/app.css"/><link href="css/app.css" rel="stylesheet"></head><body class="kiss-site"><header class="hero" id="top"><nav class="navbar"><div class="container navbar-inner"><a class="navbar-brand" href="#top"><img src="assets/images/logo.png" alt="K.I.S.S logo" class="logo" width="56" height="56" style="height: 38px"/> <span class="brand-copy">K.I.S.S Library</span> </a><button class="nav-toggle" data-nav-toggle aria-expanded="false" aria-controls="primary-nav"><span class="sr-only">Toggle navigation</span> <span></span> <span></span> <span></span></button><ul id="primary-nav" class="nav-links"><li><a href="#features">Features</a></li><li><a href="#templates">Template</a></li><li><a href="#workflow">Workflow</a></li><li><a class="btn btn-outline-light" href="#cta">Get K.I.S.S</a></li></ul></div></nav><div class="container hero-grid"><div class="hero-copy"><p class="eyebrow">Keepin' It Simply Stupid</p><h1>Ship bold marketing pages in minutes — not weekends.</h1><p>The <strong>create-kiss</strong> CLI copies a polished Webpack + Sass starter into your project, so you focus on storytelling while the stack stays tidy.</p><div class="hero-cta"><code>npx @misterzik/create-kiss launch-day</code> <a class="btn btn-primary" href="#templates">See what's included</a></div><ul class="hero-meta"><li>Multi-page ready</li><li>SCSS + asset pipeline</li><li>Motion-ready sections</li></ul></div><div class="hero-visual"><div class="hero-card"><img src="assets/images/iphone-screen.png" alt="Landing preview"/><div class="hero-card__badge"><span class="badge-pill">Scaffolded in 12s</span></div></div><img src="assets/images/wavy.svg" alt="" class="hero-wave" aria-hidden="true"/></div></div></header><main><section id="features" class="section-light"><div class="container"><div class="section-header text-center"><p class="eyebrow">Why teams pick K.I.S.S</p><h2>Opinionated defaults, zero dead weight.</h2><p>Everything inside <code>src/</code> is yours to tweak, while the tooling stays battle-tested and boring.</p></div><div class="feature-grid"><article class="feature-card"><h3>Designer-first layout kit</h3><p>Polished hero, feature, testimonial, and pricing sections built with clean SCSS partials so you can restyle instantly.</p></article><article class="feature-card"><h3>Modern stack defaults</h3><p>Webpack 5, Babel, image/font pipelines, hot reload, and tree-shaken bundles configured out of the box.</p></article><article class="feature-card"><h3>CLI ergonomics</h3><p>Friendly prompts, name normalization, and guard rails prevent overwriting existing work while keeping setup as easy as one command.</p></article></div></div></section><section id="templates" class="section-dark"><div class="container template-layout"><div class="template-visual"><img src="assets/images/simon-lee-earth.jpg" alt="Template preview" style="border-radius: 26px;"/></div><div><p class="eyebrow text-accent">Inside the template</p><h2>Your entire narrative inside <code>src/</code>.</h2><ul class="template-list"><li><strong>/src/index.html</strong> – hero, feature grid, trust indicators.</li><li><strong>/src/pages/</strong> – optional extra pages wired to HtmlWebpack.</li><li><strong>/src/scss/</strong> – tokens, mixins, and layout partials with meaningful naming.</li><li><strong>/src/js/app.js</strong> – animation hooks, sample interactions, and space for your scripts.</li></ul><a class="btn btn-outline-light" href="#cta">Generate my copy</a></div></div></section><section id="workflow" class="section-light"><div class="container"><div class="section-header text-center"><p class="eyebrow">3-step developer flow</p><h2>From zero to landing page faster than brewing coffee.</h2></div><div class="workflow-steps"><article class="workflow-step"><span class="step-number">01</span><h3>Scaffold</h3><p>Run the CLI, name your project, and let K.I.S.S copy the entire template.</p></article><article class="workflow-step"><span class="step-number">02</span><h3>Create</h3><p>Edit the HTML/SCSS sections that matter. Typography, palettes, and imagery are all yours.</p></article><article class="workflow-step"><span class="step-number">03</span><h3>Ship</h3><p><code>npm run build</code> outputs an optimized bundle ready for any static host or CDN with zero additional config.</p></article></div></div></section><section class="section-dark testimonial"><div class="container testimonial-grid"><div><blockquote>“Every marketing experiment deserves great visuals, not boilerplate wrestling. K.I.S.S let our team draft three landing pages in a single afternoon.”</blockquote><p class="author">— Vimedev Agency</p></div><div class="terminal-card"><div class="terminal-dots"><span></span><span></span><span></span></div><pre><code>npx @misterzik/create-kiss spring-campaign
+cd spring-campaign
+npm install
+npm run start</code></pre><p class="terminal-note">Hot reload + Sass pipeline ready.</p></div></div></section><section id="cta" class="section-light final-cta text-center"><div class="container"><p class="eyebrow">Ready to keep it simple?</p><h2>Spin up your next landing page with K.I.S.S today.</h2><p>Stop rebuilding the same grid every launch. Scaffold once, remix endlessly, and keep the creative energy on the experience.</p><code class="cta-command">npx @misterzik/create-kiss your-brand</code><div class="cta-buttons"><a class="btn btn-primary" href="https://www.npmjs.com/package/@misterzik/create-kiss">View on npm </a><a class="btn btn-outline-dark" href="docs/DEVELOPER.md">Contributor docs</a></div></div></section></main><footer class="kiss-footer"><div class="container footer-layout"><p>&copy; <span id="year"></span> K.I.S.S Starter · Crafted by Keepin' It Simply Stupid</p><p><a href="https://github.com/misterzik" target="_blank" rel="noopener">GitHub</a> <span class="divider">·</span> <a href="mailto:hello@kiss.dev">Contact</a></p></div></footer><script defer="defer" src="bundle.js"></script></body></html>