/*
Theme CSS entry: base.css
Global tokens, fonts, reset, accessibility, and motion preferences.
*/

/* RDBK Variables */
:root {
  --rdbk-white: #ffffff;
  --rdbk-black: #101010;
  --rdbk-ink: #151515;
  --rdbk-ink-soft: #3d3d3d;
  --rdbk-muted: #707070;
  --rdbk-muted-strong: #565656;

  --rdbk-line: #ecece7;
  --rdbk-paper: #f7f7f2;
  --rdbk-paper-strong: #eeeeea;

  --rdbk-blue: #245cff;
  --rdbk-blue-dark: #1948d4;
  --rdbk-blue-soft: rgba(36, 92, 255, 0.12);

  --rdbk-dark: #101010;
  --rdbk-dark-soft: #1b1b1b;

  --rdbk-container: 1180px;
  --rdbk-header-height: 78px;
  --rdbk-mobile-header-height: 72px;

  --rdbk-radius-sm: 14px;
  --rdbk-radius-md: 20px;
  --rdbk-radius-lg: 28px;
  --rdbk-radius-pill: 999px;

  --rdbk-shadow-sm: 0 8px 24px rgba(0, 0, 0, 0.055);
  --rdbk-shadow-md: 0 22px 70px rgba(0, 0, 0, 0.1);
  --rdbk-shadow-lg: 0 32px 90px rgba(0, 0, 0, 0.13);

  --rdbk-ease: cubic-bezier(0.16, 1, 0.3, 1);
  --rdbk-fast: 180ms ease;
  --rdbk-move: 420ms var(--rdbk-ease);
  --rdbk-slow: 620ms var(--rdbk-ease);
}

/* RDBK Fonts */
@font-face {
  font-family: "Satoshi-Variable";
  src:
    url("../fonts/Satoshi-Variable.woff2") format("woff2"),
    url("../fonts/Satoshi-Variable.woff") format("woff"),
    url("../fonts/Satoshi-Variable.ttf") format("truetype");
  font-weight: 300 900;
  font-display: swap;
  font-style: normal;
}

@font-face {
  font-family: "Satoshi-VariableItalic";
  src:
    url("../fonts/Satoshi-VariableItalic.woff2") format("woff2"),
    url("../fonts/Satoshi-VariableItalic.woff") format("woff"),
    url("../fonts/Satoshi-VariableItalic.ttf") format("truetype");
  font-weight: 300 900;
  font-display: swap;
  font-style: italic;
}

/* RDBK Reset */
*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  min-height: 100vh;
  background: var(--rdbk-white);
  color: var(--rdbk-ink);
  font-family:
    "Satoshi-Variable",
    ui-sans-serif,
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    Arial,
    sans-serif;
  font-weight: 450;
  text-rendering: geometricPrecision;
  -webkit-font-smoothing: antialiased;
}

body.rdbk-menu-locked {
  overflow: hidden;
  touch-action: none;
}

#rdbk-body {
  margin: none;
}

a {
  color: inherit;
  text-decoration: none;
}

button {
  border: 0;
  padding: 0;
  background: none;
  color: inherit;
  font: inherit;
  cursor: pointer;
}

a,
button {
  -webkit-tap-highlight-color: transparent;
}

a:focus-visible,
button:focus-visible {
  outline: 2px solid var(--rdbk-blue);
  outline-offset: 4px;
}

img,
svg {
  display: block;
  max-width: 100%;
}

em,
i,
.rdbk-font-italic {
  font-family:
    "Satoshi-VariableItalic", "Satoshi-Variable", ui-sans-serif, system-ui,
    sans-serif;
  font-style: italic;
}

h1,
h2,
h3,
h4,
h5,
h6,
.rdbk-mega-title,
.rdbk-hero h1,
.rdbk-section h2 {
  font-family: "Satoshi-Variable", ui-sans-serif, system-ui, sans-serif;
  font-weight: 820;
}

/* RDBK Reduced Motion */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

.rdbk-skip-link {
  position: absolute;
  top: -40px; /* Hide off-screen */
  left: 0;
  background: #000;
  color: #fff;
  padding: 8px;
  z-index: 100;
  transition: top 0.3s;
}

.rdbk-skip-link:focus {
  top: 0; /* Show on focus */
}

