import type { Config } from "tailwindcss";

/**
 * EDITORIAL DESIGN SYSTEM — "Issue 01"
 * ------------------------------------------------------------------
 * High-contrast, magazine-spread aesthetic. The whole site re-themes
 * from the tokens below.
 *
 * CUSTOMIZATION HOOK — COLOR PALETTE
 *   ink        → near-black, all primary type & rules
 *   ivory      → warm paper background
 *   paper      → slightly dimmer paper for cards / insets
 *   vermillion → MCM thrust accent (hot)        [Thrust 1]
 *   cobalt     → QUIC thrust accent (cool)      [Thrust 2]
 * Swap any hex and the entire editorial system follows.
 *
 * CUSTOMIZATION HOOK — FONTS
 *   font-display  → Fraunces (English serif, magazine-cover scale)
 *   font-serif-ko → Noto Serif KR (Korean serif headlines)
 *   font-sans     → Pretendard / Inter (clean body)
 * Font CSS variables are injected by next/font in app/layout.tsx.
 */
const config: Config = {
  content: [
    "./app/**/*.{ts,tsx}",
    "./components/**/*.{ts,tsx}",
  ],
  theme: {
    extend: {
      colors: {
        ink: {
          DEFAULT: "#0A0A0A",
          soft: "#262420",
          mute: "#6B655B",
        },
        ivory: "#F5F1E8",
        paper: "#ECE6D6",
        line: "#D8D1C0",
        vermillion: {
          DEFAULT: "#D9342B",
          dark: "#A8231C",
        },
        cobalt: {
          DEFAULT: "#1B3A8A",
          dark: "#122863",
        },
        // Back-compat aliases so any stray legacy class still resolves.
        brand: {
          DEFAULT: "#D9342B",
          dark: "#A8231C",
          light: "#1B3A8A",
        },
        accent: { DEFAULT: "#1B3A8A" },
      },
      fontFamily: {
        // English display serif — magazine cover scale.
        display: ["var(--font-display)", "Fraunces", "Georgia", "serif"],
        // Korean serif headlines.
        "serif-ko": ["var(--font-serif-ko)", "Noto Serif KR", "serif"],
        // Clean sans body. Pretendard preferred, Inter as web fallback.
        sans: [
          "Pretendard",
          "var(--font-sans)",
          "Inter",
          "ui-sans-serif",
          "system-ui",
          "Apple SD Gothic Neo",
          "Malgun Gothic",
          "sans-serif",
        ],
      },
      fontSize: {
        // Magazine-cover display scale. Capped at 7rem (was 9rem) so the
        // longest single word ("Standards" on /intro col-span-7) does not
        // overflow the column at 1280+ viewports. See LAYOUT_AUDIT #7.
        display: ["clamp(2.75rem, 9vw, 7rem)", { lineHeight: "0.95", letterSpacing: "-0.02em" }],
        "display-sm": ["clamp(2rem, 5.5vw, 3.75rem)", { lineHeight: "1.02", letterSpacing: "-0.01em" }],
      },
      maxWidth: {
        content: "78rem",
        prose: "44rem",
      },
      letterSpacing: {
        caps: "0.28em",
      },
      keyframes: {
        marquee: {
          "0%": { transform: "translateX(0)" },
          "100%": { transform: "translateX(-50%)" },
        },
        "marquee-reverse": {
          "0%": { transform: "translateX(-50%)" },
          "100%": { transform: "translateX(0)" },
        },
        "stream-dash": {
          to: { strokeDashoffset: "-1000" },
        },
        "node-pulse": {
          "0%, 100%": { opacity: "0.35", transform: "scale(1)" },
          "50%": { opacity: "1", transform: "scale(1.12)" },
        },
      },
      animation: {
        // CUSTOMIZATION HOOK — MOTION: tune marquee speed here.
        marquee: "marquee 32s linear infinite",
        "marquee-slow": "marquee 60s linear infinite",
        "marquee-reverse": "marquee-reverse 45s linear infinite",
        "stream-dash": "stream-dash 6s linear infinite",
        "node-pulse": "node-pulse 4s ease-in-out infinite",
      },
    },
  },
  plugins: [],
};

export default config;