/* ============================================================
   RocketXInfo — Design Tokens
   Lavender-Amber Pastel · Editorial publication system
   Light mode only. No pure black, no bright red.
   ============================================================ */

:root {
  /* ----------------------------------------------------------
     COLOR — PRIMARY (lavender · trust)
     ---------------------------------------------------------- */
  --color-primary:        #B5A8E0;   /* soft lavender — main accent */
  --color-primary-light:  #C9BFE8;   /* hover */
  --color-primary-dark:   #8C7BC4;   /* active, emphasis */

  /* COLOR — SECONDARY (amber · attention) */
  --color-secondary:        #F5C25E;   /* warm amber — highlights, badges */
  --color-secondary-light:  #FAD78F;
  --color-secondary-dark:   #D9A53E;

  /* ----------------------------------------------------------
     NEUTRALS — backgrounds (light & airy)
     ---------------------------------------------------------- */
  --bg-page:    #F8F5F0;   /* warm ivory background */
  --bg-card:    #FFFFFF;
  --bg-soft:    #F0EBE3;   /* alternating sections */
  --bg-cinema:  #E8E1D5;   /* warm beige hero sections, NOT dark */

  /* TEXT */
  --fg-1:  #363547;   /* deep graphite — NEVER pure black */
  --fg-2:  #5A5868;
  --fg-3:  #8F8C9E;

  /* BORDERS */
  --border-1:  #D9D2C5;
  --border-2:  #C0B8A8;

  /* SEMANTIC */
  --color-warning:  #E8A640;
  --color-info:     #7E94C9;
  --color-error:    #C97A85;
  --color-success:  #8FB587;

  /* Tinted surfaces (derived, for callouts / states) */
  --tint-lavender:  #F1EEF9;
  --tint-amber:     #FCF3DF;
  --tint-info:      #EEF1F8;
  --tint-warning:   #FBF1DC;
  --tint-error:     #F8EDEE;
  --tint-success:   #EEF4EB;

  /* ----------------------------------------------------------
     TYPOGRAPHY — families
     ---------------------------------------------------------- */
  --font-display:  "Fraunces", Georgia, "Times New Roman", serif;
  --font-body:     "Inter", system-ui, -apple-system, sans-serif;
  --font-accent:   "Caveat", "Comic Sans MS", cursive;
  --font-mono:     "IBM Plex Mono", "SF Mono", Menlo, monospace;

  /* Type scale — size / line-height (1.25 ratio) */
  --t-xs:    13px;  --lh-xs:   1.5;
  --t-sm:    15px;  --lh-sm:   1.55;
  --t-base:  17px;  --lh-base: 1.7;
  --t-md:    20px;  --lh-md:   1.55;
  --t-lg:    26px;  --lh-lg:   1.4;
  --t-xl:    34px;  --lh-xl:   1.25;
  --t-2xl:   44px;  --lh-2xl:  1.15;
  --t-3xl:   60px;  --lh-3xl:  1.05;

  /* Weights */
  --fw-light:     300;
  --fw-regular:   400;
  --fw-medium:    500;
  --fw-semibold:  600;
  --fw-bold:      700;
  --fw-black:     900;   /* Fraunces display */

  /* Tracking */
  --track-eyebrow:  0.14em;   /* mono uppercase eyebrows */
  --track-tight:   -0.02em;   /* large display */

  /* ----------------------------------------------------------
     SPACING — 8px base scale
     ---------------------------------------------------------- */
  --space-1:    4px;
  --space-2:    8px;
  --space-3:    12px;
  --space-4:    16px;
  --space-6:    24px;
  --space-8:    32px;
  --space-12:   48px;
  --space-16:   64px;
  --space-24:   96px;
  --space-32:   128px;

  /* ----------------------------------------------------------
     RADIUS
     ---------------------------------------------------------- */
  --radius-sm:    6px;
  --radius-md:    12px;
  --radius-lg:    20px;
  --radius-xl:    32px;
  --radius-full:  999px;

  /* ----------------------------------------------------------
     SHADOWS — soft only
     ---------------------------------------------------------- */
  --shadow-sm:     0 2px 8px rgba(54, 53, 71, 0.06);
  --shadow-md:     0 8px 24px rgba(54, 53, 71, 0.08);
  --shadow-lg:     0 16px 48px rgba(54, 53, 71, 0.12);
  --shadow-amber:  0 8px 32px rgba(245, 194, 94, 0.25);   /* CTA glow */

  /* ----------------------------------------------------------
     MOTION
     ---------------------------------------------------------- */
  --ease-out:       cubic-bezier(0.16, 1, 0.3, 1);
  --ease-out-back:  cubic-bezier(0.34, 1.56, 0.64, 1);
  --ease-spring:    cubic-bezier(0.5, 1.5, 0.5, 1);

  --dur-fast:    180ms;
  --dur-base:    320ms;
  --dur-slow:    600ms;
  --dur-reveal:  800ms;

  /* Layout */
  --container:      1180px;
  --container-text: 720px;   /* editorial reading column */
  --nav-h:          72px;
}

/* Respect reduced motion globally */
@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-fast: 0ms;
    --dur-base: 0ms;
    --dur-slow: 0ms;
    --dur-reveal: 0ms;
  }
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
}