/* ════════════════════════════════════════
   EQUIST THEME — BASE
   Tokens, reset, typography
════════════════════════════════════════ */

*,*::before,*::after { margin:0; padding:0; box-sizing:border-box; }

:root {
  --black:    #0e0e0e;
  --charcoal: #181818;
  --white:    #f5f4f0;
  --sidebar:  70px;
  --topbar:   60px;
  --ease-expo:   cubic-bezier(0.16, 1, 0.3, 1);
  --ease-quart:  cubic-bezier(0.76, 0, 0.24, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
}

html { scroll-behavior: smooth; }

body {
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
  background: var(--white);
  color: var(--black);
  padding-left: var(--sidebar);
/*   cursor: none; */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

img { max-width: 100%; height: auto; display: block; }
a   { color: inherit; }
button { font-family: inherit; }

/* ── Cursor ── */
#cursor-dot, #cursor-ring {
  position: fixed; top: 0; left: 0;
  border-radius: 50%; pointer-events: none;
  z-index: 99999; transform: translate(-50%,-50%);
}
#cursor-dot {
  width: 7px; height: 7px;
  transition: width .3s var(--ease-expo), height .3s var(--ease-expo), background .15s ease;
}
#cursor-ring {
  width: 34px; height: 34px;
  transition: width .5s var(--ease-expo), height .5s var(--ease-expo), border-color .15s ease;
}
body.cursor-light #cursor-dot  { background: #0e0e0e; }
body.cursor-light #cursor-ring { border: 1px solid rgba(14,14,14,0.35); }
body.cursor-light.hovering #cursor-dot  { width:12px; height:12px; background:#0e0e0e; }
body.cursor-light.hovering #cursor-ring { width:52px; height:52px; border-color:rgba(14,14,14,0.7); }
body.cursor-dark #cursor-dot  { background: var(--white); }
body.cursor-dark #cursor-ring { border: 1px solid rgba(245,244,240,0.4); }
body.cursor-dark.hovering #cursor-dot  { width:12px; height:12px; background:var(--white); }
body.cursor-dark.hovering #cursor-ring { width:52px; height:52px; border-color:var(--white); }

/* Button hover overrides — cursor inverts to contrast with fill.
   .eq-btn--light fills BLACK on hover → cursor must be WHITE
   .eq-btn (dark bg)  fills WHITE on hover → cursor must be BLACK
   These use !important to override the dark/light page detection.     */
body.cursor-btn-black #cursor-dot               { background: #0e0e0e !important; }
body.cursor-btn-black #cursor-ring              { border-color: rgba(14,14,14,0.7) !important; }
body.cursor-btn-white #cursor-dot               { background: #f5f4f0 !important; }
body.cursor-btn-white #cursor-ring              { border-color: #f5f4f0 !important; }

/* ── Scroll reveal ── */
[data-reveal] {
  opacity: 0; transform: translateY(40px);
  transition: opacity .75s var(--ease-expo), transform .75s var(--ease-expo);
  will-change: opacity, transform;
}
[data-reveal="rule"]  { transform: scaleX(0)!important; transform-origin: left; opacity: 1!important; }
[data-reveal="rule"].is-revealed { transform: scaleX(1)!important; }
[data-reveal="image"] { transform: translateY(40px) scale(0.98); transition: opacity .9s var(--ease-expo), transform .9s var(--ease-expo); }
[data-reveal="image"].is-revealed { transform: translateY(0) scale(1); }
[data-reveal="stat"]  { transform: translateY(24px); transition: opacity .6s var(--ease-expo), transform .6s var(--ease-expo); }
[data-reveal="card"]  { transform: translateY(40px) scale(0.99); transition: opacity .8s var(--ease-expo), transform .8s var(--ease-expo); }
[data-reveal].is-revealed { opacity: 1; transform: translate(0,0); }
[data-reveal-delay="0"] { transition-delay: 0ms; }
[data-reveal-delay="1"] { transition-delay: 100ms; }
[data-reveal-delay="2"] { transition-delay: 200ms; }
[data-reveal-delay="3"] { transition-delay: 300ms; }
[data-reveal-delay="4"] { transition-delay: 400ms; }
[data-reveal-delay="5"] { transition-delay: 500ms; }
[data-reveal-delay="6"] { transition-delay: 600ms; }

@media (prefers-reduced-motion: reduce) {
  [data-reveal], [data-reveal="rule"], [data-reveal="image"], [data-reveal="stat"], [data-reveal="card"] {
    opacity: 1!important; transform: none!important; transition: none!important;
  }
}
