/**
 * Rocket Media Brand Tokens — CSS Custom Properties
 * Source of truth: https://rocketmeatball.com
 * Machine-readable companion to rocket-media-brand-guidelines.md
 *
 * Trademark: USPTO Reg. No. 4,069,932 (Standard Character Mark)
 * Owner: Rocket Media, LLC — Gilbert, AZ
 *
 * Version: 1.0.0
 * Last updated: 2026-04-22
 */

:root {
  /* ==========================================================================
     COLOR — PRIMARY
     ========================================================================== */
  --rm-color-rocket-green:   #53B547;
  --rm-color-outerspace:     #232323;
  --rm-color-moonlight:      #FFFFFF;

  /* ==========================================================================
     COLOR — INTERACTIVE STATES
     ========================================================================== */
  --rm-color-hover:          #439639;
  --rm-color-active:         #36792E;

  /* ==========================================================================
     COLOR — SECONDARY (ACCENTS ONLY, NEVER PRIMARY)
     ========================================================================== */
  --rm-color-booster:        #3CA5FF;
  --rm-color-ignition:       #FFD62C;
  --rm-color-nebula:         #8460A9;
  --rm-color-nova:           #D95389;

  /* ==========================================================================
     COLOR — NEUTRALS (INFERRED — VERIFY AGAINST LIVE SITE)
     ========================================================================== */
  --rm-color-gray-50:        #F8F9FA;
  --rm-color-gray-100:       #F1F3F5;
  --rm-color-gray-500:       #868E96;
  --rm-color-gray-700:       #495057;

  /* ==========================================================================
     TYPOGRAPHY
     Max heading weight: SemiBold 600. Never Bold/Black.
     ========================================================================== */
  --rm-font-display:         "Titillium Web", Arial, Calibri, sans-serif;
  --rm-font-body:            "Open Sans", Inter, Arial, sans-serif;

  --rm-font-weight-regular:  400;
  --rm-font-weight-semibold: 600;

  /* Type scale — INFERRED. Verify against Section 3. */
  --rm-font-size-xs:         0.75rem;
  --rm-font-size-sm:         0.875rem;
  --rm-font-size-base:       1rem;
  --rm-font-size-lg:         1.125rem;
  --rm-font-size-xl:         1.25rem;
  --rm-font-size-2xl:        1.5rem;
  --rm-font-size-3xl:        1.875rem;
  --rm-font-size-4xl:        2.25rem;
  --rm-font-size-5xl:        3rem;
  --rm-font-size-hero:       3.75rem;

  --rm-line-height-tight:    1.1;
  --rm-line-height-snug:     1.25;
  --rm-line-height-normal:   1.5;
  --rm-line-height-relaxed:  1.75;

  --rm-letter-spacing-section-marker: 0.1em;

  /* ==========================================================================
     SPACING — 8px baseline grid (INFERRED — verify Section 6)
     ========================================================================== */
  --rm-space-0:              0;
  --rm-space-1:              0.25rem;
  --rm-space-2:              0.5rem;
  --rm-space-3:              0.75rem;
  --rm-space-4:              1rem;
  --rm-space-6:              1.5rem;
  --rm-space-8:              2rem;
  --rm-space-12:             3rem;
  --rm-space-16:             4rem;
  --rm-space-24:             6rem;
  --rm-space-32:             8rem;

  /* ==========================================================================
     RADIUS
     ========================================================================== */
  --rm-radius-card:          1rem;       /* 16px — confirmed */
  --rm-radius-button:        0.5rem;     /* INFERRED */
  --rm-radius-pill:          9999px;
  --rm-radius-none:          0;

  /* ==========================================================================
     LAYOUT
     ========================================================================== */
  --rm-container-max:        1280px;

  --rm-breakpoint-sm:        640px;
  --rm-breakpoint-md:        768px;
  --rm-breakpoint-lg:        1024px;
  --rm-breakpoint-xl:        1280px;
  --rm-breakpoint-2xl:       1536px;

  /* ==========================================================================
     MOTION (INFERRED — verify Section 10)
     ========================================================================== */
  --rm-duration-instant:     0ms;
  --rm-duration-fast:        150ms;
  --rm-duration-base:        250ms;
  --rm-duration-slow:        400ms;

  --rm-ease-linear:          linear;
  --rm-ease-ease:            cubic-bezier(0.4, 0, 0.2, 1);
  --rm-ease-ease-in:         cubic-bezier(0.4, 0, 1, 1);
  --rm-ease-ease-out:        cubic-bezier(0, 0, 0.2, 1);

  /* ==========================================================================
     SHADOW (INFERRED)
     ========================================================================== */
  --rm-shadow-sm:   0 1px 2px 0 rgba(35, 35, 35, 0.05);
  --rm-shadow-base: 0 1px 3px 0 rgba(35, 35, 35, 0.1), 0 1px 2px 0 rgba(35, 35, 35, 0.06);
  --rm-shadow-md:   0 4px 6px -1px rgba(35, 35, 35, 0.1), 0 2px 4px -1px rgba(35, 35, 35, 0.06);
  --rm-shadow-lg:   0 10px 15px -3px rgba(35, 35, 35, 0.1), 0 4px 6px -2px rgba(35, 35, 35, 0.05);
}

/* ==========================================================================
   UTILITY CLASSES (optional — consumers can ignore if using Tailwind)
   ========================================================================== */

.rm-bg-rocket-green  { background-color: var(--rm-color-rocket-green); }
.rm-bg-outerspace    { background-color: var(--rm-color-outerspace); }
.rm-bg-moonlight     { background-color: var(--rm-color-moonlight); }

.rm-text-rocket-green { color: var(--rm-color-rocket-green); }
.rm-text-outerspace   { color: var(--rm-color-outerspace); }
.rm-text-moonlight    { color: var(--rm-color-moonlight); }

.rm-font-display {
  font-family: var(--rm-font-display);
  font-weight: var(--rm-font-weight-semibold);
}

.rm-font-body {
  font-family: var(--rm-font-body);
  font-weight: var(--rm-font-weight-regular);
}

.rm-section-marker {
  font-family: var(--rm-font-display);
  font-weight: var(--rm-font-weight-semibold);
  color: var(--rm-color-rocket-green);
  text-transform: uppercase;
  letter-spacing: var(--rm-letter-spacing-section-marker);
}

.rm-card {
  border-radius: var(--rm-radius-card);
  box-shadow: var(--rm-shadow-base);
}

.rm-btn-primary {
  background-color: var(--rm-color-rocket-green);
  color: var(--rm-color-moonlight);
  border-radius: var(--rm-radius-button);
  font-family: var(--rm-font-body);
  font-weight: var(--rm-font-weight-semibold);
  transition: background-color var(--rm-duration-fast) var(--rm-ease-ease);
}

.rm-btn-primary:hover { background-color: var(--rm-color-hover); }
.rm-btn-primary:active { background-color: var(--rm-color-active); }
