/* Verum Forge — site styles */
* { box-sizing: border-box; }
  html, body { margin: 0; padding: 0; }
  body { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; background: oklch(0.974 0.002 250); color: oklch(0.175 0.05 265); -webkit-font-smoothing: antialiased; text-wrap: pretty; }
  a { color: inherit; text-decoration: none; }
  a:hover { color: oklch(0.60 0.14 78); }
  h1, h2, h3, h4, p { margin: 0; }
  img { display: block; max-width: 100%; height: auto }
  :focus-visible { outline: 2px solid oklch(0.62 0.14 78); outline-offset: 3px; }
  /* --- mobile --- */
  @media (max-width: 820px) {
    [data-m="hdr-in"] { height: auto; flex-wrap: wrap; row-gap: 0; padding-top: 10px; padding-bottom: 10px; }
    [data-m="hdr-cta"] { margin-left: auto; }
    [data-m="nav"] { order: 3; flex-basis: 100%; flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; gap: 20px; padding: 4px 0 2px; margin-top: 4px; border-top: 1px solid oklch(0.295 0.045 265); }
    [data-m="nav"]::-webkit-scrollbar { display: none; }
    [data-m="nav"] a { white-space: nowrap; padding: 8px 0; }
  }
  @media (max-width: 520px) {
    [data-m="hdr-cta"] a { font-size: 13.5px; padding: 11px 14px; }
    h1 { letter-spacing: -0.03em; }
  }

  @media (prefers-reduced-motion: reduce) { #top svg g { animation: none !important } .vf-rise { animation: none !important } }
  @keyframes vfMark { 0% { opacity: 0; transform: scale(0.4) } 6% { opacity: 1; transform: scale(1.18) } 12% { transform: scale(1) } 88% { opacity: 1 } 96%, 100% { opacity: 0 } }
  @keyframes vfLink { 0% { stroke-dashoffset: var(--len, 600); opacity: 0 } 4% { opacity: 0.85 } 22% { stroke-dashoffset: 0 } 84% { opacity: 0.85 } 94%, 100% { opacity: 0 } }
  @keyframes vfSweep { from { transform: translateX(0) } to { transform: translateX(1440px) } }
  @keyframes vfRise { from { opacity: 0; transform: translateY(16px) } to { opacity: 1; transform: none } }
  .vf-rise { animation: vfRise 720ms cubic-bezier(.2,.7,.2,1) both }

/* interaction states */
.vfx0:hover { background: oklch(0.87 0.13 80) !important; }
.vfx1:hover { color: oklch(0.80 0.14 78) !important; }

/* scroll reveal — content is fully visible without JS */
.vf-reveal { opacity: 0; transform: translateY(18px); }
.vf-reveal.vf-in { animation: vfRise 720ms cubic-bezier(.2,.7,.2,1) both; }
@media (prefers-reduced-motion: reduce) {
  .vf-reveal, .vf-reveal.vf-in { opacity: 1; transform: none; animation: none; }
}

/* anchors clear the sticky header */
[id] { scroll-margin-top: 78px; }
