/* Tokenstok — custom overrides */
:root {
  --tk-primary: #B4531A;
  --tk-primary-dark: #8B2A17;
  --tk-cream: #F5EDDD;
  --tk-kraft: #EFE7D6;
  --tk-ink: #1C1917;
}

html { scroll-behavior: smooth; }
body { background-color: var(--tk-kraft); color: var(--tk-ink); font-family: 'DM Sans', system-ui, sans-serif; }
.font-display { font-family: 'Fraunces', 'Georgia', serif; font-optical-sizing: auto; }

/* Grain texture overlay for hero sections */
.tk-grain { position: relative; }
.tk-grain::after {
  content: '';
  position: absolute; inset: 0;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.1 0 0 0 0 0.06 0 0 0 0 0.03 0 0 0 0.35 0'/></filter><rect width='100%' height='100%' filter='url(%23n)' opacity='0.55'/></svg>");
  mix-blend-mode: multiply;
  opacity: 0.35;
  pointer-events: none;
}

/* Reveal-on-scroll */
[data-reveal] { opacity: 0; transform: translateY(24px); transition: opacity 700ms cubic-bezier(.2,.7,.2,1), transform 700ms cubic-bezier(.2,.7,.2,1); }
[data-reveal].is-revealed { opacity: 1; transform: none; }
[data-reveal-delay="1"] { transition-delay: 80ms; }
[data-reveal-delay="2"] { transition-delay: 160ms; }
[data-reveal-delay="3"] { transition-delay: 240ms; }
[data-reveal-delay="4"] { transition-delay: 320ms; }

/* Hero title stagger */
.tk-stagger > * { opacity: 0; transform: translateY(20px); animation: tk-in 800ms cubic-bezier(.2,.7,.2,1) forwards; }
.tk-stagger > *:nth-child(1) { animation-delay: 100ms; }
.tk-stagger > *:nth-child(2) { animation-delay: 260ms; }
.tk-stagger > *:nth-child(3) { animation-delay: 420ms; }
.tk-stagger > *:nth-child(4) { animation-delay: 580ms; }
@keyframes tk-in { to { opacity: 1; transform: none; } }

/* Underline animated link */
.tk-link { position: relative; }
.tk-link::after { content: ''; position: absolute; left: 0; right: 100%; bottom: -2px; height: 1px; background: currentColor; transition: right 280ms ease; }
.tk-link:hover::after { right: 0; }

/* Section number */
.tk-num { font-family: 'Fraunces', serif; font-style: italic; color: var(--tk-primary); font-weight: 300; }

/* Card hover glide */
.tk-card { transition: transform 380ms cubic-bezier(.2,.7,.2,1), box-shadow 380ms ease; }
.tk-card:hover { transform: translateY(-4px); box-shadow: 0 24px 60px -18px rgba(28,25,23,0.25); }

/* Pill tag */
.tk-tag { display: inline-flex; align-items: center; gap: 8px; padding: 6px 14px; border-radius: 999px; background: rgba(180,83,26,0.1); color: var(--tk-primary); font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; font-weight: 500; }
.tk-tag::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--tk-primary); }