:root {
  /* Landing pages */
  /* Neutral */

  /* border clr */
  --clr_white: hsl(0, 0%, 100%); /* #ffffff */
  --clr_black: hsl(0, 0%, 0%); /* #000000 */
  /* Forms */
  /* Neutral */
  --clr_frm_dark_01: #0a0a0a;
  --clr_frm_dark_02: #282828;
  --clr_frm_dark_03: #5e5e5e;
  --clr_frm_dark_04: #4d4d4d;

  /* primary color */
  --clr_primary_01: hsl(87, 94%, 56%); /* #9AF8248 */
  --clr_primary_02: hsl(267, 62%, 56%); /* #894BD5 */

  --clr_primary_03: hsl(86, 87%, 44%); /* #7BD00E */
  --clr_primary_04: hsl(266, 63%, 56%); /* #8649D5 */

  --clr_secondary_01: hsl(267, 29%, 43%); /* #6A4E8D */
  --clr_secondary_02: hsl(265, 43%, 65%); /* #9F7FCC */

  --clr_secondary_light_04: hsl(155, 15%, 77%); /* #BCCDC6 */

  /* background */
  --bg_clr_white: hsl(0, 0%, 100%); /* #ffffff */
  --bg_clr_black: hsl(0, 0%, 0%); /* #000000 */

  --bg_primary: hsl(87, 94%, 56%); /* #9AF8248 */
  --bg_secondary: hsl(267, 62%, 56%); /* #894BD5 */

  --bg_primary_01: hsl(86, 87%, 44%); /* #7BD00E */
  --bg_secondary_01: hsl(267, 29%, 43%); /* #6A4E8D */

  --bg_secondary_02: hsl(268, 25%, 47%); /* #765A97 */
  --bg_secondary_03: hsl(267, 73%, 62%); /* #9655E5 */
  --bg_secondary_04: hsl(266, 83%, 66%); /* #A062F0 */

  --bg_light: hsl(0, 0%, 85%); /* #D9D9D9 */

  --bg_light_01: 0 0% 96%; /* #F5f5f5 */
  --bg_light_02: hsl(268, 100%, 97%); /* #F7F0FF */
  --bg_light_03: hsl(265, 32%, 93%); /* #EBE6F2 */

  /* text */
  --text_clr_white: hsl(0, 0%, 100%); /* #ffffff */
  --text_clr_black: hsl(0, 0%, 0%); /* #000000 */

  --text_caption_hd: 359 100% 76%; /* #FF8688 */

  --text_clr_primary: hsl(232, 29%, 10%); /* #121421 */
  --text_clr_secondary: hsl(0, 0%, 29%); /* #4A4A4A */

  --transition: all 0.3s ease-in-out;

  /* bg grad */

  --bg_grad_01: linear-gradient(180deg, #faffed 0%, #d5ff67 100%);
  --bg_grad_02: linear-gradient(0deg, #000 0%, rgba(0, 0, 0, 0) 100%);
  --bg_grad_03: linear-gradient(0deg, #fff 15.27%, rgba(255, 255, 255, 0) 100%);

  /* icon */

  /* border */
  --border_clr_01: hsl(0, 0%, 84%); /* #D5D5D5 */
  --border_clr_02: hsl(267, 100%, 91%); /* #E7D3FF */
  --border_clr_03: hsl(86, 99%, 29%); /* #549401 */
  --border_clr_04: hsl(268, 30%, 55%); /* #8B6CAF */

  --border_clr_05: hsl(154, 67%, 13%); /* #0B3724 */
  --border_clr_06: hsl(0, 0%, 91%); /* #E8E8E8 */

  --border_light: hsl(0, 0%, 94%); /* #F0F0F0 */
  --border_light_01: hsl(266, 82%, 66%); /* #9F61EF  */
  --border_light_01_01: hsl(267, 80%, 67%); /* #A467EE  */
  --border_light_02: hsl(0, 0%, 92%); /* #EAEAEA  */
  --border_light_03: hsl(266, 67%, 92%); /* #E8DCF8  */
  --border_light_04: hsl(267, 60%, 91%); /* #E7DBF6  */

  /* fonts */
  --font-family-mona: "Mona Sans", sans-serif;

  /* font weight */
  --fw_regular: 400;
  --fw_medium: 500;
  --fw_semiBold: 600;
  --fw_bold: 700;

  --bg_secondary_02: hsl(268, 25%, 47%); /* #765A97 */
  --bg_secondary_03: hsl(267, 73%, 62%); /* #9655E5 */
  --bg_secondary_04: hsl(266, 83%, 66%); /* #A062F0 */
  --bg_secondary_05: hsl(267, 41%, 46%); /* #7146A7 */
  --bg_secondary_06: hsl(267, 40%, 50%); /* #7A4CB3 */
  --bg_secondary_07: hsl(267, 52%, 60%); /* #9364CE */
}