/* Halaman 404; dimuat dari src/app/not-found.tsx */ .nf { position: relative; isolation: isolate; /* Variabel font menempel di elemen ini, bukan di , jadi aturan body di mova.css tidak menjangkaunya. */ font-family: var(--font-mova-text), sans-serif; background: var(--paper); color: var(--ink); min-height: 100svh; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; padding: 48px 24px 64px; text-align: center; overflow: hidden; } /* Sapuan cahaya hangat: satu-satunya ornamen, menjaga halaman tetap tenang. */ .nf-glow { position: absolute; z-index: -1; top: -28vmin; width: min(760px, 120vw); aspect-ratio: 1; border-radius: 50%; background: radial-gradient( circle at 50% 45%, rgba(232, 93, 42, .16), rgba(221, 229, 210, .5) 42%, transparent 68% ); } .nf-eyebrow { margin: 0; color: var(--mova-muted); font-size: var(--text-xs); letter-spacing: .32em; } .nf-code { margin: 4px 0 0; font-family: var(--font-mova-display), sans-serif; font-size: clamp(96px, 22vw, 196px); line-height: .9; letter-spacing: -.04em; color: var(--ink); opacity: .12; } .nf-title { margin: -12px 0 0; font-family: var(--font-mova-display), sans-serif; font-size: clamp(26px, 5vw, 40px); font-weight: 400; letter-spacing: -.02em; } .nf-lead { margin: 14px 0 0; max-width: 44ch; color: var(--mova-muted); text-wrap: balance; } .nf-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-top: 32px; } .nf-cta { display: inline-flex; align-items: center; border-radius: 999px; padding: 13px 26px; background: var(--ink); color: var(--paper); font-size: var(--text-sm); letter-spacing: .02em; transition: transform .18s ease, opacity .18s ease; } .nf-cta:hover { transform: translateY(-1px); opacity: .9; } .nf-cta.ghost { background: transparent; color: var(--ink); border: 1px solid var(--line); } .nf-cta.ghost:hover { border-color: var(--ink); } @media (prefers-reduced-motion: reduce) { .nf-cta { transition: none; } .nf-cta:hover { transform: none; } }