/* RDBK Entrance Animations */
@keyframes rdbkFadeUp {
  from {
    opacity: 0;
    transform: translate3d(0, 22px, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes rdbkFadeDown {
  from {
    opacity: 0;
    transform: translate3d(0, -18px, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes rdbkFadeLeft {
  from {
    opacity: 0;
    transform: translate3d(24px, 0, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes rdbkFadeRight {
  from {
    opacity: 0;
    transform: translate3d(-24px, 0, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes rdbkScaleIn {
  from {
    opacity: 0;
    transform: scale(0.96);
  }

  to {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes rdbkSoftReveal {
  from {
    opacity: 0;
    transform: translate3d(0, 18px, 0) scale(0.985);
    filter: blur(8px);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
    filter: blur(0);
  }
}

/* RDBK Animation Utilities */
.rdbk-animate,
.rdbk-animate-up,
.rdbk-animate-down,
.rdbk-animate-left,
.rdbk-animate-right,
.rdbk-animate-scale,
.rdbk-animate-reveal {
  opacity: 0;
  animation-duration: 760ms;
  animation-timing-function: var(--rdbk-ease);
  animation-fill-mode: both;
  will-change: opacity, transform;
}

.rdbk-animate,
.rdbk-animate-up {
  animation-name: rdbkFadeUp;
}

.rdbk-animate-down {
  animation-name: rdbkFadeDown;
}

.rdbk-animate-left {
  animation-name: rdbkFadeLeft;
}

.rdbk-animate-right {
  animation-name: rdbkFadeRight;
}

.rdbk-animate-scale {
  animation-name: rdbkScaleIn;
}

.rdbk-animate-reveal {
  animation-name: rdbkSoftReveal;
}

/* RDBK Animation Delays */
.rdbk-delay-1 {
  animation-delay: 90ms;
}

.rdbk-delay-2 {
  animation-delay: 180ms;
}

.rdbk-delay-3 {
  animation-delay: 270ms;
}

.rdbk-delay-4 {
  animation-delay: 360ms;
}

.rdbk-delay-5 {
  animation-delay: 450ms;
}

.rdbk-delay-6 {
  animation-delay: 540ms;
}

/* RDBK Stagger System */
.rdbk-stagger > * {
  opacity: 0;
  animation-name: rdbkFadeUp;
  animation-duration: 760ms;
  animation-timing-function: var(--rdbk-ease);
  animation-fill-mode: both;
  will-change: opacity, transform;
}

.rdbk-stagger > *:nth-child(1) {
  animation-delay: 80ms;
}

.rdbk-stagger > *:nth-child(2) {
  animation-delay: 160ms;
}

.rdbk-stagger > *:nth-child(3) {
  animation-delay: 240ms;
}

.rdbk-stagger > *:nth-child(4) {
  animation-delay: 320ms;
}

.rdbk-stagger > *:nth-child(5) {
  animation-delay: 400ms;
}

.rdbk-stagger > *:nth-child(6) {
  animation-delay: 480ms;
}

.rdbk-stagger > *:nth-child(7) {
  animation-delay: 560ms;
}

.rdbk-stagger > *:nth-child(8) {
  animation-delay: 640ms;
}

/* RDBK Reduced Motion Override */
@media (prefers-reduced-motion: reduce) {
  .rdbk-animate,
  .rdbk-animate-up,
  .rdbk-animate-down,
  .rdbk-animate-left,
  .rdbk-animate-right,
  .rdbk-animate-scale,
  .rdbk-animate-reveal,
  .rdbk-stagger > * {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
    animation: none !important;
    will-change: auto !important;
  }
}

/* RDBK Marquee Entrance */
.rdbk-js-ready .rdbk-marquee-section {
  opacity: 0;
  transform: translateY(16px);
}

.rdbk-js-ready .rdbk-marquee-section.rdbk-is-visible {
  opacity: 1;
  transform: translateY(0);
  transition:
    opacity 680ms var(--rdbk-ease),
    transform 680ms var(--rdbk-ease);
}

.rdbk-js-ready .rdbk-marquee-section .rdbk-marquee-track {
  opacity: 0;
  transform: translateX(24px);
}

.rdbk-js-ready .rdbk-marquee-section.rdbk-is-visible .rdbk-marquee-track {
  opacity: 1;
  transform: translateX(0);
  transition:
    opacity 760ms var(--rdbk-ease) 120ms,
    transform 760ms var(--rdbk-ease) 120ms;
}

/* RDBK Marquee Entrance Reduced Motion */
@media (prefers-reduced-motion: reduce) {
  .rdbk-js-ready .rdbk-marquee-section,
  .rdbk-js-ready .rdbk-marquee-section .rdbk-marquee-track {
    opacity: 1;
    transform: none;
    transition: none;
  }
}