File Structure

Norio is an App Router Next.js app. After npm run build, Next emits the production output under .next — there is no HTML dist folder like a static HTML kit. Day-to-day editing happens under src/.

src/app/layout.tsx (root)

    
import type { Metadata } from "next";
import { Inter } from "next/font/google";
import site from "@/data/site.json";
import { VendorScripts } from "@/components/layout/VendorScripts";
import "@/app/globals.scss";

const inter = Inter({
  subsets: ["latin"],
  display: "swap",
  variable: "--font-inter",
});

export const metadata: Metadata = {
  title: { default: site.name, template: `%s — ${site.name}` },
  description: site.description,
};

export default function RootLayout({ children }: { children: React.ReactNode }) {
  return (
    <html lang="en" className={inter.variable} suppressHydrationWarning>
      <body className={`${inter.className} at-magic-cursor`}>
        {children}
        <VendorScripts />
      </body>
    </html>
  );
}

src/components/layout/SiteShell.tsx

Pages wrap content in SiteShell, which composes header/footer chrome and mounts client motion via EffectsLoader.

    
export type SiteShellProps = {
  children: React.ReactNode;
  headerName?: "header-1" | "header-2" | "header-3" | "header-4" | "header-5";
  footerName?: "footer-1" | "footer-2" | "footer-3";
  pageName?: string;
  enablePreLoader?: boolean;
  bodyClass?: string;
  colorScheme?: "light" | "dark";
};

// Typical page usage:
<SiteShell pageName="home-dark" colorScheme="dark" enablePreLoader>
  {/* sections */}
</SiteShell>

Key paths

src/app/**/page.tsx — routes
src/components/sections/** — section React components
src/data/*.json — copy and lists
src/styles/** — SCSS (section styles mirror HTML master)
src/effects/** — GSAP / Three.js modules
tokens/tokens.json — design tokens → CSS vars via npm run tokens
public/assets/** — static images and vendor scripts

Dependencies (package name)

    
{
  "name": "norio-nextjs-dev",
  "version": "1.0.0",
  "dependencies": {
    "next": "16.3.6",
    "react": "19.2.8",
    "react-dom": "19.2.8",
    "gsap": "^3.15.0",
    "three": "^0.184.0",
    "glightbox": "^3.3.1"
  },
  "devDependencies": {
    "sass": "^1.105.0",
    "typescript": "^5"
  }
}