:root{
  /* Keeping your new root variables from root.css - no changes here */
   --cc-primary:#0f3c88;
    --cc-primary-dark:#0b2e6a;
  
    --cc-secondary:#2f6fb6;
    --cc-secondary-dark:#255a94;
  
    --cc-accent:#bcd1f3;  
    --cc-accent-soft:#e7edf7; 
  
    /* TEXT */
  
    --cc-heading:#0c1f3f;  <!-- X -->
    --cc-text:#1b2b44;
    --cc-muted:#6c7a92;
  
    /* BACKGROUND */
  
    --cc-bg:#ffffff;
    --cc-soft:#f4f7fb;
    --cc-footer:#0a1c36;
  
    /* BORDER */
  
    --cc-line:#dbe3ef;
    --cc-border-soft:#e7edf6;  <!-- X -->
  
    /* SHADOW */
  
    --cc-shadow-sm:0 6px 18px rgba(15,40,80,.06);
    --cc-shadow-md:0 12px 32px rgba(15,40,80,.08);
    --cc-shadow-lg:0 20px 48px rgba(15,40,80,.12);
  
    --cc-shadow:var(--cc-shadow-md);
  
    /* RADIUS */
  
    --cc-radius-sm:8px;
    --cc-radius:12px;
    --cc-radius-lg:18px;
  
    /* TYPOGRAPHY */
  
    --cc-font-primary:"Inter","Segoe UI",Roboto,Arial,sans-serif;
    --cc-font-secondary:"Inter","Segoe UI",Roboto,Arial,sans-serif;
  
    /* GRADIENT */
  
    --cc-gradient-main:linear-gradient(90deg,var(--cc-primary),var(--cc-secondary));
}