/* Rabbit Hole Digital — shared page CSS: base, link colours, keyframes. */
html,body{margin:0}
body{background:var(--bg);-webkit-font-smoothing:antialiased}
*{box-sizing:border-box}
a{color:var(--accent);text-decoration:none}
a:hover{color:var(--accent-hover)!important}
::selection{background:var(--accent);color:var(--on-accent)}

/* entrance */
@keyframes rh-rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
.rh-rise{animation:rh-rise .7s var(--ease) both}
.rh-rise-2{animation:rh-rise .7s var(--ease) .08s both}
.rh-rise-3{animation:rh-rise .7s var(--ease) .16s both}
.rh-rise-4{animation:rh-rise .7s var(--ease) .24s both}

/* hero grid scan — a gold sweep travelling down the masked grid */
@keyframes rh-scan{0%{transform:translateY(-100%)}100%{transform:translateY(220%)}}
.rh-scanline{animation:rh-scan 5.5s linear infinite}

/* pulsing signal nodes */
@keyframes rh-pulse{0%,100%{opacity:.25;transform:scale(1)}50%{opacity:1;transform:scale(1.35)}}
.rh-node{animation:rh-pulse 2.4s var(--ease) infinite}

/* terminal caret */
@keyframes rh-blink{0%,49%{opacity:1}50%,100%{opacity:0}}
.rh-caret{animation:rh-blink 1s step-end infinite}

/* stat bar fill grow */
@keyframes rh-grow{from{transform:scaleX(0)}to{transform:scaleX(1)}}

/* subtle drift for the connector lines */
@keyframes rh-dash{to{stroke-dashoffset:-24}}
.rh-dash{stroke-dasharray:4 6;animation:rh-dash 1.6s linear infinite}

/* segmented control */
.rh-seg{display:inline-flex;gap:2px;padding:3px;border:1px solid var(--hairline-strong);border-radius:var(--radius-button);background:var(--surface-2)}
.rh-seg button{font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-weight:600;color:var(--text-muted);background:transparent;border:0;padding:7px 14px;border-radius:2px;cursor:pointer;transition:color var(--dur) var(--ease),background var(--dur) var(--ease)}
.rh-seg button[data-on="1"]{color:var(--on-accent);background:var(--accent)}
.rh-seg button:hover:not([data-on="1"]){color:var(--text-hi)}

/* logo strip fade */
.rh-logo-cell{display:flex;align-items:center;justify-content:center;padding:var(--space-5);font-family:var(--font-display);font-weight:900;text-transform:uppercase;letter-spacing:-.01em;color:var(--text-faint);font-size:19px;transition:color var(--dur) var(--ease)}
.rh-logo-cell:hover{color:var(--text-hi)}

/* marquee ticker */
@keyframes rh-marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* reduced motion */
@media (prefers-reduced-motion: reduce){
  .rh-rise,.rh-rise-2,.rh-rise-3,.rh-rise-4{animation:none!important}
  .rh-scanline,.rh-node,.rh-caret,.rh-dash{animation:none!important}
}
img{max-width:100%;height:auto}