1. What you have
Every page is a folder under src/app/, one per route, and the collections behind them are files under src/content/. Everything the browser downloads unchanged lives in public/assets/: one stylesheet at public/assets/css/styles.css, the self-hosted webfont in public/assets/fonts/ and every image in public/assets/images/. Run npm install once, then npm run dev — edit a file and the page updates without a refresh.
2. Colours, type and spacing
The design's variables are declared once, in the :root block at the top of public/assets/css/styles.css. Changing --_colors---primary-colors--primary restyles every page that uses it, and the same is true of the type scale, the line heights and the section padding. Search the stylesheet for --_typography and --_colors to see the full set — those two groups are where almost every visual change you will want to make belongs.
3. Type
The template sets its type in Inter Tight, served from public/assets/fonts/ rather than from Google's CDN, so a page makes no third-party request. To change it, replace the .woff2 file and the @font-face block in public/assets/fonts/fonts.css, then point --_typography---font-family--global-font at the new family name. Headings level 3 and 4 use a system stack and download nothing.
4. Motion
All of the motion is CSS, driven by a small amount of TypeScript in src/components/formix-scripts.tsx. Scroll reveals are the .reveal classes with a data-reveal-delay in milliseconds; scroll-linked sections carry data-scrub and are animated by @keyframes in the components section of the stylesheet. Every animation is disabled under prefers-reduced-motion, so there is nothing to switch off for accessibility. To remove a reveal, delete its reveal reveal-* classes from the element.
5. The cart and the forms
The shop is a working demonstration: the basket, the quantity controls, the subtotal and the checkout run on localStorage, under the key formix:cart. Nothing is sent anywhere and no payment is taken — connect your own provider at placeOrder() in src/lib/cart.ts when you are ready. The contact and newsletter forms validate and show the design's own success message; point their action at your form service to make them live.
6. Still stuck?
If anything here is unclear, or you would like a hand adapting the template, email us at contact@kaziehsan.com. We are happy to help.