:root {
  --ink: #0B1224;
  --ink-2: #141B30;
  --ink-soft: #2A314A;
  --paper: #FAF8F4;
  --paper-2: #F2EEE6;
  --paper-3: #E8E2D5;
  --gold: #C8A867;
  --gold-deep: #A88746;
  --gold-soft: #E4D4AE;
  --line: rgba(11, 18, 36, 0.10);
  --line-strong: rgba(11, 18, 36, 0.22);
  --muted: rgba(11, 18, 36, 0.65);
}
html { scroll-behavior: smooth; }
body {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 300;
  background: var(--paper);
  color: var(--ink);
  -webkit-font-smoothing: antialiased;
  letter-spacing: 0.02em;
}
.font-mincho { font-family: 'Shippori Mincho', 'Noto Serif JP', serif; }
.font-serif-en { font-family: 'Cormorant Garamond', 'Shippori Mincho', serif; }
.font-sans-jp { font-family: 'Noto Sans JP', sans-serif; }
.lede { line-height: 2.1; letter-spacing: 0.04em; font-weight: 300; }
.display { letter-spacing: 0.04em; line-height: 1.45; }
.eyebrow { letter-spacing: 0.45em; font-feature-settings: "palt"; }
.gold-line { background: linear-gradient(90deg, transparent, var(--gold) 20%, var(--gold) 80%, transparent); }
.gold-text { color: var(--gold-deep); }
.reveal { opacity: 0; transform: translateY(24px); transition: opacity 1.2s cubic-bezier(.2,.7,.2,1), transform 1.2s cubic-bezier(.2,.7,.2,1); }
.reveal.is-in { opacity: 1; transform: translateY(0); }
.reveal-delay-1 { transition-delay: .12s; }
.reveal-delay-2 { transition-delay: .24s; }
.reveal-delay-3 { transition-delay: .36s; }
.line-grow { transform: scaleX(0); transform-origin: left center; transition: transform 1.4s cubic-bezier(.2,.7,.2,1); }
.line-grow.is-in { transform: scaleX(1); }
.vertical { writing-mode: vertical-rl; text-orientation: upright; font-feature-settings: "palt"; }
.vertical-mixed { writing-mode: vertical-rl; }
.paper-grain {
  background-image:
    radial-gradient(rgba(11,18,36,0.025) 1px, transparent 1px),
    radial-gradient(rgba(11,18,36,0.015) 1px, transparent 1px);
  background-size: 3px 3px, 7px 7px;
  background-position: 0 0, 1px 1px;
}
.ink-grain { background-image: radial-gradient(rgba(255,255,255,0.025) 1px, transparent 1px); background-size: 4px 4px; }
.gold-foil {
  background: linear-gradient(135deg, #B89248 0%, #E4D4AE 30%, #C8A867 50%, #8B6F35 70%, #C8A867 100%);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
.link-arrow { transition: gap .35s ease, color .35s ease; display: inline-flex; align-items: center; gap: 8px; }
.link-arrow:hover { gap: 16px; }
@keyframes scrollDown { 0% { transform: translateY(-12px); opacity: 0; } 30% { opacity: 1; } 100% { transform: translateY(28px); opacity: 0; } }
.scroll-dot { width: 1px; height: 12px; background: currentColor; animation: scrollDown 2.4s ease-in-out infinite; }
.v-mark { writing-mode: vertical-rl; letter-spacing: 0.6em; font-size: 10px; }
.nav-blur { backdrop-filter: saturate(140%) blur(14px); -webkit-backdrop-filter: saturate(140%) blur(14px); }
::selection { background: var(--gold); color: var(--ink); }
.stardust {
  background-image:
    radial-gradient(circle at 20% 30%, rgba(200,168,103,0.06) 0%, transparent 40%),
    radial-gradient(circle at 80% 70%, rgba(200,168,103,0.05) 0%, transparent 45%);
}
.corner-marks::before, .corner-marks::after { content: ""; position: absolute; width: 16px; height: 16px; border: 1px solid var(--gold); }
.corner-marks::before { top: 0; left: 0; border-right: 0; border-bottom: 0; }
.corner-marks::after { bottom: 0; right: 0; border-left: 0; border-top: 0; }
